UI/UX Design Principles

UI/UX plays key role in success of any application. You will find lot of blogs debating on the roles and responsibilities of a UI Designer and a UX Designer. But if you think from the end goal which is providing extraordinary experience to the end user, both of these goes hand in hand.

A great UX without great UI doesn't make much sense and so vice versa. User Interface (UI) Design and User Experience (UX) Design are the qualities those are must have for every UI engineer. These is no rocket science in it, but just small things and a discipline that you have to maintain during the development process.

Let's talk about couple of principles to have better understanding of it.

Responsive Web Design (RWD)

Responsive web design is designing your web application to have fluid interface for varying device sizes. RWD has been very popular for last few years. In initially days people used to have RWD as explicit requirement for the applications but nowadays it become implicit requirement for any web application.

Mobile First Design

Looking at increasing number of mobile web users there is a growing trend in the industry to start designing your application with mobile considerations first and then work up to a larger desktop version. So in this approach you first design your application for a mobile device providing most viable features possible and then design your application for browser and other devices to provide more features/functionalities utilizing their processing capabilities. It promotes progressive enhancement methodologies over graceful degradation.

Minimal Viable Product (MVP)

This principle is quite relevant in B2B applications. Start your development with just enough features to gather validated learning. Advanced version with refined features can be planned in subsequent releases.

Use of Info-graphics

Users scan web applications, don't read it the way they read other materials. Hence info-graphics has become standard for convey sets of data or instructions.

Prefer scrolling over paging

Scrolling is always faster than paging. The pagination was promoted to focus on speed but "clicks are expensive in usability". Scrolling beats paging because it's faster to scroll down then to click. Virtual Scrolling is be better solution meeting both of these requirements

Focus on simplicity and clarity

Be clear with what you want user to do on the application. Interface need to have "preferred actions" to be as obvious as possible. User should not have to think what you want them to do. For example, it could be focusing visual attention on one button vs. four on your dashboard/home page.

Be consistent throughout the interface

Consistency in fonts, color schemes, buttons, effects, spacing and aesthetics throughout the design reduce the need for user to rethink. Users familiar with one module/screen can easily work on other screens.

Minimalistic and Flat design approach

Minimalism is taking over the web. Nobody wants to look at screens overcrowded with graphics, text and random flying objects. A cleaner page is easier to navigate and understand.

Flat design philosophy strives for simplicity and clarity. Flat pages rarely introduce dimensionality, shadow or texture into the equation, relying instead on visual clarity and bold colors to communicate.

Forgiveness

User makes mistake, no matter how good your user interface is designed. Forgiveness is the approach that allows users to recover from errors, or even better to prevent errors.

Some Aspects of Forgiveness:

• Feedback and error recovery
• Error prevention through validations (both at client side and server side) with proper messages and visual indications
• Undo actions
• Suggestions
• Auto Save the state
• Enable/Disable actions when needed
• Confirmations before taking critical/irreversible actions