Why
Browsers were born on desktop and optimized for desktop. Mobile browsers were an afterthought. They're seen as "for quick tasks on the go".
What if they're not?
When I got in charge of designing for the Neeva browser app, I saw an opportunity to challenge the status quo by designing mobile-first experiences. The tab switcher, and tab groups in particular, were some of the experiences that the team and I spent lots of heart on.
A little context here:
The introduction of tab groups on desktop Chrome was game changing for many, including myself, who crave organization when handling complex browsing tasks. However, tabs groups on mobile didn't catch up that well. In fact, they're not even available on Chrome's iOS app. Safari in iOS 15 does support tab groups, but its take on tab groups makes them closer to browser windows on desktop than tab groups.
My goal was to design tab groups on Mobile to be just as great, if not better, than tabs groups on Chrome desktop.
When I first started designing for tab groups, I imagined a smart and multi-functional UX that was inspired by iOS's App Library concept.
Two major ideas I proposed in this design:
1.Smart grouping of tabs based on the tasks that involve multiple tabs.
The tasks are inferred from link navigations. For example, if you run a search and then visit sites from links in search results, the search results page and the sites visited from search results would be grouped into a tab group with title of the search query.
2.Nested tab groups supporting two types of interactions within tab groups.
This design offers 1-step navigation to recent sites within a group as well as dedicated zoom-in tab group view.
User Research
The team was excited about these ideas. I then ran a user research study of 6 moderated sessions, each including interview and prototype testing to understand if the design works for browser users.
The results were overall very positive. All participants rated the proposed design at least 1 point higher than their current experience. Smart grouping got dominantly positive feedback.
However, the nested tab group design was controversial. Based on constructive feedback from the study, I iterated the tab group design to be more conventional, which was considered "safer" and was then shipped.
Iterate after shipping
What then happened was fascinating. Now that tab groups are used in real life, people found the conventional UX less than satisfying. I began to hear similar feedback on tab groups UX being inconvenient, which got me rethinking the design. The mobile head and I talked and thought that perhaps my first iteration would solve the problem better, although iterations needed to be made to address the feedback I received when user testing it.
Since tabs groups shipped, I was able to get valuable data and insights on usage patterns, which helped guide the design direction. After rounds of iterations and whiteboarding sessions, I reached a version of design that felt right. It embraced the direct navigation part of the initial design, but simplified the "nested" part.
The new tab groups design is currently being tested in Testflight build. Early feedback has been very positive.
Takeaways
One of my biggest takeaway from this is to not take User Research feedback at face value. As a designer running her own research, I fell in the trap of making design decisions based on what users told me they wanted. In future, I would dig deeper on what makes users say something, and what are the real problems they face instead of the solution they say they'd want. User research is no easy task, and I bet it would be better if I could work with a dedicated researcher.
Next Steps
As of next steps for tab groups, I look forward to getting real life data once it become publicly available and continue to iterate. At the same time, I'm working on designing a smarter tab switcher that sections and displays tabs/tab groups based on time to help users manage (or reduce the need to manage ; )) the tabs forest they plant in mobile browsers, stay tuned!