Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

How can I write a UI guideline for website? How many things should it include?Have anyone got example?

share|improve this question
    
Please be more specific: What sort of guideline do you want to write, for whom? There are a lot of examples on the web - why not use those as a starting point? –  Peter Aug 22 '13 at 6:57
    
Whilst not for a website, I always found the android design guidelines to be a very easy-to-digest piece of documentation. developer.android.com/design/index.html Might be a good example to get to started. –  Gusdor Aug 22 '13 at 7:13
add comment

closed as too broad by DA01, Matt Obee, greenforest, JonW Aug 22 '13 at 8:18

There are either too many possible answers, or good answers would be too long for this format. Please add details to narrow the answer set or to isolate an issue that can be answered in a few paragraphs.If this question can be reworded to fit the rules in the help center, please edit the question.

1 Answer

In my opinion I think the best way would be to 'CODE' up the design guide into real examples of the style.

Essentially, code up the html, css, and related javascript and display example forms, buttons, paragraphs, sections, comments etc.

This has the benefit of being a live example of how it is done, for developers, and gives you the designer a sense of implementation difficulties and feasibility.

You can try wire frames, mockups, or PDF documents with images but they have the downside of NOT being in the medium that the interface will ultimately be in and gives you no real clue about how it will be implemented. Also, developers are left to guess how things will be 'hacked' together instead of having live examples at the ready to base their work on and speed up development.

Brad Frost calls this atomic design and you can see some explanatory material here

http://bradfrostweb.com/blog/post/atomic-web-design/

share|improve this answer
add comment

Not the answer you're looking for? Browse other questions tagged or ask your own question.