Arbor puts company ESG data at forefront of your online browsing and shopping experience by ensuring that the websites you visit are supportive of your personal values. After a successful initial launch of their MVP, the Arbor team dared me to redesign the Arbor browser extension from the ground up and present a dense amount of company ESG information in an accessible fashion.
View an article about this web extension on CTV News.
The Original Extension Design
Extension Redesign
After going through an iterative design process, the final re-design mockups (created in Sketch) can be seen below. At a glance, viewers can quickly see how aligned they are with the website they are visiting and review key highlights and alternatives for the company. A breakdown of all scores can also be explored by tapping the All Details button, where ESG cards and miscellaneous company information is displayed.
In the extension, the colour of the extension icon and popover theme correlates to how aligned the company is to the viewer’s selected values.
Some early sketches of the design can also be seen below.
