UI design principles:
Principle #1: Clarity
Usability.gov says that the “best interfaces are almost invisible to the user”.
Everything in the system, from visual elements, functions, and text, needs to be clear and simple. This includes layout as well as the words used — stay away from jargon and complex terms or analogies that users won’t understand get good ui from Web Design Preston.
Aesthetic appeal also fits into this principle. Ensure colors and graphics are used in a simple manner, and elements are grouped in a way that makes sense.
Apple even states an “app should respect its users and avoid forcing them to learn new ways to do things for no other reason than to be different”.
Principle #3: Flexibility and customizability
Is there more than one way people can access your system and its functions? Can people perform tasks in a number of different ways, too?
Providing your users with a flexible system means people are more in control of what they’re doing. Galitz mentions this can also be done through allowing system customization.
Examples of good UI design
For a list of some of the best user interface examples, check out last year’s Webby Awards category for Best Interface Design. The 2016 category winner was the Reuters TV Web App, while the People’s Choice winner was AssessYourRisk.org.
As an aside, this is the second year that the Webby Awards introduced this category — just goes to show how important it is to have good UI design!
While you don’t want your site or application to look exactly the same as these winners, you still want yours to function well and be aesthetically pleasing. To help you get there, there are a number of UI design tools and UI software available.
Here’s a list of some of the many out there:
UXPin – An online UI design tool that allows you to create wireframes, mockups, and prototypes all on one platform.
InVision – A prototyping and collaboration tool. More in-depth than Balsamiq, and it allows you to go from mockup to high-fidelity in minutes.
Balsamiq – A simple mockups tool for wireframing, which allows users to test out ideas in the early stage of interface design.
Atomic – An interface design tool that allows you to design in your browser and collaborate with others on your projects.
Principle #2: Consistency
The system should have the same or similar functions, uses and look throughout it for consistency. For example, the same color scheme should be used throughout an app, or the terminology on a website should be consistent throughout. Users should also have an idea of what to expect when they use your system. As an example, picture a retail shopping app. You’d expect that any other retail shopping app out there will have similar basic functions: a place to log in or create an account, account settings, a way to navigate and browse stock, a way to purchase stock at the press of a button. However, this doesn’t mean copying another app or website exactly; there should just be consistency so users know what to expect when they encounter your system.