However, when designers think “mobile-first”, and translate the mobile hamburger design to the desktop, the outcome can be devastating. Users want quick and easy access to the site navigation so they can control how they explore the desktop; they are not expecting the desktop navigation to be buried within a hamburger menu. Progressive.com attempted to implement the mobile-first hamburger menu on its desktop design in 2015, with disappointing results. In 2016, they learned users are not ready for the desktop hamburger and brought back their informative, exposed navigation menu.
In 2014, eVOC Insights conducted Wave 1 of a competitive benchmarking study across the leading 10 insurance companies in the US including 21st Century, Allstate, Esurance, Farmers Group, Geico, Liberty Mutual, Nationwide, Progressive, State Farm, and Travelers. Our research found that Progressive had the highest brand awareness and appeal, the user intent to request a quote and purchase auto insurance from Progressive reigned, and the overall ease of use and satisfaction was highest among the evaluated sites.
However, in 2015, when eVOC conducted its Wave 2 of the same competitive benchmarking study with the same companies and user demographics, Progressive’s brand and homepage appeal significantly dropped. What happened? Progressive introduced the Hamburger Menu on its desktop design.
In 2014, Progressive had an exposed, primary navigation menu with a roll-over drop down menu across the top of the desktop homepage. Then in 2015, the site adopted a hamburger menu along with a mobile-first design. The decrease in the homepage appeal across waves suggests that more users preferred and were able to use the desktop homepage before the change to a hamburger menu.In the Wave 1 (W1) research, conducted in August 2014, Progressive’s website performed very well in overall homepage appeal; 70% of users rated the homepage as “Extremely Appealing”.
In Wave 2 (W2), conducted in January 2015, Progressive’s website changed (see W2 2015 design above); its homepage appeal significantly dropped to only 58% of users rating the homepage as “Extremely Appealing”. Users said the following:
*Scaled questions (i.e., appeal / product interest) were asked using a 1-7 Likert scale; a rating of 6-7 qualified as a the top two box (Extremely Appealing / Interested); Statistical difference at 95%
With the 2015 hamburger design, prospects indicate that they had hoped to find more information about Progressive and its value proposition on the homepage. However, it was not immediately clear where this information could be found. Product interest, typically introduced by the homepage, also dropped for users after visiting the mobile first desktop, suggesting that there is a disconnect between what users were successfully able to find using the exposed navigation menu in 2014, and whether or not they were able to find anything under the buried hamburger menu in 2015.
In 2016, Progressive made the decisive move to revert back to its exposed navigation menu from 2014. The redesigned Progressive homepage in 2016 showcases its three main content categories (i.e., Insurance, Claims, About), with its exposed drop-down navigation upon rollover, thus maintaining a user focused design and a clean, modern look and feel. When adjusted to a mobile screen width, the menu then condenses to the familiar mobile hamburger menu. This case study is not meant to imply that the “Mobile-first” design is incorrect; rather, it suggests that focusing solely on one device can negatively impact the experience of another. A “User-first” design would be universally well received.