Overview

MealMaster CRM is a web app designed for tiffin service providers to streamline their operations. The platform allows users to efficiently manage orders, track deliveries, and engage with customers through an intuitive interface. Featuring advanced analytics, automated reminders, and seamless integration with various tools, MealMasterCRM enhances business efficiency and customer satisfaction, making it easier for small business owners to oversee their service and drive growth.

My Role
Design Lead
User Researcher
UX Designer
UI Designer
Deliverables
User Interviews
Component Library
High Fidelity Designs
Marketing Assets
Team
3 Designers
4 Developers
1 Project Manager
Problems
  • Manual record-keeping hinders organization and growth.
  • No tracking system for monitoring deliveries.
  • Lack of analytics tools to track customer trends.
  • Difficult to manage cancellations, new subscriptions, and dietary preferences.
Solution

MealMasterCRM is a responsive web app designed to streamline record-keeping, enable efficient delivery tracking, and provide valuable analytics tools for tiffin service owners. Our extensive research ensures it meets all user needs, enhancing operational efficiency and offering insights for better decision-making.

Design Process

Research

User Survey

We conducted a user survey from 11 tiffin business owners to gather insights on current challenges and preferences. Here are some results:

See the complete user survey here:

Click Here

Key Findings

92% of the users prefer a digital solution over manual record-keeping.

83% of the users find it difficult to monitor deliveries without a dedicated tracking system.

78% of the users expressed the need for analytics to understand customer trends better.

User Interviews

We conducted user interviews to gain a deep understanding of our audience and gather insights that helped us develop a product that effectively addressed their needs and challenges.
Here are some of the most important findings from the user interviews.

Manual Operations Are Time-Consuming: The user currently manages customer subscriptions, payments, and data through Excel, which is inefficient and leads to a lot of time spent on manual tracking.

Difficulty in Tracking Customer Activity: Managing customer gains, losses, and active subscriptions is a major challenge, especially with the recent increase in customers, leading to struggles in keeping track of everything.

Lack of an Organized Delivery System: The absence of a synchronized system for managing tiffin deliveries, from preparation to customer receipt, results in confusion and delays.

Inefficient Social Media Management: The user faces inefficiencies in sharing offers and updates across multiple social media platforms, as they need to manually post the same content on Instagram, Facebook, and WhatsApp.

Analysis

Competitive Analysis

Since we had no direct competitors in the tiffin service industry, we analyzed broader CRM systems to identify strengths and weaknesses. This revealed a significant market opportunity to differentiate MealMaster CRM by tailoring it specifically to the unique needs of small food businesses. This approach allowed us to refine features like delivery tracking and customer management, making our offering more specialized and user-friendly.

User Persona & User Stories

Creating personas was essential to ensure our design decisions were deeply rooted in the real needs and behaviours of our target users, allowing us to create solutions that truly address their challenges and enhance their experience.

Tiffin Owner Persona & User Stories
Driver Persona & User Stories

Card Sorting

We invited 8 participants, a mix of real and potential users, to take part in the card-sorting exercise. This group size provided a diverse range of perspectives while allowing us to identify consistent patterns in how users think about the platform’s features.

Information Architecture

Now that the card sorting was complete and we gained valuable insights into users’ mental models, we decided to create a clear and intuitive information architecture for MealMasterCRM. This allowed us to organize features and content in a way that aligns with user expectations, ensuring a seamless navigation experience throughout the platform.

User Flow

With a clear structure in place, we mapped out how users would navigate through the platform to accomplish specific tasks. These user flows ensured that the journey through MealMasterCRM was efficient and intuitive, reflecting the mental models identified during the card sorting exercise.

Design & Test

Wireframes

After finalizing the user flows, we moved on to creating mobile wireframes. Since MealMaster CRM is a responsive platform, we followed a mobile-first design approach to ensure the most essential features were optimized for smaller screens. This strategy allowed us to prioritize simplicity and focus on the core tasks, ensuring that the user experience on mobile devices remained smooth and uncluttered.

By starting with mobile, we ensured that the design was scalable, adaptable, and accessible, without sacrificing functionality.

Once the mobile wireframes were complete, we scaled the design up for desktop wireframes, making sure the layout adapted seamlessly to larger screens. This approach helped us maintain consistency across devices while taking advantage of the additional screen space on desktops for more advanced features and enhanced usability.

Usability Testing

We conducted usability testing with real users to evaluate the main features of MealMaster CRM. The goal was to identify any issues and gather insights to enhance the user experience.

Usability Testing Process:
  • Participants: 5
  • Method: Task-based testing with think-aloud protocol
  • Duration: 15-20 minute sessions per participant
  • Key metrics: Task completion rate, time on task, error rate, and user satisfaction (measured by SEQ)
Usability Testing Findings and Improvements
1. Missing Diet Preferences Section in Customer Form

2/5 people pointed out that the form for adding new customers didn’t have a section for diet preferences. This caused confusion and could lead to problems when catering to customers with specific dietary needs or allergies.

Before

The form only collected basic customer info and didn’t include options for dietary preferences. Users couldn’t specify if a customer was vegetarian, non-vegetarian, vegan, or note any allergies or special diet needs.

After

The form was updated with an optional drop-down for dietary preferences (Vegetarian, Non-Vegetarian, Vegan) and a text area for additional notes. This helps tailor meal plans to customer needs, improving service quality and satisfaction.

2. Confusion in Social Media Integration Due to Missing Usernames

3 out of 5 people found the Social Media Integration section confusing because usernames for connected accounts weren’t visible. This made it hard for users to identify which social media profiles were linked to their MealMasterCRM account.

Before

The Social Media Integration section only showed platform icons, not usernames, causing confusion and making it hard to manage multiple accounts.

After

We updated the interface to show connected usernames next to the social media icons. This makes it easier for users to identify linked accounts, improving usability and reducing confusion.

Visual Design

Branding & UI Kit

Typeface
Colours
Logo
UI Kit

High Fidelity Designs

Tiffin Owners
Add New Customers

The Add New Customers feature lets tiffin owners enter customer details like name, meal plan, billing cycle, and dietary preferences. Once submitted, the new customer record is added to the portal for easy management.

Add New Drivers

The Add New Driver feature allows tiffin owners to enter and save details of hired drivers, such as name, contact, email, and photo, in the portal. Owners can also assign a token so drivers can log in and easily see their upcoming deliveries.

Schedule Deliveries

The Schedule Deliveries feature allows tiffin owners to assign delivery drivers to customers. Owners can schedule single or multiple deliveries for drivers, making it easy to manage the delivery process.

Track Driver

The Track Driver feature allows tiffin owners to track their drivers in real time, enabling them to see the driver’s current location.

Meal Plan

The Meal Plans feature allows tiffin owners to add new meal plans by entering details like name, description, and price. They can also edit or delete existing meal plans as needed.

Driver Screens
Driver Dashboard And Delivery Confirmation

The driver logs in with a token from the tiffin owner, views assigned deliveries, and navigates to each location. After delivering, he takes a photo to confirm completion and continues to the next delivery, while the tiffin business owner tracks the driver’s progress in real-time.

Learnings & Takeaways

User Feedback During Waiting Periods

I learned that providing meaningful information during potentially frustrating moments, like video uploads, significantly improves user satisfaction. This reinforces the importance of keeping users engaged and informed throughout all processes, even when the app is performing background tasks.

Clarity in UI Elements

The confusion around icon functionality highlighted the need for clear, unambiguous UI elements. I found that while minimalist design can be aesthetically pleasing, it shouldn’t come at the cost of user understanding. Balancing visual simplicity with clear labeling or tooltips is crucial for intuitive navigation.

UX Design Extends Beyond the Screen

When users struggled to keep track of their reps away from their phones, it hit us – good UX isn’t just about what’s on the screen. We realized we needed to think about how people actually use the app in real life, not just in perfect conditions. This led us to explore options like voice feedback, showing that sometimes the best solution isn’t visual at all. It was a wake-up call to design for the messy, unpredictable ways people might use our app, and to be flexible in how we deliver a smooth experience, whether they’re looking at the screen or not.

Overview
Research
Analysis
Wireframing & Testiing
Visual Design
Marketing Assets
Learnings