Digital Product Management

Session 6
Recap: Value Proposition Canvas
Recap: Jobs To Be Done
• Customers hire products to do the job they need to get done
• Products may change over time, but jobs remain
• What is the customer trying to accomplish with the product is the ‘job to be done’
• I am hiring an app to book a taxi
• I am hiring a software to submit IT returns
• Customers have multiple jobs that they want to get done
• Get to a destination on time
• Find information easily
• Share memories and connect with friends
• Jobs Can be
• Functional
• Emotional
• Social
• What job would you want to do with the product?
Recap: Jobs To Be Done (Template & Examples)
When ______________ I want to ___________ So that I can_____________

Situation Motivation Outcome

When I travel by train in the night I want a to wake up in time So that I that I do not miss my
station

When I teach I want to have easy access to all So that I can check for examples
my notes and solutions

When I check emails I want to see the important mails So that I can respond to them
immediately
Recap: Jobs To Be Done (Template & Examples)
When ______________ I want to ___________ So that I can_____________

Situation Motivation Outcome

When I am travelling I want to check my office emails So that I can keep responding to
important ones

When I am traveling I want to stay connected to work So that I do not miss out on any
thing important

In the morning I want to remember every task for So that I can prioritize my task
the day
Recap : Pains and Gains (Examples)
• Pains are problems and frustrations.
• Keep forgetting tasks
• Accidentally deletes email
• Important information gets lost
• Difficult to track my earnings and spending
• Forget to pay my bills
• Gains are those ideal outcomes
• What if I had someone to remind me of everything
• If only we have a system to track all the intra-office communications
• If I could automate IT submissions
• If I could see all my money in one place
• What if I could have a snap-shot of my health
Recap: User Story Mapping
• User stories (sometimes called epics) are the backbone of story
mapping.
• A user story is typically a unit of work a user needs to accomplish to get
their job done while interacting with a digital product
• A typical template
• As a [Persona type], I want to [action] so that [benefit]
• Examples:
• As a programmer, I want to check off my tasks as I complete each one so
that I am continually updated on project progress
• As a customer, I want to buy a product easily on this website
Recap: Making a user story map
• Set the frame.
• Who is the user
• What jobs are they looking to get done
• Map out the steps in the story.
• User stories > Epics
• Group and define.
• Slice your tasks and get your minimum viable product.
Recap: User Story Map Example
Prototyping
What is a
Prototype ?
• For users to effectively evaluate
the design of a product,
designers must produce an
interactive version of their
ideas. This activity is called
prototyping.
Prototype to Production
Prototype
A prototype •
•
A miniature car
A model of a building
• A series of screen
sketches
can be a •
•
A clay model
A computer aided
• A PowerPoint slide
show
small-scale visualisation • A video simulating
the use of a system
model: • A 3 D printed model
• A cardboard mock-up
• A lump of
wood/clay/Lego
blocks
• A piece of software
with limited
functionality
Why prototype?

Evaluation and Validation of Choosing between

Communication
feedback: design ideas: alternatives:
• allows • clarifies vague • test out the • provides multiple
stakeholders to requirement technical designs for the
interact with an feasibility of an application
envisioned idea
product, to gain
some experience
of using it in
realistic settings
and to explore
imagined uses
Low-fidelity Prototyping
Does not look very much like the final product

Uses materials that are very different from the intended final version, such as
paper and cardboard
Used during early stages of development

Cheap and easy to modify so they support the exploration of alternative

designs and ideas
It is never intended to be integrated into the final system. They are for
exploration only.
Examples of Low-fidelity prototyping

Storyboards

Sketching

Index cards

‘Wizard of Oz’
Storyboard
§ Initially from the film industry, used to get the idea of a scene
§ Snapshots at particular points in the interaction
§ Series of sketches
§ shows how a user can perform a task using the device
§ Often used with scenarios
§ brings more detail to the written scenario
§ offers stakeholders a chance to role-play with the prototype, by stepping
through the scenario
An example
How to make a storyboard
• Storyboard illustrates something in comic book format, it shows the context of the story, and
the end user is the star of the storyboard.
• Storyboard is a visualization of the predicted user experience of the product.
• Designers, developers, project managers and other stakeholders understand the people’s interaction
with the product over time, giving a clear sense of what is important for the user.
• Gather Information, Scenario, and Persona
• Choose a fidelity level
• Define the basics and steps
• Create visuals and captions
• Character
• Scene
• Plot
• Script
• Captions
• Distribute & Iterate
An example
• An app that allows users to quickly and effortlessly scan ,restore,
tag and add old pictures to their personalized digital collection.
• An app that aggregates all payment options to make online
payments
Sketching
• Drawing skills are not critical
• symbols to indicate tasks, activities, objects
• flowcharts for time-related issues
• block diagrams for functional components
Index cards
• Small cards (3 X 5 inches)
• Each card represents one screen
• multiple screens can be shown easily on a table or the wall
• Thread or lines can indicate relationships between screens like
• sequence
• hyperlinks
• Often used in website development
‘Wizard-of-Oz’ prototyping
• Simulated interaction
The user thinks they are interacting
with a computer, but a developer
is providing output rather than the
system.

User

>Blurb blurb

>Do this

>Why?
High-fidelity prototyping
• Choice of materials and methods
• similar or identical to the ones in the final product
• Looks more like the final system
• appearance, not functionality
• Misled user expectations
• users may think they have a full system
Compromises in prototyping
• All prototypes involve compromises
• Compromises in low-fidelity prototypes:
• device doesn't actually work
• Compromises in high-fidelity prototypes:
• limited functionality available
• Two common types of compromise
• ‘horizontal’: provide a wide range of functions, but with little detail
• ‘vertical’: provide a lot of detail for only a few functions
Why Use Low-fi Prototypes?
• Traditional methods take too long
• sketches -> prototype -> evaluate -> iterate
• Can simulate the prototype
• sketches -> evaluate -> iterate
• sketches act as prototypes
• Kindergarten implementation skills
• allows non-programmers to participate in the design process
The Basic Materials
• Large, heavy, white paper (11 x 17)
• 5x8 in. index cards
• Post It Notes
• Tape, stick glue, correction tape
• Pens & markers (many colors & sizes)
• Overhead transparencies
• Scissors, knives, etc.
• Whiteboards
• Prototyping software (Marvel app)
Constructing the Model
• Set a deadline
• don’t think too long - build it!
• Draw a window frame on large paper
• Put different screen regions on cards
• anything that moves, changes, appears/disappears
• Ready response for any user action
• e.g., have those pull-down menus already made
• Use photocopier to make many versions
Preparing for a Test
• Select your users
• understand background of intended users
• use a questionnaire to get the people you need
• don’t use friends or family

• Prepare scenarios that are

• typical of the product during actual use
• make prototype support these (small, yet broad)
Preparing for a Test
• Create “informed consent” forms:
• Explain who you are, and what the goal of your experiment is.
• Include phrases like:
• This is not part of your (class or job) evaluation
• You can quit at any time
• Your name will not be included in any reports
• Identifying data will be anonymized
• Participation is voluntary…
Conducting a Test
• Four testers (minimum)
• greeter - puts users at ease & gets data
• facilitator - only team member who speaks
• gives instructions & encourages thoughts, opinions
• computer - knows application logic & controls it
• always simulates the response, w/o explanation
• observers - take notes & recommendations
• Typical session is 1 hour
• preparation, the test, debriefing
Conducting a Test (cont.)
• Greet
• get forms filled, assure confidentiality, etc.
• Test
• facilitator hands written tasks to the user
• must be clear & detailed
• facilitator keeps getting “output” from participant
• “What are you thinking right now?”, “Think aloud”
• observe -> avoid strong reactions: laugh, gape, etc.
Conducting a Test (cont.)
• Debrief
• fill out post-evaluation questionnaire
• ask questions about parts you saw problems on
• gather impressions
• give thanks
Evaluating Results
• Sort & prioritize observations
• what was important?
• lots of problems in the same area?
• Create a written report on findings
• gives agenda for meeting on design changes
• Make changes & iterate
Advantages of Low-fi Prototyping
• Takes only a few hours
• no expensive equipment needed
• Can test multiple alternatives
• fast iterations
• number of iterations is tied to final quality
• Almost all interaction can be faked