Samuel M
UI/UX & Product Designer | Mobile Apps & High-Converting Web
CJ’s Mobile App — Guest Experience & Direct Ordering Concept
Role: Lead Product Designer & Digital Strategist
Industry: Hospitality & Travel Tech
Deliverables: UX Research, Mobile Wireframes, UI Design System, Interactive Figma Prototype
Executive Summary
CJ’s is a premier dining establishment known for exceptional in-person hospitality across East Africa. However, growing customer reliance on third-party food delivery platforms creates two core challenges: high commission fees eating into operator margins, and diluted brand control over the digital guest experience.
This case study presents a brand-owned, guest-first mobile application prototype designed to streamline direct takeout/delivery orders, boost customer retention through smart reordering, and eliminate conversion friction.
The Challenge & Strategy
Key Pain Points Identified
Upfront Login Barriers: Traditional restaurant apps force account creation before users can explore the menu, leading to immediate drop-offs.
Third-Party Dependency: Relying on food delivery aggregators cuts into unit margins and limits direct customer relationship management.
Complex Customization: Recreating custom dining preferences (e.g., specific coffee brews, side substitutions) digitally often feels cumbersome.
Strategic Objective
Bridge my background in Sustainable Tourism & Hospitality Management with UI/UX product design to build a digital touchpoint that honors CJ’s hospitality standards while maximizing direct-to-consumer digital revenue.
Key Solution Highlights
1. Frictionless Guest Browsing
Designed a zero-friction entry path allowing guests to explore daily chef specials and full menus instantly without forced account setup.
Implemented quick category navigation and predictive search for high-frequency orders.
2. One-Tap Smart Reordering
Created a personalized "Favorites & Recents" hub enabling returning guests to reorder their preferred meal combinations in under 15 seconds.
Integrated clear meal customization drawers to streamline special requests and add-ons seamlessly.
3. Direct-to-Consumer Ordering Engine
Built a dedicated direct-ordering checkout path that bypasses third-party aggregator commissions, increasing net profitability per digital order.
Included live order-tracking mockups and transparent delivery/pickup options to build guest trust.
Design System & Prototyping
Tooling: Designed and prototyped entirely in Figma using smart-animated component variants and auto-layout systems.
Visual Identity: Clean, high-contrast visual architecture tailored to showcase food photography, using warm earth tones that align with CJ's physical restaurant ambiance.
Results & Business Impact
Conversion Optimization: Reduced the steps required to complete an order from 7 screens down to 3.
Margin Preservation: Created a scalable blueprint for hospitality brands to reclaim direct customer data and protect operating margins.
2
0
8
UrbanFit — E-Commerce Storefront & Mobile Shopping App
Designed a sleek, high-converting digital storefront and mobile shopping experience for UrbanFit, an urban clothing and activewear brand. Focused on high-impact editorial layouts, dynamic sizing guides, and a streamlined, frictionless checkout flow built for mobile shoppers.
Key Highlights:
Bold, modern catalog layouts featuring interactive product filter overlays and quick-view cards.
Interactive size recommendation modal to reduce cart abandonment and product returns.
Seamless mobile cart and single-page checkout prototype crafted in Figma Tools:
Figma
0
72
Beadique — Artisan Jewelry & E-Commerce Mobile App
Designed an elegant, mobile-first e-commerce experience for Beadique, an artisan hand-crafted jewelry brand. Focused on high-end visual storytelling, minimalist product galleries, and a seamless checkout flow tailored for mobile shoppers.
Key Highlights:
Minimalist product discovery layout with high-resolution imagery cards.
Interactive custom order flow allowing users to pick bead materials and sizes.
Frictionless mobile cart and single-page checkout prototype built in Figma.
Tools:
Figma
0
68
Discover Hidden Wonders — Mobile Travel & Discovery Experience
Designed a mobile-first travel discovery application for exploring off-the-beaten-path destinations. Focused on high-impact visual imagery, intuitive search filtering, and seamless itinerary planning for modern travelers.
Key Highlights:
Mobile-first responsive layouts crafted in Figma.
Custom trip-planning flow with integrated map previews and digital pass views.
Interactive high-fidelity prototypes for user testing and dev handoff.
Tools:
Figma
0
100