CTRUH Brand Refresh

Project Overview

CTRUH (pronounced "see-through") creates immersive 3D and AR experiences, but its old identity didn’t match the vision. The earlier symbol—common across many industries—felt generic and disconnected from the company’s innovative work.


I refined the identity while preserving its familiarity and built a concise design system that unified how CTRUH showed up across products, presentations, and the web.

UI/UX research

Branding & Identity

Design System

Web App Design

BUSINESS PROBLEM

While CTRUH’s technology advanced quickly, the brand lagged behind. The earlier symbol looked generic and lacked the warmth or immersion the company stood for.

The refresh was a chance to refine the mark, introduce a more human form, and create a unified visual system for all digital touchpoints.

01.

Core Ideas & Emotions

The refresh centered on “Technology for All” — making advanced 3D and AR tools feel simple, human, and accessible.

  • Design + Code: balancing realism with technical precision

  • Immersion: bringing experiences to life

  • Accessibility: softening rigid shapes into friendly forms

  • Emotion: adding warmth without losing clarity
    The emerging heart-like shape expressed a genuine love for technology and the brand’s mission to make it approachable.

02.

Redesign Idea

The process began with the original code-inspired symbol — sharp and rigid. By blending it with a softer, organic form, the mark evolved into a fluid heart that felt modern and human while still honoring the founder’s original concept.

The updated color palette and typography aligned the entire identity with CTRUH’s digital presence, creating a more cohesive experience across light and dark modes.

2. Personalized, Actionable Reports

  1. Personalized, Actionable Reports

Problem: Nearly identical results across users lowered trust and failed to explain why recommendations mattered.

Solution:

Smart product cards linked recommendations directly to user concerns, answering “Why should I use this?”. Features included:

  • Scores tied to conditions (e.g., Acne 34/100).

  • Expandable details explaining benefits.

  • One-tap “Add All” for must-have products.
    This reduced decision fatigue and encouraged confident purchases.

3. Reducing Drop-Offs with a Seamless Flow

  1. Reducing Drop-Offs with a Seamless Flow

Problem: Cluttered layouts and product overload created friction, leading to fatigue and drop-offs.

Solution:

To minimize drop-offs, the experience was restructured into a short, focused journey:

  • Streamlined onboarding with fewer but relevant questions.

  • Immediate results paired with actionable recommendations.

  • Personalized routine builder guiding users from diagnosis → product → checkout.

03.

Final Design

Figma Prototype

All insights and solutions were translated into a mobile-first Figma prototype.

Dig into the details

I’ve attached more design artifacts for those who want to explore beyond the prototype.

Impact

The prototype was tested with the sales team in live pitches, yielding strong outcomes:

Cut Pitch Time

Pitches became 40% faster as clients could instantly understand the reports.

Cut Pitch Time

Pitches became 40% faster as clients could instantly understand the reports.

New Client Wins

Enabled the team to close 3 new brand deals in the first month.

New Client Wins

Enabled the team to close 3 new brand deals in the first month.

Trusted Results

Clear, science-backed reports built instant credibility with clients.

Trusted Results

Clear, science-backed reports built instant credibility with clients.

“Clients didn’t need me to walk them through every detail, they saw it, understood it, and asked about next steps.”

-CTRUH Sales Rep

Reflections…

This insanely successful project has been a challenging yet fun experience for me and the team with tons of learnings and takeaways.

Data driven

Leveraged data to enhance design decisions & boost user engagement.

Working at extreme pace

Delivered top-notch designs quickly in a high-pressure environment.

Stakeholder alignment

Convincing stakeholders to take such a different, wild direction.

Dig into the details

I’ve attached more details about the project (of course showing only the things I’m allowed to showcase).

Create a free website with Framer, the website builder loved by startups, designers and agencies.