Hypothesis is a primarily experienced through a Google Chrome extension which allows users to select text on the web, and highlight or annotate that selection. Through one of these actions the selected text is saved automatically to a user’s account and they can easily share them through social media.
Users can also interact with other users’s annotations and form a conversation about important text excerpts. Hypothesis is used throughout educational institutions and research groups—you can even use it for your favorite quotes from articles that you don’t want to forget about.
I was hired to help Hypothesis organize and clarify the design of their application. The application had been relying on a lot of open-source icons and had upwards of 12 shades of gray used throughout the interface UI. There were also many user flows that needed some tightening up.
I’m a big fan of figuring out what’s working well with a design and amplifying those elements. There were a few examples in the icons that emphasized the personality of the application so I took that approach to creating the new set.
In addition, I helped slim down the quantity of grays used throughout the application and found a cool-gray tint that worked well for light and dark themes and helped the core brand red stand out.
In addition to seeing annotations in the browser extension, annotations are also available through a web application that groups them by article—so you can see all annotations that users throughout the system have made on a particular article.
Search within the application allows users to sort by multiple parameters, including user and popular tags—making sure users can find exactly the annotation they are looking for.
A new feature I helped design was group management. Users can be part of multiple groups—essentially buckets they put annotations into. It was important to allow for users to manage their groups through the extension and provide easy access to seeing all annotations in a particular group.
There were a lot of other areas in the UI that needed clarity, including the share dialog and how users get help when they’re having trouble with the tool.
Additional annotation states were improved including making it clearer when users were editing their annotation comments. Nested replies within annotations were also more clearly emphasized—enveloping them within the core frame of the primary annotation.