Project 4

Context

Bopin is a social video-sharing experience centred around watching YouTube content together in real time.

This project focused on identifying behavioural friction across onboarding, sign-up, retention, and post-session engagement using quantitative analytics data from Google Analytics.

Rather than relying on user interviews or journey mapping, the work focused on behavioural patterns, funnel analysis, and drop-off points to understand where the experience loses momentum.

The objective was to translate behavioural data into actionable UX recommendations that improve continuation, engagement, and social interaction.

[Insert supporting image: analytics dashboard, behavioural flow, or platform overview]

Process

Step 1

Behavioural Funnel Analysis

The project began by analysing onboarding, navigation, and retention behaviour through Google Analytics funnel and event tracking.

Focus areas included:

  • onboarding progression
  • sign-up completion
  • retention patterns
  • navigation flows
  • social interaction behaviour

The analysis concentrated on identifying where users abandon the experience and what behavioural patterns repeat across sessions.


Step 2

Quantitative Data Extraction

Behavioural events and conversion data were extracted and compared to identify friction points throughout the product experience.

This stage focused on:

  • user drop-off frequency
  • retention decay
  • event completion rates
  • post-session behaviour
  • navigation interruption patterns

Rather than analysing isolated screens, the work focused on how behaviour changes across the full experience lifecycle.

[Insert image placeholder: retention graph / conversion table / event analysis]


Step 3

Insight Synthesis

The extracted data revealed recurring experience-level problems affecting onboarding, trust, retention, and social engagement.

Drop-Off Before Sign-Up

Data

Out of 55 users who installed the app:

  • all users reached onboarding
  • only 5 users continued to sign-up

Over 90% of users left before attempting account creation.

Insight

Users abandon the experience before understanding the product’s value.

The onboarding flow introduces friction before clearly communicating why the platform matters or what users gain from continuing.

UX Recommendation

  • Surface the core value proposition immediately
  • Reduce friction before engagement
  • Allow users to begin watching before account creation

Wireframe Direction

A simplified onboarding entry point focused on immediate clarity and action.

Headline:
“Watch YouTube together, live”

Subtext:
“Start a shared session in seconds”

Primary CTA:
“Start watching”

Secondary CTA:
“Sign in”

[Insert image placeholder: onboarding wireframe]


Discount Code & Promotion Friction

Data

“Rabattkod CLUB20 fungerar inte.”
Mobile, Sweden, 2026-03-15

“Det blev ingen skillnad på slutsumman när jag la in CLUB20”
Mobile, Sweden, 2026-03-15

Insight

Users lose trust when discounts fail silently or when price adjustments are unclear during checkout.

The issue was not only technical, but communicative. Users lacked confirmation, transparency, and feedback.

UX Recommendation

  • Confirm when discounts are successfully applied
  • Show updated totals immediately
  • Display contextual error messaging
  • Improve visibility of promotional logic

[Insert graph: promotion-related complaints or failed discount interactions]



Checkout Friction & Purchase Interruptions

Data

“Ja, att jag bara får köpa max 2 st”
2026-03-14

“Obetalda fakturor…”
2026-03-16

Insight

Checkout interruptions create frustration when users encounter restrictions or unclear purchasing limitations without sufficient explanation.

Users expected smooth progression, but experienced sudden obstacles and unclear constraints.

UX Recommendation

  • Surface purchasing limits earlier
  • Improve cart visibility and feedback
  • Create smoother step transitions
  • Clarify blocked actions and payment states

[Insert graph: checkout exits, failed sessions, or friction frequency]


Conversion Gap Analysis

Data

  • Active users: 145K (+21.4%)
  • Sessions: 226K (+19.5%)
  • Purchases: 15K (+50.2%)
  • Key events: 15K (+49.6%)

Insight

The platform demonstrated strong growth and purchasing intent, but the experience did not consistently guide users toward conversion.

Some users converted efficiently, while others struggled to orient themselves within the purchase flow.

UX Recommendation

  • Reduce early decision friction
  • Make the primary action immediately visible
  • Introduce stronger onboarding hierarchy
  • Guide users toward high-confidence starting points

[Insert graph: conversion funnel or sessions-to-purchase comparison]


Wireflow & UX Direction

Based on the identified friction patterns, redesigned wireflows were created to improve orientation, reduce cognitive load, and strengthen checkout confidence.

The redesigned flows focused on:

  • clearer progression
  • visible feedback
  • simplified decision-making
  • improved mobile responsiveness

[Insert wireflow]

Caption example:
Wireflow redesign focused on reducing friction across mobile checkout interactions.

A side-by-side comparison of two UX flows displayed on matching, thin black tablets resting on a light ash wood surface. One tablet shows a cluttered, low-contrast interface, while the other presents a clean, accessible redesign with large touch targets, clear hierarchy, and inclusive language. Between them lies a narrow black strip of annotations, printed in precise sans-serif type, calling out ethical and usability improvements. Soft, overcast window light from the left creates even illumination and subtle, directional shadows, enhancing contrast without harshness. Shot from a slightly elevated angle with moderate depth of field, both screens are crisp while the wood texture softly recedes. The photographic realism and restrained palette underscore thoughtful, principled UX decision-making.

A dramatic, minimal UX dashboard interface displayed on a large, frameless ultra-wide monitor mounted on a dark, textured wall. The screen shows an accessible analytics dashboard with generously spaced charts, high-contrast labels, and clear, ethically framed metrics like “user well-being” and “task success.” The monitor rests above a narrow black shelf holding only a single monochrome notebook and a slender graphite pencil. Lit by a single, focused overhead light, the interface glows against the near-black surroundings, casting a faint halo on the wall. Captured in a straight-on composition with sharp focus throughout, the photographic image feels bold, cinematic, and intensely focused on the ethical, data-informed side of UX design.

A collection of UX case study artifacts spread with careful precision across a wide, pale concrete tabletop: high-fidelity mobile screens printed on thick matte paper, a bold black tablet displaying a crisp design system, and a stark white storyboard of user flows drawn with sharp black lines. Each artifact uses strong contrast and generous whitespace, with clear accessibility annotations. Overhead, soft studio lighting evenly illuminates every detail, creating gentle, defined shadows that add depth. Shot from a slightly elevated, top-down perspective, the composition forms a strong diagonal flow from lower left to upper right. The mood is bold and analytical, with a photographic realism that highlights structure, hierarchy, and methodical UX craftsmanship.

Design Decisions

Structure

The checkout flow was simplified into clearer sequential steps to reduce uncertainty during purchase completion.

Priority actions and system feedback were surfaced more visibly to support user orientation.

Accessibility

Touch interactions, responsive spacing, and simplified messaging were prioritised to improve usability across mobile devices.

Error states and status changes were designed to remain visible and understandable without requiring technical interpretation.

Behavioural Clarity

Rather than adding additional functionality, the redesign focused on reducing ambiguity during high-friction moments.

System feedback, pricing changes, and purchasing restrictions were surfaced more proactively to strengthen trust.

[Insert final prototype screens]

Caption example:
Responsive checkout flow designed around visibility, reassurance, and reduced friction.

Caption example:
Improved promotional feedback designed to increase transparency during purchase decisions.

Solution

The final concept reframes checkout not as a transactional endpoint, but as a guided and confidence-building interaction.

By translating behavioural data into experience-level insights, the redesign focused on improving trust, clarity, and progression throughout the purchasing journey.

The project demonstrates how data analysis and UX thinking can work together to identify friction patterns and create more intuitive e-commerce experiences.

Reflection

This project reinforced the value of combining behavioural analytics with UX analysis to uncover deeper experience-level problems.

Many of the identified issues were not caused solely by functionality failures, but by uncertainty, unclear communication, and loss of trust during critical purchase moments.

The process also highlighted how qualitative feedback can reveal emotional friction that quantitative metrics alone may overlook. Translating customer complaints into UX patterns made it possible to move beyond isolated issues and identify broader structural improvements across the checkout experience.

More broadly, the project strengthened my understanding of how data-informed UX can support clearer decision-making, stronger user confidence, and more resilient digital commerce experiences.

Latest Notes

View Archive [ -> ]