The Knack Behind User Interface Design: PDF Document


Published on

A good User interface aims to provide a comfortable interaction between the user and the system, enabling the user to manipulate the system providing desirable results to the end user.

Published in: Design, Technology
1 Comment
  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

The Knack Behind User Interface Design: PDF Document

  1. 1. User Interface Design The Knack Behind User Interface Design Tel : +91-44-42305023, 42305337 Email : N EW N O . 7 , M O UN T R O A D , L I T T L E M O UN T , S A ID A P E T , CHENNA I-15
  2. 2. CONTENTS I. II. User Interface Design – Introduction …4 Tips To Be Remembered …5 i. ii. iii. iv. v. vi. vii. III. Techniques That Can Enhance User Experience i. ii. iii. iv. v. vi. vii. viii. ix. x. IV. Simplicity Consistency Structuring The Webpage Use Of Color And Texture Strategically Effective Use Of Fonts Communication Defaults Clarity Effective Wording Of Labels And Menus Grouping Pictographic Representation Contrast Ease Of Transition/Toggling Managing Attention By The Use Of Colors Auto-Focus Custom Input Highlight Concise Dialog Boxes Principles That Changes The Game Of User Interface Design i. ii. iii. iv. v. vi. …7 …9 Reduce Thinking Time- Reduce Questions Do Not Test Patience Visibility Without Distraction Crisp Writing Reach Out With Simplicity Use Blank Spaces Effectively Page 2
  3. 3. vii. viii. ix. x. xi. V. VI. VII. Importance Of Effective User Interface Design …11 Applications That Can Successfully Benefit From The User Interface Design …12 Catching Trends …12 i. ii. iii. iv. v. VIII. The Teto Approach The Principle Of Structure Feedback Tolerance Resume Function Responsive Web Designs Interactive Scrolling Tap Friendly And Swipe Optimal Designs Large And Bold Images Videos Conclusion …13 Page 3
  4. 4. I. USER INTERFACE DESIGN The Knack Behind User Interface Design Introduction: Imagine what would happen if you click on a pop-up link from a web page and nothing happens or the website does not respond to your actions?? This is where User Interface comes into play. A good User interface aims to provide a comfortable interaction between the user and the system, enabling the user to manipulate the system providing desirable results to the end user. It must facilitate the effective operation and control factors of the system to the ultimate end user, without which the purpose of the system interaction would be a failure. A good User Inte rface Design should focus on the simplicity of the design and also on the efficiency of the system in order to understand and anticipate the needs of the user, thus enabling easy interaction combined with the use of easily accessible elements which facilitates the performance of the actions required by the user. In order to ensure an aesthetically pleasing and engaging user interface design, it must require concentration in the areas of Interactive designs, Visual effects and information architecture, which if perfected provides a smoothly functioning and a hassle free User Interface. Page 4
  5. 5. II. TIPS TO BE REMEMBERED i. Simplicity: Avoid complex interfaces as they take a longer time to be understood, which can also mean that more training is required in order to achieve the desired results, whereas when the design is simply the interaction and workability also becomes easier. ii. Consistency: In a user- interactive mode consistency can make the difference between a pleasing website to a highly difficult website to work with. Keeping a consistent design throughout the webpage makes it easier to understand the workability model and follow the instructions similarly throughout the interface. Page 5
  6. 6. iii. Structuring the Web page: When the website layout is decided upon, care should be taken to ensure that the layout is structured in order to give a clear highlight of the features the brand wishes to portray to the end-user. Proper and strategic placing of content and designs can ensure better inter-activeness to the end user. iv. Use of Color and Texture strategically: Using vibrant colors and captivating textures in the right places can impose an optimum effect on the end user, ensuring that the user interface passively promotes the features that are highlighted by the developer. v. Effective use of Fonts: Fonts can be used in a hierarchical fashion to emphasize on the most important points one wishes to convey, this can further be categorized according to prominence, and this feature would provide more clarity to the user interaction. vi. Communication: In many cases the working on the design is not conveyed to the user, optimum use of links, prompts, change of action, error and the status of varied processes must be conveyed to the user effectively. This ensures the linking of the user to the interface system, which ensures the avoidance of confusions and frustration faced by the end-user during time lapses. vii. Defaults: Analyze in detail the services provided by the site and thereby exercise a clear understanding of the common requisites and underlying req uirements which are sorted out by the end-user, facilitate the interaction and minimize the processes required to be traversed by the user, thereby creating a system which understands the needs and caters to the requirements in an intelligent manner, in the form of pre-determined services, options and selections. Page 6
  7. 7. III. TECHNIQUES THAT CAN ENHANCE USER EXPERIENCE Keeping in mind certain researched techniques and implementing the same can be extremely beneficial when designing user interface systems. i. Clarity: In many cases the users have difficulties in understanding the working of the program, in such cases offer help messages when the cursor hovers through the menus, to offer a better understanding of the system in a quick and easy manner. ii. The Effective Wording Of Labels And Menus: Always remember to be crisp and concise in wording messages or menus, enabling better understanding of the categories available in the interface, making sure nothing misses the eye. iii. Grouping: Categorizing or grouping of services and information effectively can greatly contribute to the reduction of aimless searching for services or options. Categorizing furthermore would provide a balanced approach to the entire interface due to the reduction in cluttering. Page 7
  8. 8. iv. Pictographic Representation: The utilization of pictures provides a good value addition to a well formatted web page, visualized representation provide easy understanding to the end-users. v. Contrast: Colors can be used effectively to communicate the hierarchical importance in a web page, the use of focus shades can ensure more importance is diverted to the highlights of the page. vi. Ease of Transition/Toggling: Care must be enforced to ensure that the transition from one page to another must occur effectively and with ease with the extensive use of process commands to ensure better understanding of the user towards the working of the system. vii. Managing Attention By The Use Of Colors: Contrasting colors add a vibrant touch to the web page and it’s an effective tool in drawing the attention of the end user to the points of attraction the organization wishes to emphasize on. viii. Auto-Focus: In the case of documents that require a degree of typing, the auto- focus tool can facilitate the input process of the user by automatically moving the type cursor to the field, making it ready for typing. ix. Custom Input Highlight: This tool further facilitates the working of typing inputs by highlighting the text input field which gets highlighted immediately and subsequently to ensure the visibility of text that are being typed by the user. This makes it easier for the user to view the subsequent fields to be typed. x. Concise Dialog Boxes: In many cases the users do not have the patience to read through the entire dialog box content, therefore in order to make the content easier, more action specific dialog boxes which instead of yes, no or cancel can state function such as save, don’t save or cancel, will reduce the time and manage the content specified in an easier fashion. Page 8
  9. 9. IV. PRINCIPLES THAT CHANGE THE GAME OF USER INTERFACE DESIGN i. Reduce Thinking Time- Reduce Questions: Ensure that the users have very little to think about which makes the number of questions that arises lesser, when this happens the end-user feels more ensured and intrusive about the website and does not hesitate to venture forth into the captivating system offered. ii. Do Not Test Patience: Research states that in case of a free trial service offered, users are more inclined to giving personal details like e- mail etc. When it is asked for at the end, rather than when it insisted on in the beginning, also care should be taken to mineralize the information required from the end-user in-order to reduce the time spent by the user filling out forms. iii. Visibility Without Distraction: Ensure user focus with the use of informative infographical designs and attractive short patterns of interaction which highlights what you could offer to the user in return. iv. Crisp Writing: E loquent language is easily ignored by the user as one cannot expect all users to have such a level of understanding of the platform used, therefore keep crisp short phrases, with a well defined scalable categorized layout supporting a very plain and object oriented language. v. Reach Out With Simplicity: The (KIS) principle more elaborately known as the Keep it Simple concept revolves around keeping and maintaining the entire website in a simple finish format. It is always better to keep in mind that the users are in reality present to optimize the services offered and not ultimately to enjoy the designs and patters present. vi. Use Blank Spaces Effectively: Using spaces to categorize collective points in an effective manner is a good way to deliver well tailored comments more efficiently, rather than presenting long pages of collective texts which will prove to be ineffective. vii. The TETO Approach: The Test Early & Test Often approach should be optimized every once in a while to sort possible problems and issues that can be faced by the end user with the giver interface design. Page 9
  10. 10. viii. The Principle of Structure: Emphasis should be given to maintaining an architecture that’s not only organized and meaningful but also purposeful to the site as well as useful and clear to the audience. Maintaining a well recognized structure also with a good flow of content compliments to the overall architecture and workability of the site. ix. Feedback: The success of the web user- interface design could rely on its feedback feature as constant feedback of processes, errors; status of the program etc. Should be mentioned on a regular basis to ensure the user’s anxiety does not escalate. x. Tolerance: It is common of mistakes to occur in any performance, the user interface design must have enough tolerance to incorporate those changes in the system by taking them into consideration and providing useful undoing and redoing feature as well as automatic error detection features. xi. Resume Function: The design should be incorporated in such a manner that the user who returns to the site should not have the need to repeat processes all over again, automated memory options facilitating lesser rethinking can play a vital role In convincing the user to return to the website on a regular basis. Page 10
  11. 11. V. IMPORTANCE OF EFFECTIVE USER INTERFACE DESIGN As per statistics your user interface design plays 77% in convincing the user to continue on with your website that alone can be the marking difference in the playing field between success and failure in the web arena. A good user interface is one which has an emphasis on the following points: - Ease of use: there is no point in having a greatly designed interface that does not cater to the understanding quotient of the user. - Self Explanatory: A good User interface design is ideally manual free due to its self explanatory simplistic style. - Performance Speed: an ideal user interface design is one which can satisfy to the time needs of the user by performing effectively, with consistent interface speed without splurging on the user’s time. - Familiarization: positioning familiar elements required frequently by the user as a necessity in familiar locations saves time and vitality. - Help Tips: a good interface must be able to detect constant errors and offer help as and when required by providing optimum help tips and tools. With the proper optimization of a good user interface design we will be able to achieve Facilitation: when the design caters to the needs of the user and provides easy steps to achieving user goals the return quotient of the user and their associations with the organization will increase substantially. Design: a customer friendly design with a good balance of design and information will give an effective return on investments as the users are able to traverse through his system and connect easily with the design, their orientation to continue would be elevated. Features: with the effective use of the above concepts, the designer can be sure that the model created would be a success, with time and effort in integrating the model laced with a n array of constant tests from third party sources, the designer could benefit greatly with the implementation of user friendly changes clubbed with a system that works effectively to cater to their needs. Page 11
  12. 12. VI. APPLICATIONS THAT CAN SUCCESSFULLY BENEFIT FROM THE USER INTERFACE DESIGN With the tremendous growth in the gadget industry, software’s and platforms are no longer focused only towards the use on computers. With a rise of more than 2.3 billion portable products available in the market, the creation of applications that caters to the main website cannot be taken lightly. When creating a mobile app which can be used across platforms o ne should ensure that there is:Ease of Transition from the desktop site to the mobile site No loss of features or services occurs within the platform The compatible design should be made user friendly Should cater to the device requirements Visibility should not be tampered with Access to various information should be made available with no exceptions. Ensuring these factors would enable the on-the- go applications to be successful by being user friendly and compatible, thus ensuring more accessible to the end user. VII. CATCHING TRENDS With User interface design playing a vital role in capturing the market, various trends have evolved as well as brought back from the past, some of the familiarly used common tre nds which are highly successful: i. Responsive Web Designs: This allows the website to convert to any screen as required by the user based on access, with the tremendous growth in the electronic industry the need to ensure websites are made available across platforms is of prime importance, and that coupled with the fact that the websites need to be available without compromising on the features plays a vital part, therefore responsive designs are one of the leading trends in the market. Page 12
  13. 13. ii. Interactive Scrolling: This provides a varied number of scrolling options which are aesthetically appealing as well as creatively functional ensuring that there is an element of interactive design associated with the web page iii. Tap Friendly And Swipe Optimal Designs: This feature offers an interactive website with concise content which caters to the requirement of on-the-go users and users who use applications in cross platforms. iv. Large And Bold Images: Solid images which are extra large are posing a comeback in recent times. This type of design is used to keep up the interface and user to the point and active. v. Videos: With the right speed and optimal support the use of videos is becoming highly popular as according to research a video can communicate your brand effectively and it increases the chances of the viewer turning into your client by 437% VIII. CONCLUSION In any case it is advised by User Interface Design Experts that the best designs are the ones that convey the message to the point equipped with a simplistic approach and user friendly concept. ********* Page 13