10 Rules of Good UI Design to Follow On Every Web Design Project

1. Understand How UI Plays Into UX UI – User Interface is important but UI designer needs to rely on the information from the user experience angle UX designers – User Experience (or ‘architects’) need to take into consideration such diverse factors as interaction design and architecture, the creation of clear taxonomies, copywriting, coordination with designers and programmers Serious work on the interface will begin after gaining access to all of this information, then mockups will be made, tested and approved by UX designers and a product will be launched

2. Know Your Audience The most important insights into how to design a fantastic interface should be taken from your users Must already have an idea of what your future audience will want Looking at the competition can be a great way to kickstart the creative process Which websites are at the top in your project’s field? Are they using similar layouts or colors? Do they adhere to similar styles or seem to cater visually to the same demographics?

2. Know Your Audience Once you’ve identified your audience, you can test how your design plays out among them and take their feedback into consideration. Actionable feedback from your desired target audience is incredibly valuable, so get it and use it! Moderated In-Person Usability Testing obtaining feedback from live users interacting with everything from paper prototypes to fully implemented applications.

2. Know Your Audience Once you’ve identified your audience, you can test how your design plays out among them and take their feedback into consideration. Actionable feedback from your desired target audience is incredibly valuable, so get it and use it! Moderated In-Person Usability Testing Moderated Remote Usability Testing This works best with website and web-based apps Conduct testing from the comfort of your personal space, by computer or telephone “All you need is the user’s web cam to be pointed at the device of application and a web- based tool to record the session,” he says.

2. Know Your Audience Once you’ve identified your audience, you can test how your design plays out among them and take their feedback into consideration. Actionable feedback from your desired target audience is incredibly valuable, so get it and use it! Moderated In-Person Usability Testing Moderated Remote Usability Testing Card Sorting and Tree Testing create and test a taxonomy or navigation structure with actual users During Card Sorting exercise, a participant is presented with words or phrases (items) and is asked to sort those items into categories. Tree Testing is more similar to actual browsing behavior than card sorting. It is considered reverse card sorting

Card Sorting Additionally, an online Card Sorting study can: Help improve an existing site structure or define a new one. Give insight on how to organise and categorise site information. Be created quickly: since it doesn’t require moderation, it is easy to collect data from 50+ participants, while lab based studies are normally limited by cost and time. Save money: online card sorts are much more cost-effective than lab testing. There is no need for lab space, research moderation, or compensating participants for travel.

Card Sorting

Tree Testing Tree testing is sometimes referred to as reverse card sorting since you are finding items instead of placing them into a navigation structure (often called taxonomy).  A tree test is like a usability test on the skeleton of your navigation with the design “skin” removed. It allows you to isolate problems in findability in your taxonomy, groups or labels that are not attributable to issues with design distractions, or helpers.

2. Know Your Audience Once you’ve identified your audience, you can test how your design plays out among them and take their feedback into consideration. Actionable feedback from your desired target audience is incredibly valuable, so get it and use it! Moderated In-Person Usability Testing Moderated Remote Usability Testing Card Sorting and Tree Testing Beta Testing

3. Keep Things Simple and Consistent The hallmark of a great interface is simplicity Easy to understand and interact with Elements such as colors, typography, feedback messages, and visual hierarchies Keep consistent throughout a design

4. Implement a Visual Hierarchy The most important elements of an interface should be highlighted in order to make users focus on them, and design provides an almost endless array of methods through which to achieve this effect.

5. Make Good Use of Typography Another way to establish visual hierarchy is through the use of typography Size Weight Color Position Type Contrast

5. Make Good Use of Typography Another way to establish visual hierarchy is through the use of typography Size

5. Make Good Use of Typography Another way to establish visual hierarchy is through the use of typography Weight – simply using a bolder weight of a font

5. Make Good Use of Typography Color

5. Make Good Use of Typography Position

5. Make Good Use of Typography Contrasting Typefaces

5. Make Good Use of Typography Combination

6. Use Color and Contrast Properly Using colors to their full effect to design a stunning interface Psychology of colors Colors can be used to convey visual hierarchy establish a relationship between elements elevate your designs hold the attention of your users Maintain some uniformity Contrasting color to draw attention

7. Consider Feedback Messages Interfaces are meant to be used Design feedback messages that convey crucial information to your users when they perform an action Is something loading? Why not use a simple animation as a feedback message Did someone fill a field incorrectly? Design a message to inform them right away so they know exactly what went wrong

8. Simplify Your Forms Forms are one of the main methods through which users will interact with your web projects. Most users hate forms Integrate them into your interface as painlessly as possible

9. Collaborate Your Way to Success Work as part of a team All members of the team share the same information Use good collaboration tools

10. Bring It All Together Designing an interface is no simple task Foresee your audiences’ needs in order to create a design Using multiple disciplines and having technical information regarding your audience Maintain a close relationship between user experience design and the interface design Your interfaces need to be easy to use, simple to navigate, make use of the right colors for your audience, employ the right fonts, integrate useful feedback messages, and remain consistent overall. If you can juggle that many factors and still produce an appealing design, perhaps it’s time for you to teach us some rules of web design.