Camp retailer

Camp retailer — One store, a hundred packing lists

An ecommerce foundation redesigned around how parents actually shop for camp — wireframes for navigation, camp selection, packing lists, collections, PDP, cart and checkout.

Role
Lead UX/UI Design · IA
Team
Retailer ecommerce team
Years
2025
Industry
Retail · Ecommerce
Headline result
100s

Camps a single wireframe system was built to carry — each with its own packing list, required items and guided shopping flow.

An ecommerce foundation redesigned around how parents actually shop for camp — wireframes for navigation, camp selection, packing lists, collections, PDP, cart and checkout.
Primary surface
Fig. 01

[ The problem ]

Parents shop for camp under time pressure, list in hand — and the existing flow fought them the whole way. Switching camps was difficult, large catalogs were hard to navigate, and the packing list lived somewhere else entirely. Every camp has different requirements, so the store had to behave differently for each one without becoming a hundred stores.

[ Goals ]

Guided shopping — the camp's packing list drives the journey, not a generic catalog. Scale — one system that supports hundreds of camps and their unique requirements. Momentum — add, check and continue without ever losing your place. Clarity — parents always know what is required, what is recommended and what is done.

    Approach

    I started with an audit of the existing flow to find where parents were getting stuck, then rebuilt the architecture around the packing list as the organizing object rather than the product catalog. From there the system came together surface by surface in wireframes: a sticky navigation anchored to real shopping behavior, a camp selector built for speed, a slide-in cart and an always-available packing-list drawer, then camp home, collections, quick view and PDP — each designed to keep required items one glance away.

    [ Scope and constraints ]

    What I owned
    Constraints
    How it was tested

    [ The work ]

    The surfaces.

    BeforeAfter
    1

    The audit

    Find where parents were getting stuck before redesigning anything.
    Objective

    Find where parents were getting stuck before redesigning anything.

    Process

    Walked the existing flow end to end and mapped the friction: camp switching, catalog navigation, and a packing list that lived outside the shop entirely.

    Outcome

    A clear map of gaps that shaped the system's priorities.

    camp-ecommerce-wireframes
    2

    Sticky navigation

    Support how parents actually move — between categories, lists and comparisons.
    Objective

    Support how parents actually move — between categories, lists and comparisons.

    Process

    Anchored essential actions to the viewport so cross-referencing never means scrolling back to the top.

    Outcome

    The store keeps up with the shopper instead of resetting them.

    camp-ecommerce-wireframes
    3

    Camp selector

    Get the right camp chosen fast, under time pressure.
    Objective

    Get the right camp chosen fast, under time pressure.

    Process

    Grouped camps visually, simplified search and made the selected camp unmistakable throughout the session.

    Outcome

    Wrong-camp confusion and backtracking designed out of the entry point.

    camp-ecommerce-wireframes
    4

    Cart drawer

    Let parents add, check and adjust without leaving the page.
    Objective

    Let parents add, check and adjust without leaving the page.

    Process

    Rebuilt the cart preview as a slide-in drawer with quantities, sizing and totals handled inline.

    Outcome

    Momentum holds — the cart is a glance, not a detour.

    camp-ecommerce-wireframes
    5

    Camp home

    Turn each camp's requirements into a guided landing experience.
    Objective

    Turn each camp's requirements into a guided landing experience.

    Process

    Highlighted required essentials, introduced core categories and built clear pathways into the packing list.

    Outcome

    Every family starts from their camp's reality, not a generic homepage.

    camp-ecommerce-wireframes
    6

    Packing-list drawer

    Keep the paper list parents shop with inside the experience.
    Objective

    Keep the paper list parents shop with inside the experience.

    Process

    Surfaced required items, recommendations, quantities and completion states in an always-available drawer with links to matching products.

    Outcome

    The list drives the shop — nothing gets forgotten.

    camp-ecommerce-wireframes
    7

    Collections

    Organize large catalogs around how families shop for camp gear.
    Objective

    Organize large catalogs around how families shop for camp gear.

    Process

    Grouped by apparel, bedding and accessories with scannable product cards and easy access to filters.

    Outcome

    Browsing follows the requirement, not the inventory.

    camp-ecommerce-wireframes
    8

    PDP & quick view

    Support fast, confident product decisions.
    Objective

    Support fast, confident product decisions.

    Process

    A quick-view modal for comparison without losing place, and a PDP that groups information logically, surfaces fit early and ties each item back to its list category.

    Outcome

    Clarity, confidence and speed at the decision point.

    camp-ecommerce-wireframes

    [ The system underneath ]

    [ Results ]

    100s | Camps carried by one system 9 | Surfaces wireframed, nav to checkout 1 | Packing list, always one tap away

    The result is a UX foundation a camp retailer can scale: hundreds of camps on one system, each parent guided by their own list. Required items surface first, progress is visible, and nothing about adding to cart interrupts the flow. Because it was designed as wireframes at the system level, the client can apply brand and content without renegotiating the structure.

    What I carry forward

    Designing around the parent's list instead of the store's catalog taught me that the best navigation is sometimes someone else's piece of paper, made digital and kept at hand.

    ← All work

    More work