Boxful UX

Role

Design Lead

Product Designer

Art Director

Scope

Design Strategy

UX Research

UI Design

Design System

Branding

the Challenge

Design an accessible, intuitive cross-platform service that educates space-constrained HK residents on door-to-door valet storage, differentiates from traditional mini-storage, builds trust, and drives conversions.

Results & Impact
  • Delivered end-to-end UX and branding that helped Boxful raise Series A ($6.6M) and Series B ($18M)
  • Created scalable checkout and product flows that supported business expansion to self-service lockers
  • Built trust and conversions in a skeptical market through intuitive, educational experiences

Design Process

DESIGN PROCESS
Lean UX

With the time constraints we had (45 days) to push out version 1.0, the principles of Lean UX provided us the framework to efficiently build a functional, comprehensive product. Version 1.0 provided a strong foundation for us to learn about our user's behavior. This allowed us to start the learning and implementation cycle so we could build a human-centered product.

Learn

Process
Learn
Competitive Analysis

We first developed our own ideas for the website layout and user flows before reviewing competitors. This approach helped us avoid preconceived biases. Analyzing existing solutions afterward allowed us to create a stronger pros and cons list and identify clear opportunities for differentiation.

Learn
Site Map

As a new service in Hong Kong, product education and pricing must be clear, concise and accessible throughout the user's journey. This site flow allowed us to make sure all information is disseminated in a clear and efficient manner.

Process
Learn
Build
Check
Evolve

Build

Process
Learn
Competitive Analysis

We made it a point to come up with our own thoughts and ideas regarding the layout of the website before looking at what existing competitors have done. This way we could immediately dispell any biases we had. Then analyzing what the other guys were doing allowed us to come up with a better pros and cons list.

Learn
Journey Map

The journey map serves as a reference point to view all of the site's potential touchpoints/painpoints.

Learn
Site Map

As a new service in Hong Kong, product education and pricing must be clear, concise and accessible throughout the user's journey. This site flow allowed us to make sure all information is disseminated in a clear and efficient manner.

Build
Low/Medium Fidelity Prototypes

Key experimenting period with valuable feedback from stakeholders to start the design process

Low-fidelity Wireframing
Quick and dirty, fast and focused prototyping for the Boxful responsive website
Medium-fidelity Wireframing
Fleshing out concepts
User Flow
Quick and dirty, fast and focused prototyping for the Boxful responsive website
Build
High-Fidelity Prototypes

The final stage focused on detailed design, user testing, and refinement. We created polished, responsive prototypes that closely represented the final product experience before handing off to developers.

Check

Process
Check
Checkout Redesign

The original checkout process created unnecessary friction and drop-off. Users were asked for contact details (email) far too early, before they understood the service or saw pricing. Location details appeared prematurely, and the long single-page format caused excessive scrolling with no clear sense of progress or completion.

Checkout 1.0 - The Problem
ISSUES
  • Get rid of the Enter District screen
  • Sign-up too early in the checkout process could deter some users
  • Too much scrolling can cause confusion especially when user wants to make changes
Core Problems
  • Information was requested in the wrong order, forcing users to commit personal data before building confidence in the service.
  • Poor flow: users couldn’t easily explore options and see final pricing before entering detailed inputs.
  • Overwhelming single-page design with heavy scrolling reduced perceived control and increased abandonment.
1
Sign-up (for new users only)
This high barrier at the very start caused many potential customers to abandon the process before they were convinced of Boxful’s value.
2
Enter District
The abrupt location gate felt discouraging and unhelpful. Users received little education or transparency before potentially being turned away, creating poor first impressions and lost opportunities.
3
Schedule
Information overload combined with excessive scrolling made the process feel chaotic and endless. Users lacked a clear sense of progress and found it difficult to review options or correct inputs.
4
Billing
Requiring users to review and confirm everything before entering payment details created unnecessary friction and hesitation right at the point of conversion.
Checkout 2.0 - The Solution
Our Solution

We redesigned the checkout from a single, overwhelming scrolling page into a clear, multi-step flow across 4 focused pages (5 logical steps). This new structure eliminates confusion, reduces cognitive load, and builds user confidence progressively by showing value first, then collecting information at the right moments.

  • Eliminated sources of confusion by sequencing steps logically and isolating related tasks.
  • Reduced scrolling dramatically by breaking content into standalone, focused screens with clear progress indicators.
  • Improved analytics & iteration through dedicated pages, making it easier to identify and optimize future drop-off points.
  • Added a persistent FAQ section across all steps to proactively address questions and build trust.

We redesigned the checkout from a single, overwhelming scrolling page into a clear, multi-step flow across 4 focused pages (5 logical steps). This new structure eliminates confusion, reduces cognitive load, and builds user confidence progressively by showing value first, then collecting information at the right moments.

  • Eliminated sources of confusion by sequencing steps logically and isolating related tasks.
  • Reduced scrolling dramatically by breaking content into standalone, focused screens with clear progress indicators.
  • Improved analytics & iteration through dedicated pages, making it easier to identify and optimize future drop-off points.
  • Added a persistent FAQ section across all steps to proactively address questions and build trust.
Select Service

Users begin by selecting one of Boxful’s two door-to-door storage services.

Updates

This dedicated opening step immediately focuses on the core offering and excites users with the lifestyle benefit of clearing space in their tiny Hong Kong apartments. Prominent progress indicators provide clear orientation from the start, while the integrated FAQ helps answer common questions early. By leading with education and value, we significantly lowered early bounce rates.

Select Product

A dedicated shopping cart page where users can adjust selections and view transparent, real-time pricing.

Updates

Research showed this was the most critical part of the checkout, so we gave it its own focused page. Users can now fully explore options, understand value, and see their total before committing any personal data. This isolation removed previous overload and dramatically improved confidence in the purchase.

A New Product

With the initial checkout redesign and homepage updates successfully implemented, we continued the Learn → Build → Check cycle. User data and business growth soon highlighted the need for the next major evolution: the introduction of self-service lockers.

What are Self-Service Lockers?
Access flexible, self-service storage at any Boxful Store. Drop off and retrieve your items anytime with smart card access. Our mobile lockers are stored efficiently at the central warehouse, enabling more store locations/pickup points across Hong Kong and greater convenience for residents.

Adding Lockers - Version 2.0

To expand our offerings without disrupting the proven door-to-door storage business, we introduced Self-Service Lockers as the third product in our lineup. As locker adoption grew and we scaled to more physical locations, we elevated Lockers to the top position in the “What We Do” and pricing sections.

Things to improve on

Despite the successful launch, the expanded product range created new challenges on the homepage:

  • Information Overload. With multiple products and differing pricing structures (by-item, by-square-foot, and lockers), the page presented too much information for users to digest. For many in Hong Kong, our service was still a novel concept, making clarity and simplicity critical.
  • Brand Perception. Boxful had become strongly associated with door-to-door storage. We needed to clearly communicate that we were also an innovative player in the self-storage space.

Simplifying the Homepage & User Flow - Version 2.1

Building on these learnings, we restarted the Lean UX cycle to simplify the experience while better supporting the full product range.

Restructure the User Flow

We consolidated from three distinct services into two clear product categories:

  • In-Person Access → Self-Service Lockers
  • Door-to-Door Service → Combined By-Item and By-Square-Foot options

Instead of asking users to differentiate complex pricing structures upfront, they now choose between the two primary modes of service. This created a much more intuitive decision point.

Homepage Improvements (2.0 → 2.1)

With an eye on taking Self-Service Lockers to the next level, the goal is to improve engagement by using the homepage to promote the merits of our services. Detailed pricing and information were moved further down the funnel.

  • Simplified the homepage by focusing on high-level service promotion and emotional benefits.
  • Moved detailed product lists and pricing deeper into the funnel, reducing cognitive load on the entry page.
  • Strengthened the “What We Do” section with clearer use cases, brief descriptions of each product, store locations, and enticing “as low as” pricing to drive users forward.

Comparison of the old (left) and updated (right) homepage wireframes.

The Funnel

When we only offered two similar door-to-door products, comparison was straightforward and the customer journey was nearly identical (book → pickup → warehouse storage).

With the addition of self-storage lockers, the journeys diverged significantly. We therefore needed to provide richer information to help users choose the right option — without overwhelming them. The restructured flow educates visitors on the distinct benefits of each mode early, then guides them smoothly into the streamlined checkout where they can explore details, pricing, and scheduling.