Using virtual reality to maintain the magical experience of book fairs and increase access to reading materials for underserved communities.
Timeline
3 weeks (1 week for the initial design challenge, then 2 weeks to iterate after feedback)
Context
Speculative design chosen as a finalist in the Adobe + Scholastic Creative Jam.
Role
My partner, Victoria Vela, and I shared the workload for the first phase of the design process. I handled the redesign on my own.
Preview of the solution
During the second week of my Designlab course, I teamed up with another Designlab student to compete in the Adobe XD + Scholastic Creative Jam.
Scholastic is the world's largest publisher of children's books and known for its book fairs hosted in elementary & middle schools.
THE PROBLEM
During the pandemic, schools and libraries closed, shutting off access to reading materials for many children, especially those in underserved communities.
THE DESIGN BRIEF
Design a mobile tool to help communities host book-sharing events, safely, in a pandemic. No matter how large or small the event, it must introduce or increase school-age children's access to new or used books.
Of 204 teams, our solution made it to the top 10
Version 1 designs submitted to the competition
Version 2 redesign after feedback and research
Educating myself on the problem
We got an overview of the problem space from the Scholastic Team and started into our process. While we didn’t have time for full-depth research in a week, I am lucky to have several teachers in my family who I reached out to with questions about book fairs.
Low cost books
Book fairs are an essential resource for both children & teachers.
Store partnerships
When Scholastic isn’t available, some schools partner with local bookstores to provide affordable books.
Unsung heroes
Volunteers dedicate their time to hosting these events because they care deeply about supporting readers.
Donations
PTAs sometimes come together to provide money for each student & teacher to spend.
Child empowerment
For many children, book fairs are the first time they get to pick their own books.
Visual experiences
Book fairs are tailored to the visual experience of children with book covers facing out.
How might we empower volunteers to plan more book fairs while maintaining the magical experience for children?
We decided to create an app that allows volunteers to source donations from their communities so they can offer low and no-cost books to kids.
We incorporated an augmented reality aspect that allows the kids to view the available books, covers out, in the safety of their own living room.
With Reading Tree users are able to:
Create virtual book-sharing events
Share canned posts with their communities to gather donations & garner attention
Find local bookstores offering low-cost partnerships
Source donations (both cash and books) from parents and others in their communities
Shop book-sharing events near them with an augmented reality book fair
Presenting & getting feedback
Being selected as a finalist meant we had two minutes to present our concept to 3 judges. Here is some feedback we received:
Kristen Connell, Design Director of Social Media, Scholastic
“You could really up the design to help elevate everything across the board and then it would really just be a smash hit.”
Heather Mckenna, Design Director, Scholastic Book Fairs
“The design is clean, but I think it would be nice if the design elements were a little more playful.”
With more time to iterate, I had several objectives:
Conduct research around planning book sharing events to gain a better understanding of what tools volunteers would find most useful in this app
Conduct usability testing on the version 1 prototype to find out how it can be improved
Enhance the UI of the existing app
Exploring the problem space (in depth this time)
When deciding how to frame my research, I struggled with the fact that there are two target users for Reading Tree:
Volunteers
Children
Ultimately, I decided to focus on the experience of the volunteers for this iteration since, without them, these book fairs wouldn’t exist.
I felt that a survey would be the best way to reach the niche audience of users who had planned book fairs or book-sharing events and then created an affinity diagram of the responses:
Affinity map of survey responses
From the survey, I found that there were quite a few features we had built into Reading Tree that would, in fact, be very beneficial to users:
Graphics for social promotion
Books can be organized into shelves & sections for genre/age range
Opportunities for access to low/no cost books for kids from all economic backgrounds
RSVPs offer a way to track attendance
Creating a way for hosts to sort books
I also found from the survey results that organizing books and managing the stock of the fairs was a major source of overwhelm for volunteers.
Based on this, I wanted to create a simple way for them to manage the books that have been donated to their fair. To visualize it, I created a task flow for this goal.
Task flow for creating a shelf and adding a book to it
Preview of the book organization flow:
In Version 1 of Reading Tree, we had two separate dashboards: one for hosting & one for donating/shopping. I believe this contributed to the confusing navigation.
I decided to streamline the overall experience with one flow where users can do everything. To better visualize this, I created wireframes of new views and combined them with views of the V1 designs in a wireflow.
What if a user wants to both host and attend events?
Version 2 wireflow
Designing a playful visual language
When conducting usability testing, I gained the most insight from watching users struggle with the interaction.
We had gone with a card-based design and I saw that users really weren’t inclined to click on the cards to find their way around the app.
For version 2, I decided to go with a more classic design style while also incorporating more playful elements to make the app more fun and kid-friendly.
Usability testing & priority revisions
After iterating on the visual design quite a bit, I decided to test it. All users were able to complete the tasks requested of them, but there were two areas where users got a little confused:
The donation management section caused some confusion. Sometimes simple changes in copy are all that are needed, so I changed “Donations” to “Donation Goals.”
Users sometimes didn’t notice the “create new shelf” button, so I edited the color and shape to make it look more consistent with the rest of the section.
The solution
Highlights:
Provides graphics for social promotion
Organizes books into shelves & sections for genre/age range
Provides opportunities for access to low/no cost books for kids from all economic backgrounds
Tracks attendance via RSVPs
Reflection 🤓
I’d love to explore the augmented reality experience more. Conducting research with kids & seeing how they interact with the app would be very insightful and help me to improve the app even more.
What I would do next
Growth
It was fun to look back at how far I have come as a designer in such a short amount of time. I think the second version of this app is a huge improvement over the first and maybe, just maybe, we would have won with this one. ;)