Bookery UX Case Study: Embracing the Subscription-Based Streaming Movement
Case Study | Skills/Responsibilities: User Research, Market Research, Wireframing, Prototyping, Visual Design, Interaction Design, Information Architecture
General Overview
Bookery LLC is a “mock” startup company that was formed by a group of college students who have aspirations of revolutionizing the textbook market. During our college experience, we noticed that the textbook market has a lot of untapped potential. Looking at other markets such as music and television, subscription-based streaming services have had revolutionary impacts. After taking inspiration from these markets, we concocted the idea of a subscription-based textbook application that allows students to access a broad range of textbooks.
Defining the Problem: Students run into the problem of navigating through several applications to access textbooks for their respective classes. Since these textbooks are mostly from different publishers, there is no single “hub” where students can access his or her textbooks. With the current options, students also run into the problem of paying for textbooks that he or she is only going to use for one semester. This leads to the marginal cost exceeding the marginal benefit of buying a textbook at that price even if they are only going to use it for one semester.
The Goal: This is where our solution, “Bookery”, comes in. We have looked at products that have revolutionized their own markets such as television and music streaming, and looked to create a product that can make a similar impact in the textbook market. In the current market, the options for students really just include: buying or renting a physical textbook, buying or renting an online textbook (which usually is overpriced), hunting for a used textbook on a multitude of websites, or even using piracy. Rather than being able to access one textbook at a time while at an unjust rate, we sought out to create a hub for students to access their textbooks. Bookery allows students to access a wide array of textbooks in one single application, while paying a price that is more suitable for the time they need to access the textbook(s). This solves user pain points such as overpaying for textbooks, identifying different places they would have to buy the book from, and much more. As a whole, our product will alleviate many pains and frustrations that our audience faces in the current textbook market.
Team Roles: Gautam Nagwekar, UI/UX Designer and Prototype Developer; Huy Nguyen, Product Manager and Documentation Manager; Het Patel, Business and Financial Analyst; Jaidev Singh, Cliant Liaison and Team Leader and Ivan Rodriguez, Market Researcher.
My Responsibilities: As the UX Designer for the team, my goal was to serve as a bridge between our users and our application. Some of my responsibilities included performing market research, empathizing with users through user research, creating both low and high fidelity wireframes, creating a functioning high fidelity prototype, and reiterating upon my designs based on usability testing.
User Research
In this case study, I wanted to approach my research by putting any of my personal biases aside. As a college student, I have my own opinions and conceptions about textbook applications, streaming applications, etc. In order to provide the best user experience possible, I needed to put my feet into the shoes of different types of potential users. It was crucial to ensure that my research and design as a whole was user-centered. For the research, I interviewed a sample of 5 college students from different colleges across the East Coast. To facilitate the interview, I utilized a discussion guide which would lead to open-ended responses. Through a discussion guide, I was able to learn about potential wants and needs, goals, frustrations, etc. Most importantly, because of the open-ended responses, I could learn more about potential motivations that cause users to respond a certain way. This was a big aid when looking to empathize with users and put them at the center of my design process.
Research Questions:
Before performing interviews with potential Bookery users, I wanted to create research questions for myself. These research questions would be answered by the actual information and insights provided by users participating in the interviews. Below are some the research questions that I sought to answer:
- What aspects of Bookery would enable users to utilize the app more?
- What do users prefer about other subscription-based services in other markets (Music, TV, Journalism, etc.)? How can we put our own spin on some of these features in the textbook market?
- What drives users to use Bookery rather than physical textbooks?
- What would make Bookery an accessible and equitable product for different types of users?
Textbook Specific Discussion Guide Questions:
- Do you prefer using physical textbooks rather than E-textbooks? If so, why?
- On the other hand, if you prefer E-textbooks, what causes you to prefer them?
- Where did you get your textbooks from last semester (Bookstore, Reseller, Online, etc)?
- How did you access your textbooks (Physical, Phone, Laptop)?
- How would you personally benefit from having one application for your textbooks?
- E-textbooks tend to provide accessibility settings that physical books don’t. Are there any specific features do you think you would benefit from?
- Do you have any experiences with current E-textbook websites? If so, what do you like about them? What would you change?
Subscription-Based Streaming Discussion Guide Questions:
- What are some of your favorite streaming applications? What do you like about them?
- What are some of your least favorite streaming applications? What don’t you like about them?
- What makes you prefer streaming services over other solutions?
- Lots of streaming services provide personalized content. Do you make use of the personalized content that is recommended to you? Do you enjoy it?
- Where are you located when you use streaming applications (At home, at work, at school, etc.)?
Personas:
For the persona named “John”, I wanted to focus on a tech-savvy archetype. Based on my research, a majority of the college students I interviewed considered themselves to be inclined towards newer technologies. They embrace the digital movement across many different products whether it be television, music, education, etc. This archetype will definitely serve as a huge chunk of potential Bookery users.
For the persona named “Rebecca”, I wanted to focus on an archetype that wasn’t as tech-savvy. Rebecca, who is 28, currently has a full-time job but chose to go to grad school later on in her career. Unlike undergraduate students, her experience with technology differs. She doesn’t have as much experience with newer technologies that students like John do. Because of this, it is crucial that users like Rebecca are taken into account as well. In User Experience, it is crucial to make sure designs are accessible and equitable for all users, which is why users like Rebecca need to be at the center of the design along with users like John.
User Scenarios:
To further the design process, I wanted to empathize with Bookery users by creating succinct user scenarios. As mentioned before, I want to be able to put myself in my users shoes so I can understand more about their wants, goals, frustrations, and much more. Through creating user scenarios, I can paint a picture of different situations users may find themselves in and take that into account throughout the design process. Here are just a handful of the many user scenarios that I created:
As a student, I want to have all of my course content in one location.
As someone who likes to learn new things, I want to have textbooks recommended to me based on my likings.
As someone who isn’t great with technology, I want to be able to navigate through the app easily.
As a traveler, I want to be able to view my book offline because I don’t always have Wi-Fi.
As someone who has trouble reading small text, I want to be able to increase the size of the text.
Key Insights:
Based on my findings from user interviews as well as my process of empathizing with users, I was able to derive key insights. I wanted these insights to drive my design changes to ensure I was designing with my users in my mind. Below I have added some of the key insights that were derived:
Users prefer having one “hub” to access most of their books rather than navigating through different platforms
Digital products can include more accessibility for individuals who may have a disability or impairment. Through our product, we can create a textbook experience that is accessible and equitable for users who may have issues with vision or audition.
Users prefer textbook experiences to be engaging and eye catching. The design of our application should be innovative and should strive away from the look of an older textbook application.
Users love when other applications give them a personalized experience. We can suggest certain content for users based on their user data and others who view similar books. This brings a more modern and “subscription-based” flair to our product.
Users may not always have an internet connection. Because of this, we should include an “offline” feature that saves textbooks directly onto their device through the app. This way, users can still access their textbook if they don’t have a connection
Brainstorming/Early Design Iterations
As I began brainstorming and developing solutions for the product’s design, I wanted to ensure I followed the insights that were taken from the user research I conducted. On top of this, I created a journey map to follow the journey of Bookery users. I used examples of simple tasks that Bookery users would follow such as finding a book or viewing a book and tried to get an understanding of what the experience would be like and how they would be feeling. Overall, I felt like creating this journey map while brainstorming helped me empathize with users further while deciding how I would lay out the design of the application.
Early Sketches/Paper Wireframes:
When attempting to create the design for the application, I began sketching through different possibilities. A large chunk of my research indicated that users enjoyed modern interfaces that subscription-based streaming services use rather than those of outdated textbook applications. Because of this, I wanted to aim for the look and feel of a typical subscription-based streaming application while bringing in the uniqueness of the textbook market. The early sketches below indicate the direction that I wanted to move towards when creating digital wireframes and later on, functioning prototypes for the product.
After creating these early sketches, I converted them into digital wireframes using Figma. These low-fidelity wireframes served as a general idea of how I wanted to move forward with my high fidelity wireframes and prototype. As I moved forward, I was aware that I would learn about any potential issues users would be having through usability testing. Based on what I learn from that usability testing, I can add more features to my design or rework certain components of what I created during the early developments of the design.
Initial High Fidelity Wireframes/Prototype:
After creating the backbone of Bookery’s design through sketches and low-fidelity wireframing, it was finally time to transform the rougher designs into a much more polished product. As I mentioned before, it was crucial to give Bookery the look and feel of a modern subscription-based streaming application. I aimed to do this through not only the layout of the application, but also the navigation and the styling. Many textbook applications tend to be dull, so I wanted my design to be simple yet vibrant. I opted to utilize a design system that utilized mainly gray and white, but also a hint of gold to add more life and luxury to the design. They say “knowledge is wealth” and the use of gold is meant to symbolize this.
When users open the application, they are greeted by the Homepage. From here, there are many different paths the user can take. If they stay on the home page, they can view the personalized content that Bookery offers. For example, users are recommended books based on similar genres or textbooks they viewed already. If they are browsing for a textbook in a specific genre, they can click on a genre like “Mathematics” or “Psychology” that are provided on the homepage. Once the user does this, they are exposed to an array of textbooks that are relevant to the topic. If the user finds a textbook they want to read from the Homepage, they can simply tap on the book and add it to their library.
At the bottom navigation bar, users can access their library, search for specific books, enter the e-textbook reader, or simply go back to the homepage. In the library page, users can view books that they have already added to their library. Once users open their library, there are two specific parts: “all” and “saved”. The “all” section would consist of any book that was added to the users library. These books would be a mix of textbooks that are accessed with internet or if they are saved/downloaded to the device. On the other hand, the “saved” tab ONLY consists of books that are downloaded onto the physical device. If the user doesn’t have internet, then they can still access the textbook they are looking for. The search portion of the navigation bar is utilized when users are looking for a specific book. An example of a search would be a term such as “Introduction to Information Systems 8th Edition” or “Patricia Wallace Introduction to Information Systems”. Once the user locates the book, they can tap on it and add it to their library. The last portion of the navigation bar is the “Now Reading” section.
Users are brought to the “Now Reading” page once they open a textbook from their library. At the top bar of the page, users can hit the back arrow to go back to their library. The other buttons at the top serve as accessibility features. When users tap the search button, they can look for specific words in the textbook if they want to learn about a specific term or concept. If they tap the “slider” button, the user will have the option to change accessibility features such as text size, brightness, etc. If users want to go to the next page, they can simply swipe left or right on the page, or they can tap the left or right arrow at the bottom for a much simpler option. Right under the textbook page, users can hit the “table of contents” button to jump to a specific chapter or page. There is also a progress bar at the bottom that lets the user know which page they are on and how many pages there are in total. This was a fairly early prototype of the E-textbook reader and I was ready to make changes based on what I learned from usability testing!
First Round of Usability Study and New Design Iterations:
After completing the first iteration of the high fidelity prototype, I gathered 5 participants to participate in usability studies. I created a list of some tasks that users may perform on the app and asked my participants to perform. I made sure not to give the participants any hints on how to complete a task so I could get the best idea of what may be working well and what may not be working well. Some of the tasks that I asked participants to complete included:
Browse the homepage and add a textbook to your library
Open your library. Delete one book and then open one book.
Go to the third page of the book
Change the size of the font to a bigger font
After having participants complete these tasks, I learned a lot about what I needed to change in order to meet users needs better. In particular, I put a huge focus on reworking the e-textbook reader. For certain tasks, users took longer than expected to complete the task. There was definitely confusion that I could eliminate by reiterating on my designs.
In the wireframes above, there is a noticeable difference in the size of the e-textbook reader along with the widgets. Initially, the size of the e-textbook itself was a bit smaller. Users wanted the textbook to take up more space on their screen, so I eliminated the use of the arrow keys to go from page to page. In order to compensate, I added an interaction where users can use the scroll button at the bottom navigation bar to get to the next page. Users can maneuver the scroll button, or swipe left or right to get to the next page. Another big change I made was with the widgets at the top right side of the e-book reader. On the left of the four widgets, users still have their search feature to look up keywords within the textbook. To the right of the search button, users now have a much clearer accessibility widget in which they can change font size, brightness, and page themes. A new addition to the widget bar is the bookmark feature, which was created based on user research. On the right, users will still be able to access their settings with the same gear icon. In the following screenshots, I will provide a much more in depth look at the changes!
As depicted in the picture above, users now have the option to either swipe to go from page to page, or use the scroll button at the bottom. Initially, I noticed that the only way for users to jump over a big amount of pages was either swiping through a huge amount of pages, or using the table of contents button. With the new scroll button interaction, users can save a lot more time when jumping over higher amounts of pages.
The first interaction in the prototype above is the bookmark feature. With physical books, people can add a bookmark to a page they want to return to. I wanted to add a similar mechanism for users to get back to the position they want to just like they can with a physical book. In the settings section, the user will be able to view all bookmarked locations. For the most recent bookmark a user hits, they will be brought back to the same page the next time they open the book. The second interaction in this prototype is the use of fullscreen mode. In my usability studies, some users attempted to zoom in on the book since they didn’t want to change any settings. In order to allow users to specifically view the e-book in full, I added a tap interaction to turn the e-book reader into a fullscreen mode. If they want to go back to the regular view, they can simply tap on the screen again to exit fullscreen mode.
Any type of e-book app needs to put a focus on accessibility. Many different users may have many different ways of viewing a book. This is why I opted to rework my accessibility features tab. As I mentioned earlier, I changed the button of the accessibility tab from a slider widget to a font widget. I noticed some users were slightly confused by the first widget when I asked them to find the accessibility tab. I was looking to help alleviate any confusion users may be having when trying to find the accessibility tab. As of right now, there are 3 main features built within the accessibility tab. Brightness, font size, and page themes.
If a user wants to raise or lower the brightness of the e-book reader, they can simply move the slider lower or higher. In a similar fashion, if a user wants to make the font smaller or bigger, they can move the slider towards the smaller text or the bigger text depending on what they desire. In this case, instead of utilizing a regular slider, I opted to design a slider with built in tickers. Unlike a regular slider, I wanted users to have a clear idea of where they are on the slider. Font sizes tend to go up and down in increments, and these tickers assist users in understanding where they are relative to the slider. For the last section of the accessibility section, users can change the theme for the page of these textbook. Users may be utilizing this app in many different locations with different needs in respect to viewability and preference. Based on their own desire, the user can identify which page theme would suit their viewing needs best, and select it through the accesibility section.
Second Round of Usability Study:
After completing my second round of usability testing, I found a new group of 5 participants to complete the same tasks that I asked the first group in the first round of usability testing. I wanted to track some of the key performance indicators to see if the changes helped reduce any confusion users may be having. After completing the usability study, I found that the changes I made were an overall success. Here are some of the main findings:
Users generally completed tasks much quicker with new changes
Users were able to jump over a higher amount of pages in much less time
Users were able to complete tasks in different ways and didn’t feel limited
5/5 users say they would utilize the accessibility features on a regular basis
5/5 users found that the bookmark feature will be helpful
4/5 users utilized the fullscreen button without any confusion
As a whole, I found many of the changes to be a success. A huge focus on this usability study went on the e-book reader, so I want to make sure the other parts of Bookery provide a great experience as well. In future usability studies, I will take a look at the many other components of the app and build even better solutions!
Takeaway and Next Steps
Thank you for reading! This case study started from an idea that my classmates and I had in a management class. The idea for Bookery was initially meant for an assignment in the class, but I felt like there was a lot of potential in the idea of the app so I decided to create a full-blown prototype. I really enjoyed the process of building a product from the ground up. A lot of research, ideation, and brainstorming went into this project to ensure it came out the way it did.
For the class, our product was specifically supposed to be a mobile application. Ideally, the product itself would not only be on mobile devices but desktops and tablets as well. Moving forward, converting the experience that was cultivated on the mobile app to the other platforms is something that I definitely want to do.
A big part of this project was the research I did on college students along with other products that currently exist in the market. I wanted to ensure that the refined iterations of my prototype took their input and feedback into account. If I were to complete more usability studies, I’m sure there is much more I could find out about potential users and changes that I could make to benefit them. For example, an idea that I’ve been thinking of adding in the future is a form of “text-to-speech” for users who may have visual impairments or individuals who may be on the move.
There is definitely lots of room for Bookery to grow and a lot of potential to fulfill. As we’ve seen in other markets, a movement to subscription-based services has revolutionized their respective markets. If Bookery were to release to the public, I’m sure it would be a refreshing and unique experience for those looking for a way of attaining their textbooks!
