The Problem
Let’s launch this thing!
Malwarebytes Browser Guard originally was a beta mode product for almost two years as a market test. During beta, and without much marketing efforts, the extension drove almost 200K installs with a 4.5 star rating. Once executives felt it was a solid offering that would provide supplemental protection to users, plans were developed to bring a full scale extension to life.
Design goals
Reinforce Malwarebytes’ mission to provide greater, broader security by crossing over from OS to browser level protection.
Business goals
Create a UI/UX for all ages that is simple to use and provides touch free protection.
DEFINING DECISIONS
How do we get this to the finish line?
Lack of time for research
With the original go-to-market plan, there wasn’t much time to perform a thorough design process. Guerilla UX research was done to validate various design decisions (i.e., hallway testing and staff surveys).
Fit within Semantic UI
Though not necessarily a constraint, all components of the UI needed to be designed in a manner buildable by the Semantic UI framework. While this limited the ability to completely customize different elements, it allowed for easier design and development efforts by utilizing an existing library.
Easily accessible by all
Malwarebytes Browser Guard can be accessed by everyone using Chrome, Firefox, and Safari. Because of this, we want the experience to be seamless for the average casual user as well as for the sophisticated cybersecurity expert.
FIRST DRAFT
Let's brainstorm
Requirements to note
Positioned as a freemium extension that tied into Malwarebytes’ flagship security product.
Utilize crowd-sourced databases to provide extra screening services (fake news, clickbait)
Hallway testing feedback
50% of testers didn’t understand the difference between “Page Protection” and “Global Settings”
Some thought the navigation had too many items and could potentially become overwhelming should the product grow.
Initial wireframes
Things don't always go according to plan
Discovered business constraints
In order to offer Browser Guard premium features as part of Malwarebytes 4’s packaging, users were required to re-install Malwarebytes 4. This was a clunky experience for the end user and ultimately would negatively impact mass adoption.
Instead of being an extension of the Malwarebytes 4 Premium product, Browser Guard will be a completely free user acquisition tool. It will be optimized to encourage conversion to Malwarebytes 4.
Due to the political climate at the time, the screening of “Fake News” and “Clickbait” was a contentious subject. Because of this, the features were removed from the product offering. Navigation was also simplified to provide more distinction between features that affect the current site and global settings that affect all sites.
Final Designs
What we delivered
THINGS I WOULD CHANGE
What I proposed as next steps
Conduct benchmarking study
Because of the aggressive timeline, there was a lack of foundational ux research for this product. It would be very valuable to conduct a usability study to determine a baseline value for the user experience as well as uncover any unmet user needs.
Obvious pause action
In initial designs, it was assumed that most users would pause the extension through toggling off the “Ads/Trackers” blocker in the side panel. However, there was feedback from the app reviews that the toggle could be more obvious so that access would be even more efficient.