Redesigning Werlabs Website with Priority Guides
Tokenisation
Introduction
Werlabs is dedicated to improving people's health and well-being by providing actionable data and insights. Their mission is to help individuals live longer, healthier lives. As the UX Designer for this project, I played a key role in setting the design direction, conducting user research, collaborating with strategists, and introducing a new approach to structuring content: the Priority Guide model.
Begin with High-Level Priority Guide
A Priority Guide is a content-first design tool used to define the information hierarchy for each screen, especially in mobile contexts. Unlike wireframes, it omits layout specifications and instead focuses on what content should be presented and in what order — based on both user needs and business goals.
“Focused on solving problems and serving needs.”
At this early stage, the guide helped frame key conversations between designers, developers, and stakeholders. It allowed us to align on priorities without being distracted by visual design.
Follow with Detailed Priority Guide
With the high-level guide was approved, we developed the Detailed Priority Guides, refining each screen with real, production-ready content. This step also included known functionalities, and proved to be a major efficiency gain: developers could begin building with actual HTML early in the process.
Content decisions were based on what actually wanted to be said, rather than visual hierarchy, which in turn made it quite easy for stakeholder to approve the content. But most importantly, developers could easily track and get usable HTML early.
Priority Guides - one of my go-to tools for early-stage design
Visual design & collaboration
UI Design
With content and structure finalized, the UI design phase began. Jesper, the UI designer, led the visual exploration based on the approved priority guides. I provided feedback and support throughout the process to ensure the final product remained aligned with user needs and the original intent.
The project evolved to collaborate with a 3D designer to create new product imagery that aimed to help give a better visual difference between the products and also match the updated branding.
