Front End UI Design

A front end user interface design is a very important element of any web application or for that matter any software application which involves interaction with users. The attributes of good design are quite similar to  physical applications and gadgets. The concept of a UI design can be looked fundamentally from a human interaction model. How the system builds the notion of two way communication with the user using the system. The important elements of UI design are mainly

• Visual Display
• Workflows

Visual Display

Physical systems can use other sensory elements like sound and smell apart from visual cues to
communicate but software applications are usually limited to visual displays. Software applications need to engages users gaze to build the communication. There are again two parts to visual display. 

• Look and feel: Looks and feel is more about the colours, layout and font schemes. It's like the first impression. There are standard notions connected with colours and people may relate with them. For example a high temperature condition is shown by red colour. Red is also more related to alarms and errors. Usage of right colour schemes can help in focussing the attention of users to certain parts of page or application.

• Display of information: What kind of elements are used to show the information and data to end user. For example the traffic to a page can be shown by an odometer or the traffic can be shown as condensed graph to reflect the growth with time. The visual elements to be used should be governed by the perception that you want to create in a user's mind. Also how the elements are laid on the page. Something in centre portion of the page will get more attention of user than something hanging from top or bottom. Popups can create a situation of high attention, if you want to communicate about something very important or something very bad.

Visual display is basically done by people with design skills. In software world of web applications it's about HTML and CSS .

Workflows

Workflows are more about how the user interacts with the system. In case of software, it's about the sequence of task a use has to perform to achieve the end result. For example if user wants to buy something you may not want to take his credit card information right in the beginning. Good workflow design is about good usability. It also requires a lot of inputs from domain experts. If there are current processes, that needs to be understood properly so that it is mapped in the designed workflow.

For example for a travel site, the sequence could be

• Find the availability between destinations in terms of dates and level (economy/business)
• Select the flight with date and level.
• Click on 'Book'
• Enter payment details 
• Get the confirmation of booking

Based on workflow design the user has to fundamentally achieve the task of booking. Workflows is done by people who are expert in interaction design and usability. It also requires a lot of input from domain experts.

End Note

Both visual display and workflows are important elements of good The visual display can be applied on each step of workflow to gain the required usability. A good way to approach software user interface design problems is to first nail down the workflows and than focus on visual display elements.