Overview
Jivada is a wellness e-commerce startup selling high-quality Ayurvedic and organic beauty products. When I joined the project, they had a product they believed in — but a digital presence actively undermining it. New visitors were leaving within seconds. Mobile users, who made up 75% of traffic, were abandoning carts at an alarming rate. The PM had no clear picture of where in the funnel they were losing people or why.
I was brought in as the sole UX/UI designer and took full ownership of the end-to-end redesign: scoping the research, defining the design strategy, producing all wireframes and high-fidelity UI, running two rounds of usability testing, and managing the developer handoff. The brief was clear — fix the conversion problem — but the solution required uncovering its root causes first.
The problem
Jivada entered a crowded wellness market without brand recognition. Before designing anything, I audited the existing platform with Hotjar and Google Analytics to quantify where and why the experience was failing:
Mobile sessions dominated but had the highest abandonment rate — meaning the platform was actively failing its largest audience.
Session recordings showed users pausing and leaving at product pages — unfamiliar names with no context eroded trust before purchase intent could form.
Heatmaps revealed users clicking the same nav items repeatedly — a signal of confusion, not browsing. They couldn't find what they came for.
The checkout had unnecessary form fields, no progress indicators, and late-stage error validation. The cart-to-purchase drop-off was the single largest revenue leak.
Research & discovery
I led a focused two-week research phase combining competitive analysis, qualitative interviews, and behavioural analytics to understand both the market landscape and actual user needs.
What I did
Mapped navigation structures, trust signals, mobile UX patterns, and pricing communication across five direct competitors. Identified that none had solved the "education gap" — helping newcomers understand Ayurvedic products without feeling overwhelmed.
Focused on online shopping motivations for organic products, trust-building factors, and pain points during discovery and checkout. Key finding: users wanted to feel educated, not marketed to.
Heatmaps and scroll maps revealed where users dropped off. Session recordings exposed specific checkout fields causing hesitation. Confirmation that mobile users were the most impacted segment.
Validated interview findings at scale. Identified two primary behaviour patterns that shaped persona development.
User interviews, affinity mapping, and competitive analysis — research phase outputs
Key insights
Users needed visible credibility signals — certifications, ingredient transparency, and reviews — before adding anything to cart.
Users preferred browsing by benefit or ailment over product type. They didn't know what they wanted — they knew what problem they had.
Both identified user types were busy professionals. The experience had to respect their time and remove every unnecessary step.
User persona
Research revealed two overlapping behavioural profiles. Rather than designing for two separate journeys, I synthesised them into a single composite persona that captured the core tension: desire for authenticity vs. limited time and patience for complexity.
Goals
- Find trustworthy skincare without hours of research
- Personalised recommendations that match their skin concerns
- Quick, confident purchasing — no second-guessing at checkout
Pain points
- Too many choices, no guidance on what's right for them
- Distrust of product claims without transparent ingredients
- Checkout friction that makes them question whether to proceed
Design decisions
With research complete, I presented findings and a prioritised opportunity map to the PM. We aligned on four focus areas ranked by estimated conversion impact. Every design decision below was directly traceable to a specific research finding — I documented this traceability explicitly during handoff so developers and stakeholders understood the reasoning behind each choice.
Restructured IA around user intent, not product taxonomy
Analytics showed users were clicking the same navigation repeatedly — a dead giveaway that the categories didn't match their mental model. I replaced the flat product listing with four intent-driven entry points: Ailments, Ingredients, Popular, and Bundles. This shift — from "what the product is" to "what the user needs" — was the single highest-impact structural change. It was validated in usability testing: task completion for product discovery improved from 3 of 6 participants to 6 of 6 in two rounds.
Revised information architecture — intent-driven navigation grouped by Ailments, Ingredients, Popular, and Bundles
Low-fidelity wireframes exploring layout and navigation structure before moving to high-fidelity
Moved credibility signals from homepage to point-of-decision
Interview analysis showed trust wasn't breaking down at arrival — it was breaking down at the product page, right before add-to-cart. I redesigned product pages to surface ingredient transparency panels, sourcing certifications, and contextual plain-English explanations of Ayurvedic terminology inline — not buried in an FAQ. This was a deliberate structural shift: trust signals embedded in the product UI, not treated as marketing copy on a separate page.
Redesigned product page — ingredient panels, certifications, and plain-English descriptions at the point of decision
Collapsed multi-step checkout to a single validated page
Session recordings identified three specific fields where users hesitated or backed out. I eliminated two redundant fields entirely (negotiated this with the PM by showing drop-off data), consolidated the flow to a single page, and added inline field validation so errors surfaced immediately rather than at submission. On mobile, I increased tap targets to 48px minimum and resolved keyboard-overlap issues that were hiding active fields. The −46% drop-off reduction was directly attributable to these changes.
Single-page checkout flow — annotated with friction points removed and validation improvements
Checkout screens — including the "not sure" hesitation state with reassurance messaging to recover wavering users
Built a scalable, mobile-first design system from the ground up
Rather than designing screens ad-hoc, I built a component library in Figma first: colour tokens, typography scale, spacing system, and reusable UI patterns. This meant the product could scale to new SKUs and categories without visual inconsistency. The visual direction — earthy tones, generous whitespace, high-legibility type — was tested with 6 participants for perceived trustworthiness before being finalised. All components were delivered as annotated specs with responsive behaviour defined for every breakpoint.
Competitive benchmarking — informing the visual direction: colour palette, typography hierarchy, and trust-signal component patterns across 5 competitors
What failed — and what we changed
Showing only the decisions that worked is the wrong kind of portfolio. Three significant design directions were tested, found wanting, and replaced before launch. Each one produced a better outcome than the original.
Skin-type quiz before browsing — scrapped after first usability round
My initial approach to personalisation was a 6-question skin-type assessment before users could browse any products. The logic was sound — better-matched recommendations would reduce decision fatigue and increase conversion. The usability test result was not: 4 of 6 participants either abandoned the quiz entirely or gave arbitrary answers just to get past it. The pre-browse gate created more friction than it removed. I replaced it with intent-driven navigation architecture (browse by Ailment or Ingredient) — personalisation delivered through structure rather than a form, with no barrier to entry.
First checkout redesign — better but not enough
My first iteration reduced the original 5-step checkout to 3 steps. Hotjar session analysis post-first-test showed improvement — but users were still hesitating and dropping off at step 2. The root cause wasn't step count. It was that users lost their form data when they pressed the back button to review their cart, and the inline field errors only appeared at submission. I rebuilt as a single-page flow with field-level state persistence, real-time inline validation, and resolved keyboard-overlap issues hiding active fields on mobile. The single-page structure was the change that drove the −46% drop-off — not the step reduction alone.
In-context terminology guide — deferred to phase 2
Research clearly identified that unfamiliar Sanskrit product names eroded trust before purchase intent could form. My original solution included a persistent inline glossary accessible from every product page. In the prioritisation session with the PM, we agreed the content maintenance overhead — keeping glossary entries accurate, SEO-optimised, and matched to new SKUs — was too high for the 8-week initial scope. We solved the immediate trust problem through plain-English product descriptions and ingredient callout panels instead. The glossary was formally documented as a phase-2 recommendation with a content brief attached.
Tied to a product launch already announced to retail partners — no schedule flexibility. Every scope decision was tested against this constraint.
Live personalisation recommendations and real-time inventory updates were descoped. The design system was built to work entirely with static product data for launch.
Complex CSS animations and transitions were not viable. The visual system relied on typography hierarchy, spacing, and whitespace for impact — constraints that produced a cleaner result than heavy motion would have.
Formal testing incentives weren't available. Both usability rounds used guerrilla recruiting — real target users approached directly, tested with coffee as the incentive. The findings were equally valid.
Process & cross-functional ownership
The project ran over 8 weeks. As the only designer, I was accountable for the full design process and served as the connective tissue between business goals (PM), technical constraints (2 developers), and user needs.
Key senior-level responsibilities I held throughout:
- Scoped the research plan independently and presented findings with a prioritised recommendation to the PM — research led strategy, not the other way around.
- Made scope trade-off decisions: negotiated removal of two checkout form fields by presenting drop-off data, pushing back on a stakeholder preference to retain them "for data collection."
- Ran two rounds of moderated usability testing (6 participants each) and used findings to make concrete design changes — not cosmetic tweaks.
- Produced annotated Figma specifications with component-level responsive documentation, reducing developer clarification requests during the 3-week implementation sprint.
- Monitored post-launch analytics for 3 weeks and made 4 targeted UI adjustments based on observed behaviour before signing off the engagement.
Results & impact
Results were measured over 90 days post-launch using Google Analytics conversion funnels and Hotjar session analysis. Where possible, I've attributed each metric to the specific design change that drove it.
- +38% overall conversion rate — driven primarily by the checkout redesign (−46% cart drop-off) and trust signal placement on product pages. Mobile conversion, previously the weakest segment, became comparable to desktop within 6 weeks.
- −46% cart-page abandonment — directly attributable to the single-page checkout, elimination of redundant fields, and inline validation. The 3 highest drop-off fields identified in session recordings were either removed or redesigned.
- +61% personalised product click-through — the intent-driven IA (Ailments / Ingredients navigation) connected users to relevant products faster. Users who entered via ailment navigation converted at a higher rate than those browsing by product category.
- 4.6★ average post-purchase satisfaction — collected via post-purchase survey (n=120+ responses). Qualitative feedback highlighted "easy to find what I needed" and "felt trustworthy" as the top two reasons.
- New SKUs indexed within weeks — the SEO-optimised product architecture meant new product additions benefited immediately from search visibility without manual intervention.
Key takeaways
- Research specificity pays off. The decision to interview users about Ayurvedic shopping specifically — not just e-commerce generally — surfaced the education gap that became the central design opportunity.
- Trust is a design system problem. Credibility signals aren't a marketing add-on. They need to be designed into the product architecture at the component level, not bolted on at the end.
- Mobile-first means mobile-obsessed. Designing for mobile first exposed friction points that desktop-first teams consistently miss — especially around keyboard behaviour, tap targets, and checkout form patterns.
- Simplicity is a business outcome. The biggest conversion gains came not from visual redesign but from removing steps and reducing cognitive load. Less complexity = more trust = more purchases.
Reflection
The most valuable skill I exercised on this project wasn't visual design — it was knowing when to push back. Removing two form fields the stakeholder wanted to keep was a small decision with a measurable outcome. That only happens when the designer has the data, the confidence, and the relationship with the team to make the case.
Working as the sole designer on a fast-moving cross-functional team also sharpened my ability to communicate design decisions clearly to non-designers. Every recommendation I made came with a "why" rooted in user data, not aesthetic preference — and that earned trust quickly.
Jivada also reinforced something I believe strongly: the biggest conversion improvements rarely come from visual refinement. They come from removing the wrong things — unnecessary steps, confusing language, friction the team had stopped noticing. That's the work senior UX/UI design exists to do.