%20(Mockuuups%20Studio)%20(1).png)
Client |Google
Timeline |4 weeks
Role | UX/UI Designer, UX Research
Tools | Figma, Miro, Optimal Workshop
This is a project I completed for Designlab’s UX Academy. This is not an existing feature for Google Chrome but the research is real and the design is based on actual user voices, in combination with mentor and fellow student feedback. I’m proud of this work, but I just wanted to be upfront with that.
Background
I usually use bookmarks to save important links that I know I will refer to at a later date or any useful information I plan to use or share in the future that I won’t find again in a few seconds with an online search. I use boomkmarks both at work and on my personal computer. However, the experience of using bookmarks has been frustrating, because I usually end up forgetting that I have saved an item previously and end up searching from the search bar all over again. Therefore I decided to do some further research on what other problems other users are having when using the bookmark feature and ultimately redesign the experience of recalling bookmarked items.
Problem Statement
How do we redesign Google Chrome’s bookmark feature so that users can have a better experience when they need to recall their bookmarked or saved pages.
Let's design Google Chrome’s Bookmark feature to be more accessible and user friendly
To improve the current Google Chrome Bookmark experience I came up with two different feature design changes that can be implemented together. The features are added to give an all-rounded experience when users are trying to recall articles/ sites that they previously saved. Users are now able to see their most recently added, recently viewed, and frequently visited bookmarks on the Bookmark Bar using a newly added filter icon. When adding a bookmark using will also have the option to be reminded to view the saved bookmark. Additionally, I have added a new tool on the Google search results page that will now capture keywords searched and identify if any of the keywords are a match with a bookmark previously saved.
Users can now access their recently added bookmarks via a new icon
Users being reminded of their saved bookmark the next time they open a browser
.png)
Users have the option to extend their bookmark reminder
Design Solution 2
Users can clearly identify they have a saved bookmark from the Global search bar
Adding a bookmark Icon on the Google search results page. Bookmarks will be flagged by the key search words and will show up under the new bookmark tool
Research
In order to gain a deeper insight into the current problem of the Google Chrome Bookmark experience, a research plan was formulated. The research plan will not only help focus on the objectives of the design but will act as a guide to solving the right problem.
Current Site Analysis
To better understand Google Chrome's bookmarking experience I decided to carry out my own analysis of the flow of saving and recalling a bookmark.
As easy as it is to save a bookmark, sometimes the experience of getting to your saved pages isn't convenient. There are two main ways in which a user can get to saved pages; from the Bookmark bar and from the Chrome menu bar. Each of them has its own problem:
The Chrome menu problems
-
Bookmarks appear as an overlay. While this is a quick way to access your bookmarks, the overlay list looks messy and wordy.
-
There's no way to sort the list. My last bookmarked page usually goes to the bottom of the list and this can be an annoying experience.
The Bookmark bar problems
-
I can only fit a certain amount of Bookmarks on the bar. Every time I add a new bookmark to the bookmark bar folder, I don't see it. Due to the limited space, the last bookmark I added to the bar doesn't appear and goes to the bottom of my entire bookmark list. Unless you drag and drop.
Overlay list of Bookmarks
" Adding to folders or organizing can be time-consuming, as I just want once click access to my bookmarks "
Competitor Analysis
I conducted a Competitor Analysis, to identify best practices and understand what other commonly used search engines do to provide bookmarking experiences.
Customer Journey Map
In order to visualize the current saving and recalling bookmarking experience from the user’s perspective, I created a User Journey map. The journey map involved a scenario where a user was to bookmark a website/ document so that he could refer to it in a couple of days.
Define
Design
User Research
To effectively address the current problem, a series of interviews were conducted to further understand the users. The qualitative research will be used to know the user's behavior, motivation, and pain points when bookmarking and recalling a saved page. Here are some of the direct quotes from the users
" If I can’t find what I’m looking for then I would start the whole google search again "
" I don’t like the fact that there’s a limit of options of bookmarks underneath the search bar, then you have to use the double down arrows which is a pain too "
" Sometimes my most frequently used bookmark is at the bottom of the list. And therefore it becomes difficult to move it to the top of the list, where I can easily select it as opposed to opening the bookmark manager, It is a pain in the ass "
" If I bookmark something today it will end up being at the bottom of the list "
A User Persona was created that resonates with their goals, needs, and frustrations. Referring back to the persona during this design process keeps me aligned with the user goals and helps me solve the problems users have. Following this, I synthesized the data from the user interviews to put together key themes/patterns.
.png)
Following this, an Empathy map was put together to understand the Goals, Actions, Emotions, and Pain Points of our persona.
.png)
What does this mean for design?
-
The Bookmarking experience will be designed for the niche users that were interviewed
-
Each of the users needs to have quick access to their bookmarks and therefore the solution will be designed to make the saving and recalling process of a bookmark seamless
-
Folders will be created for the users as they don't prefer to create their own folders
-
Design solutions will be an all-round experience, where users will be able to access bookmarks from their toolbar, search bar and search results
Sketches
I sketched different ideas that came to mind for twenty minutes, letting my creativity flow, but at the same time keeping the user's needs in mind. I annotated each of the sketches which helped target the different pain points that I was trying to solve.
Low-fidelity wireframes
In order to prioritize the solution I was going to build out from the sketches above, I looked back at the research insights, persona, and pain points. I did this in order to build a solution that was going to meet the needs of the users I interviewed (Targeted Niche). To help make the design solution clear, I created two different User Stories for the new solutions.
.png)
Testing
Prototype
The next step in the process was to digitize my screens on Figma. I created high-fidelity mocks up of designs that would meet the needs of the targeted niche. These included two different solutions, giving an all-rounded recalling of bookmarks experience. I then went ahead and prototyped my wireframes to show the two different solutions and how users can interact with bookmarks in Google Chrome. I observed each participant navigate through the new bookmarking features and asked them specific questions about the overall flow and impression of the process of saving and recalling bookmarks and if the experience met their needs.
The useability testing results were very positive as users were easily able to understand how the new bookmarking process works and found it to be very efficient and useful. Some of the comments from the participants were:
"The new bookmark icon in the search results is a game-changer"
"Clean design and very useful experience"
"The ability to access your recently added bookmarks and frequently visited bookmarks is very helpful"
Conclusion
Overall, the prototype was a success because I let the research inform what features to create and to follow the needs of the users, then go into this project with a feature in mind. The end result was a successful product that users find useful and can see themselves using. The responses received were very similar but each individual had a preference on what solution/ feature they preferred. All participants expressed that the features added to the Google Chrome bookmarking experience are very useful and can be used in an everyday setting, both in their personal and professional environments
Because this project was created in a 4-week sprint, there are a few things I would do differently if I had the time and resources:
-
Interviewing a larger, more diverse group of Google Chrome Bookmark users
-
Conduct user testing with more peopl