Heejin Suh

Byte Technology · 2020 · Shipped to Production

Redesigning the discount system for a B2B food retail platform.

The admin dashboard that Byte's clients relied on to manage discounts was broken. I redesigned the experience end-to-end in 4 weeks.

ROLE

UX/UI Designer

PLATFORM

Web (B2B SaaS)

TIMELINE

4 Weeks

Heejin Suh

About

Resume

Overview

Problem

Who We Designed For

Current Experience Audit

Flow Exploration

Design

Exploration: Expanding Ownership

00 · Overview

What is Byte Technology?

Byte builds smart refrigerators placed in workplaces, hospitals, and campuses across the US. Customers swipe a credit card, grab what they want, and walk away, RFID tags handle the rest. For some clients, this platform is mission-critical to their entire business

UX/UI designer working closely with Byte's PM and developer

Ran the analysis, user flow, wireframes, and hi-fi prototyping

Checked design decisions against engineering constraints throughout

My Contribution

Redesign of discount & coupon admin experience on Byte's B2B dashboard

New aggregated dashboard, create flows, detail views, and search UX

Handed off to Byte for usability testing and development

Project scope

01 · Problem

The discount feature was buried and barely functional.

As a project kickoff, I audited the current dashboard. The discount admin was spread across 4 confusing flows, the forms were too limited for what clients actually needed, and the whole thing was hidden under a "Premium" panel.

02 · Who we designed for

Food companies, from large corporations to mom-and-pop.

Some clients are large corporations with considerable resources, others are small operations. Tech savviness varies a lot. But they all use the same dashboard, and "discount" means 4 very different things depending on the goal:

02 · Who we designed for

Food companies, from large corporations to mom-and-pop.

Location subsidies

Permanent discounts split between client and location; e.g. 25% from each, stacking to 50%. Billable to either party.

New store promotions

Temporary discounts or single-use coupon codes to drive trial at unfamiliar locations.

Enjoyment, uniqueness, collectability, investment, self-expression — different users, different threads.

Reduce spoilage

Auto-discount products approaching expiration based on shelf life. A big deal for clients selling fresh food.

Happy hour

Recurring discounts during slow hours (e.g. every Friday 4–6 PM) to move inventory before the weekend.

03 · Current experience audit

8 deficiencies. A system that couldn't scale.

As part of the discovery phase, I went on the Byte dashboard to see the limitations of the current product:

03 · Current experience audit

8 deficiencies. A system that couldn't scale.

As part of the discovery phase, I went on the Byte dashboard to see the limitations of the current product:

Discount feature buried under "Premium" which makes it not discoverable from the main landing page

4 different flows that accomplish similar things and are confusing

Field labels on forms often missing or not clearly stating what entries are desired

No search functionality, making data access and sorting difficult

Inconsistency in dashboard data table headers

Extremely limited data entry inputs for the "create new discount" form vs. complexity of use cases

No validation before form submission, leading to user errors

Ineffective data entry with excessively long radio button lists and no search

Discount feature buried under "Premium" which makes it not discoverable from the main landing page

Inconsistency in dashboard data table headers

4 different flows that accomplish similar things and are confusing

Extremely limited data entry inputs for the "create new discount" form vs. complexity of use cases

Field labels on forms often missing or not clearly stating what entries are desired

No validation before form submission, leading to user errors

No search functionality, making data access and sorting difficult

Ineffective data entry with excessively long radio button lists and no search

New features requested by Byte

Aggregated discount overview

"Currently live" visual indicator

Billing export to bill the location

Discount/coupon details

% or $ amount option

04 · Flow exploration

Separate or combined? That was the main question.

Should discounts and coupons share one flow, or be separated early? I designed two options.

04 · Flow exploration

Separate or combined? That was the main question.

Should discounts and coupons share one flow, or be separated early? I designed two options.

Option A: separated ✓

Users choose coupon or discount upfront. Each path stays focused. Byte agreed this was the right call.

Option b: combined

Users create a "promotion" and choose type later. Simpler entry, but more confusion downstream.

I recommended the option that separates the coupon and discount experience to the Byte team. By giving the user the decision point early on, they can focus on one category and avoid confusion. The Byte team ultimately saw the benefit of separating those two experiences and decided to proceed with the recommended user flow.

05 · Design

The new discount experience.

Based on the user flow we landed on, I sketched out solutions and shared them with the Byte team for feedback. With their input, I iterated on wireframes and generated high-fidelity prototypes. Here are some highlights.

05 · Design

Make buying weightless. Make selling guided.

Even subscribing to Art Store confused users. Buying on NFT marketplaces required too many steps. On TV, that friction only gets worse.

05 · Design

Make buying weightless. Make selling guided.

Even subscribing to Art Store confused users. Buying on NFT marketplaces required too many steps. On TV, that friction only gets worse.

Design Highlights

Discount Details Modal

Clicking a discount name opens a modal with everything: stores, products, SKUs, categories, billing split, schedule, recurrence. Billing export and "End Now" buttons are right there too.

Create New: Type Selector

A modal with options to create a new discount or a new coupon. Each option has a short description so users know what they're getting into.

Create New Discount

One form replacing 4 old flows. Users pick % or $ for both the discount value and bill-to-location. Discount type (Regular, Happy Hour, Shelf Life) changes what date/time options appear. Product and category search, store picker, and optional recurrence are all on the same page.

Instead of scrolling through a long radio button list, users get a searchable modal with visual product cards showing images and SKU numbers. They can select multiple items and see their selections as they go.

Search UX Pattern

All discounts and coupons in one table. Color-coded status icons, Bill to Location column upfront, search, and export/stop actions per row. "Coupons & Discounts" got its own sidebar menu item instead of being buried under Premium.

New Coupons & Discounts Dashboard

Discount details modal

Create new: type selector

Create new discount

Search UX pattern

06 · Reflection

4 weeks to learn the business, then design for it.

06 · Reflection

Learning a business in 4 weeks, then designing for it.

What worked

Separating coupons and discounts early got rid of the confusion from 4 overlapping workflows. Byte's team said this alone was a big improvement.

What I'd explore further

Test edge cases in the SKU selector (like "all products except one category") and validate the forms with less tech-savvy operators.

Working within Material UI, Byte's engineering constraints, and a 4-week timeline pushed me to make every decision count.

The onboarding that got millions of gamers to hit play

Next Project