Lisa Krenzelok - 5amIdiom

redlemonbalmΚινητά – Ασύρματες Τεχνολογίες

10 Δεκ 2013 (πριν από 3 χρόνια και 8 μέρες)

63 εμφανίσεις

Lisa Krenzelok | 5amidiom.com | 925.487.1646
Lisa Krenzelok
Delight our mobile user
2011
Lisa Krenzelok
9593 broadmoor dr
san ramon, ca 94583
925.487.1646
lisak@5amidiom.com
A case study of designing for the mobile user. A spot-light
portfolio.
Delight the mobile user
Allow the mobile user to find, see, and share content in the
“ “ repository
Provide basic workflow review and approval
Provide access to content while the user is online or steps
into the offline world
Lisa Krenzelok | 5amidiom.com | 925.487.1646
Contents
03 Process overview
04 UI Plan
05 Personas
06 Use Case development
07 Use case flows
08 Wireframes
09 Functional Specification
10 Visual
11 success
Lisa Krenzelok | 5amidiom.com | 925.487.1646
0 3
Most projects begin with a brief discovery phase to identify a project's
goals and requirements, measurements of success, and implementation
schedule-UI PLAN. PERSONAS should also be developed to represent
behavior patterns of the end user. However, when designing for mobile—
sometimes the needs analysis is compromised and condensed.
The process of specifying a project's features and functionality can vary
greatly from client to client, depending on a project's objective, scope,
and delivery schedule. Some deliverables here may include: TASK
MATRIXs, USE CASE FLOWS, Heuristic analysis, ...etc
A project's design phase often overlaps the specification phase, at least
initially, and continually if the schedule is short. During this phase,
conceptual ideas are elaborated, page layouts and page templates are
developed thru WIREFRAMES and eventually a ui functional specification.
Once a project's functionality is primarily established, the process of
building a visual brand can develop. With agile development a prototype
wasn’t necessary as the live code was checked in weekly and could be
utilized for USABILITY TESTING and revisions.
Process
Specification
Needs Analysis
Design
Production
03 Process overview
04 UI Plan/Success Matrix
05 Personas
06 Use Case development
07 Use case flows
08 Wireframes
09 Functional Specification
10 Visual
11 success
Lisa Krenzelok | 5amidiom.com | 925.487.1646
0 4
A ui plan helps a team understand exactly what will be delivered to the engineering and
project communities. However, when the upper management directive is “sizzle”, a ui
plan becomes a success matrix.
Success Matrix
03 Process overview
04 UI Plan/Success Matrix
05 Personas
06 Use Case development
07 Use case flows
08 Wireframes
09 Functional Specification
10 Visual
11 success
Success Matrix
1. Business Driver to “sizzle”
2. Tasks that support
3. Features that support
4. Experience requirements of
business driver
5. metrics of success
Lisa Krenzelok | 5amidiom.com | 925.487.1646
0 5
Success Matrix
How does the selected personas enable
this product to succeed
How do they differ
Key features to their success
Key tools they use commonly
Feature Matrix
Design features for the primary
persona
Primary features cross all personas
Design usability success for persona
with most limitations
Personas
03 Process overview
04 UI Plan/Success Matrix
05 Personas
06 Use Case development
07 Use case flows
08 Wireframes
09 Functional Specification
10 Visual
11 success
Personas identifies who you are designing for. Narrowing down your perspective helps
you understand the concerns, goals and habits of particular users.
Personas
Lisa Krenzelok | 5amidiom.com | 925.487.1646
0 6
Use Cases
03 Process overview
04 UI Plan/Success Matrix
05 Personas
06 Use Case development
07 Use case flows
08 Wireframes
09 Functional Specification
10 Visual
11 success
Our use cases had to define a scenario that would cross-section each persona, but
identified the primary persona as MU or Mobile User.
Use Case Definition
Lisa Krenzelok | 5amidiom.com | 925.487.1646
0 7
Use Cases flows
03 Process overview
04 UI Plan/Success Matrix
05 Personas
06 Use Case development
07 Use case flows
08 Wireframes
09 Functional Specification
10 Visual
11 success
Each use case scenario may consist of alternate flows and error conditions. Flows
helped organize the interactions of patterns and is a good way to make sure all system/
user responses are accounted for.
Use Case flows
Lisa Krenzelok | 5amidiom.com | 925.487.1646
0 8
Wireframes
03 Process overview
04 UI Plan/Success Matrix
05 Personas
06 Use Case development
07 Use case flows
08 Wireframes
09 Functional Specification
10 Visual
11 success
Every pattern within a UC needs to have a skeletal rendering – a wireframe. For each
specific feature, the attributes, entry and exit points, and visual detailing result in the
features eventual reflection.
Wireframes
Lisa Krenzelok | 5amidiom.com | 925.487.1646
0 9
Functional Specification
03 Process overview
04 UI Plan/Success Matrix
05 Personas
06 Use Case development
07 Use case flows
08 Wireframes
09 Functional Specification
10 Visual
11 success
Functional specifications pull it all together. The final decisions on flows, wireframes,
attributes, terminology, etc.
Functional specification
Lisa Krenzelok | 5amidiom.com | 925.487.1646
0 10
Visuals
03 Process overview
04 UI Plan/Success Matrix
05 Personas
06 Use Case development
07 Use case flows
08 Wireframes
09 Functional Specification
10 Visual
11 success
From demo to production.
Visuals
Lisa Krenzelok | 5amidiom.com | 925.487.1646
0 11
Success
03 Process overview
04 UI Plan/Success Matrix
05 Personas
06 Use Case development
07 Use case flows
08 Wireframes
09 Functional Specification
10 Visual
11 success
Success