Find your match: Book Quiz
Find your match: Book Quiz
Embedded Files
This branching quiz is a conceptual project that matches the customers of an independent bookstore with their next read based on their preferences.
Audience - Customers of the independent bookstore, in-person or online.
Responsibilities - Visual design, Instructional design, eLearning development.
Tools Used - Adobe Captivate, Keynote, Google Docs, Mindmeister, Figma, Canva, Pages
The Problem
The Problem
A new, independent bookstore specializing in romance novels needs help. They are growing quickly, but are having a difficult time keeping up with all the demands of running a storefront. One of the most common and time-consuming requests for help from customers is for book recommendations.
This bookstore does not want to let its customers down, and providing recommendations is a favorite of many employees, but currently they cannot keep up with the demand while completing all the other necessary tasks to keep the store running smoothly.
The SOLUTION
The SOLUTION
For this store, I proposed creating a Buzzfeed-style quiz matching customers with a recommended read based on their answers to a few questions. Customers in the store (or on the website) will scan the QR code and then take the quiz. In the store, they then would be directed to find the book. On the website, they will be taken directly to a link to purchase the book. By creating this quiz, employees are freed up for other tasks, but can still serve their customers.
MY PROCESS
MY PROCESS
Throughout this process I used the SAM model. For this particular project, the SAM1 model made more sense than ADDIE as this project and process were simpler than most. Even so, I cycled through the Evaluate, Design, and Develop Steps several times each as I created the action map, the text-based storyboard, and the visual mock-up. This interactive quiz was developed using Adobe Captivate.
ACTION MAP
ACTION MAP
Since this is the concept project, I utilized my love of books and reading to be the SME on this project. After evaluating the needs of the bookstore (to be able to recommend books to customers without taking employees away from other tasks), the question became how to best address those needs.
Buzzfeed-style quizzes are incredibly popular, so I wanted to leverage that popularity to help the bookstore. First, I brainstormed the flow of this quiz, including how a customer gets from A to Z, and all the different paths they could potentially take.
This action map lays out the each decision the customer needs to make before receiving their personal recommendation. By creating an action map, I ensure that each customer ends up with a recommendation, no matter the decisions they make.
text-based storyboard
text-based storyboard
Once the action map was complete, I designed the flow of the interactive quiz. As the user answers questions, they are led down a path, presenting them with more specific questions about their reading interests. Ultimately, the decisions the user makes will result in a specific book recommendation.
When writing the questions, I took care to make the questions clear, but also write in a way that was conversational and the way readers of romance novels might think/talk.
At this point, the user is provided with the title and author of the book, as well as a link to purchase the book (if buying online) and the physical location of the book in the bookstore.
Visual Mock-ups
Visual Mock-ups
After completing the text-based storyboard, I moved forward with visual design. I used Pages to create a mood board and then created the style guide and wireframes in Figma. This interactive quiz is fun and light-hearted, so I chose colors and fonts to complement that mood. I choose stock illustrations of people reading from istockphotos, all in a similar style, to give this learning interaction a final touch.
Creating the wireframes allowed me to get a feel for how everything was going to come together without getting bogged down in the details. There are three main types of slides in the quiz (title, question, and match), but the title and the match slides are similar in layout so I only included two examples in the wireframes here.
Page updated
Google Sites
Report abuse