Avast Online Security & Privacy
A major redesign of the flagship browser extension with over 10 million users.
Executive summary
We took a sidelined browser extension with 12M+ installs and brought it back into the spotlight. Along with a brand new visual style, reformed information architecture, and a revised feature set, we introduced an interactive Privacy Advisor guide system.
Through a meticulous design and development process, our team delivered a fully refreshed product to praise from users and leadership. Avast Online Security & Privacy made a strong return and started to play an integral role as a major digital touchpoint for both existing and potential customers.
Team
A cross-functional effort spanning product, design, research, engineering, QA, marketing, localization, and support. The core team carried the redesign from discovery through launch, with additional specialists supporting rollout across channels and markets.
Core team
Product design lead
Led product design from problem framing and information architecture to high-fidelity design, testing, and handoff.
Product owner
Discovery
UX research
Engineering lead
Cross-functional support
UX writing: Alysa Yamada
Quality assurance: Victoria Usan
Product marketing: Andrew Stark, Joe Bosso
Web design lead: Matej Portes
PR: Marina Ziegler, Mike Healey, Stephanie Kane
Sales & in-product messaging: Veronika Konecna, Lukas Blaha
Documentation & support: Vojtech Holub
Localization: Jan Fiala
Problem statement
Amid controversial events surrounding Avast's subsidiary Jumpshot and its shutdown in January 2020, the browser extension called Avast Online Security was one of the immediate products that had to fall from grace. The practice of manipulating user data was brought to an abrupt end, and the company fundamentally shifted direction to focus on protecting customer privacy.
The extension was put into maintenance mode, its user base and store reviews taking a noticeable hit. After the dust settled, it had been lying on the shelf for over a year. In the meantime, privacy became a key pillar of Avast's commitment to digital freedom and one of the cornerstones of the upcoming rebrand.
With that, it was time for such a high-volume and impactful customer-facing product to get back on track, start bringing real value to users, and deliver on Avast's renewed privacy commitment.
Goals
- Revisit an outdated framework and create a new vision for it through design thinking.
- Outfit the product with a new visual style and branding to launch alongside the flagship Avast One in late 2021.
- Design, develop, and introduce a set of features centered on users' privacy.
- Create user experiences across the full funnel, from acquisition to retention.
- Build integrations with the existing product lineup and pave the way for future integration with the flagship product.
Design process
At the core of our design process we employed the classic double diamond design model. The initial kick-off and discovery phase were covered by my teammate Petr, who thoroughly explored multiple directions and produced an extensive body of research.
I picked up the torch when it came to narrowing down the scope, defining the problem, expanding the work from concepts to high fidelity, testing, and delivering the final results.
New information architecture
When defining the new information architecture, our initial approach was to retain the single-screen framework and use widget-style cards. I quickly discovered that it would not be ideal.
- It lacked a focal point on the main screen.
- Multiple jobs-to-be-done would compete for users' attention.
- Tons of controls would further dilute the experience.
- UI space could be utilized more efficiently.
- There were more features packed in than before, and we still needed room to scale.
With that in mind, I came up with a new information architecture that addressed each of these issues.
- The focal point became immediately clear, so when you looked at the screen you knew what it was about and what to do with it.
- Jobs-to-be-done were separated into their own sections and did not interfere with each other.
- Each screen had a single primary action and, at most, a secondary one.
- The layout shift gave us room to add more meaning and detail to each part of the product without cramming everything together.
- Breathing room made it easier to create more value per feature and left space for future additions thanks to the sidebar structure.
Many more variables affected the decision-making process. Each UI element and user journey was scrutinized and iterated on. For the purposes of this case study, I focused on the refined post-feedback screens and the decisions behind them.
Prototype
After multiple rounds of presenting new concepts to stakeholders and gathering feedback from designers and engineers, I received the green light to produce high-fidelity assets and build a prototype in Figma.
With this prototype, we were able to collect more feedback both internally and externally. Qualitative user testing was conducted with three target groups:
- People who were already using this browser extension.
- People who were using our products and were familiar with the brand.
- General participants with no prior familiarity with our products.
User experience research outcome
Users responded well to the redesign, particularly the new light visual style, and they navigated the product with ease.
There were a few moments when some people did not understand the meaning of a feature because the concept itself was unfamiliar. We addressed that by simplifying verbose copy and, in some cases, replacing paragraphs with a single line plus a link to the relevant help section on the website.
We also documented all instances where users hesitated or struggled to locate an action, so I could smooth out rough edges like that as well.
Handoff
After a couple more iteration cycles, we were satisfied with the new designs, so it was time to hand them off to development. As a designer, I always try to support the devs' workflow by including them in the process as early as possible and providing meaningful, self-contained deliverables as the project moves forward.
This gave engineers a much easier time with sprint planning and let them work on the foundation while hi-fi designs were still being prepared and finalized.
Some examples from this project:
- Early prioritization and alignment on which features we were keeping or letting go. This let developers refactor old code and begin groundwork for new features on a solid backend foundation.
- Parallel work on the general structure, so the team had a clear idea of what to expect for frontend development.
- Designing and shipping collateral items as early as possible, such as new Privacy Advisor messages, interactive guides, updated static web pages, and scenario-specific messaging, before frontend implementation became fully occupied with the main UI.
During development I had close back-and-forth with engineers to make sure everything matched the established vision. Once visuals started coming in, we held regular sessions to iron out rough spots. Despite the team working remotely, I happened to be in the same city as our main frontend developer, so we made the most of it and worked together in person.
Localization to 20+ languages
AOSP was available globally and had to be localized across European, Asian, and Middle Eastern markets with every release or update.
This introduced another level of complexity. One example was producing promotional materials for various online stores. Another was text length variability across languages, sometimes dramatic enough to break the UI. Credit to our QA team for catching every instance where that became a problem, so we could fix it in a timely manner.
How we measured success
Avast has a wide array of analytics tools to establish and track almost any metric, all stripped of personal data. Some of the things we looked at included:
- New onboarding: completion rates and immediate feature opt-ins. About a year later, we shortened and simplified onboarding to drive users to the main UI faster.
- Product adoption: how and when people engaged with the product during the first 30 days, including uninstall rate.
- Usage & interaction: more specific data on how people used each feature, helping us understand what brought the most value.
- Privacy Advisor: guide completion, depth, popularity across guides, platform rankings, and other engagement signals.
- Campaigns: engagement with promotional in-product messaging and cross-sell opportunities, later extended into a subscription-based model.
- Feedback: NPS, surveys, built-in quick feedback forms, store review dynamics, and additional rounds of user testing.
- Churn and retention: installs versus uninstalls after the redesign. We saw an initial uninstall spike from dormant users who rediscovered the extension, then installs significantly outpaced uninstalls once that wave passed and promotional campaigns resumed.
Results
- After the redesign, Avast Online Security & Privacy 2.0 became a powerful standalone offer and an integral touchpoint within the broader customer experience.
- With a fresh new look, fully reimagined UX, and a new privacy-first posture, AOSP became the only rebranded product launched alongside the flagship Avast One in the company's latest design language.
- We created a significant new marketing differentiator.
- We added contextual first-purchase touchpoints for effective cross- and up-selling to other products.
- We simplified navigation across all privacy settings, making key user journeys much more effective.
- We introduced an interactive Privacy Advisor feature to guide users in real time on platforms like Facebook, Google, Twitter, and more.
- We measurably increased user awareness of privacy issues and available solutions compared to the previous version.
- The outcome was well received by stakeholders at all levels, including the C-suite.
Personal takeaway
It was a fascinating design-driven project. I'm grateful for the chance to lead such a significant part of the design process and see the success of our efforts. Huge thanks to everyone involved.
By the end of my time with the company, AOSP was the product I felt most attached to. After the redesign, it began to bring a lot of value to people and became much more delightful to use, which is the combination that ultimately matters most.
View more case studies