Wednesday, August 19, 2015

interaction design - UI simplicity vs complex requirements


I'm in the process of crafting a relatively complicated interface for a niche social networking website and I'm struggling to achieve a satisfying level of simplicity for the UI.



Given that "modern" design trends favor simple/large/bold/clear, and also the need to support multiple devices from mobile up (and therefore potentially forsake pixel perfection), are there any guidelines or good strategies for approaching complex user interfaces where the functionality simply needs to be there but the sum of the total feels over-whelming, or perhaps over-technical, and perhaps even a little old-fashioned.


This is my first post and I understand that this question is a little vague. I'd be very interested in hearing about some practical techniques for dealing with UI complexity, apart from just "remove everything you can".



Answer



Create a clear visual hierarchy


52 weeks of UX
tuts plus


This basically breaks down into making the most important parts of the page the most obvious through various techniques such as size, colour, contrast, use of whitespace, proximity to other items, etc.
The most important parts of the page are usualy the headings, content and primary navigation (or the most important parts of it).
Then items should become less obvious the less important they are. This is not saying they should be hidden in any way just that they should not be what the user first focuses on.


Try to only show things that are immediately relevant



For example if you have a lot of options for filtering content you can have a single button for 'filter content' which when clicked presents a panel with all the filtering options. This way part of the UI is hidden (but immediately available) until actually needed.
The yellow help button at the top right of the question/answer fields on stack exchange is another good example of this. Advanced users who already know or people who don't care about additional markdown options can ignore it but for those who want it the additional help is readily available.


User testing


There is no substitute for getting good feedback from your users. Sometimes this can change whole aspects of your system as you realize that something you thought would be very important or would be a problem turns out to be insignificant.
Remember, you are not the user.


Other ideas


Be sure to use progressive enhancement. (see smashing mag and tech republic)


You could try implementing an adaptive system that learns from the way individual users use it and adjust accordingly. For instance reducing/increasing the prominence of items depending on how much they are used over time. This can be (but does necessarily have to be) quite complex.


Sometimes splitting components into separate steps/pages can allow you to be more focused on each step.


Of course "reduce until you are left with the absolute essentials" is a great design philosophy and does not have to mean sacrificing looks.



These are only a few suggestions for what is a very broad topic.


No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...