Twitter is a microblog social media platform that focuses on live and current happenings. It is a source for news, entertainment, networking, social connection and more. Users communicate through quick messages known as tweets.
This redesign explores expanding upon Twitter’s existing Bookmarks system to enhance discovery and memory. My redesign implements search functionality and filter organization to decrease scroll time and make navigation easy amidst billions of tweets and a continuous feed.
Finding a bookmarked tweet can be a test of willpower and endurance as a Twitter user without a paid subscription. If a user has many bookmarked tweets or saved it some time ago, users have to spend time (endlessly) back scrolling. This makes the Bookmarks feature a pain to use or navigate.
As an avid Twitter user, I often use the platform to find resources spanning multiple topics and communities. I use the ‘Save’ feature on all social media sites so I can re-find a specific source or post when I need it.
However, finding a saved item as a free Twitter user is time-consuming and frustrating. A lack of content organization leaves users with no choice but to back scroll through all their bookmarked posts until they find the tweet they want.
To make finding specific content easier, I added a search function and filters to Bookmarks. Users are able to directly search their bookmarks or use filters such as post type to locate what they need or easily see what they’ve saved with a glance.
By staying consistent with Twitter’s UI, feature integration is seamless and navigation is intuitive for both new and current Twitter users.
To better understand how others use Twitter, I interviewed 6 Twitter users to learn about their habits and experience.
Can you walk me through how you typically use Twitter?
How often do you revisit your bookmarked or liked tweets?
How do you search for a specific post or tweet?
Using screenshots from my Twitter account, I mapped out the current flow a user takes to access and interact with their bookmarks. I noted several areas of user frustration contributing to a decrease in enjoyment and ease of use.
As a test, I also scrolled through my own bookmarks to find another tweet made by the same artist. I timed this interaction, and found it took me 2 minutes and 39 seconds of non-stop scrolling to come across the last post I saved by this user.
The proposed user flow relieves pain points from the current flow:
I developed low-fidelity wireframes to ideate different modalities of both the bookmark feature and a new filter system. These were later used to test each version with real users to determine which was the most intuitive to use and would integrated most seamlessly into Twitter’s UI.
.png)
I interviewed 5 participants, including both Twitter users and non-users.
The bookmarks feature lacked visibility when users are scrolling their timeline. To reduce the number of steps it takes to bookmark a tweet, I explored placing the bookmark icon directly on each tweet card.
Option A didn’t feel natural enough and the placement diverted too much from current UI conventions. Option C’s placement at the top of the tweet card was more difficult to reach when scrolling with one hand. One user also noted that C made tweets look too visually busy.
I chose to use option B in my redesign as it was the cleanest and most intuitive based on current UI trends. It had the most instinctive flow due to the proximity and alignment with Twitter’s main interaction buttons. This placement was also the easiest to access (for right-handed users).
Users are unable to search their bookmarks or filter results. This lack of categorization makes it difficult and time-consuming to find saved posts.
To reduce these pain points and make bookmarking an efficient process, I developed an organization system that utilizes a search function and filter options to improve findability.
Option A & B included a filter bar under the main page header with access to the different categorization options and the search button.
A: Users found it visually appealing but the number of menus and icons on the page was too overwhelming. The flow and design felt too different from Twitter’s UI.
B: Utilized Twitter’s current 3 dot menu to reduce clutter but still has the same tradeoff as A.
I chose option C as my final design. Twitter already implements a ribbon menu on its user profile and Explore pages. Therefore this design had a stronger use case for its consistency. Using a familiar design convention is helpful for the user’s mental model and reduces effort and thinking during navigation. This version also allowed for both swipe and tap gestures.
