"Papercasting User Experience in Interactive Ebooks" by John Rodzvilla (Emerson College) for ebookcraft 2016, presented by BookNet Canada and eBOUND Canada - March 31, 2016

1. Papercasting the Interactive
Ebook

2. The Ebook Designer
What's wrong with this picture?

3. Design Blindness
• Insider's perspective.
• Each page is a small part of a larger whole.
• You know what the page is meant to do.
• Aesthetics can sometimes mask usability.
YOU ARE NOT THE USER.

4. "Instead of a traditional TOC I want an image
where the user will click on images for each
chapter. "
"I want it to feel like a pop-up book where you
touch words and it caused an image to
appear."

5. Image from Falafel in Purgatory by Jennifer Martin and Sharmin Rahman.

6. Image from Falafel in Purgatory by Jennifer Martin and Sharmin Rahman.

7. Image from Falafel in Purgatory by Jennifer Martin and Sharmin Rahman.

8. The Ebook User
1. They have a reason for reading this book.
2. They muddle through technology.
3. They "satisfice."
4. No one thinks about how to use a book.
I didn't know you could click on the images!!

9. Designing the Ebook Interface
►How adept are the users?
 What indicators will you need to use to
direct them?
►What is the user looking for?
 How many steps do they need?
 Videos or slideshows?
 What kind of interaction?

10. User Research
• Card Sorting
• Contextual Interviews
• Focus Groups
• Heuristic Evaluation
• Individual Interviews
• Personas
• Surveys
• Storyboarding
• Prototyping
• First Click Testing
• Use Cases
• A/ B testing
• Task Analysis
• Usability Testing

11. User Research
• Card Sorting
• Contextual Interviews
• Focus Groups
• Heuristic Evaluation
• Individual Interviews
• Personas
• Surveys
• A/ B testing
• Prototyping
• First Click Testing
• Use Cases
• Task Analysis
• Usability Testing
Prototyping

12. Usability Testing through
Papercasting/ Paper Prototyping.
• Done after wireframes/ storyboarding.
• Designed to test how users interact with a
product using just paper.
• Designers can make changes on the fly and
retest in the same session.
• After sessions, designers have a better
understanding of user's wayfinding patterns/
needs.

13. Advice from Steve Krug
• Testing one user is better than testing
none.
• Test early.
• Record responses.

14. Why Use Paper Prototyping?
• Usability testing that does not require a lot of time
or money.
• Research shows that using high-fidelity prototypes
(digital designs) and low-fidelity prototypes (paper)
result in the detection of the same usability issues.
• Test subject are more willing to point out problems
in the design when it's only paper. People generally
aren't as critical on high-fidelity prototypes that
look like they took time and effort.

15. Tools
• Scissors.
• Markers.
• Different sizes of sticky
notes.
• Tablet and phone
templates.

16. Guidelines
• Work within a frame. Papercasting should always be done
in a template, preferably one that is the actual size of the
device.
• Plain white paper can represent all non-interactive text and
images. As long as you can not click on it, it should be on
plain paper.
• All interactive objects should be identified with sticky
notes. Any object that needs to be clicked, pulled, pushed,
or tapped, should show the different states .
• All states should be stacked on the prototype so users can
see what happens when they interact with the object.
• Do not spend too much time on making the pieces look
professional as they are meant to be iterative.

17. Prototyping Process:
Identifying Content
• Static text and images can be identified with wireframes.
• Linked text should be identified.
• Any image that is clickable should be identified, including
buttons, arrows, slideshows and linked maps.
• Movies needs to be identified along with controls
• Audio needs to be identified along with controls.
• Quizzes and forms need to be broken down into
interactive parts.
• Instructions for all interactive objects need to be
identified as well.

18. Prototyping Process:
Building the Deck
• Design a paper interface for each page that
will have interactivity.
• Interactivity will be placed on the page as a
sticky note.
• Pile sticky notes to replicate different phases
or stages of object (example, slideshow,
movies).

19. Examples
CHECKLIST LINKS
PHOTO w/ POP-OUT CAPTION SLIDESHOW

20. Interactive Ebook Prototype: Slideshow

21. Interactive Ebook Prototype: Slideshow

22. Interactive Ebook Prototype: Slideshow

23. Interactive Ebook Prototype: Slideshow

24. Prototyping Process:
Testing Users
• Once you have a deck of prototypes, find
someone and have them walk through the
book.
• Can be done anywhere, but it's best at a table
where you can sit across from the user.
• Bring a notepad and extra sticky notes. The
notepad for your notes, the sticky notes to
make changes based on user input.

25. User Walkthrough
Rules for the user walkthrough.
Hand prototype to user.
Have user "read" through the book.
Record how user interacts.
Ask questions.
Edit on the fly.

26. A warning about priming
• Exposure to one stimulus/ pattern influences
the response to another stimulus.
• In usability testing it is important not to
provide too much detail as it might prime or
lead the user.
"What do you think that button does?"
"Did you see the entire slideshow?"

27. Lessons Learned
• Interactivity is still novel and unexpected.
• Always provide simple directions for
interactivity.
• Do not overwhelm readers with
interactivity- less is more.

28. Thank You!!
Supplemental ebook available at
https://emerson.box.com/papercasting
Twitter: rodzvilla
Tumblr: foxholeformat.tumblr.com