Top10 VPN - Rebrand & Redesign

User research, rebrand, UX and UI redesign of VPN package comparison service.

Overview

Top10%20 %20experimenting%20with%20fonts

Rebrand, restructure and redesign of the comparison service Top10vpn. Having had a successful mvp in place for some time - Top10vpn sought out a market leading design to elevate their product. The restructure of the site would also focus on building engaging content around commercial incentives - reviews, guides and FAQs to expand into the sector.

The Problem

Top10%20 %20defining%20meaningful%20groups

Expand the MVP with a deeper site. More tables, reviews, news, articles, guides

Improve visual strength of brand and UI

Differentiate product in a complicated market

Enhance simple commercial routes for dropping cookies

Produce a suite of illustrations for guides and site wide use

The Process

top10%20 %20navs

Detailed user research and persona generation workshops, understanding a complex market of product users

Workshop with small team to iron out user journeys, wireframe streamlined content

Short project timeline = develop brand language at same time as test drive UI design

Iterate UI to provide approachable engaging content delivery mixed with streamlined powerful commercial driving factors

Create impactful illustrative characters and scenes, harmonious to the art direction of the brand

The Product

top10%20 %20homepage%20responsize

Working closely with a small team, a full persona workshop was undertaken to understand the depths of the customer base.

Combined with competitor analysis and tone of voice guidelines a broad palette of a brand structure formed. Working in detail with the product manager on wireframes and site structure - a symbiotic process was decided upon to start designing visual UI approach and brand elements concurrently.

A bright and engaging style began to emerge - rising above the drab greys and blacks of the industry. With it emerged a playful illustrative approach - requiring a large asset library of illustration to be generated. Designing UI layouts across broad responsive dimensions - the product was fast-tracked to build with a remote team, requiring a lot of testing and visual iteration.

The final deliverables - asset libraries of optimized components for build and stringent visual style guides for page layouts.

transparent
transparent
transparent
transparent
transparent
transparent
transparent
transparent
transparent
transparent
transparent
transparent
transparent
transparent
transparent