User Centered DesignThe Process
Information Business – UCD
Robert Press(718) 248-1540
Successful Website Design -- InterrelatedP
has
e 0
So
luti
on
D
esig
n
Ph
ase
1
Det
aile
d
Des
ign
as well as customization
Brand = promise + delivery
User Centered Design Defined
• An iterative process of creating multiple work products to drive a complete Phase 0 (Solution Design) and Phase 1 (Detailed Design)
– All Solution Design outputs enable Detailed Design and production– Improves upon Waterfall model
• All work products are dependent upon one another, and are on the critical path to completing the Solution Design.
– ‘Stakeholder’ approval is required in order to move on to the next step– All Technical and Content Mgmt outputs should be driven by the
Creative work stream
• Stakeholders’ needs and wants are more closely realized at launch because the process is iterative and collaborative
• UCD process allows a very smooth transition from Solution to Detailed Design and Production
UCD Process
High Level DesignAssess
Creative
Technical
Content Mgt
JR
D +
Sta
ke
ho
lde
r In
terv
iew
sPh1
Project Management
BusinessStrategy
E-BusinessStrategy
DigitalBranding
Fin
al S
olu
tio
n D
esig
n
Dem
og
rap
hic
Sit
e A
sses
smen
t(M
etri
cs A
nal
ysis
)
Fu
nct
ion
al R
equ
irem
ents
Creative
Technical
Content Mgmt
Phase 0 – Solution Design
Det
aile
d D
esig
n - P
rodu
ctio
n
UCD Process
High Level DesignAssess
Creative
Technical
Content Mgt
JR
D +
Sta
ke
ho
lde
r In
terv
iew
sPh1
Project Management
BusinessStrategy
E-BusinessStrategy
DigitalBranding
Fin
al S
olu
tio
n D
esig
n
Dem
og
rap
hic
Sit
e A
sses
smen
t(M
etri
cs A
nal
ysis
)
Fu
nct
ion
al R
equ
irem
ents
Creative
Technical
Content Mgmt
Phase 0 – Solution Design
Det
aile
d D
esig
n - P
rodu
ctio
n
Creative Outputs: Assess• Competitive Site Matrix• Brand Value Matrix / User Profiles• User Scenarios• Design Impressions• Usability Testing (if redesign)
UCD Process
High Level DesignAssess
Creative
Technical
Content Mgt
JR
D +
Sta
ke
ho
lde
r In
terv
iew
sPh1
Project Management
BusinessStrategy
E-BusinessStrategy
DigitalBranding
Fin
al S
olu
tio
n D
esig
n
Dem
og
rap
hic
Sit
e A
sses
smen
t(M
etri
cs A
nal
ysis
)
Fu
nct
ion
al R
equ
irem
ents
Creative
Technical
Content Mgmt
Phase 0 – Solution Design
Det
aile
d D
esig
n - P
rodu
ctio
n
Content Mgmt Outputs: Assess• Content Analysis Document• Work Flow Analysis Document
UCD Process
High Level DesignAssess
Creative
Technical
Content Mgt
JR
D +
Sta
ke
ho
lde
r In
terv
iew
sPh1
Project Management
BusinessStrategy
E-BusinessStrategy
DigitalBranding
Fin
al S
olu
tio
n D
esig
n
Dem
og
rap
hic
Sit
e A
sses
smen
t(M
etri
cs A
nal
ysis
)
Fu
nct
ion
al R
equ
irem
ents
Creative
Technical
Content Mgmt
Phase 0 – Solution Design
Det
aile
d D
esig
n - P
rodu
ctio
n
Technical Outputs: Assess• Technical Assessment • Component Model• Architectural Decisions
UCD Process
High Level DesignAssess
Creative
Technical
Content Mgt
JR
D +
Sta
ke
ho
lde
r In
terv
iew
sPh1
Project Management
BusinessStrategy
E-BusinessStrategy
DigitalBranding
Fin
al S
olu
tio
n D
esig
n
Dem
og
rap
hic
Sit
e A
sses
smen
t(M
etri
cs A
nal
ysis
)
Fu
nct
ion
al R
equ
irem
ents
Creative
Technical
Content Mgmt
Phase 0 – Solution Design
Det
aile
d D
esig
n - P
rodu
ctio
n
Functional Requirements Document
UCD Process
High Level DesignAssess
Creative
Technical
Content Mgt
JR
D +
Sta
ke
ho
lde
r In
terv
iew
sPh1
Project Management
BusinessStrategy
E-BusinessStrategy
DigitalBranding
Fin
al S
olu
tio
n D
esig
n
Dem
og
rap
hic
Sit
e A
sses
smen
t(M
etri
cs A
nal
ysis
)
Fu
nct
ion
al R
equ
irem
ents
Creative
Technical
Content Mgmt
Phase 0 – Solution Design
Det
aile
d D
esig
n - P
rodu
ctio
n
Creative Outputs: Design• Navigation Model• Design Studies• High Level Content Plan• Usability Testing ( Design )
UCD Process
High Level DesignAssess
Creative
Technical
Content Mgt
JR
D +
Sta
ke
ho
lde
r In
terv
iew
sPh1
Project Management
BusinessStrategy
E-BusinessStrategy
DigitalBranding
Fin
al S
olu
tio
n D
esig
n
Dem
og
rap
hic
Sit
e A
sses
smen
t(M
etri
cs A
nal
ysis
)
Fu
nct
ion
al R
equ
irem
ents
Creative
Technical
Content Mgmt
Phase 0 – Solution Design
Det
aile
d D
esig
n - P
rodu
ctio
n
Content Mgmt Outputs: Design• Content Model• Content Conversion Plan• Document Type Definition
UCD Process
High Level DesignAssess
Creative
Technical
Content Mgt
JR
D +
Sta
ke
ho
lde
r In
terv
iew
sPh1
Project Management
BusinessStrategy
E-BusinessStrategy
DigitalBranding
Fin
al S
olu
tio
n D
esig
n
Dem
og
rap
hic
Sit
e A
sses
smen
t(M
etri
cs A
nal
ysis
)
Fu
nct
ion
al R
equ
irem
ents
Creative
Technical
Content Mgmt
Phase 0 – Solution Design
Det
aile
d D
esig
n - P
rodu
ctio
n
Technical Outputs: Design• Proposed Physical Architecture• Architectural Overview Diagram• Draft of Functional Spec. Document
UCD Process -- Information Business
Assess Design Build
IB + ProductBusinessModels
-- Payment Model
-- Delivery Model
Branding-- Naming-- Attributes-- Scenarios
JRDFunctionalReqs
--Internal (IB)--Internal (Citi)--External (alphas)--Industry Verticals--All Stakeholders
Technical Reqs
Bu
sin
ess/
Cre
ativ
eT
ech Technical
Assessment
IA-- Flowcharts-- Templates-- Scenarios
Tech Solution-- DB-- Data Models-- Architecture
Design
-- Studies
Usability
Dev
--HTML--Assembly--UAT
--Coding
Common PM
Ph1Phase 0 – Solution Design
Months 1-2
• Client Education
• Joint Requirements Definition Mtgs
• Stakeholder Interviews
• Competitive Site Matrix
• Brand Research
• Create User Scenarios
• Technical Arch Assessment
• Workflow Analysis & Design
• Data & Content Analysis
Months 3-4
• Complete 1st draft of navigation model : Flowcharts + Templates
• Outline Architecture Model
• Develop Component Model
• Outline Proposed Physical Architecture Description
• Content Model Development
• Content Conversion Plan
Months 5-6
• Usability Studies
• Revise Navigational Model & Develop 3 Design Studies
• Begin preparing high-level business use cases & accompanying scenarios to permit development of the system
• Document Type Definitions
• Present Final Deliverables
Months 7-11 (end)
• Creative Production of individual page/elements
• HTML coding/page construction
• UAT/Usability Testing
• Back-end coding/develop
• Content Porting/Development
• Launch
Timeline: UCD Phase 0 & 1•Creative•Technical•Content Mgt.
Phase 0 Phase 1
• Competitive Site Matrix
• Brand Value Matrix/User Profiles
• User Scenarios
• Technical Architecture Assessment Document
• Workflow Analysis Document
• Content Analysis Document
• JRD Document
• UI Functional Reqs + Nav Model
• Architectural Decisions Doc
• Architectural Overview Diagram
• Component Model
• Proposed Physical Architecture
• Content Model
• Content Conversion Plan
• Final Solution Design Documentation
• Functional Spec Document
• Document Type Definitions
• SiteStyle and Usability Guide
• Branding Guidelines
• Site Code Specs
• Content Creation Guide
Outputs
Activities
UCD Process Attributes
• Citi/Client collaboration
• Iterative deliverable cycle
• Multi-stream, parallel process – Business/Creative, Technical
• Internal, cross-skill collaboration