Protocol
Protocol
Product Designer (0→1)
Product Designer (0→1)
Led the design of a cross border personalized nutrition products, translating user data, business goals, and health insights into a scalable, high converting digital experience.
Led the design of a cross border personalized nutrition products, translating user data, business goals, and health insights into a scalable, high converting digital experience.
View below
Overview
Overview
Protocol is a personalized nutrition platform delivering tailored recommendations based on user data, lifestyle, and goals.
I led product experience across web and app, creating a seamless cross-border journey (Canada ↔ Taiwan) connecting digital, product, and fulfillment.
Protocol is a personalized nutrition platform delivering tailored recommendations based on user data, lifestyle, and goals.
I led product experience across web and app, creating a seamless cross-border journey (Canada ↔ Taiwan) connecting digital, product, and fulfillment.
Mobile First - MVP
Role & Responsibilities
Role & Responsibilities
Product Designer (Website, Web App & Branding)
Defined product strategy, user flows, and core features
Designed wireframes, high-fidelity UI, and prototypes in Figma
Built and maintained a scalable design system
Developed brand identity, marketing assets, and packaging
Designed end-to-end journey across digital and fulfillment (order → delivery)
Collaborated with cross-functional teams to align user, business, and operations
Product Designer (Website, Web App & Branding)
Defined product strategy, user flows, and core features
Designed wireframes, high-fidelity UI, and prototypes in Figma
Built and maintained a scalable design system
Developed brand identity, marketing assets, and packaging
Designed end-to-end journey across digital and fulfillment (order → delivery)
Collaborated with cross-functional teams to align user, business, and operations
The Problem
The Problem
Users lack personalized, actionable nutrition guidance
Fragmented experience across ordering, fulfillment, and delivery
Low trust in generic health recommendations
Users lack personalized, actionable nutrition guidance
Fragmented experience across ordering, fulfillment, and delivery
Low trust in generic health recommendations
Users are required to complete long, rigid forms upfront. This increases friction and creates drop off early in the experience. I saw an opportunity to simplify input through adaptive, step by step interactions.
Users are required to complete long, rigid forms upfront. This increases friction and creates drop off early in the experience. I saw an opportunity to simplify input through adaptive, step by step interactions.
Goals
Goals
Deliver a personalized experience tailored to individual data, lifestyle, and goals
Translate complex health information into clear, actionable guidance
Build trust through transparency and intuitive user interactions
Design a scalable product supporting users across Canada and Taiwan
Align user needs with business goals, including conversion and retention
Deliver a personalized experience tailored to individual data, lifestyle, and goals
Translate complex health information into clear, actionable guidance
Build trust through transparency and intuitive user interactions
Design a scalable product supporting users across Canada and Taiwan
Align user needs with business goals, including conversion and retention
Constraints
Constraints
Simplifying complex and inconsistent health data into an intuitive experience
Designing across languages and cultural contexts without losing clarity
Balancing personalization with simplicity to avoid overwhelming users
Integrating digital product design with packaging and fulfillment workflows
Operating within early stage technical and operational limitations (0 → 1)
Simplifying complex and inconsistent health data into an intuitive experience
Designing across languages and cultural contexts without losing clarity
Balancing personalization with simplicity to avoid overwhelming users
Integrating digital product design with packaging and fulfillment workflows
Operating within early stage technical and operational limitations (0 → 1)
I designed a personalized formula experience that transforms user data into a clear, tangible outcome. By bridging the gap between abstract recommendations and real world products, the interface emphasizes clarity. Helping users understand exactly what they’re getting and why.
I designed a personalized formula experience that transforms user data into a clear, tangible outcome. By bridging the gap between abstract recommendations and real world products, the interface emphasizes clarity. Helping users understand exactly what they’re getting and why.
I designed a structured nutrition breakdown that simplifies complex health data into digestible insights. This allows users to quickly understand their intake without feeling overwhelmed. The goal was to build trust through transparency and clarity.
I designed a structured nutrition breakdown that simplifies complex health data into digestible insights. This allows users to quickly understand their intake without feeling overwhelmed. The goal was to build trust through transparency and clarity.
Design Process
Design Process
1 - Discovery
Identified gaps in personalization, trust, and cross-border constraints
2 - System Thinking
Defined end-to-end flows from onboarding to delivery
3 - Experience Design
Designed intuitive onboarding and clear recommendation flows
4 - Visual Design
Built UI, brand system, and scalable design language
5 - Execution
Connected digital product with fulfillment and packaging
6 - Iteration
Collaborated, tested, and refined across teams and regions
1 - Discovery
Identified gaps in personalization, trust, and cross-border constraints
2 - System Thinking
Defined end-to-end flows from onboarding to delivery
3 - Experience Design
Designed intuitive onboarding and clear recommendation flows
4 - Visual Design
Built UI, brand system, and scalable design language
5 - Execution
Connected digital product with fulfillment and packaging
6 - Iteration
Collaborated, tested, and refined across teams and regions
I established a scalable design system to ensure consistency across features, platforms, and future iterations. Components and patterns were standardized early to streamline collaboration and reduce development overhead. This enabled the product to evolve efficiently while maintaining a cohesive experience.
I established a scalable design system to ensure consistency across features, platforms, and future iterations. Components and patterns were standardized early to streamline collaboration and reduce development overhead. This enabled the product to evolve efficiently while maintaining a cohesive experience.
Solution & Product Experience
Solution & Product Experience
Personalized Onboarding
Guided flow capturing lifestyle, goals, and preferences without overwhelming users
Builds trust and relevance from the start
Actionable Guidance
Delivered simple, easy-to-follow recommendations
Reduced decision fatigue and improved consistency
Flexible Experience
Allowed users to adapt recommendations to real-life situations
Supports long-term engagement
Clear Hierarchy
Prioritized key information through layout and visual structure
Improved usability and reduced friction
End-to-End Journey
Connected digital experience with packaging and delivery
Created a cohesive, consistent product experience
Personalized Onboarding
Guided flow capturing lifestyle, goals, and preferences without overwhelming users
Builds trust and relevance from the start
Actionable Guidance
Delivered simple, easy-to-follow recommendations
Reduced decision fatigue and improved consistency
Flexible Experience
Allowed users to adapt recommendations to real-life situations
Supports long-term engagement
Clear Hierarchy
Prioritized key information through layout and visual structure
Improved usability and reduced friction
End-to-End Journey
Connected digital experience with packaging and delivery
Created a cohesive, consistent product experience
Welcome / onboarding card
Welcome / onboarding card
I introduced a personalized formula experience that translates user data into a clear, tangible output. This bridges the gap between abstract recommendations and real world products. The interface focuses on clarity, helping users understand what they’re getting and why.
I introduced a personalized formula experience that translates user data into a clear, tangible output. This bridges the gap between abstract recommendations and real world products. The interface focuses on clarity, helping users understand what they’re getting and why.
Packaging box design
Packaging box design
I developed the packaging structure to ensure consistency across physical touchpoints. The design balances branding, functionality, and production constraints to deliver a cohesive product experience.
I developed the packaging structure to ensure consistency across physical touchpoints. The design balances branding, functionality, and production constraints to deliver a cohesive product experience.
Final product / packaging mock
Final product / packaging mock
I designed the final product presentation to feel premium, cohesive, and aligned with the digital experience. This reinforces trust and creates a seamless connection between digital guidance and real world use.
I designed the final product presentation to feel premium, cohesive, and aligned with the digital experience. This reinforces trust and creates a seamless connection between digital guidance and real world use.
End-to-End Experience
End-to-End Experience
Overview
Designed a cohesive experience across web, app, mobile, packaging, and delivery, guiding users from discovery to real-world use.
Website
Built a clear, conversion-focused entry point communicating personalized nutrition value
Product (Web & Mobile)
Designed a consistent, cross-platform experience delivering clear, actionable recommendations
Brand & Marketing
Created visual assets and campaigns to support acquisition and consistency
Packaging & Delivery
Extended the experience into physical touchpoints, from packaging to unboxing
Operations
Structured fulfillment and workflows to align execution with the product experience
Overview
Designed a cohesive experience across web, app, mobile, packaging, and delivery, guiding users from discovery to real-world use.
Website
Built a clear, conversion-focused entry point communicating personalized nutrition value
Product (Web & Mobile)
Designed a consistent, cross-platform experience delivering clear, actionable recommendations
Brand & Marketing
Created visual assets and campaigns to support acquisition and consistency
Packaging & Delivery
Extended the experience into physical touchpoints, from packaging to unboxing
Operations
Structured fulfillment and workflows to align execution with the product experience
Website & Application - Multi language
Website & Application - Multi language
User Flow - End-to-End Journey
User Flow - End-to-End Journey
Packaging - Physical Experience
Packaging - Physical Experience
Social Media Posts
Social Media Posts
Color Systems & Typography
Color Systems & Typography
Impact & Results
Impact & Results
Product Experience
Simplified complex nutrition data into clear, actionable guidance
Reduced friction and improved overall usability
User Trust & Engagement
Increased confidence through personalized recommendations
Built trust with a consistent cross-channel experience
Business & Operations
Aligned product, branding, and fulfillment into one system
Improved packaging and delivery efficiency
Scalability
Built a scalable design system for faster iteration
Enabled expansion across markets (Canada ↔ Taiwan)
Product Experience
Simplified complex nutrition data into clear, actionable guidance
Reduced friction and improved overall usability
User Trust & Engagement
Increased confidence through personalized recommendations
Built trust with a consistent cross-channel experience
Business & Operations
Aligned product, branding, and fulfillment into one system
Improved packaging and delivery efficiency
Scalability
Built a scalable design system for faster iteration
Enabled expansion across markets (Canada ↔ Taiwan)
Reflection
Reflection
What I Learned
Balancing personalization with simplicity is key to making insights truly actionable, and I learned that great products extend beyond the screen into real world experiences.
What I’d Improve
I would deepen personalization through dynamic data and feedback loops, while expanding user testing across regions to refine global usability.
Looking Forward
I’m focused on designing end-to-end experiences beyond interfaces, aiming to build scalable products grounded in real user behavior and impact.
What I Learned
Balancing personalization with simplicity is key to making insights truly actionable, and I learned that great products extend beyond the screen into real world experiences.
What I’d Improve
I would deepen personalization through dynamic data and feedback loops, while expanding user testing across regions to refine global usability.
Looking Forward
I’m focused on designing end-to-end experiences beyond interfaces, aiming to build scalable products grounded in real user behavior and impact.