Kaspa's: App Refresh

Kaspa's: App Refresh

Restructuring and refreshing Kaspa’s existing app for a clearer, more recognisable mobile experience.

I design strategic brand identities that win trust, attract customers, and drive growth.

Restructuring and refreshing Kaspa’s existing app for a clearer, more recognisable mobile experience.

overview

Kaspa’s is a UK dessert franchise known for its colourful menu and playful brand. Its existing app supported ordering, loyalty and promotions, but the experience had become visually inconsistent and difficult to navigate. I worked on restructuring the app and refreshing its visual direction, from competitor research and information architecture through to wireframing, UI design and launch support.

Redesigning an existing ordering and loyalty app.

Redesigning an existing ordering and loyalty app.

Redesigning an existing ordering and loyalty app.

To simplify the experience and bring it closer to Kaspa’s evolving brand.

To simplify the experience and bring it closer to Kaspa’s evolving brand.

To simplify the experience and bring it closer to Kaspa’s evolving brand.

Research, information architecture, wireframing, UI design and iterative testing.

Research, information architecture, wireframing, UI design and iterative testing.

Research, information architecture, wireframing, UI design and iterative testing.

previous app

previous app

The existing Kaspa’s app was functional, but years of added features had left its navigation, hierarchy and visual language inconsistent. The brief initially focused on refreshing the interface, with room to rethink how the experience was organised.

fragmented navigation

Core actions were split across the home screen, side menu and nested pages.

fragmented navigation

Core actions were split across the home screen, side menu and nested pages.

fragmented navigation

Core actions were split across the home screen, side menu and nested pages.

weak hierarchy

Primary and secondary features often carried similar visual weight.

weak hierarchy

Primary and secondary features often carried similar visual weight.

weak hierarchy

Primary and secondary features often carried similar visual weight.

inconsistent interface

Forms, cards and navigation lacked a shared visual system.

inconsistent interface

Forms, cards and navigation lacked a shared visual system.

inconsistent interface

Forms, cards and navigation lacked a shared visual system.

limited brand expression

The product felt disconnected from Kaspa’s wider visual identity.

limited brand expression

The product felt disconnected from Kaspa’s wider visual identity.

limited brand expression

The product felt disconnected from Kaspa’s wider visual identity.

the landscape

I reviewed around 20 food and hospitality apps, combining direct competitors with highly rated ordering platforms, to understand how they balanced ordering, loyalty, promotions and brand expression.

1

clear navigation

Core actions remained accessible without relying on deep side menus.

1

clear navigation

Core actions remained accessible without relying on deep side menus.

1

clear navigation

Core actions remained accessible without relying on deep side menus.

2

food-first design

Photography and products did much of the visual work, rather than excessive UI decoration.

2

food-first design

Photography and products did much of the visual work, rather than excessive UI decoration.

2

food-first design

Photography and products did much of the visual work, rather than excessive UI decoration.

3

brand balance

Typography, colour and imagery expressed the brand without overusing its primary colour.

3

brand balance

Typography, colour and imagery expressed the brand without overusing its primary colour.

3

brand balance

Typography, colour and imagery expressed the brand without overusing its primary colour.

restructuring

The original app relied heavily on a side menu, with ordering, loyalty, account and supporting content spread across several levels. I reorganised the structure around a smaller set of clearer destinations, bringing key actions closer to the home screen and reducing reliance on nested navigation.

side navigation

view our menu

refer a friend

social media

FAQ & support

leave

feedback

location

account

history

click &

collect

order to

table

vouchers

loyalty

promo slider

loyalty QR

loyalty

orders

redeem voucher

start new order

click &

collect

order to

table

select

store

table

number

view our menu

my account

account details

side navigation

view our menu

refer a friend

social media

FAQ & support

leave

feedback

location

account

history

click &

collect

order to

table

vouchers

loyalty

promo slider

loyalty QR

loyalty

orders

redeem voucher

start new order

click &

collect

order to

table

select

store

table

number

view our menu

my account

account details

side bar

view our menu

refer a friend

social media

FAQ & support

leave feedback

location

account

history

click&collect

order to table

vouchers

loyalty

promo slider

loyalty QR

loyalty

orders

reedeem voucher

start new order

click&collect

table order

select store

table number

view our menu

my account

account details

I prioritised the actions customers were most likely to use regularly, moving supporting content into a secondary level. Checking loyalty points is one example of how this reduced unnecessary navigation.

Before

home

side navigation

loyalty

loyalty QR

Before

home

side bar

loyalty

loyalty QR

wireframe & feedback

wireframe & feedback

I translated the revised structure into a low-fidelity prototype to explore how the new navigation could work in practice. The wireframe was reviewed across marketing, operations and senior stakeholders, helping refine which actions should stay most visible, how secondary content could be simplified, and how strongly the Kaspa’s identity should come through.

“keep ordering easy to reach"

4/5 of the team wanted ordering to feel more prominent, while menu browsing could be surfaced through the home screen.

“make locations easier to find”

The Operations team wanted the app to better highlight store information, i.e. opening hours, contact details and delivery-platform links.

"simplify 2nd navigation"

2 senior marketing team members suggested merging more into account to reduce the number of top-level destinations.

"avoid an overly pink interface"

Senior stakeholders wanted the app to feel recognisably Kaspa’s without relying too heavily on its signature pink.

“keep ordering easy to reach"

4/5 of the team wanted ordering to feel more prominent, while menu browsing could be surfaced through the home screen.

“make locations easier to find”

The Operations team wanted the app to better highlight store information, i.e. opening hours, contact details and delivery-platform links.

"simplify 2nd navigation"

2 senior marketing team members suggested merging more into account to reduce the number of top-level destinations.

"avoid an overly pink interface"

Senior stakeholders wanted the app to feel recognisably Kaspa’s without relying too heavily on its signature pink.

“keep ordering easy to reach"

4/5 of the team wanted ordering to feel more prominent, while menu browsing could be surfaced through the home screen.

“make locations easier to find”

The Operations team wanted the app to better highlight store information, i.e. opening hours, contact details and delivery-platform links.

"avoid an overly pink interface"

Senior stakeholders wanted the app to feel recognisably Kaspa’s without relying too heavily on its signature pink.

"simplify 2nd navigation"

2 senior marketing team members suggested merging more into account to reduce the number of top-level destinations.

Following the feedback, I developed the first visual draft with a restrained black-and-white interface and pink used as an accent, leaving product photography and campaign content to bring in colour.

visual refresh

As the project progressed, stakeholder direction shifted back towards Kaspa’s signature pink-and-black palette, creating a stronger connection with the wider brand. Development limitations also restricted motion and some richer interactions, so the design relied on bold campaign imagery, colour and reusable components to bring energy to the experience.

Colour

Pink

#BC1574

Charcoal

#1B1B1D

Soft pink

#F2CADB

White

#FFFFFF

Surface

#F2F2F2

Cyan

#5EB7C6

Pink drives actions. Charcoal anchors the interface; soft pink and cyan add contrast.

Colour

Pink

#BC1574

Charcoal

#1B1B1D

Soft pink

#F2CADB

White

#FFFFFF

Surface

#F2F2F2

Cyan

#5EB7C6

Pink drives actions. Charcoal anchors the interface; soft pink and cyan add contrast.

Colour

Pink

#BC1574

Charcoal

#1B1B1D

Soft pink

#F2CADB

White

#FFFFFF

Surface

#F2F2F2

Cyan

#5EB7C6

Pink drives actions. Charcoal anchors the interface; soft pink and cyan add contrast.

Typography

FIND YOUR KASPA’S

Bebas Neue · 32

Your favourites

Inter Bold · 20

Honeycomb Waffle

Inter Bold · 16 / 22

A little treat, any time.

Inter Regular · 16 / 22

SELECT THIS STORE

Bebas Neue · 22

HOME ORDER BAG

Inter Bold · 12

Typography

FIND YOUR KASPA’S

Bebas Neue · 32

Your favourites

Inter Bold · 20

Honeycomb Waffle

Inter Bold · 16 / 22

A little treat, any time.

Inter Regular · 16 / 22

SELECT THIS STORE

Bebas Neue · 22

HOME ORDER BAG

Inter Bold · 12

Typography

FIND YOUR KASPA’S

Bebas Neue · 32

Your favourites

Inter Bold · 20

Honeycomb Waffle

Inter Bold · 16 / 22

A little treat, any time.

Inter Regular · 16 / 22

SELECT THIS STORE

Bebas Neue · 22

HOME ORDER BAG

Inter Bold · 12

Mobile Layout

Two-column grid

24px margins · 24px gutter
Equal-width columns adapt to the available space.

UI Spacing

8

12

16

24

32

Shadows

CORNER RADIUS

4px horizontal + vertical offset

Button

Fully rounded

Rewards

12px radius

Inputs

6px radius

Mobile Layout

Two-column grid

24px margins · 24px gutter
Equal-width columns adapt to the available space.

UI Spacing

8

12

16

24

32

Shadows

CORNER RADIUS

4px horizontal + vertical offset

Button

Fully rounded

Rewards

12px radius

Inputs

6px radius

Mobile Layout

Two-column grid

24px margins · 24px gutter
Equal-width columns adapt to the available space.

UI Spacing

8

12

16

24

32

Shadows

CORNER RADIUS

4px horizontal + vertical offset

Button

Fully rounded

Rewards

12px radius

Inputs

6px radius

Buttons & Selection

default

Primary action · 50px height · 180px / full width

Default

Selected

Category chip · 32px height · content width

Favourite · 17 × 17px

Add-on selector · 24 × 24px

Buttons & Selection

default

Primary action · 50px height · 180px / full width

Default

Selected

Category chip · 32px height · content width

Favourite · 17 × 17px

Add-on selector · 24 × 24px

Iconography

general

Location

Account

Rewards

Default icon size · 24 × 24px

Navigation

Empty

HOME

ORDER

BAG

LOCATIONS

ACCOUNT

Home selected

HOME

ORDER

BAG

LOCATIONS

ACCOUNT

Full width · 72px height
labels: white by default · pink when selected

Navigation

Empty

HOME

ORDER

BAG

LOCATIONS

ACCOUNT

Home selected

HOME

ORDER

BAG

LOCATIONS

ACCOUNT

Full width · 72px height
labels: white by default · pink when selected

Navigation

Empty

HOME

ORDER

BAG

LOCATIONS

ACCOUNT

Home selected

HOME

ORDER

BAG

LOCATIONS

ACCOUNT

Full width · 72px height
labels: white by default · pink when selected

Inputs

Empty

e.g. Less ice, more milk

Filled

Extra sauce

Fluid width · 50px height
16px text · 24px horizontal padding

Inputs

Empty

e.g. Less ice, more milk

Filled

Extra sauce

Fluid width · 50px height
16px text · 24px horizontal padding

Iconography

general

Location

Account

Rewards

Default icon size · 24 × 24px

Buttons & Selection

default

Primary action · 50px height · 180px / full width

Default

Selected

Category chip · 32px height · content width

Favourite · 17 × 17px

Add-on selector · 24 × 24px

Iconography

general

Location

Account

Rewards

Default icon size · 24 × 24px

Product Cards

Honeycomb Waffle

£8.95

Salted Caramel Popcorn Waffle

£8.95

Fluid card width · two-column grid
Product name and price follow a consistent hierarchy.
Favourite control shown in default and selected states.

Product Cards

Honeycomb Waffle

£8.95

Popcorn

Waffle

£8.95

Fluid card width · two-column grid
Product name and price follow a consistent hierarchy.
Favourite control shown in default and selected states.

Product Cards

Honeycomb Waffle

£8.95

Popcorn

Waffle

£8.95

Fluid card width · two-column grid
Product name and price follow a consistent hierarchy.
Favourite control shown in default and selected states.

Dividers & Banners

Fluid width · proportional height
Available ratios: 1:1 · 4:3 · 2:1
CTA button: 180 × 50px

BUY GIFT VOUCHERS

Two interchangeable divider styles
Scale proportionally with the available width

Dividers & Banners

Fluid width · proportional height
Available ratios: 1:1 · 4:3 · 2:1
CTA button: 180 × 50px

BUY GIFT VOUCHERS

Two interchangeable divider styles
Scale proportionally with the available width

Dividers & Banners

Fluid width · proportional height
Available ratios: 1:1 · 4:3 · 2:1
CTA button: 180 × 50px

BUY GIFT VOUCHERS

Two interchangeable divider styles
Scale proportionally with the available width

The finished system combined a broader colour palette with consistent navigation, buttons, cards, forms and product tiles, creating a flexible interface that could adapt to different products, promotions and seasonal campaigns.

going live

I supported the app rollout with a range of digital assets, helping carry the refreshed visual direction beyond the product itself. This included promotional materials used across later app campaigns to attract new users and keep the app visible across key touchpoints.

outcome

Looking back, if I had the opportunity to develop the app further, I’d introduce user research and product analytics much earlier — understanding which features customers use most, gathering direct feedback and testing key journeys before further iteration. With greater technical flexibility, I’d also explore richer interactions and more flexible layouts.


For now, the app continues to support ordering, loyalty and customer acquisition at scale, with strong ongoing usage and a high share of orders coming from new users.

115k

active app users

115k

active

app users

1.2m

yearly app order value

1.2m

yearly app

order value

56%

orders from new users

56%

of orders from

new users