DESIGN SPRINT · NEW FEATURE · UX/UI
Project Context
Solo project
Designed in 5 days following the Google Ventures Design Sprint format (April 2022)
Created a solution for Tiny Tales, a fictional startup
Challenge was provided by Bitesize UX in partnership with Springboard
Background
Tiny Tales is a fictional startup where authors and illustrators can publish children's stories for parents to read to their children.
Design restrictions:
Designed as an iPad or Tablet app
Stories are discovered and read in the app - parents are not ordering hard copies or printing out stories, or reading on another app/device
4. Relevance
Parents select books for their children that are relevant to them whether it is based on their age, what they're currently going through (their experiences), and interests.
SOLUTION SKETCHES
I then designed a 3-panel board using the Home Page I chose from the Crazy 8s exercise as my critical screen. With the critical screen set, I then sketched the screens which I felt should precede and follow it.
Problem
As Tiny Tales' library has grown, parents have expressed that it has been difficult and time consuming to find the right stories to read to their children.
User Map
With those insights in tow, I closed Day One by mapping the end-to-end journey of a user using Tiny Tales to read a book to their kids.
QUICKLY FIND GREAT STORIES TO READ
Get fast recommendations based on who you're reading for, mood, or length of story
EASILY AND QUICKLY FILTER BOOKS TO READ
Search for an appropriate book in just a few clicks
Just answer a few questions and be on your way to finding the right book for your child.
1. Time requirement
Parents report that it frustrates them when they take a lot of time to find books for their kids. The search process is often long as it requires a lot of steps from picking a topic, looking at a book, browsing through the pages and verifying with their child if they were interested in reading it.
PERSONA
The project brief also provided a persona, Claire, to have a better picture of who the user is. However, I decided to add another persona, Ella, a first-time mom of one kid, and who does not have a lot of free time. I added Ella to account for users who are looking for simple products that saves them a lot of research time which is the case for most first-time parents who rely on a lot on recommendations from others.
ADD TO LIST FUNCTION
Bookaroo & Spotify
Bookaroo allows users to "keep" the book so that they can save it to their bookshelf. Spotify has an 'add to playlist' option which allows users to add a song a playlist that they personally created.
Added new search feature making it easier and faster for parents to find a book to read
My Role
User Experience
User Interface
User Experience
Prototyping
Testing
The Solution
Product Features
Sketch
SEARCH/BROWSE PAGES
Booka & Epic
Both Book and Epic have great search pages that have filters that allow users to indicate the child's age, interests and even reading level. They also display categories/themes to make it easier to find relevant topics for kids.
SKETCHING
On Day 3, I sketched a lightweight wireframe of the essential screens needed to test the new Story Time feature.
Try The Prototype
Tools
Figma
Photoshop
Illustrator
Solution
I focused my design solution on Story time, a feature for Tiny Tales, that would serve as a "one-click button" that streamlines the search function to help parents find appropriate books to read faster and easier.
CREATE READING LISTS FOR YOUR KIDS
Plan ahead and add books to a 'Reading List' so you can curate your own collection of great reads
Add books to your child's 'reading list' so you can plan ahead the books you will read for the week. Your kids can even share the same reading list!
Design Process
GV Design Sprint
Understand and Map
To begin understanding this problem, I went through the interview recordings and quotes provided by Bitesize UX to understand the process parents go through in selecting books to read.
I took notes from the recordings and was able to identify common themes. The insights provided me a clearer understanding of the problem I was trying to solve. I organized the insights and ordered by priority.
2. Multiple children
Most families have multiple kids so parents need to take into account each kid in selecting a book.
HOW MIGHT WE?
With the insights I gathered and persona in place, I started to ask myself How Might We (HMW) questions to jumpstart my solution ideation process.
SEARCH/BROWSE PAGES
Booka & Epic
Both Book and Epic have great search pages that have filters that allow users to indicate the child's age, interests and even reading level. They also display categories/themes to make it easier to find relevant topics for kids.
CRAZY 8'S
To quickly ideate, I sketched eight (8) solutions in eight minutes. My initial focus for the sketches is to redesign the Home Page.
I felt like the Home Page need to be redesigned to provide users a great base from where they can easily find inspiration and book suggestions without wasting a lot of time going through the the search/browse page.
I spent Day 4 creating High Fidelity screens of my sketches and worked on creating a working prototype.
I started by creating a style guide so I can identify the color palette and overall feel I wanted the app to have. I also made sure that the colors I chose passed Accessibility standards.
Location of Story Time button matters
Even if the function is repeatedly shown in the Home Page and the bottom navigation bar, all the users still missed choosing Story Time first when given their task to find a book
"Story Time" wording was confusing
Even with the onboarding screens, the users still encountered problems connecting the term "Story Time" to the function that it represented. Users reported that they did not associate the term to the act of "finding" books.
Change "Story Time" wording to "Tale Picker"
Replace the "Story Time" wording to "Tale Picker" so that users would better associate the feature to a search/filtering function.
3. Value
A lot of parents expressed that they try to ensure that the books their children are reading have value. They prefer books that are educational, value-laden, or are classics.
5. Recommendations
A lot of parents seek the advice of others in selecting books for their kids. They appreciate book clubs, suggestions from friends and family and curated lists from reputable sources like publishing houses and the like.
I started Day 2 with a Lightning Demo exercise
Since I had no personal knowledge of kids' Reading apps and was curious about how current products are tackling the same problem, I started Day 2 by scouring the app store for Reading apps for kids. At the beginning, I only looked for Reading apps in particular, but after seeing what the current apps offer, I also looked at examples of apps I was more familiar with such as Spotify, Netflix and the Apple App store.
I identified the features that I liked from similar apps to serve as inspiration.
SOLUTION SKETCHES
After the Crazy 8's exercise, I decided for a Home Page design that introduced a new feature for Tiny Tales that would allow users to quickly find a book through a mini search/filtering process which I decided to call, "Story Time."
At the beginning, I was not sure how to redesign the Home Page so that it can incorporate a search/browse function within that page itself but as I went through the Crazy 8's exercise, I began to slowly realize that instead of redesigning the entire Home Page, I should just add a banner to introduce a new search feature for the app.
Since I introduced the new "Story Time" feature, I updated my user map from Day 1 to reflect this change.
DECIDE & STORYBOARD
PROTOTYPE
On Day 5, I conducted 4 moderated user testing through video conferencing which uncovered the strengths and weaknesses of my solution.
For the tests, I recruited five (5) adults who were parents and/or caregivers who had small kids. However on testing day, one user had to back out last minute which left me with just four (4) testers.
For the testing, I provided the testers with a scenario that required them to create a profile for two kids and to find a story for both kids that is funny and only takes 5 minutes to read.
Explore the idea of adding social elements
Explore the possibility of adding social elements like comments on books and ratings, and possibly a creation of book list "experts" in the community, based on the users' Reading lists
Refine 'Reading List' Feature
Expand the "Reading List" feature so users can have pre-made reading lists that they can easily populate it. Perhaps, also add "Reading List" recommendations from users in the community.
Test
Key Takeaways
Story Time function in itself is effective
On the function itself, users really enjoyed the idea and functionality of Story Time
Users instinctively looked for the browse/search page
Users gravitated instinctively to the browse page when given the task to find a book to read. They browsed through the Home Page but since they were given specific tasks, their instinct was to browse and find the book/s themselves.
Add to Reading List function can be expanded
The add to reading list function was something users enjoyed. Although it is not explicitly included in the Story Time feature, it is something that can be further explored based on the great feedback from the users
NEXT STEPS
The user testing revealed several pain points in the prototype. If I were to revise the Prototype, I would make the following changes based on findings from the User tests
Change "Story Time" wording to "Tale Picker"
Replace the "Story Time" wording to "Tale Picker" so that users would better associate the feature to a search/filtering function.
Make "Story Time" banner more prominent and/or add page hints
Change some of the colors in the "Story Time" hero banner to make it more prominent and improve visual hierarchy. Also, add some pop up page 'hints' so that first time users will not miss the new feature.
Icons and Placements
Change some icons to improve usability such as the icon for "Story Time". Also, move some icons to better positions to improve visual hierarchy such as those in the 'book information screen'