Sana
Transforming skincare through AI personalization
The Problem
The ingredient language barrier.
Shoppers know the outcome they want, but the path is blocked by 'chemistry paper' lists and generic grids. The intent is clear; the interface just doesn't speak human.
Decision fatigue isn't a user failure-it's a discovery failure. I built Sana to fix the path.
"I'm staring at a list of ingredients that looks like a chemistry paper, and I still don't know if this is safe for my skin."
The desktop experience bringing ingredient technicality into a clean, shoppable interface.
The Strategy
Effortless Discovery: Make personalization the default state, not a buried feature.
Ambient AI: Position the AI as an assistant woven into the flow, not a chatbot bolted on.
Trust through Logic: Remove friction by showing the 'why' behind every recommendation.
Research
Filling the Community Gap
I found that enthusiast communities (Reddit, wikis) have the knowledge but store it in spreadsheets. Mainstream e-commerce ignores this data layer.
Thesis: Bring technical ingredient literacy into a mainstream UI without the spreadsheets.
The optimized architecture: from diagnostic entry to personalized checkout.
Execution
Logic First
Structure before style. The low-fi pass validated the core flow: quiz entry → personalized grid → informed product detail → checkout. Each screen had one job.
Early information architecture - establishing the grid logic before visual complexity
High-Fidelity Wireframes
The wireframe pass introduced the ingredient tooltip system and the quiz-to-grid handoff. The AI assistant was positioned as a persistent layer - always available, never intrusive.
Insights
Personalization as Infrastructure
Quiz as the Front Door: Instead of a cold grid, Sana starts with a diagnostic quiz. Personalization isn't a feature; it's the data infrastructure that powers every pixel.
Inline Logic: Tooltips surface plain-language explanations directly on product cards. Confidence at the point of decision.
Informed Nudges: Conflicting products aren't blocked; I trigger a soft warning. I empower the user with transparency, not restrictions.
Contextual Assistant
The AI doesn't live in a chat bubble. It lives on the product page as a contextual panel: "this matches your profile because..."
By answering the user's unspoken questions at the point of decision, we eliminate the need for a separate conversation and keep the focus on the product experience.
Final Designs
The final screens applied the visual language: warm neutrals, generous whitespace, typography that breathes. The quiz and product grid feel like the same system. The AI layer is present but quiet.
Homepage - personalized entry point
Homepage - skin profile active state
Diagnostic quiz - building the skin profile
Product detail - ingredient transparency + AI context
Personalized grid - filtered to your profile
Newsletter - extending personalization beyond the session
Reflection
Infrastructure first
Treating the quiz as a data layer rather than onboarding changed everything. Once the skin profile existed, personalization became the default state of the interface.
Validation focus
I need to test the tooltip language with total novices. The level of detail required for confidence is a moving target that requires real-world validation.
Assistant vs Chatbot
The AI's value is in eliminating doubt at the point of decision. The contextual panel worked because it provided an answer before the user had to formulate a question.