Usability / UI Design / UX etc. - project documentation

Question

I am a software developer, and now I am going to complete a project that involves implementing a website using ASP.NET (3.5 / 2008, using Factory Web Client software). I was tasked with creating a UI / UX Design Document for the project, but I don't know where to start.

For three years I worked on one project, where there was a formal document with a user interface design, which included rules and rules for layout and style (for example, the application has a title, navigation, etc., links should be colored A, buttons for positive actions should be on the right, etc. etc.). This was very useful in retrospect, I appreciated that someone put in a lot of effort, even by defining CSS classes in the document. However, the document was based on an existing application and was consistent with the overall corporate identity of the business.

The current project is a new project that currently does not have clearly defined requirements (yes, I know ... how you develop when there are not many requirements ... I get distracted). It is difficult to understand what kind of functionality is needed. There are two different types of user / person, but no formal research will be done for this document. In addition, I am not sure of corporate identity, except that the business has some rules regarding the use of their logo, which I will receive further clarifications in a few days.

So, I'm a little in the dark, throwing paint on the canvas, hoping that I will get a beautiful picture at the end (if only I were Jackson Pollock).

What would you include in this document? It is intended for business (client), as well as for developers. I can only think of the following:

• Layout - header, footer, content, navigation
• Styles - The color palette and styles of the various expected components.
• Interaction with the user - when the user performs an action and needs to wait for him to be notified by a modal dialog, verification is performed using AJAX, navigation should be contextual, tasks should be performed with a minimum of clicks / navigation, etc. etc..

Does anyone have experience creating such a document or any known, proven, and proven user interface development process?

Thanks,

James

Answer 1

All kinds of elements can be included in such a set of documentation:

• visual style guidelines (colors, fonts, sizes, icons, etc.)
• branding recommendations (corporate logos, colors, messaging, etc.).
• copyright protection style guide (terminology, correct messaging, correct voice, etc.).
• personalization / demographic settings
• page layout guide
• CSS Guides / Standards
• JS Guidelines / Standards
• use cases
• accessibility issues
• usability issues
• implementation examples
• Streams IA paths
• Wireframe components
• and etc.

I will pick up this book if you can start thinking about it:

http://www.amazon.com/Web-Anatomy-Interaction-Frameworks-ebook/dp/B002ZY5FCW/ref=sr_1_2?ie=UTF8& s = books & QID = 1262983955 & cf = 8-2

Answer 2

Along with all the other obvious components of your planning document, it would be nice to outline parts of the user interface along with an accompanying description of specific use cases.

I had problems in the past when trying to convey user interface ideas. It is often useful to sketch dialogs and action sequences. If these sketches look too “real,” then there is a tendency for them to become specifications for the final product.

To mitigate this, I played with the Balsamiq Mockups . It has the excellent property that it is an editable back side of the swipe and deliberately displays all objects and screen layouts with a freehand feel. I like the results that I achieved with him for small indoor projects. I still do not have the opportunity to use it for a large project with many external stakeholders.

Answer 3

The Wikipedia article for the Human Interface Guide contains some great links that I was going to offer. Some of them may have much more information than you need, but they should give you an idea of ​​what types of things you should add.

I have always found Apple recommendations very complete and useful, but they are certainly very complete and require a lot of reading.