To practice UCSD–Usability Design

(1)

1 © Jan Gulliksen & Bengt Göransson

To practice UCSD – Usability Design

User centered systems design, spring 2008, Lecture no. 15 © Jan Gulliksen and Bengt Göransson, 2008 http://acsd.hci.uu.se/

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Usability Design – from principles to process

 Adds essential UCSD activities and roles to any process.

 Easy to communicate.

 Easy to integrate: in organizations and projects.

 A subset of a development process.

Usage example

(2)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Plan the UD process

 Must also be an integral part of the overall project planning.

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Requirements analysis Elicit

business objectives

User profiles Contextual

inquiries

System goals, design criteria and usability

goals Usability

Design Guide

Growing software with iterative design

Usage Scenarios

Mock-ups Conceptual

Design

Evaluation Goals

Usability Design Guide

Interaction Design

Prototypes

Evaluation

Detailed Design

Evaluation

Goals met?

Yes No!

Yes

No! No!

Deployment

Usability Design in Systems Development

Analysis Refine models

• Explicit design activities

• A professional attitude

• Usability champion

• Holistic design

• Processes customization

• A user -centered attitude

Functional description

use -cases

Active user involvement

• User Focus

• Active user involvement

• Evolutionary development

• Simple design representations

• Prototyping

• Evaluate use in context

Driven by the Usability Designer

Usability Design Process

(3)

3 © Jan Gulliksen & Bengt Göransson

Contextual Inquiries and User Profiling ^Video

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Focusing on users _Video

(4)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Turn requirements into design

 Design criteria are complementary to usability goals.

 As we iterate through analysis, design and evaluation we learn more about what kind of design that will work best.

 Design criteria is an “aid” to  design for usability.

 These criteria are derived from user profiles and work tasks, and gives the direction for the design (layout and interaction).

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Design criteria:

Image size. Make the area for images as large as possible.

Minimal user load. Make the handling of the application as easy as possible.

No extra load should be put on the user. This includes short access paths to functions and minimized navigation paths within the application.

Work oriented. The application should map (support) the actual work situation (work flow) and domain to further minimize the mental load.

Support multiple user levels. The same application should allow both novice and expert users to gain maximal usability. There should be no expert mode needed.

Search area Database Work task bar

Design criteria, an example

(5)

5 © Jan Gulliksen & Bengt Göransson

Workspace with notepads Calendar for

overview and navigation

Work task bar Page metaphor for

viewing notepads 1. Fast scanning of content.

2. Easy and direct access.

3. Overview.

4. Support the average user.

Design decisions:

• No navigation through menus.

Supporting criterion 2.

• Fixed and static layout.

Supporting criteria 1, 2 & 3.

• Clean layout without

unnecessary graphical effects.

Supporting criterion 1.

• Focus on content. Supporting criteria 2 & 4.

• Restricted use of metaphors, use only when appropriate.

Supporting criterion 4.

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Usability Design Guide _Doc

Example TOC

• Customizing the usability design process for the project

• Plan for user participation

• Overview of the system – goals and functionality

• User profiles and/or personas

• Contextual task analysis

• Platform capabilities and constraints

• Usability goals

• Design decisions and criteria

• Usage scenarios

• Conceptual design

• Interaction design, navigation and information structure

• Detailed design

• Design artifacts

• Feedback and evaluations

(6)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

business objectives

inquiries

goals Usability

Design Guide

Usage Scenarios

Mock-ups Conceptual

Design

Evaluation

Goals met?

Interaction Design

Prototypes

Evaluation

Goals met?

Detailed Design

Evaluation

Introduce and operate Goals

met?

Yes No!

Yes

No! No!

Yes Usability Design Guide

Deployment

Usability Design in Systems Development

• Holistic design

use -cases

Active user involvement

• User Focus

• Prototyping

Usability Design Process

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Scenarios – User stories

 Scenarios for describing:

 Current work situation

 Elicit requirements

 Future usage

PREPARE THE SOLUTION User role: Laboratory staff.

Priority: 1 1=must have, 2=should have, 3=could have Context: The user wants to prepare the solution for a particular step in an activity, for example Stock Solution in 1D. The user does not know how to prepare the solution but know in which activity in the System to use it. She wants to find the recipe, make the solution and then use it.

Another common situation is that the laboratory staff wants to prepare different solutions in advance. They start with preparing all solutions for a certain activity, and continue with all solution in the next activity. An example is when a 2D Buffer has been started, and laboratory staff is going to make the solutions for staining (i.e. next activity in the workflow).

Issues for the prototype: The user starts with searching among all chemicals etc. Criteria may be short name, long name, application field, type of chemical and activity. Information displayed in the result

(7)

7 © Jan Gulliksen & Bengt Göransson

Conceptual design

 Abstract description of the overall concept.

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Refined conceptual design

(8)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Navigation

Status

Workspace

Drop symbol Main menu bar

Navigation

Status

Workspace

Drop symbol Main menu bar

Example of conceptual design

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Interaction design

 Interaction sequences, information architecture, the dynamics, navigation, menus, etc.

Delete Close

Image Archive – Open image

Options Open

Image Archive – Thumbnail view

(9)

9 © Jan Gulliksen & Bengt Göransson

Interaction design – example of navigation structure

Login Login

Läkemedel

Läkemedel ReceptRecept PersonligtPersonligt PubliceraPublicera ÅsikterÅsikter HjälpHjälp

www.pharmapoint.com www.pharmapoint.com

Avsluta Avsluta Kontakter

Kontakter

Biverkning Biverkning

Dokument Dokument

Visa

Visa SkickaSkicka Sammanf.

Sammanf.

Avtalstext Avtalstext

Signal arkiv Signal arkiv

Dok.

arkiv Dok.

arkiv Pers. info Pers. info Intresse

Intresse Prefs.Prefs.

Bekräftelse Bekräftelse

Om Om Frågor

Frågor

Referens

Referens IndexIndex Steg-för-stegSteg-för-steg Statistik

Statistik RiktlinjerRiktlinjer InfoInfo FelFel ÅsiktÅsikt Erfarenheter

Erfarenheter

ATC ATC

Villkor Villkor

Registrering Registrering

Kopia Kopia

Tipsa Tipsa

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Navigation with work task buttons

Interaction design | structured information architecture

(10)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Detailed design

 Exact placement, accurate components, colors, fonts, graphics, etc.

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Detailed design | grouping information

(11)

11 © Jan Gulliksen & Bengt Göransson

Prototyping – going from simple and comprehensible paper sketches to a completed system.

Prototyping

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Prototyping – low fidelity

(12)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Prototyping – high fidelity

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Prototyping – Quick and efficient

 Visual Basic prototype…

VB

(13)

13 © Jan Gulliksen & Bengt Göransson

User profiles Personas

User

Drawing material

Drawing area

Participatory prototyping

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

business objectives

inquiries

goals Usability

Design Guide

Usage Scenarios

Mock-ups Conceptual

Design

Evaluation

Goals met?

Interaction Design

Prototypes

Evaluation

Goals met?

Detailed Design

Evaluation

met?

Yes No!

Yes

No! No!

Deployment

Usability Design in Systems Development

• Holistic design

use -cases

Active user involvement

• User Focus

• Prototyping

Usability Design Process

(14)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Usability evaluations

 Preferable in users’ natural work environment.

 Powerful when seen as a part of the explorative process of finding (inventing) solutions.

 It’s an interaction between analyzing the problem, seeking solutions to the problem and evaluating solutions.

 Evaluations as a tool to explore the design space and learn more about possible solutions.

 Possible to combine field studies with evaluations.

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Out in the field, meeting users

(15)

15 © Jan Gulliksen & Bengt Göransson

Evaluation – mock-up example

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Evaluation – example mock-up and paper _Video

Doc

(16)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

business objectives

inquiries

goals Usability

Design Guide

Usage Scenarios

Mock-ups Conceptual

Design

Evaluation

Goals met?

Interaction Design

Prototypes

Evaluation

Goals met?

Detailed Design

Evaluation

met?

Yes No!

Yes

No! No!

Deployment

Usability Design in Systems Development

• Holistic design

use -cases

Active user involvement

• User Focus

• Prototyping

Usability Design Process

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

To deploy and introduce a system

 Critical to the success of the system.

 Usually gets too little attention.

 Must start when the project starts.

 Involves: organization, work processes, work force competence, etc.

 The system owners must be involved from the start of the project.

 Education and support.

 Use “ambassador users”.

(17)

17 © Jan Gulliksen & Bengt Göransson

UCSD and

the Rational Unified Process

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

The RUP “statement”

 The Rational Unified Process ^® or RUP ^® product is a software engineering process. It provides a disciplined approach to assigning tasks and responsibilities within a development organization. Its goal is to ensure the production of high-quality software that meets the needs of its end users within a predictable schedule and budget.

Rational Unified Process v. 2003.06.00.65

(18)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Architecture-centric and use-case driven

 “Use cases drive the Rational Unified process end-to-end over the whole lifecycle, but the design activities are centered around the notion of architecture - system architecture, or for software-intensive systems, software architecture. The main focus of the early iterations of the process - mostly in the elaboration phase - is to produce and validate a software architecture, which in the initial development cycle takes the form of an executable architectural prototype that gradually evolves to become the final system in later iterations.”

Rational Unified Process, version 2000 – 0011

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Rational Unified Process

Best practices 1. Develop iteratively.

2. Manage requirements.

3. Use component architectures.

4. Model visually (UML).

5. Continuously verify quality.

6. Manage change.

(19)

19 © Jan Gulliksen & Bengt Göransson

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

UCSD in RUP…

 Scattered in

the process…

(20)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Requirements:

Deployment:

UCSD in RUP

Analysis & Design:

Use Cases Conceptual Road Map:

Usability Engineering

Ux Plug-In Guidelines: Role playing,

Interviews, Storyboarding, User Interface etc Concepts:

User-Centered Design, Usability Testing

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Use-cases and UCSD…

 Too often there is no distinction between the description of the current work situation and the requirements on the new system.

 Users are experts in their profession (work), not in systems development.

 Use-cases do often continue presumptions and preconceived notion about the design of the user interface.

 Use-cases are sequential by nature. Does often lead to a sequential user interface an interaction structure, not supporting a flexible and effective dialog.

 The user interface becomes “fragmented”: ”one use-case

= one window”.

No single and agreed upon definition.

(21)

21 © Jan Gulliksen & Bengt Göransson

Use-cases and UCSD … continued

 Use-cases are difficult for users to perceive and imagine as the future work situation. Is not enough to

communicate with users.

 Different requirements on the size of the use-cases.

 Software developers prefer small use-cases when specifying the functionality.

 For usability designers use cases instead have to be large to correspond to users’ work tasks.

 The way use-cases are described can have implications on the design space.

 Use-cases are modeled with the software system as the focus of attention.

 Users must take an active in the use-case modeling and use other ways of communicate in parallel.

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

UCSD in RUP – summarizing

This could be improved...

 Usability is distributed and vaguely defined 

often not a major concern and simply

“disappears”.

 RUP is “architecture-centric” and not user-centered.

 In general, too much on artifacts.

There is a risk that the “big picture”

gets lost and that each role puts too much effort in writing documents (fill out forms).

 No one is coordinating or is in charge and responsible for the usability.

 No support for usability design.

This is ok!

 Use-cases 

can be user-centered.

 Focus on requirements.

 Iterative development.

 Multidisciplinary

teams.

(22)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Usability design discipline

 A plug-in to RUP: textual and graphical guidelines, examples and templates.

 Adds the key principles for user-centered systems design to Best Practices segment in RUP.

 Contains accepted design and usability methods.

 The “news” is that they are put into a software

engineering framework (RUP) and that they go beyond usability testing and usability goal setting / requirements.

 User-centered systems design throughout the systems life cycle.

 RUP will never be fully user-centered, but it can be improved.

RUP

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Benefits of the discipline

 The discipline is visible and easy to adopt.

 UCSD integrated, or at least visible, in the software engineering process.

 Contributes support for focusing on users and active user participation.

 Adds roles with explicit usability, UCSD and HCI competence.

 Quality assurance for usability.

 Early, active and continues involvement of users and

business will make the introduction and deployment of

the system easier and more successful.

(23)

Usability design in RUP

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Usability design: Overview

[ Inception and early elaboration ]

Plan a user -centered approach Plan a user -centered

approach

Perform competitor analysisPerform competitor analysis Conduct

user studiesConduct user studies

Conceptual design Conceptual

design

Interaction design Interaction

design

Detailed design Detailed design

Develop user assistance Develop user

assistance

Monitor usability work

Usability evaluation Usability evaluation

[ Late elaboration and construction ]

(24)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

[ Inception and early elaboration ] Plan a user -centered

approach Plan a user -centered

approach

design Interaction design Interaction

design Detailed design Detailed design Develop user

assistance Develop user

assistance Monitor usability workMonitor usability work

Workflow detail: Conduct user studies

Field study specialist Field study specialist

User profilingUser

profiling Usage and task

analysis Usage and task

analysis

Analyze context of use and work

environment Analyze context of use and work

environment

Usability goals

& design criteriaUsability goals

& design criteria

Context of use and work environment Context of use and work environment

Design sketches (explorative) Design sketches (explorative) Domain experts

Domain experts

End user End user Vision (modified)Vision (modified)

Explore future useExplore future use Usage scenarios

Usage scenarios

Glossary (modified) Glossary

(modified) Supplementary

specifications (modified) Supplementary

specifications (modified)

Business use - case model

(modified) Business use -

case model (modified)

Obstacles and enhancements (business and work process

improvements) Obstacles and enhancements (business and work process

improvements)

Other stakeholders Other stakeholders

Domain model (modified) Domain model

(modified) Business use-case (modified) Business use-case (modified)

Use case model (modified if existing) Use case model

(modified if existing)

Business Vision Business

Vision User profiles

(rich description) User profiles (rich description)

Usage and task model (current & future) Usage and task model (current & future)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

approach

Usability evaluationUsability evaluation

Workflow detail: Interaction design

Interaction design description Interaction design

description

Interaction designer Interaction

designer

Develop information architecture Develop information

architecture

Content design and layout Content design

and layout Develop navigation

structure Develop navigation

structure Domain experts

Domain experts

End user End user

Develop prototypesDevelop prototypes

Interaction design prototypes

(storyboards) Interaction design prototypes

(storyboards) Interaction

design model (navigation map) Interaction design model (navigation map)

Design guidelines and rationales

(modified) Design guidelines

and rationales (modified)

(25)

approach

Workflow detail: Develop user assistance

Usability designer Usability designer

Integrate assistance in system Integrate assistance

in system

Domain experts Domain experts

End user End user

Training and support materials

Recommendations for work and business

improvements Recommendations for

work and business improvements Glossary

(modified) Glossary (modified)

Training and support plan Training and support plan Plan user

assistance Plan user assistance

Course developer

Develop training materialDevelop training material

Technical writer Technical

writer

Develop support materialDevelop support material

Design guidelines and rationales

(modified) Design guidelines

and rationales (modified)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Customer Customer

Usability evaluation specialist Usability evaluation

specialist

Plan and conduct evaluation Plan and conduct

evaluation

Determine usability metrics Determine usability

metrics

Recruit representative users Recruit representative

users

Usability problems and re-design recommendationsUsability problems and re-design recommendations Usability

evaluation planUsability evaluation plan

Domain experts Domain experts

End user End user

Test plan (modified) Test plan

(modified) Iteration plan

(modified) Change request

(modified)

Workflow detail: Usability evaluation

approach

Usability evaluationUsability evaluation

(26)

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Roles

User-interface designer

End user

Domain expert

Usability designer Usability designer Interaction

designer Interaction

designer

Graphic designer Graphic designer Field study

specialist Field study

specialist

Usability evaluation specialist Usability evaluation

specialist

Technical writer Technical

writer Course

developerCourse

developer Technical reviewer Technical reviewer

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Case: Volvo IT

 Adjusted the plug-in to their development case of the RUP.

 2-day workshop with a team from Volvo IT.

 Used by Volvo IT in a large project at the Volvo Group Inc.

 Will be re-fined and finished by them.

 Implemented world-wide.

 Using Usability ambassadors.

 (Volvo IT does not use the Business Modeling (BM)

discipline)

(27)

The Volvo IT customization

 New names (Design & Usability, Usability Architect)

 Fewer artifacts

 Altered roles

 Close cooperation between Design & Usability and Requirements

 Brief descriptions added

Usability Design – Integrating User-Centered Systems Design in the Software Development Process

Example from Volvo IT

E.g. elaborated on the

Develop User Assistance

activity

(28)

To practice UCSD–Usability Design

1 © Jan Gulliksen & Bengt Göransson