user interface design: pdf document

8/12/2019 User Interface Design: PDF Document

1/13

User Interface Design

The Knack Behind User Interface Design

www.spiderindia.com

Tel: +91-44-42305023, 42305337

Email:[email protected]

N E W N O . 7 , M O U N T RO A D , L I T T L E M O U N T , S A I D A P E T ,

C H E N N A I - 1 5
http://www.spiderindia.com/http://www.spiderindia.com/mailto:[email protected]:[email protected]:[email protected]://www.spiderindia.com/


2/13

www.spiderindia.com Page 2

CONTENTS

I . User I nterface Design In troduction 4I I . Tips To Be Remembered 5

i . Simplicityii . Consistencyii i . Structur ing The Webpageiv. Use Of Color And Texture Strategicall yv. Effective Use Of Fontsvi . Communicationvii. Defaults

I I I . Techniques That Can Enhance User Experience 7i . Clarityii . Effective Wording Of Labels And M enusii i . Groupingiv. Pi ctographic Representati onv. Contrastvi . Ease Of Transi tion/Toggli ngvii. Managing Attention By The Use Of Colorsviii. Auto-Focusix. Custom Input Highlightx. Concise Dialog Boxes

IV. Principles That Changes The Game OfUser I nterface Design 9

i . Reduce Thinking Time- Reduce Questi onsii . Do Not Test Patienceii i . Visibi li ty Without Distractioniv. Cri sp Wri tingv. Reach Out With Simpli ci tyvi . Use Bl ank Spaces Effectivel y


3/13


vii. The Teto Approachviii. The Principle Of Structureix. Feedbackx. Tolerancexi. Resume Function

V. Importance Of Effective User Interface Design 11VI . Appli cations That Can Successfu ll y Benefi t F rom

The User I nterface Design 12

VI I . Catching Trends 12i . Responsive Web Designsii . I nteractive Scrolli ngii i . Tap F ri endly And Swipe Optimal Designsiv. Large And Bold Imagesv. Videos

VI I I . Conclusion 13


4/13


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 thesystem, 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 Interface Design should focus on the simplicity of the design and also on theefficiency of the system in order to understand and anticipate the needs of the user, thus enablingeasy 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 requireconcentration in the areas of Interactive designs, Visual effects and information architecture,which if perfected provides a smoothly functioning and a hassle free User Interface.

I.USER INTERFACE DESIGNThe Knack Behind User Interface Design


5/13


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 apleasing 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 followthe instructions similarly throughout the interface.

II. TIPS TO BE REMEMBERED


6/13


iii. Structuring the Web page:When the website layout is decided upon, care should betaken 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 ofcontent and designs can ensure better inter-activeness to the end user.

iv. Use of Color and Texture strategically: Using vibrant colors and captivatingtextures in the right places can impose an optimum effect on the end user, ensuring thatthe 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 themost important points one wishes to convey, this can further be categorized according toprominence, 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 processesmust be conveyed to the user effectively. This ensures the linking of the user to theinterface 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 clearunderstanding of the common requisites and underlying requirements which are sortedout by the end-user, facilitate the interaction and minimize the processes required to betraversed 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 se lections.


7/13


Keeping in mind certain researched techniques and implementing the same can be extremelybeneficial when designing user interface systems.

i. Clarity: In many cases the users have difficulties in understanding the working of theprogram, in such cases offer help messages when the cursor hovers through the menus, tooffer 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 andconcise in wording messages or menus, enabling better understanding of the categoriesavailable in the interface, making sure nothing misses the eye.

iii. Grouping:Categorizing or grouping of services and information effectively can greatlycontribute to the reduction of aimless searching for services or options. Categorizingfurthermore would provide a balanced approach to the entire interface due to the

reduction in cluttering.

III. TECHNIQUES THAT CAN ENHANCE USER

EXPERIENCE


8/13


iv. Pictographic Representation: The utilization of pictures provides a good valueaddition to a well formatted web page, visualized representation provide easyunderstanding to the end-users.

v. Contrast:Colors can be used effectively to communicate the hierarchical importance ina web page, the use of focus shades can ensure more importance is diverted to thehighlights of the page.

vi. Ease of Transition/Toggling:Care must be enforced to ensure that the transition fromone 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 thesystem.

vii. Managing Attention By The Use Of Colors:Contrasting colors add a vibrant touchto the webpage and its an effective tool in drawing the attention of the end user to thepoints of attraction the organization wishes to emphasize on.

viii. Auto-Focus: In the case of documents that require a degree of typing, the auto-focustool can facilitate the input process of the user by automatically moving the type cursor tothe field, making it ready for typing.

ix. Custom Input Highlight:This tool further facilitates the working of typing inputs byhighlighting the text input field which gets highlighted immediately and subsequently toensure 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 readthrough the entire dialog box content, therefore in order to make the content easier, moreaction specific dialog boxes which instead of yes, no or cancel can state function such assave, dont save or cancel, will reduce the time and manage the content specified in an

easier fashion.


9/13


i. Reduce Thinking Time- Reduce Questions:Ensure that the users have very little tothink 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, usersare more inclined to giving personal deta ils 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 tomineralize 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 info-graphical designs and attractive short patterns of interaction which highlights what you

could offer to the user in return.

iv. Crisp Writing:Eloquent language is easily ignored by the user as one cannot expect allusers 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 theKeep 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 aneffective 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 optimizedevery once in a while to sort possible problems and issues that can be faced by the end

user with the giver interface design.

IV. PRINCIPLES THAT CHANGE THE GAME OF

USER INTERFACE DESIGN


10/13


viii. The Principle of Structure:Emphasis should be given to maintaining an architecturethats 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 workabil ity of the site.

ix. Feedback: The success of the web user-interface design could rely on its feedbackfeature as constant feedback of processes, errors; status of the program etc. Should be

mentioned on a regular basis to ensure the users anxiety does not escalate.

x. Tolerance: It is common of mistakes to occur in any performance, the user interfacedesign 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 userwho 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.
http://www.spiderindia.com/http://www.spiderindia.com/http://www.spiderindia.com/http://www.spiderindia.com/http://www.spiderindia.com/http://www.spiderindia.com/


11/13


As per statistics your user interface design plays 77% in convincing the user to continue on withyour 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 caterto the understanding quotient of the user.

- Self Explanatory:A good User interface design is ideally manual free due to its selfexplanatory simplistic style.

- Performance Speed:an ideal user interface design is one which can satisfy to the timeneeds of the user by performing effectively, with consistent interface speed without

splurging on the users time.

- Familiarization:positioning familiar elements required frequently by the user as anecessity in familiar locations saves time and vitality.

- Help Tips:a good interface must be able to detect constant errors and offer help as andwhen 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 toachieving 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 connecteasily 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 modelcreated would be a success, with time and effort in integrating the model laced with an array of

constant tests from third party sources, the designer could benefit greatly with theimplementation of user friendly changes clubbed with a system that works effectively to cater to

their needs.

V. IMPORTANCE OF EFFECTIVE USER INTERFACE

DESIGN


12/13


With the tremendous growth in the gadget industry, softwares and platforms are no longer

focused only towards the use on computers. With a rise of more than 2.3 billion portableproducts available in the market, the creation of applicat ions that caters to the main websitecannot be taken lightly.

When creating a mobile app which can be used across platforms one 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 platformThe 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.

With User interface design playing a vital role in capturing the market, various trends haveevolved as well as brought back from the past, some of the familiarly used common trends which

are highly successful:

i. Responsive Web Designs: This allows the website to convert to any screen as requiredby the user based on access, with the tremendous growth in the electronic industry theneed to ensure websites are made available across platforms is of prime importance, andthat 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 trendsin the market.

VI. APPLICATIONS THAT CAN SUCCESSFULLY

BENEFIT FROM THE USER INTERFACE DESIGN

VII. CATCHING TRENDS


13/13


ii. Interactive Scrolling: This provides a varied number of scrolling options which areaesthetically appealing as well as creatively functional ensuring that there is an elementof interactive design associated with the web page

iii. Tap Friendly And Swipe Optimal Designs: This feature offers an interactivewebsite with concise content which caters to the requirement of on-the-go users and userswho use applications in cross platforms.

iv. Large And Bold Images: Solid images which are extra large are posing a comeback inrecent times. This type of design is used to keep up the interface and user to the point andactive.

v. Videos: With the right speed and optimal support the use of videos is becoming highlypopular 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%

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.

*********

VIII. CONCLUSION

user interface design: pdf document

Documents