Organize stories into Binders for future reference.
Making it easy to organize archived stories
A one-week design sprint where I designed, prototyped, and animated a new feature for Medium's mobile app that would allow users to easily organize and find their archived stories for future reference.Skip to final designs here
At a Glance
Timeline: December 2020 (1 week)
My Role: Sole designer
The Focus: Design, Prototyping, and Animating
Tools Used: Figma, Principle, Protopie
I completed this project to practice the Product Design process in a fast timeline. With a focus on interaction, I prototyped using Principle and animated the onboarding screens using Protopie. Because of the compressed timeline, my designs are based on app reviews and assumptions about users.
It's hard to find Saved and Archived stories
I've been reading on Medium for over a year now, and to date, I have about 400 stories Saved, and even more Archived. Many of these stories fall under the topics of life, productivity, Product Design, and freelance; my reading history is pretty niche.
As a regular reader on Medium, it can be hard to find certain stories again, even if I had Saved or Archived it because of the large number of stories that I have saved for future reference. The Medium mobile app currently displays all of these stories in one never-ending list that can only be sorted by recently added, recently published, and shortest reading time. This causes me to rarely turn to my Saved or Archived stories to find past articles, and instead, turning to Google search.
Medium readers cannot efficiently find articles that archived because these articles are stored in one long list with limited sorting abilities.
Introducing Medium Binders
My solution is to replace the "Archived" with Binders, a new way to organize stories that will make it easy for users to find their archived stories. Users will be able to create their own Binders and add any stories to them, giving them maximal customizability with this new feature.
Medium uses the title "Archived", but this can be changed to a more meaningful word for the Medium platform. When users click into the Reading List tab to reference these Archived stories, the Binders and new search feature will aid them to find their stories fast.
Imagine your own physical folders and binders of information in your cabinets (aka archive). Let's bring that digitally to the Medium platform.
User Research and Assumptions
Because of the compressed timeline of this design project, I decided to focus primarily on the design and interaction of this feature instead of user research. However, I did look through reviews on the App Store and read about how users utilize the Medium Saved/Archived feature on the Help Medium articles and on Quora. This gave me a general overview of how users find Saved/Archived stories.
From my user research online, I found that:
- Readers currently have a few workarounds to find a story that they saved earlier. Bookmark it (aka Save it), look at their browser history, or clap for the story.
- Users find it hard to find certain Saved/Archived stories in the Reading List tab because they're all displayed in one list. They can use the sort feature.
In combination with my research online and my own experience reading on Medium, I'm basing my designs on these assumptions. If time allowed, I would love to validate these.
- Readers on Medium read various niche topics and want to categorize their saved/archived stories in this way.
- Users will want to easily compile their saved articles, but also want the freedom to create their own groupings/labels.
Medium Binders is for regular readers with niche reading lists
Here's more about who Medium Binders is for:
- Regular readers who frequently save or archive stories
- Readers who have niche reading interests. Many of their archived stories fall under the same few topics.
- Use Medium as a source of knowledge and inspiration.
- Rediscover their archived stories later on and possibly share them with others
- Compile these resources (Medium Stories) for easy future reference
Their pain points:
- It's hard to find stories that they had archived more than a week ago.
- They have to use the browser history to find specific archived stories because they can't search within their list of archived stories.
A call for a new user flow for Archiving stories
The current user flow of the app only allows users to archive stories after they're saved. However, there is no difference between Archived and Saved stories in functionality. This can make differentiating these features confusing. I took this into account and decided to keep the Saved user flow, but change the user flow of Archived.
My proposed change:
Allow users to Archive any article to a Binder. It does not have to be Saved first.
Here are the two primary user scenarios I designed for:
- Reader sees an interesting article but they don't have enough time at the moment to read the article fully. They want to quickly save it.
- Reader finds an article that they want to save for future reference in their archive.
Why is this feature valuable for Medium's Readers and Writers?
Medium Binders leads to more engagement,
which leads to...
Medium Binders will provide an easier entry point for archived stories that will allow users to go back to these stories more often. In simple terms, more engagement on all of these saved/archived stories will be a win-win for Medium, the writers, and the readers.
For Medium, this means that there will be more engagement on all stories, including the starred Partner stories. If users can find these stories again, it opens up the opportunity for them to share these stories, and get even more people on the Medium platform. This will drive up Member subscriptions for Medium. Users can utilize Medium Binders instead of Google search to find their archived stories.
For those in the Medium Partner Program who write on Medium to earn money, more engagement on all stories will drive up their monthly income from Medium. When readers are able to easily find past saved/archived stories, this will lead to more views, reads, and sharing, driving up the writers' take-home pays from Medium.
For readers on Medium, this feature will help them immensely with finding old stories that they wanted to save for future reference. Now, they can actually reference it in the future! It will add to the enjoyability of the user experience of reading on Medium.
The Final Designs:
I designed out three flows: adding a story to a Binder, finding and exploring a Binder, and creating a new Binder.
I also wanted to try animating an onboarding flow for this new feature! While I was exploring the current Medium app, I had to deliberately explore the app to figure out the difference between Saved and Archived. It took some trial and error to figure out the difference (there's none, in my understanding) — and a user shouldn't need to use trial and error to discover how a feature works.
Archive a story to a Binder
When a reader finds a story that they want to refer back to later, they can archive it to a Binder! Users can click on the Binder button, choose which Binder to add it to, and it's added. Simple animations for a quick interaction.
Find and explore a Binder
To find a past archived story, users can navigate to the Binders tab in the Reading List and click into the respective Binder. If they can't remember which Binder it's in, they can use the Search bar at the top to search for stories in all of their Binders, or search within a Binder.
Creating a new Binder
Users can create a new Binder in the Binders tab in the Reading List. They'll be prompted to add a title and a short description. Users can also create a new Binder when they're archiving a story to a Binder.
Please ignore the choppiness of the typing; I'm not sure why it's recording like that!
Onboard users to Medium Binders
New features can be confusing. This onboarding animation will help users to learn the difference between Saving and archiving a story to a Binder.
The gif is choppy, so to view a smoother prototype of this, click on the link below!View the live prototype on Protopie here
- Build out this feature further by allowing Binders to be public. Medium Collections exist, but regular users cannot curate lists within Medium to share with others. As someone who is looking to learn more about Product Design, I've searched all over the internet for resources. Many of these compiled lists (of Medium stories) are on Notion or even in Medium stories. Making Binders public will make it easier to compile Medium stories to share with others.
- Conduct user research to learn more about Medium's readers and what they think of the current save/archive system. I want to validate or invalidate my assumptions so that I can make this feature even more comprehensive and better.
This project pushed me to complete the Product Design process in a short amount of time. I completed this project at the peak of the holiday season in December, and while it was challenging to find time to complete this project, I'm really glad that I decided to do this, and am proud of what I was able to accomplish in a week! I learned to keep my focus on primary use cases, be mindful of the user assumptions I made, and challenged myself to think further about how this feature can be beneficial for not only my primary target audience but also for other users of the app and the company.
On a technical level, I finally learned how to use Auto Layout and Components in Figma to maximize my time and make it easier to create more screens. This was also my first time using Principle to prototype and there was a bit of a learning curve, since I had only used Protopie before to animate/prototype, but after creating these prototypes, I'm excited to take what I've learned and practice more!