GM MOHIT
PORTFOLIO ©2026
1
06300
08420
TEAURE — CONCEPT
SCROLL TO EXPLORE

Teaure.

RoleLead Designer & Developer
Timeline4 Weeks
ServicesUI/UX, Frontend, Motion

Organic blends crafted for calm, presence, and unmatched holistic purity.

A fictional wellness brand created to explore how cinematic storytelling can transform digital commerce into a more immersive experience.

01 / The Premise

Can digital commerce feel as calming and intentional as the ritual of preparing tea?

Most wellness websites focus primarily on transactions. This project explores how storytelling, motion, and atmosphere can transform online shopping into a more immersive and emotionally engaging experience.

Rather than optimizing purely for conversion, the concept investigates how intentional design can create stronger connections between product, brand, and user.

02 / Context

Designing for Presence.

Teaure is a conceptual project combining brand creation with product exploration. The project began with a simple observation: Most wellness products promise calm, mindfulness, and balance, yet their digital experiences often feel rushed and transactional. This exploration investigates what happens when the digital experience becomes an extension of the product itself.

03 / Insights

The Gap in Wellness Commerce.

01

Sensory Disconnect

Digital experiences often feel flat and disconnected from the calming nature of wellness products.

02

Story Over Specs

Users frequently connect with mood, rituals, and emotion before evaluating product details.

03

Interrupted Flow

Traditional shopping patterns often disrupt immersion during key moments of discovery.

04 / Realism

Designing Within Constraints

Even within a conceptual project, several constraints shaped design decisions to ensure the project felt grounded in real-world considerations.

  • Rich visuals must not compromise performance.
  • Motion should support usability rather than distract.
  • Product information must remain accessible and clear.
  • Storytelling cannot interfere with discoverability.
  • The experience must balance atmosphere with conversion intent.
TypefaceAa
Ag

Cormorant
Garamond

Primary
Aa

Plus Jakarta
Sans

Secondary

Design Decisions

Atmosphere
Users often form emotional impressions before rational decisions. Large visual storytelling establishes context before introducing specifications.
Unified Space
Instead of redirecting users through disconnected steps, the cart behaves as an extension of the browsing experience, preserving continuity.
Motion Continuity
Transitions maintain context and create smoother movement between states. Motion exists to support comprehension, not simply to attract attention.
Depth Hierarchy
Foreground elements remain sharp and actionable. Background elements provide context without competing. Focus emerges naturally rather than through aggressive UI.
Teaure Floating UI
Teaure Environment View

Designing the Feeling,
Not Just the Interface

Most interfaces optimize for speed and efficiency. This project explores a different approach. An experience where users are not rushed, but gently guided through interaction. The goal was not to make users move faster, but to make them feel something while they move.

07 / System

Built for Atmosphere and Clarity.

The visual language balances warmth with precision. Neutral earthy tones create familiarity. Editorial typography introduces sophistication. Minimal interface elements reduce visual noise. The system is designed to support the experience, not dominate it.

Design Principles

TypographyCalm Before Conversion
LayoutClarity Over Complexity
ContentStorytelling Over Promotion
InteractionMotion With Purpose
System Component
System Component
System Component
Cream White#FCF5EE
Warm Earth#574233
Roasted Cacao#3F352C
Charcoal Black#1C1C1C

Cormorant
Garamond

AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz!@#$%^&*()?:;<>[]
LightRegularMediumBold

Plus Jakarta
Sans

AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz!@#$%^&*()?:;<>[]
LightRegularMediumBold

08 / Expected Impact

This concept explores how cinematic storytelling may:

  • Increase emotional engagement
  • Improve product recall
  • Create stronger brand differentiation
  • Encourage longer session duration
  • Build deeper product connection

09 / Reflection: Looking Back

Key Learnings
  • — Emotion requires restraint, not excess.
  • — Motion shapes navigation, not just aesthetics.
  • — Simplicity is the result of deliberate decisions.
  • — Brand storytelling influences perceived value.
Future Exploration
  • — Personalized experiences based on behavior.
  • — Richer motion systems across product flows.
  • — Interactive exploration using emerging web tech.

If developed further, the next step would be validating these assumptions through usability testing, behavioral analysis, and iterative refinement.