Assignment 6
Website and code
Deployed website: https://bookclub-frontend-seven.vercel.app
Link to code: https://github.com/juliacamacho/bookclub-frontend
Task List
| Title | Instructions | Rationale |
|---|---|---|
| Add a friend and view your friends | Send a friend request to a user, and then view your list of friends | This task tests whether the feedback mechanisms for adding a friend are informative enough, and whether the friends tab in a user’s own profile is easily findable. I hope to determine whether these actions are intuitive across different pages. |
| Accept a friend request | Accept a friend request and then view their profile | This task tests whether the placement of friend requests in the Friends tab in a user’s own profile is findable, and whether users know to click on the profiles of their friends there. I hope to determine whether these actions are intuitive across different pages. |
| Create a new book | Add a new book to the platform | This task tests whether users know where and how to add a new book to the platform. I hope to determine whether a new user knows what to put in the “description” section. |
| Add books to your reading folder | Add a book to your “currently reading” folder, add a book to your “to read” folder, and view all the books that you want to read | This task tests whether users know to visit individual books’ pages in order to add them to their folders. Additionally, this task tests whether users know where to navigate to to view all the books that they want to read. I hope to learn whether the concept of different book folders (and the titles I chose for the default folders) make sense to other users. |
| Rate a book after reading it | Mark that you have read a book, and rate it | This task tests whether users know that marking a book as read entails adding it to their “read” folder, and whether they know where to go in order to rate a book. I hope to find out whether users understand that they need to add a book to their “read” folder in order to give it a rating. |
| Send a reading invitation to your friends | Choose a book to read and invite your friends to read it with you | This task tests whether users understand the concept of a reading invitation and where to go in order to send one. I also hope to find out how users choose a book to read (whether they use the numerical ratings or visit their “to read” folder, etc.). |
| View and respond to your reading invitations | View the reading invitations your friends have sent you, and respond to them | This task tests whether users understand the idea of receiving and responding to reading invitations, and where to navigate to in order to do so. I also hope to find out whether users understand what has happened after they accept a reading invitation. |
| View and send book recommendations | View the books that your friends have recommended to you, and then recommend a book to a friend | This task tests whether users understand where to navigate to in order to recommend books to specific friends. I hope to confirm whether or not users find recommendations from friends useful, and whether they understand how they differ from reading invitations. |
| Change the folder status of a book | Indicate that you’ve started reading a book that’s in your “to read” folder | This task tests whether users understand that adding a book that’s already in a folder to another folder removes it from that other folder. I also hope to learn whether users understand that actions for a particular book are contained within its own page. |
Study Reports
Study #1: Margaret
Overall, Margaret was able to use the interface without too much confusion or hesitation. She liked the "calm simplicity" of the UI and the overall idea of the app, and completed the tasks very quickly and without having to ask questions or go back and forth between pages. As she was explaining her thought processes, they largely aligned with what I had had in mind while designing the UI. Additionally, her comments while using the app indicated that she was enjoying the experience of exploring different books and trying out new features like sending book recommendations to friends. She appreciated the feedback messages that popped up at the top of the screen; when she tried to enter a book rating outside of the 0-5 range just to see what would happen, for example, she said that she was "pleased to see that she received a helpful message back." We only had to pause the study once, when she encountered an error on the page for viewing her recommended books.
There were a few points of momentary confusion during the study. One of the physical aspects, for instance, was the links throughout the app: she wasn’t aware that they were clickable until she hovered over them, since they weren’t blue or underlined to begin with. Additionally, there were several minor elements like the small size of the “description” input box in the Add Book form that cut off the view of the text entered if it was too long and the fact that refreshing pages with tabs for dynamic content on the page reset the tab to the original leftmost tab rather than keeping it on the tab she was previously on.
One linguistic point of confusion was the difference between the app’s home page and her own profile page; although she was able to complete all of the tasks successfully, she explained in the study debrief that she had expected content on her home page to be about her (like the information on her profile page) rather than about her friends. Additionally, during the task to add a new book to the platform, I realized that I didn’t provide enough user instructions for what should be entered as the book description; instead of entering in a summary of the book like I had intended, she entered in a personal comment about why she was adding it instead.
She also stumbled slightly in the “Adding books to reading folders” task when she navigated to her profile first to view her desired folder—expecting there to be a button there to add a new book to it, as she explained in the debrief—rather than going to the All Books page and then an individual book’s page like I had expected her to. Similarly, during the “View and respond to reading invitations” task, she navigated to her profile first, then her recommendations page, then finally the home page in order to find her invitations.
Regarding conceptual points of confusion, one of the main elements was the distinction between reading invitations and book recommendations; in the debrief, she explained that she didn’t understand the difference between them. She also mentioned that she wanted to be able to choose particular friends to send reading invitations to rather than having the invitation sent to all of her friends at once.
Study #2: Fred
Fred liked the overall design of the UI, especially the "pleasantness" of the design and the colors and fonts used, and he especially liked the design of the book pages. He liked the idea of being able to make reading a social activity that he did with friends, and appreciated that the app enabled him to interact with his friends’ reading habits rather than just keep track of his own. He was able to complete most of the tasks without confusion, and after learning what pages contained what content, didn’t make the same mistakes more than once.
Many of the points of confusion that he encountered were similar to Margaret’s. One of the main aspects was the difference between the Home and My Profile pages, and what types of content should be included in each. In the task to accept a friend request, for instance, he visited the home page first before going to his profile page. Similarly, during the task to add a book to his Currently Reading folder, he first went to the home page, then his profile page, then finally a book page. He later explained that he had "expected the home page to include more content related to himself like his friend requests and the books that he was currently reading," and that he thought that his profile page would include more logistical content like what was included in the Settings page.
Another point of confusion that he shared with Margaret was regarding the difference between reading invitations and book recommendations. However, although he seemed confused during the tasks, he was indeed able to correctly articulate what they meant later in the debrief without me informing him, indicating that he might have learned while using the app. He also accurately pointed out that it wasn’t entirely clear what accepting a friend’s reading invitation entailed / resulted in.
Fred liked the existing feedback messages throughout the app, but suggested adding additional feedback after completing user actions and more indications of what previous actions had been taken (he explained that after sending a book recommendation to a friend, for instance, he would like to be able to see next to their username that he had sent it so he didn’t try to send them another recommendation). He also suggested that it would be nice to add a list/menu of the possible actions that users could take (sending invitations, recommendations, etc.) on the home page or other pages so users could have quick shortcuts to those actions.
Design Flaws/Opportunities
Major linguistic and physical flaw: not enough explanation for what the “description” field in the form to add a new book to the platform should include
- This flaw arises in the form to add a new book to the platform, where the “Description” input box simply asks users to include a description for the book, failing to specify whether this description should be a user’s personal thoughts on the book, the book’s genre, or a blurb/summary of the book (which I had intended). I noticed this problem in both user studies. Furthermore, because the text box is small, this leads users to only enter in a few words. This flaw arose because I hadn’t considered other interpretations of the word “description” in the context of a reading app. Possible ways to fix this could be to include a small explanation for what users should enter, increase the size of the text box, and provide examples of book descriptions.
Moderate conceptual flaw: the difference between reading invitations versus book recommendations
- This flaw is the conceptual difference between reading invitations and book recommendations; namely, what the terms entail and what their purposes are. Both Maragret and Fred expressed confusion about this distinction. This flaw arose because I had identified different purposes for each of these concepts during the design process, but didn’t differentiate their functionality enough in the implementation or provide enough explanation for what the words “invitation” and “recommendation” meant. This could be addressed by more clearly separating their places in the app, providing more user instructions, or possibly even combining or removing one of the concepts.
Moderate linguistic flaw: not enough feedback to tell users what happens after they accept a reading invitation
- This flaw is the lack of user feedback or instructions after they respond to a reading invitation from a friend, which both Maragret and Fred noted. Adding to the confusion of what invitations entail, this arose because there is no change on the screen aside from the success message that indicates that the book has been added to the user’s Currently Reading list or that the friend who sent the invitation has been notified. Possible solutions could include adding a more informative success message, bringing the user to their Currently Reading folder to show that the book was added, or including a new section on the Home page to show the reading invitations that they’ve accepted with explanations of next steps for the user to take.
Minor linguistic flaw: difference between the Home and My Profile pages
- This flaw is the confusion regarding what kinds of content and user actions are on the Home and My Profile pages, which both Maragret and Fred noted. This arose because of users’ conceptions regarding the industry standard usages of these pages, and my decision to keep more friend-related content on the Home page and more user-related content on the My Profile page. This could be addressed by adding more user-related content like their Currently Reading list to the home page, or renaming the My Profile page to the My Books and Friends page or something similar.