Hyperknow
Conversion- & Engagement-Driven Design for AI Product
Increased website conversion by 30% and supported growth to 5,000+ users & 400+ daily conversations by designing engaging motion-based interactions and visual storytelling for an AI learning assistant, Hyperknow.
Project Type
Part-Time Work
Timeline
Nov 2025 - Mar 2026
Team
Linda Xiao
2 Co-Founders (PM + Dev)
Tools
Framer, After Effects, Photoshop, Procreate
Problem & Challenge
Functional product, but lacked engagement and user trust
Low website conversion of visitors to users
My Solution
Make the product experience more human through motion and character design
Redesign the website to increase conversion rate and drive user growth
Impact
Increased website conversion by 30%, contributing to growth to 5,000+ users.
Drove 400+ daily human–AI conversations with a more engaging product experience.
Strengthened user engagement and established a more recognizable product identity that lives and breathes in the product.
Motion makes an AI tool alive
PROBLEM 1
A cold learning experience impedes engagement and retention
Through product evaluation, I found the existing Hyperknow learning experience with a chat interface felt transactional and cool.
The chat-based interface lacked feedback, continuity, and personality
Users interacted with it as a tool rather than a learning partner
These problems mattered, because learning is emotional. The current gap limited engagement, long-term learning experience, and user retention.
Before
DESIGN SOLUTION
Orbie: Turning an AI SaaS tool into a learning companion
Instead of treating the AI as a utility, I reframed it as a companion.
I designed Orbie, a lightweight character that lives inside the product and responds to user actions. The goal was to make the system feel responsive and alive.
Using motion as communication
I used motion to express system state in a way that feels natural and human.
Welcome State
Reducing entry friction through character-led welcoming
When users enter the product, Orbie greets them with a subtle, friendly animation that signals interactivity and lowers the barrier to start. It reassures users they’re not facing complex concepts alone, making the experience feel more approachable and supported.
Thinking State
Transforming waiting into engagement
Instead of a generic loading indicator, Orbie shifts into a “thinking” animation while generating responses. This turns waiting into an intentional process, showing that the system is actively working to support the learning experience.
These animations build emotional connection and replace moments of uncertainty with clarity and user trust.
Design considerations
I kept the animations:
subtle, so they wouldn’t compete with learning content
loopable, so they feel smooth at any response time
consistent, so Orbie feels like a single personality across states
The goal was to support the experience, not dominate it.
IMPACT
Higher Engagement, Stronger Identity
Orbie became a core part of the product experience, contributing to:
Web redesign increased conversion by 30%
PROBLEM 2
The previous website had a low conversion rate.
Understanding why
I ran lightweight informal user interviews, asking people whether they would sign up after visiting the website, and why.
Their answers revealed that:
The CTA lacked visual prominence, making users less inclined to click through
After clicking CTA, asking users to register before experiencing the product felt too high-commitment
The page relied on long blocks of text, which people skimmed or ignored
Before
DESIGN SOLUTION
Designing for trust before commitment
I shifted the experience from immediately driving signups to first helping users understand the product, its value, and the mission behind it before asking for commitment.
This led to three key changes:
Made the CTA more visually prominent to encourage engagement
Reduced upfront friction by letting users explore the product before signup
Replaced dense static explanations with more interactive and visual storytelling
A clearer CTA hierarchy
I guided user attention more intentionally through motion and branded visuals, making the primary action immediately noticeable while communicating the product story from the first impression.
Trial-first experience
Instead of pushing users directly into registration, I proposed a lightweight trial flow that allowed users to experience the product before being asked to commit or share personal information.
Before
After
Motion & visual storytelling
I introduced simple motion and branded visuals to:
demonstrate how the product works
break up dense content sections
keep users engaged as they scroll
This also created stronger continuity between the website and the product experience, where branded characters, graphics, and motion already played a key role.
RESULTS
REFLECTION
Motion bridges the gap between invisible AI processes and user understanding.
Friction can be psychological. Users needed to understand and trust the product before committing.
Lightweight user research was sufficient to uncover the core barriers to conversion.
Small changes to the user flow and onboarding experience led to measurable business impact.
