15 things we learned about interface design as developers

Milan Vrekic
C:/Milan
Published in
3 min readAug 22, 2012

As developers who realized that no one will care about our product or clients more than ourselves, we took the design of our new product iteration onto ourselves. These are the 15 things we learned about user interface design in the process:

1.) Use patterns as much as possible. You can even use groups and white space to create patterns.

2.) Things that are close together should belong together. Look at the example remote bellow. Buttons form logical groups based on their functions.

Np4001remote-600

3.) 9% of all men are color blind. Use vischeck.com to check how your site, or web app looks to those people.

4.) Whenever possible, use progressive disclosure. Principle of progressive disclosure dictates that the user should be provided only the information he needs at that time. More information on screen increases chances for confusion and ultimately — inaction.

5.) If you must make tradeoffs between clicks and thinking. Use more clicks and less thinking.

6.) People are more motivated as they get closer to a goal. Example: Coffee shop has two types of stamp cards. Card A with 10 stamp slots and card B with 12 stamp slots but 2 already pre-stamped. Card B is set to perform much better. People will focus on what remains to be done vs. what is already completed.

7.) All error messages should tell people what they did wrong. Explain the problem and instruct user how to correct it. Error messages should be written in active, not passive voice. Never make the user feel stupid by making an error message sound accusatory.

Example of a really bad iTunes error message:

Tumblr_l5ss78whhg1qcytnmo1_1280

…and a really good one:

Picture_48

8.) If people are doing a boring task, raise the level of arousal with colors, sounds and movement but be careful not to overdo it.

9.) If people are doing a difficult task, decrease the level of arousal by eliminating any distracting elements such as colors, sounds or movement.

10.) Make your forms cache non-confidential information (such as text areas and text boxes) real-time. So that in case user is interrupted he can continue later. If it is worth user entering — it is worth app remembering.

11.) Never give a blank slate. Once they sign-up, make sure that the first step is not theirs but yours. It is not an accident that Dropbox pre-creates a welcome file for each new user.

12.) If you design for the extreme scenarios, the middle will often take care of itself.

13.) Avoid unnecessary reporting. There is no need for a “good job” notification every time a user performs a task successfuly.

14.) Feedback has to be constant and instantaneous. It can be a sound you hear when you press a button or a light you see when you receive a message.

15.) Color is a communication tool. Use of color should be unobtrusive. If you are making an app people will use on a daily basis you cannot make the background yellow or buttons pink. Colors must respect and fit in the environment.

Our new app (soon to be out)

Titanfile_draft_passport

--

--

Milan Vrekic
C:/Milan

Product Manager @POF, Volta, Zora & TitanFile co-founder, Maritimer living on the West Coast.