Dilemma at the Curb

Products have an onboarding experience, but what if onboarding is the product and users have less than 100 secs to spare?
Contextual Inquiry
local_library
To know more about design decisions, project nuances, and catch 22s, please reach out

The Context

CurbPass - previously known as 'Automotus Pay' - is Automotus' solution to make the curb safer, sustainable, and efficient. It is a webapp designed to improve access to the curb and reduce loading zone abuse by providing a handsfree pay-to-park solution post sign-up.

CurbPass Illustration

The Problem

For nearly 3 months, the conversion rate of CurbPass stagnated just below 11%

The Design Brief

How might we make CurbPass onboarding experience simple, stress free, and encouraging so that drivers comply to smart loading zone regulations?

WHAT YOU NEED TO KNOW

Conversion rate stalled at 11% because users were not only unfamiliar with the product but also annoyed with its onboarding

report

CONSTRAINT

Moreover, CurbPass is a webapp; user proximity does not exist

Overview

Timeline

10 Weeks

My Scope

  • Contextual Inquiry
  • Heuristic Evaluation
  • Analysis & Synthesis
  • Design Strategy
  • PRD scoping & Planning
  • Ideation & Prototyping
  • A/B Testing
  • Pixel Craft
  • HandOff
  • Alpha Testing

Resource

  • 1 Frontend Dev
  • 1 Full Stack Engineer
  • Product Manager
  • 1 Colleague
  • Marketing Team

Category

B2C WebApp

The Solution

A redesigned product - CurbPass 2.0 that boasts a less intrusive, simple, and quick onboarding so that users can get going.

SOLUTION OVERVIEW

~1:35 mins
OLD DESIGN
~1:05 mins
NEW DESIGN*
*industry avg is ~1 to 2 mins
auto_awesome

insight

Parking is inherently a negative experience that makes users impatient and sensitive to what's next

CurbPass V2
CurbPass V2

Impact

+19%
Conversion Rate
+2500
MAU in SLZs
-50%
Support Tickets
-32%
Churn Rate
BEFORE
  • Unclear value proposition
  • Unnecessary user inputs - swiping
  • No actionable information
CurbPass V1CurbPass V2
AFTER
  • Actionable Information
  • Clear value proposition - save time
  • Optimized user input

User Story: As a loading zone user, I hadn't known what smart loading zones are until know. I conduct business here, so I want to know what CurbPass is. Given that its a web-app, when I scan the QR and visit the page, then I should be able to know if this product is useful and affordable for me. I don't want to use another parking app!

BEFORE
  • Errant pattern
  • Cognitive overload re: ideal balance
  • Affordance issues
  • Unnecessary scrolling
CurbPass V1CurbPass V2
AFTER
  • Mental model alignment
  • Low barrier to entry
  • Assistive information
  • Little/No scrolling

User Story: As a commercial driver who delivers often, I'm interested in trying CurbPass, but, I don't want to pay as I'm not sure if I want the product or I fully understand it; loading zones have been free historically. Given that CurbPass is a paid product, I don't want to commit to it right now and leave money on the table.

BEFORE
  • Poor visual design
  • Lack of information hierarchy
  • Affordance issues
  • Not very useful
CurbPass V1CurbPass V2
AFTER
  • Visual hierarchy
  • Glanceability
  • Clear affordances
  • Purposeful

User Story: As a CurbPass user I'm unable to know if my park is detected by the system and how much I have spent. Given that I use them often, I want to receive notifications and track my parking. Furthermore, when I sign-in, then I should be able to know my balance.

Contextual Inquiry

Since CurbPass’ success is crucial for Automotus to go into new markets, I advocated for design research and collaborated with the marketing team to plan and organize contextual inquiries. However, due to logistical constraints, field research and ride-alongs were not possible. So, I proposed using google maps street view to simulate the overall experience even though it is not typical. We interviewed:

  • Gig Drivers
  • Fleet Drivers
  • Mom & Pop Shops
  • SMB Owners
Diagnostic Interviews

What we learned

Synthesized learnings from heuristic evaluation and contextual inquiries

From nearly 12 sessions comprising of surveys, interviews, and focus groups, we discovered the following painpoints

29%

Users did not know how smart loading zones worked

78%

Users did not want to pay for infrastructure that was historically free

44%

Users did not understand how CurbPass worked

71%

Users often dropped out just before completing their payment

auto_awesome

Parking is inherently a negative experience for drivers resulting in frustration. As a result drivers are sensitive to frictions like sign-ups or paying to use loading zone

User Journey
Heuristic Evaluation
  • Out-of-loop syndrome: Primary CTAs donot provide real time feedback of the system state. For ex: users don't know if they successfully created the account

  • Errant Mental Model: Payment is typically initiated after completing all steps in a purchase experience. However, in CurbPass V1, the payment step is fore-fronted

  • Poor access to essential info: Parking is largely concerned with cost and availability. However, that information is unavailable or submerged

  • Steep learning curve: The value of the product comes from progressive use. However, the onboarding flow demands too much effort without providing compensation

  • Affordance Issues: CurbPass setup is confusing, poorly designed, and not usable

  • Information Overload: The signage plays a pivotal role in adoption. However, it is information heavy and overwhelming

  • Unforgiving and Untraceable: V1 Onboarding does not allow users to correct their steps as there is no back button. Furthermore, users cannot come back to the product as its a webapp

Findings and Insights
  • Users view CurbPass like 'parking meters' and try to hack the system with their 'catch me if you can’ attitude

  • Users donot have time at the Curb to understand how CurbPass works since ‘accessing a loading zone’ is merely an intermediate and non-trivial touchpoint in their user journey

  • ‘Parking’ has conventionally been a negative experience for people and thus users are sensitive to any related tasks

  • Users were unable to determine the value of CurbPass because loading zone use is demand based and spontaneous whereas CurbPass removes spontaneity thereby making it undesirable for certain user groups

  • Lack of scale and enforcement undervalued CurbPass. Users were not sure if they would use CurbPass often or if smart loading zones were prevalent in their city

  • The V1 release lacked user facing feedback loops and communication channels, which left them unsure, anxious, and out-of-the-loop

  • The learning curve was too steep for users to grasp the conceptual model of CurbPass

  • Flawed mental models were the cause of many challenges users faced

  • The V1 release required significant user effort to complete tasks resulting in interaction fatigue

  • The V1 release contained unnecessary and poorly structured information that lead to cognitive overload

Ideation & Design Strategy

Initially, the product manager was inclined towards an iterative approach due to engineering and project management constraints, but, I strongly adovcated for a complete redesign since CurbPass was scheduled to launch in 2 new cities.

CurbPass R&D
Design Exploration
Be Unobtrusive

Be Unobtrusive

CurbPass should not disrupt the user’s journey by wasting time, creating friction, or demanding unnecessary effort.

Be Familiar

Be Familiar

CurbPass must be approachable, familiar, and easy to use as it is a new concept in the world of curb management.

Progressive Value

Progressive Value

Compliance must be earned, not forced. CurbPass’ value must be discovered through engagement - not by sale.

Payment Step Strategies

Explored 5 payment step variations and boiled them down to 2 for A/B testing.

  • 64% felt that option-based approach was better than calculator-based approach
  • Advocated for Google Pay/Apple Pay integration and successfully influenced implementation
A/B Test Metric AA/B Test Metric B
A/B test results
local_library
To know more about the payment strategies and A/B test findings, please reach out

Landing Page Optimization

While landing page is a fairly easy to design, it plays a crucial role in high-dynamic environments - such as the curb. It is imperative that the landing page is effective since CurbPass is a webapp; 1st engagement is vital.

Design exploration
Additional contributions

Park Notification - Twillio

Besides the redesign of the webapp experience, it was vital to improve key touchpoints of the overall UX. Collaborated with PM to build Twilio SMS flows for various notifications along the user journey

  • Post Onboarding
  • Park Event
  • Wallet Balance
  • Zone regulations
Iphonestock
Twilio Studio

Final Designs

Using MUI design system, I crafted the designs below. I worked closely with the dev team during handoff to ensure that the feature is built per design spec.

CurbPass onboarding 2.0

Design System Challenges

Automotus used off the shelf MUI design system. However, it was not tailored for Automotus' needs and needed a significant upgrade. In parallel to CurbPass' development I worked with all PMs, and front end developers to establish a robust MUI design system for Automotus.

Automotus Design SystemAutomotus Design System
8 months worth of work

Design HandOff

  • Collaborated with Marketing to ensure that campaigns are aligned with the new user journey.
  • Collaborated with QA to ensure input error and system error states are accounted for
HandOff

Impact

+19%
Conversion Rate
+2500
MAU in SLZs
-50%
Support Tickets
-32%
Churn Rate
arrow_upward