A Single Article
Read it, comment, and share it with your friendsUser Interface Design ideas for your review
I’ve been working as the sole UI designer for a startup this summer (in my 4th week now) and I have been applying all of my knowledge about UI design since day 1. We are working on a site that is targeted toward a large demographic of which many are not really “technical.” I’ve been thinking a lot about how users will be interacting with the pages I have been designing and I have been expounding some ideas about UI design that I was hoping to share with you and get your feedback on. These are the things I believe about UI design and have been incorporating in my work:
- There should be one single place (e.g. webpage) for each action. If you want to allow users to add something to your system, there should be one link that takes them there and one page that provides the form. This way, users always know where they need to go to do something and they don’t get confused by multiple links and multiple pages serving the same function.
- Copy should be brief but never too generic. If you have a page that users visit to browse content, just calling that page “content” is not specific enough. Calling it “browse” is pretty good. Calling it “look for content” is maybe too wordy.
- Icons are great for actions. It’s not a good idea to have a boatload of icons all over your pages, with one attached to each and every link throughout the site, but for links that are associated with actions (such as “comment” or “add a file”), icons fit right in.
- Placement should be consistent. If you have a login form at the top right of your header, the logout form a users sees after logging in should go there too. If you center the submit button in a form, you should do the same with other submit buttons on other forms. If you have a certain layout for displaying information about an item in a “browse results” page, you should use a similar layout for displaying the same information on a “search results” page.
Like I said, these are all ideas and I am open to hearing your thoughts and opinions about them. I learn from discussing with you so don’t be shy 
And if you have any suggestions of your own about UI design, please share!
Get a Trackback link
3 Comments
Responses to my articleHi Christian,
A book you might like is “Don’t Make Me Think” by Steve Krug (if you haven’t already). Most of the concepts you point out are in there…
Also, I wanted to comment on your first bullet-point. I agree that there should be one ‘place’ associated with one action or idea. So, for example, If I want to add a picture to a system, there should be a designated ‘picture place’ that I would need to navigate to.
However, I don’t agree that there should be only one way to get there. I think it is best to offer multiple paths to the same destination. Users will of course find comfortability using one path over others and that’s fine- as long as the paths are conceptually the same and use the same terminology so that the user doesn’t think they are different things. Like, I wouldn’t call one link “add pictures’ and another one ‘image manager’ or whatever.
It would be a good idea to have a constant, static, and recognizable portal link to any given website entity/place. It wouldn’t hurt to offer other entry points though, especially if it’s done intelligently. Like, amidst content that is related to pictures, throw in an ‘Add pictures’ link! Since people operate associatively, intelligent placement of multiple entry points can really enhance the user experience and encourage them to use features they would otherwise not venture into.
I concur with Cody. A little navigational redundancy can be a positive thing. I’ve quite frequently experimented with different wording that leads down the same path–as long as the terminology is clearly related, or similar enough to avoid being ambiguous. As long as you don’t semantically overlap with completely unrelated links, I think it’s a great way to play with phrases that may appeal to different subsets of your audience. Clearly, having wildly divergent terminology may cause no small amount of confusion, but you’ll have the benefit of knowing which particular word, phrase, or placement generates the most interest.
One thing I feel designers forget is the importance of links. They use more time on the design of the link, than how the user will use it.
Links should always be clearly distinct, and react to focus/hover.
One should not have like 5 types of links, and text that is not a link should never resemble a link i.e. underlined, blue, or purple.
The user should never have to test if something is a link or not.
I think the default link is the way to go.
The menu is an exeption of course.
You should set
text-decoration: none;on hover on your site. Thats my opinion anyway.Leave a comment
Share your thoughts with the worldYou can use Markdown, or you can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>Please keep comments respectful and on topic.
This form is guarded by Akismet, so don't waste your time trying to submit spam. It won't work. Ever.