Canteen App
This project was a hospital meal-ordering application built by ClapHere. Developed to simplify the process of ordering meals for hospital staff, patients and visitors. The app offered features for browsing menus, customising orders, and managing delivery or pickup options directly within hospital settings.
Deliverable:
Mobile App, Website
Service:
UXUI, Design system
Tool:
Figma, Adobe Creative Suite
When:
Developed in 2023
objectives
To redesign UI and improve the experience of ordering meals in hospitals. The focus was on delivering an efficient and seamless interface for selecting restaurants, viewing serving menu list, placing orders, and tracking deliveries.
CONTRIBUTIONS
[Two Designers]
Improve user flows and wireframes to optimise the meal-ordering process.
Simplified interactions for restaurant selection, address input, and order management.
Redesign UI for a clean look of mobile applications and for the Landing page.
Refined visuals and workflows to ensure a smooth user experience across all stages of ordering.
DESIGN PROCESS
UX Audit
I started the project by analysing and evaluating the user experience and user's pain points from User Journey and workflows.
Wireframing
Developed new user flows(from current design page) for meal ordering, delivery, and payment processes.
UI Design
Delivered polished designs focusing on intuitive navigation and a visually clean interface.
FEATURES
Restaurant Selection
Users could browse hospital-affiliated canteen and their menus.
Delivery Management
Flexible delivery address settings and order tracking.
Order Confirmation
Real-time updates on order status with clear payment and delivery details.
Payment Integration
Supported multiple payment methods for user convenience.
The Landing Page
Revising design
The previous version had a highly complex design and heavy graphics, which posed challenges for the developers, requiring extensive time and effort to implement. To address this, I was tasked with redefining the landing page, focusing on simplifying the design while maintaining strong visual and cohesive with the mobile applications.
The new design reduced complexity by optimising layout, section graphics for faster development process and add a colour for a smoother and a better transitions while scrolling through the page without compromising the experience and overall looks.
KEY TAKEAWAYS
User Flow Optimisation: Enhanced the meal-ordering experience by refining flows for browsing menus, placing orders, and tracking deliveries.
Simplifying Complex Interactions: Designed intuitive interfaces to reduce steps and improve the process for restaurant selection, address input, and delivery management.
Improved Visual Design: Focused on creating a clean and functional design for both mobile applications and the landing page, balancing aesthetics with usability.
Adaptability for Healthcare Settings: Developed an interface tailored to hospital workflows, ensuring the system supported both staff and visitors seamlessly.
Continuous Improvement: Iterated on the design based on user feedback, refining features like order updates, notifications, and menu display for better engagement.