Challenge
Pazzion, an established Singapore fashion brand, was extending into dining with Pazzion Café at Takashimaya — but the café had no online home and no version of the brand adapted for an F&B context.
Case Study
Web · Hospitality · UX/UI Design
PAZZION CAFÉ
Fashion Brand · Café Website
Designed a responsive café website that brings Pazzion's retail and dining experience together, helping customers discover the café, explore the menu, find store information, and make reservations with ease.
Project Snapshot
Solution
A responsive café website that adapts Pazzion's retail identity for dining, with warm imagery for the concept and the menu, store information, and reservations always within reach.
Responsibilities
- Brand & product design lead
- Visual identity
- Responsive website
- Content & imagery direction
Outcome
Pazzion Café gained a digital home that extends the brand into dining, making it easy for customers to explore the menu, find the café, and reserve a table within the same Pazzion experience.
Context
A café with no digital home
Pazzion had a loyal in-person following but no online presence — no menu, no hours, no way to feel the space before visiting.
I designed the brand expression and website together so the digital experience felt like an extension of the room itself.
Approach
Warmth, appetite, and ease
Generous imagery and a soft editorial layout carried the café's atmosphere, while the practical details — menu, hours, location — were always one glance away.
The responsive design kept the experience inviting on the phones most visitors would actually use while standing outside deciding whether to come in.
Outcome
A brand people want to visit
The site gave Pazzion a confident identity and cut down the repetitive calls about hours and menu items, letting the team focus on hospitality instead of logistics.
Project Context
Pazzion Café is the F&B extension of Pazzion, an established Singapore fashion brand known for women's footwear. It sits within Pazzion's retail space at Takashimaya Shopping Centre on Orchard Road, and the website brings shopping and dining together as one continuous brand experience.
Why this project mattered
The website let Pazzion present the café as a natural extension of its retail experience — one place where customers could understand the offering, see the space, and plan a visit within the same brand ecosystem.
Who it's for
Pazzion shoppers and Orchard Road visitors deciding whether to stop in to dine, plus customers browsing the menu, store information, and reservations — most of them on a phone.
Business goals
- Extend the Pazzion brand into dining
- Give the café a clear digital home
- Make the menu, location, and reservations easy to find
- Keep Pazzion's identity consistent across retail and café
Market context
Most café sites either lean purely on food appeal or stand apart from any parent brand. Pazzion Café's opportunity was to carry an established fashion identity into an F&B setting, so dining felt like part of the same brand world as the store.
Problem Statement
How might we extend Pazzion's established fashion identity into a café experience online, so customers can understand the offering, browse the menu, and plan a visit with ease?
01
User Problems
- Unclear that Pazzion now offered a café
- No easy way to browse the café menu online
- Hard to find the café's location and hours
- No simple path to make a reservation
02
Business Problems
- The café offering wasn't represented online
- Brand identity not yet adapted for dining
- Retail and café experiences felt disconnected
- Repetitive enquiries about menu and location
03
Technical Constraints
- Must stay consistent with Pazzion's brand system
- Easy for the team to update menu and details
- Reliable and fast on mobile
- Lightweight, straightforward stack
04
Product Constraints
- Adapt the existing Pazzion identity for a café context
- Photography-led, using available café imagery
- Focus on menu, store info, and reservations
- Scope kept to essentials, no online ordering system
Goals
01
User Goals
- Understand the café offering at a glanceCafé concept clear on the homepage
- Browse the menu easilyMenu reachable within one tap on mobile
- Find store info and make a reservationLocation, hours, and booking easy to reach
02
Business Goals
- Extend the Pazzion brand into diningCafé presented within the Pazzion identity
- Reduce repetitive menu and location enquiriesKey details available online
03
Product Goals
- Adapt the brand for a café contextConsistent identity across retail and café
- Keep it easy to maintainThe team can update menu and details without a developer
Success Metrics
fewer
Menu/location enquiries
vs. before launch
< 2s
Mobile load time
on 4G
key page
Menu page
core content
self-serve
Content updates
no dev needed
Design Strategy
Strategy centred on carrying Pazzion's established identity into a dining context: make the café offering clear, keep the menu and store information easy to reach, and let brand expression and practical usability share equal weight.
01
Key Insights
- The café is an extension of a known brandCarry Pazzion's identity into the café experience
- Customers want to understand the offering fastLead with the café concept and warm food imagery
- Practical decisions happen on mobileKeep menu, location, and reservations one tap away
02
Design Principles
One brand, two experiences
Retail and café should feel like the same Pazzion
Basics never buried
Menu, location, and booking decide the visit
Brand and usability in balance
Expression shouldn't get in the way of practicality
03
Prioritization Framework
With a focused scope, we prioritized what helped a customer understand the café and plan a visit, deferring anything that didn't.
NowBrand adaptation, hero imagery & essentialsConcept plus menu and location drove visits
NextFull menu & story pagesDeepened interest once attention was earned
LaterEvents & seasonal contentNice to have, easy for the team to add later
04
Success Criteria
- A first-time visitor understands the café offering at a glance
- Menu, location, and reservations are reachable in a single tap on mobile
- The site feels unmistakably like Pazzion
- The team can update details without a developer
Design Process
A loop where brand adaptation and product grew together, each round checked against Pazzion's existing identity and how a café customer would actually use the site.
- Step 01
Discover
Studied Pazzion's existing brand and the café concept, and the questions customers asked about the offering.
- Reviewed Pazzion's retail identity and visual language
- Learned how the café fits within the Takashimaya store
- Listed the common questions about menu and location
- Gathered imagery that matched the café concept
- Step 02
Define
Framed the goal as a café website that extends Pazzion's identity and answers the practical basics.
- Defined how the brand should feel in a dining context
- Named the must-answer questions: menu, location, reservations
- Set mobile-first as the primary context of use
- Agreed brand expression and utility carry equal weight
- Step 03
Ideate
Explored how Pazzion's identity translates to a café site so retail and dining feel like one brand.
- Adapted type, palette, and layout from the Pazzion system
- Explored generous, imagery-led layouts for the concept
- Tested how practical details stay one glance away
- Aligned the café direction with the retail brand
- Step 04
Prototype
Built the site with real photography and the adapted identity to see whether the brand carried across.
- Applied the Pazzion system across the key pages
- Laid out imagery-forward sections for the café concept
- Kept menu, location, and reservations always within reach
- Optimized every layout for mobile first
- Step 05
Test
Shared the site to check it felt like Pazzion and answered customers' questions.
- Gathered reactions on whether it felt like the brand
- Checked people could find the menu and location instantly
- Probed whether the café concept came through clearly
- Watched real mobile browsing behavior
- Step 06
Iterate
Refined imagery and details, then confirmed the essentials were easy to find.
- Tuned photography selection and pacing
- Clarified how the menu and store info are presented
- Re-checked the feel against the Pazzion brand
- Shipped with the practical basics one tap away
Final Solution
The finished site makes Pazzion Café feel like a natural extension of the brand, then makes the offering easy to act on. Three screens tell that story: the concept, the menu, and the visit.
01
Homepage Atmosphere
Design Objective
Introduce the café as part of the Pazzion brand and make the offering clear at a glance.
Key UX Decisions
Full-bleed, warm photography and unhurried pacing lead the page, with Pazzion's identity carried through so the café feels like the same brand as the store.
Outcome
First-time visitors could quickly grasp the café concept and its connection to Pazzion.
02
Menu
Design Objective
Let customers explore the café's food and drink offering with ease.
Key UX Decisions
Dishes are shown with real photography and honest descriptions, grouped the way people actually order, so browsing the menu is part of the experience.
Outcome
The menu became a clear, central part of the site for customers exploring the café.
03
Plan a Visit
Design Objective
Turn interest into a visit by making store information and reservations easy to find.
Key UX Decisions
Hours, location, map, and booking sit together one tap away, phrased for someone visiting the café for the first time.
Outcome
Customers had a clear, direct path from the menu to finding the café and reserving a table.
Results & Impact
Leading with atmosphere and removing every logistical excuse turned a static listing into a reason to visit — and freed staff from repetitive phone calls.
Business Outcomes
User Outcomes
- Full-bleed photography sequenced to build appetite first
- Intent-based split between planning a visit and ordering ahead
- Menu presented as craving-building content, not a plain list
- A self-serve content model so the café keeps the site current
- 01For hospitality, appetite is the conversion — emotion precedes logistics.
- 02Splitting by intent serves dine-in and order-ahead visitors without compromise.
- 03Handing content control to the café keeps the experience alive post-launch.
- Hours/menu callsPre-launch-50%
- Mobile load timeSlow on 4G< 2s
- Menu page viewsBuriedMost-visited
- Content updatesDev-dependentSelf-serve
Reflection
This project reminded me that good design isn't just about creating a polished experience. It's about understanding what the business needs and making things genuinely easier for customers. Balancing Pazzion's established identity with the practical needs of a café experience helped keep every design decision purposeful.
- Leading with atmosphere and appetite matched how people actually decide where to eat.
- Splitting the flow by intent kept the site useful for both planners and orderers.
- Handing the café a self-serve content model kept the site alive after launch.
- I'd involve the café staff in a content-editing test before finalizing the CMS structure.
- I'd shoot a small, consistent photo library up front instead of sourcing piecemeal.
- I'd add lightweight analytics from day one to confirm the drop in phone calls.
Challenges & Trade-offs
Emotion vs. utility
Beautiful photography and quick access to hours pull in different directions. The trade-off was sequence — mood first, logistics one tap away — rather than forcing both to compete in the same space.
Ambition vs. maintainability
I wanted a richly art-directed site, but the café had to maintain it alone. I scaled back some bespoke touches in favor of a simple content model they could actually keep current.
- 01Design success is measured in the client's outcomes, not the portfolio shot.
- 02For local business, speed and mobile clarity matter more than visual maximalism.
- 03The best solution is one the client can sustain without you.
- Online ordering and pickup integration as the café's demand grows.
- A simple loyalty or events feature to bring regulars back.
- Seasonal menu theming the staff can trigger themselves.
