Post on 22-Feb-2016
description
Gabriel Spitz
User-Interface Design Process
Lecture # 6
1
Gabriel Spitz 2
What is Process
• A process is a:o Collection of tasks or steps that are tightly relatedo Initiated in response to a need or a specific issueo Achieves specific result for the customer of the process
• A process is a way or the set of steps to solve a problem
Information Technology and ServicesSyracuse University
Gabriel Spitz 3
User Interface Design Process
NeedsAssessment
Competitive Analysis
PersonaDevelop
Task Analysis
MockDesign
WorkflowDesign
ConceptualDesign
WireframeDesign
Formative Evaluation
MockupDesign
PrototypeDesign
Requirements Development
Design
EvaluationMockDesignSummative Evaluation
Gabriel Spitz 4
UI Design process - Iterative Design
• Use wireframes for early concepts • Later concepts use richer implementations• Every concept is evaluated – Users involved in all
iterations • More iterations generally means better UI
Gabriel Spitz 5
Why Follow the UI Design Process
• To ensure that the problem is resolved• To ensure that the resolution meets usability
criteria• To ensure a quality team work
Gabriel Spitz 6
Requirements Development
Gabriel Spitz 7
Why Articulate Requirements
• Many IT projects fail because their design is based on an inappropriate, and/or incomplete set of requirements
• Such products solve the wrong set of problems, or the right set of problems in the wrong way
• For example:o Movie ticket kiosk – Selling tickets vs. Getting you into
the showo Newton – was just too large & heavyo Others?
Gabriel Spitz 8
Apple Newton MessagePad (1993)
Was- Large-7.5”X4.5”X0.75- Heavy-480 gr- Expensive-$1000
Palm Pilot- Size- 4.7X3.2X0.7- Weight-160 gr - Price-$300
Gabriel Spitz 9
Solving the Wrong Problem - Example
Locate a CM VS. Locate a Problem
Gabriel Spitz 10
Requirements
• Requirements statements specify:o What the product should do – Functional req.
• Store personal contact information• Enable users to add delete and modify contact info.• Print contact information• ….
o How it should do it – Non-functional req.• Contact info should be organized as a “business card”• Contact name and title should appear in bold type
face• ….
Gabriel Spitz 11
Requirements Development
• Get in touch with real people who will be potential users of our system
• prototypical categories • extremes
• Learn about their real taskso articulate concrete, detailed examples of tasks they
perform or want to perform that your system should support• routine• infrequent but important• infrequent and incidental
Gabriel Spitz 12
Iterative Design
• Helps meet users requirements byo Iteratively designing the UI and evaluating it with actual
or potential users• we force the issue of requirements to the front
o By identifying requirements through systematically modeling users’ roles, tasks flows associated with each role and information needs for each task
Gabriel Spitz 13
Usability Requirements …
• Are user related goals that were established prior to UI design
• Often are based on results with other systems• To be useful should be:
o Specifico Unambiguouso Clear
Gabriel Spitz 14
Generating Requirements
• Requirements do not happened • Requirements do not exist out there• Requirements are often difficult to identify
• Requirements need to be developed
Gabriel Spitz 15
Steps in Developing Requirements
• Developing requirements involveso Gathering datao Interpreting the datao Extracting requirements
• This sequence of steps is iterative and therefore requirements evolve over time
Gabriel Spitz 16
Gathering Data
• To understand users and their tasks we need to gather data about how users:o Thinko Acto Feelo AdaptWithin the context of interacting with the target system or
its predecessor
Gabriel Spitz 17
Criteria of Data Gathering
• Ensure that sufficient, and appropriate data is available to develop a stable and comprehensive set of requirements
• The scope of data gathering efforts should be wide enough to ensure effective coverage of the different aspects of the applications’ use
• Data gathering should include information about users, their tasks, and the environment in which tasks will be performed
Gabriel Spitz 18
Data Gathering Techniques• Only a few basic techniques are generally used to
gather behavioral data• These techniques, however are flexible and can be
combined in a variety of way to ensure effective coverage of the design space
• The most common techniques include:o Observations – Watch people at worko Interviews – Talk to peopleo Questioners – Ask people specific questionso Review documentation – Read about their work
Gabriel Spitz 19
Observations
• Involves watching and recording how users actually performs a function or a set of tasks
• Often conducted at the workplace of the user• Observations are very effective when the task
involved is primarily physical• For tasks that are primarily cognitive we should
add “talk aloud”o Ask the operator to articulate what s/he is doing and
why
Gabriel Spitz 20
Good Task Examples
• Focus on what users want to do not on how they will do it
• Are specific• Describe a complete job• Specify who the users are• Are evaluated• As a set, identify a broad range of users and task
types
Gabriel Spitz 21
If Tasks Do Not Exist
• If all else fails…o describe your expected set of users, o describe your expected set of tasks
• These will become your ‘assumed users and tasks’o verify them later as information comes ino modify them as needed
Gabriel Spitz 22
If There Is No System Yet
• If there are no real users or tasks…o think again, there probably are!
Jeff Hawkins, the inventor of the Palm Pilot, was said to have carried a small block of wood around in his shirt pocket … As various everyday situations arose, he would take out the block of wood and imagine how he would use the device.1
1see Sato and Salvador, interactions 6(5)
Gabriel Spitz 23
Interview
• One on one interaction between a designer and a user
• Often it is a face to face interaction but can also be over the phone or a “chat room”
• Interviews can be either structured or unstructured
• Task related interviews are most effective when conducted at the work placeo Users find it easier to point at an object and use gestures
than verbally articulate actions or object
Gabriel Spitz 24
Questionnaire
• Requires active user participation• Intended to elicit specific information• Questionnaire come in different forms
o Open endedo Multiple choiceo Yes/no
• Suitable for gathering information from a large group of people distributed over a wide geographic area
• Require careful design and evaluation
Gabriel Spitz 25
Review of Documentation
• Involves reading available user-guides, FAQ, help files, etc. and developing an understanding of what users do and need
• Documentations is a good source of information about available functions, features and procedural aspects of tasks
• Should be used as a first line of attack in developing requirements
• But should not be used as the only method of data gathering
Gabriel Spitz 26
Usage of Data Gathering Methods
• Observationo Develop a detailed understanding of tasks, and
procedures in the real world – How is it used• Interview
o Explore issues and develop use scenarios – What is missing
• Questionnaireso Gather specific information
• Documentation reviewo Develop a high level understanding of features, task,
and procedures – what is there
Gabriel Spitz 27
Choosing Data Gathering Method
• Most of the time we use all methods during the UI design
• Invocation of a specific method is driven by:o The type of information that is needed
• General understanding, specific data, ….o Availability of resources
• Money, time, people, ….o Access to users