On designing User Interfaces Rajesh Lal Senior UI/UX Engineer

Agenda What is User Interface Design Interface Design Fundamentals Standard Design Principles Windows Technologies for UI development

What is User Interface Design

Interface Design Fundamentals

Standard Design Principles

Windows Technologies for UI development

User Interface Design interact Definition : Process of designing the interaction between a User & a Product

interact

Definition :

Process of designing the interaction between a

User & a Product

Interface Design Fundamentals Identify the users Ask the users Design for the user

Identify the users

Ask the users

Design for the user

Identify Your User Who are the Users ? How much computer experience do they have? How do they perform their jobs now? What other software they will be using? What specific knowledge they have? What is their existing software & hardware Operating System Drivers Screen resolutions Monitors

Who are the Users ?

How much computer experience do they have?

How do they perform their jobs now?

What other software they will be using?

What specific knowledge they have?

What is their existing software & hardware

Operating System

Drivers

Screen resolutions

Monitors

Ask the User Only the users know what they need and what they want and The only way to find out what the users need and want is to ask the users and design accordingly.

Ask the User

Only the users know what they need and what

they want

and

The only way to find out what the users need

and want is to ask the users and design

accordingly.

Design For the User Provide an intuitive interface Provide easiest interaction possible Help the users complete their tasks

Provide an intuitive interface

Provide easiest interaction possible

Help the users complete their tasks

Standard Design Principles 80/20 Rule Simplicity Accessibility Consistency Feedback Forgiveness

80/20 Rule

Simplicity

Accessibility

Consistency

Feedback

Forgiveness

Standard Design Principles User Interface Design Find the Top 20 % Show that First similar layout, terminology interaction, and navigation Maximum number of users Keyboards accessibility Multiple Visual Cues Redundancy Don’t let user make mistakes Enable buttons when required Disable Transaction button when clicked once Immediate Feedback Update user with current status More important if you are working in the background Keep It Simple Keep it Clear Avoid user’s distraction Proper tradeoff between functionality and simplicity

Find the Top 20 %

Show that First

similar layout, terminology

interaction, and navigation

Maximum number of users

Keyboards accessibility

Multiple Visual Cues

Redundancy

Don’t let user make mistakes

Enable buttons when required

Disable Transaction button

when clicked once

Immediate Feedback

Update user with current status

More important if you are

working in the background

Keep It Simple

Keep it Clear

Avoid user’s distraction

Proper tradeoff between

functionality and simplicity

Windows Technologies for UI development Windows Presentation Foundation Windows Forms Rich Internet Application (RIA) Adobe Flash /AIR Silverlight JavaFX AJAX Server Pages ASP.NET PHP CGI HTML

Windows Presentation Foundation

Windows Forms

Rich Internet Application (RIA)

Adobe Flash /AIR

Silverlight

JavaFX

AJAX

Server Pages

ASP.NET

PHP

CGI

HTML

User Interface development Technologies

www.abcofdesign.com contact: [email_address]