For my Master's Project at Georgia Tech I focused on online literary communities as a place for thoughtful
“Supposing is good, but finding out is better.”
— Mark Twain
Goodreads is an existing application that acts as a social network for book readers. It can be connected to Facebook and allows users to keep track of books they want to read, have read, as well as have discussions with others about the books. The app also allows users to set reading challenges for themselves and keep track of their progress.
The Reader's Journey is a re-design of the yearly reading challenge feature within Goodreads. The goal is to create an interactive experience that motivates users to read more and challenges them to experience new kinds of books. The current application only allows users to set a yearly goal and lacks any other features.
Although Goodreads has separate mobile and web versions, I chose to focus solely on the mobile design in order to allow more time to research rewards, habit building, and gamification techniques.
Business Goals
Get more users to participate in the yearly reading goal.
Increase in users community involvement and social media shares.
User Goals
Make a habit of reading more.
Engage in challenges that help me explore different kinds of reading experiences.
See the results of my efforts in fun and competitive ways.
Hand sketching (low-fi wireframes, idea sketches)
Google Forms (research survey)
Xtensio (Personas)
xSort (card sorting)
draw.io (user flows)
Sketch (wireframing, prototyping)
InVision (prototyping)
Things (project management).
The first phase of the project included some primary and secondary research. Using Quantcast I could gain some insight right away about some of the current Goodreads users. The data shows that Goodreads gets just under 40 million unique hits globally and has a 73% female user base. 70% of the users have a bachelors degree or higher.
From there I distributed a survey to several of the online reading communities to see how they currently use Goodreads. Most responders indicated that they wanted a more robust reading challenge experience. Some made suggestions like "read more female authors." for potential challenges. They also indicated that they'd like to have some kind of motivation or reward as well as seeing more statistics on what they are reading. The results of this research support the initial concept for a challenge and reward system.
Using knowledge from the research phase I was able to craft personas to help me empathize with the users throughout the design process. I also created empathy maps as a way to think about the user before creating the personas.
With the personas in mind, it was time to hammer down what features a minimum viable product would have. From there we could form those into user stories.
Set multiple reading goals for the year, month, and week.
Set unique reading challenges that can be created by the user or chosen from the community.
View statistics on progress.
Habit building techniques to help users reach their goals.
Game-like elements that help users read more through play. The app should be playful and fun to use.
Reward System- Provide motivation to help users achieve more habitual reading.
As a user, I want to set multiple reading challenges so that I can stay on track to achieve multiple goals.
As a user, I want to participate in reading challenges so that I can experience different kinds of books and authors.
As a user, I want to see statistics about the books I’ve read so that I can track my growth.
As I user, I want the product to be playful and engaging so that I can be more motivated to keep achieving my goals.
As a user, I want the reading challenge to provide some kind of motivation or reward so that I can stay engaged with my challenge and complete it.
The next phase of the project involved an abundance of sketching. I think it's incredibly helpful to get lots of ideas down on paper and iterate on them before putting any effort into digital wireframing. I sketched many ideas in a sketchbook as well as using mobile templates to start thinking about where things would go. Sketching is also helpful in narrowing the scope.
The next step was to work on determining the information architecture and create sitemaps and user flows. I conducted a card sort using the software xSort. I created a set of cards each having an activity the user would perform. Then the participants grouped and labeled the groupings of activities in the way that made the most sense to them. One of the most important things revealed from the card sort is that some users may not understand that completing challenges still contributes to your overall reading goal. Using the results of the card sort we can create a sitemap for major groupings and put together user flows for certain actions.
A big part of this project was finding ways to design a product that helps users build habits as well as constructing a reward system that keeps them engaged. This is the area where most of the gamification takes place. I started with some research on habit building. I decided to focus the habit settings on 3 main features. Setting a reminder to read at the same time each day and provide some kind of reward for doing so. The user selects what days, what time, and how long they want to read. Users will gain level points for reading and bonus points for streaks (reading all the days they set in a week). From there, leveling up unlocks more challenges as well as prestige profile icons.
Goodreads is a very community driven application as it is today. It is common within online communities for users to have some sort of profile picture or icon that shows something about them. In the case of the Reader's Journey a level icon shows prestige in that they have read more books. A higher level reviewer might be taken as a more trustworthy review. It also provides a place for competition between friends to develop in achieving challenge badges. Below are some samples of the kind of icons users can unlock. Green, yellow, and red badges indicate completion of a challenge of level easy, medium, and hard, respectively. The level indicator can be seen on the bottom left. Lastly, if a user completes his/her yearly goal, they will get a special badge for that year that cannot be unlocked in later years. These badges can be displayed on their profile or shared on social media.
Using Sketch and the knowledge gained from the primary and secondary research I built my initial wireframes. The initial wireframes are in grayscale to focus on information architecture and layout rather than style. In this phase of the project, I did not yet start to incorporate game-like elements. But after seeing the designs come together and receiving mentor feedback, I decided that the final design would need to be playful and fun. Rather than using plainer text fields and drop-down menus, I would use images and interactions to create an experience that feels fun and game-like.
For the user testing phase, I was able to load the InVision prototype on my mobile device and have users attempt to complete 3 main tasks. I had users complete the onboarding flow, experience leveling up by completing a book and interact with challenges.
The main takeaways from these sessions were:
Shorten the onboarding flow and make things a little clearer.
Show progress in the onboarding flow.
Make the experience less dry.
Better explain challenges.
Using the wireframes I built in Sketch, I can begin to make a clickable prototype using InVision. The Craft extension allows me to send my Sketch designs straight to InVision and from there I can add hotspots and overlays to create a higher fidelity prototype. The prototype has gone through several iterations getting user feedback along the way.
After conducting my first user testing session with the grayscale prototype, I was able to make changes accordingly and then start thinking about style. I put together the style guide below and then began applying it to the prototype. In this final phase of the project, I also started adding in more interactions and the reward badges. You can view the final InVision prototype at the link below.