Introducing feedly’s New Explore Experience
By Eduardo Santos, Freelance User Interface Designer
For the past few months I’ve been helping the feedly team on a couple of exciting design challenges.
One of those challenges took shape in the form of a redesign of the explore experience with the ongoing assistance and support of Arthur Bodolec, the Lead Designer at feedly.
I’m writing this post to expose a few of our motivations, the pain points we’ve detected, and the solutions we found.
Project motivations
To focus our project on what is essential to feedly and our users, we distilled our motivations into one question.
Reading helps you grow, and get better at what you do. Choosing properly where you get that information from is key.
Whether you already follow some sites in your feedly or not, you still want to widen the pool that sources the content that most interests you.
How do you choose which sites you need to follow to excel at your job?
This is one of the core questions that motivated us to rethink the explore experience to see if we could come up with a superior solution that would help you reach better and more engaging sources of content.
Pain Points we noticed
While looking through the lens of this one essential question we noticed a couple of pain points in the current experience. We are always trying to improve the feedly experience, so we wanted to take the opportunity to enhance these too.
Lack of apparent logic to the way results are presented
Currently, if you search on the ‘design’ topic (or any other), you get an apparently unordered stream of sites about that topic. There seem to be no logic about why these sites are presented to you other than the fact that they publish on that topic.
Each site looks like an article
A potential cause for this, is the fact that each site card presents the preview of an article. Due to the article large footprint, it becomes an hierarchy issue.
People don’t refine their searches
Since the search bar is placed out of sight, the page doesn’t look like a search result page. People don’t intuitively refine their search as there is no encouragement for it.
We are limiting the amount of related topics on your search. This makes each search even less appealing as although we showcase 4 related topics, these are often not enough to help you optimize your search.
It’s hard to understand what a site is about
At a glance it is difficult to quickly understand what each site is about. Without having to open each site manually, how would you know if the site publishes on design topics or was it more specifically publishing on graphic design for instance?
Sites are hard to scan too. The card format creates a scanability issue. The cards are being placed horizontally and vertically, to scan through the results you have to perform a lot of Z eye movements, making it a boring and tiring experience to compare sites.
The size/height of the cards further augments the scanability issue by forcing users to scroll a lot in order to go through a bigger quantity of results.
A navigation problem
There is no easy way for you to go back to the parent explore page. The title looks like a breadcrumb, although it isn’t one.
We aren’t taking advantage of our collections
What better way for you to look for quality sources than by seeing what trusted influencers recommend on the topic you searched for?
It is very difficult to detect influencer blogs
A lot of you use feedly because of influencers, they’re top thinkers, movers and trusted voices on the web. It should be easy to notice them as they’re so important. We realised it was difficult to distinguish influencer blogs from other sites.
The explore experience felt finite
Once you search on a topic there is no encouragement for you to further explore besides the inclusion of related topics in the header.
A New Explore Experience
After exploring multiple ideas and taking into account the pain points we detected, we came up with 3 design principles that shaped the new explore experience.
Refine your search
- Search is central to encourage refinement
Every time you will search, you will get a central search field. It will informs you of what you searched for, and it will encourage you to further refine your search.
- Related topics near the search box
Sometimes when you’re searching, you’re not being too specific about what you search, you’re just scouting. If you search “design” you’re widening your pool of possible sites into all branches of design, which could be UX, UI, web design, graphic design and more… even other fields such as arts, and photography.
We currently only showcase 4 related topics per search. We felt this wasn’t enough, so we’re going to provide more related topics. This should help you refine your search with much more accuracy, with the most closely related topics being shown in order of degree of relation.
There’s also more related topics on the sidebar and on the bottom of the page.
Find relevant content quickly
- Topics on each site to quickly understand what the site covers
You will know which topics each site publishes on at a glance, making it easier to understand if a site is generic (publishes on multiple and broad topics) or specific (just one or closely related topics).
You wish to redesign your marketing blog, so perhaps you may want to refine your search by exploring on the “web design” topic. Think of these as tags on demand, which are always available when you scroll down your page. It not only helps you compare results, but also to quickly jump between topics by click through them, improving continuity of exploration as well.
- A tab bar to filter down your results
Previously, there was no way to filter your results. With this new experience you will be able to get different views and results for each topic search you make.
By default you will see the All Sites tab first, which simply put, shows you all of the best sites for a given topic.
If you want to just get Influencer sites, simply jump to the Influencer tab. Let’s imagine you want to discover great influencer sites on the design topic. Rather than scrolling down and trying to compare scattered results, you can now get in a single view a list of great influencer sites making it easier to scan and compare between them.
Another promising tab is the Collections tab. When you hit this tab you can see a list of collections that contain sites which publishes on the topic you searched on. This will hopefully make it easier to follow interesting collections as well as discover relevant new sites within them.
- A list view to improve scannability
We’ve redesigned the results view and decided that a list view was more appropriated as it improved scannability.
Each result is now much closer to each other, with a vertical alignment which helps compare them. Contrast is improved as well, with titles standing out. You will be able to compare these results much easier, thus helping you decide whether they’re worth adding to your feedly or not.
We will also be focusing on each site’s description and metadata, and will remove articles to avoid confusion.
- Influencers get a special tag to identify them easier
In addition to having a tab dedicated exclusively to filter through all the results and show only the influencer sites, each site that is classified as an influencer, will get an orange “influencer” tag to help you identify influencer sites anywhere.
Additionally, as a perk, when you hover this tag, you will get a popover displaying some metrics about each influencer. These metrics are called Coverage (% from all posts, that each reader reads on average) and Avg. Read Time (on average, how much time a reader spends on reading an article). This extra information should further help you get some important insight on whether an influencer is interesting to your needs and whether you should follow his/her site or not.
Easy navigation
- A back button to navigate easily
Do you want to go back to the main explore page? Simply hit the back link. It will be available on all result pages, making it easier to transition between different pages.
- A sidebar with personalized suggestions and richer results
As you will scroll down on the search result page, along side the main results, you will see the new sidebar. This sidebar will include some curated results without overshadowing the main list of results in order to keep the scannability we so strongly have striven for.
It takes form in a Featured Sites module on every given searched topic. If you search for Photography, and you’re in doubt of which sites to follow, these featured sites will be a great starting point!
Below the featured sites module you can see a few more Related Topics. These extra related topics will be placed in the sidebar so that you can refine your search without having to either scroll back to the top or bottom to find them.
There will also be a few Collections suggested (based on the topic you search), which further enriches the results you get.
We’re hoping to roll out this whole new experience soon, as we feel this is something that will greatly improve the way you find new and great sources of content on your feedly.
As always, we’re eager to learn about your thoughts and suggestions, so feel free to drop a comment below or on specific points!
-Eduardo Santos
Special thanks to Arthur Bodolec, Edwin Khodabakchian and Noelle Chun.
