A Responsive Web Application
Tiffin Service Management
UI/UX Case Study
PROJECT OVERVIEW
MealMaster CRM is a responsive web app, to revolutionize tiffin service management by addressing challenges like manual record-keeping and lack of tracking and analytics tools. MealMaster CRM aims to streamline customer data organization, enhance delivery tracking, and provide valuable business insights.
Team
- 3 Designers
- 4 Developers
Duration
- 12 Weeks
My Role
- UI/UX Designer
DESIGN PROCESS
The MealMaster design process started with research to identify user needs and pain points. We then brainstormed features, created wireframes, and developed prototypes for user testing. Finally, we crafted the UI design and worked closely with developers to ensure a seamless, user-friendly product.
USER RESEARCH
We conducted a User Surveys to gather insights on current challenges and preferences. This feedback helped us design MealMasterCRM to address the real needs of tiffin service providers effectively.
User’s Age
54.5%
of the user were of age of 31-35 and 27.3% were of age 36-40
Customers
45.5%
of the user had near 80 customers and 29.3% had near 145 customers
Excel
89.3%
of the user were using Excel to and 21.3% were using Pen-Paper
Offers
44.2%
of the users use Instagram to promote their available discounts
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 questions with the answers that we gathered.
Question:
What challenges do you face in keeping track of customer gains, losses, and active subscriptions?
Response:
“Managing customer gains and losses is challenging, especially because I’ve seen a significant increase in customers recently. Keeping track of active subscriptions and ensuring timely deliveries is a struggle!”
Question:
How do you currently manage your tiffin service operations, including customer subscriptions, payments, and customer data?
Response:
“I currently manage everything manually using Excel. It’s time-consuming to track customer subscriptions, payments, and changes in customer numbers.”
Question:
What are the main difficulties you encounter in managing and tracking tiffin deliveries from preparation to customer receipt?
Response:
“Tracking tiffin deliveries is difficult because it’s all manual. There’s no synchronized system for managing orders from preparation to delivery, which leads to confusion and occasional delays.”
Question:
How do you currently handle the process of sharing offers or updates about your tiffin service on social media platforms like Instagram, or WhatsApp?
Response:
“I use Instagram and Facebook to share our tiffin service offers. It’s a hassle because I have to post the same information twice on both platforms, and sometimes also share updates through WhatsApp to reach more customers.”
COMPETITOR ANALYSIS
Since we had no direct competitors, we analyzed other CRM systems to identify strengths and weaknesses. This revealed a significant market opportunity for us to differentiate and improve our offering.
USER PERSONA & STORIES
01. Tiffin Service Owner
02. Driver
CARD SORTING
To ensure an intuitive and user-friendly interface for MealMasterCRM, our design team conducted a card sorting exercise. Three designers collaborated, each focusing on one of the platform’s main features.
After gathering insights from three different perspectives, we meticulously analyzed the results. The process allowed us to identify the most effective structure, ultimately selecting the arrangement that provided the best user experience. This approach ensured that MealMasterCRM’s navigation and information architecture are both logical and aligned with users’ needs.
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
After conducting market and user research, along with card sorting and task flow analysis, we developed a streamlined user flow for MealMasterCRM. This approach optimized navigation and task management, significantly enhancing the user experience for tiffin service providers.
WIREFRAMES
We decided to create wireframes to visually map out the app’s structure, layout, and user navigation flow.
1. Analytic Dashboard
2. Customer Record Management
3. Employed Driver’s Record
4. Schedule Delivery
5. Social Media Integration
6. Meal Settings
7. Driver’s Dashboard – Mobile View
USABILITY TESTING
We conducted usability testing with real users to evaluate the main features of MealMasterCRM. The goal was to identify any issues and gather insights to enhance the user experience.
Through this testing, we discovered areas for improvement and made crucial updates, ensuring a more intuitive and effective interface that better meets our users’ needs.
Finding01
During usability testing, it was discovered that the form for adding new customers in MealMasterCRM lacked a section for capturing diet preferences. This omission led to confusion and potential issues in catering to customers with specific dietary needs, such as allergies or dietary restrictions.
Before
The form only collected basic customer information without addressing dietary preferences. Users had no way to specify whether a customer was vegetarian, non-vegetarian, or vegan, nor could they provide additional details about allergies or special diet requirements.
After
The form was updated to include a compulsory drop-down menu for selecting dietary preferences (Vegetarian, Non-Vegetarian, Vegan) and an optional text area for additional dietary notes. This enhancement ensures that meal plans can be tailored to individual customer needs, improving overall service quality and customer satisfaction.
Finding02
Usability testing revealed that users found the Social Media Integration section confusing due to the absence of visible usernames associated with connected accounts. This lack of clarity made it difficult for users to identify which social media profiles were linked to their MealMasterCRM account.
Before
The Social Media Integration section only displayed the social media platform icons without showing the connected usernames, leading to user confusion and difficulty in managing multiple accounts.
After
We updated the interface to display the connected usernames alongside the social media platform icons. This enhancement provides users with clear and immediate identification of linked accounts, improving overall usability and reducing confusion.
BRANDING & UI COMPONENTS
MealMaster’s branding embodies simplicity, efficiency, and reliability. With a modern design, clean lines, and a primary shade of purple, it reflects professionalism and trust. Icons represent each feature for intuitive navigation, while a touch of red and green signifies errors and successes, ensuring clarity. MealMaster’s brand appeals to tiffin service providers looking for seamless customer relationship management and growth, aligning with their commitment to quality in their services.
PROTOTYPING
The survey indicated a preference for digital solutions over manual record-keeping, a strong need for delivery tracking systems, and the importance of analytics tools for understanding customer trends and managing services effectively.
1. Customer Management
It allows tiffin service providers to maintain detailed records of each customer. It includes information like contact details, dietary preferences, order history, and payment records. Providers can easily add new customers, edit existing information, and disable accounts when needed.
2. Employed Driver Management
It streamlines the process of adding and managing delivery drivers. Tiffin service providers can easily hire new drivers, add their information, and assign unique tokens for deliveries. These tokens help track and verify deliveries, ensuring that each order reaches the correct customer.
3. Real-time Delivery Tracking
This allows tiffin service providers to monitor deliveries as they happen. Using GPS integration, providers can track drivers’ locations in real-time, ensuring timely deliveries and providing customers with accurate updates on their orders.
4. Schedule Delivery
This enables tiffin service providers to efficiently schedule deliveries by assigning specific drivers to various addresses. Providers can match drivers to routes and delivery times, ensuring that each customer receives their order on time.
5. Social Media Sharing
This allows tiffin service providers to effortlessly promote their business on social media platforms. Providers can share menu updates, special offers, and customer reviews directly from the CRM to popular social channels. This feature helps increase brand visibility, attract new customers, and engage with the community, all from within the platform.
6. Meal Plan Settings
This allows tiffin service providers to customize and assign different meal plans to individual customers. Providers can create various meal plans based on dietary preferences, portion sizes, and delivery frequency, then easily assign these plans to specific customers. This feature enables personalized service, ensuring that each customer receives meals tailored to their needs and preferences.
7. Driver Dashboard
a dedicated interface for drivers, allowing them to navigate to all assigned delivery addresses efficiently. Using the token provided by the tiffin service provider, drivers can access their delivery route, view customer details, and automatically get directions to each address. This feature simplifies navigation, optimizes delivery routes, and ensures timely and accurate deliveries.
LEARNING & TAKEAWAYS
Cross-functional Team/ Collaboration
Teamwork was a cornerstone of the MealMaster project, fostering creativity and efficiency. To strengthen collaboration, we engaged in team-building activities, including fun and strategic games that boosted camaraderie and problem-solving skills. Regular stand-up sessions between teams allowed us to share progress, address challenges, and align on goals effectively.
Understanding User Needs is Crucial
Conducting user research through surveys, interviews, and competitor analysis was vital to uncovering the pain points of tiffin service providers. This research helped us identify the core functionalities required in MealMaster CRM – efficient customer data management, delivery tracking, and valuable business insights. By focusing on user needs, we ensured the product addressed their challenges and streamlined their operations.
Empathy Leads to Better Design
Putting ourselves in the shoes of tiffin service providers and delivery personnel enabled us to design a product that genuinely addresses their pain points. This empathy-driven approach ensures that our solutions are user-centric, fostering greater user satisfaction and product adoption.
Iterative Design Leads to Better Products
The iterative design process, encompassing user flow development, wireframing, usability testing, and UI design, allowed for continuous improvement. Usability testing provided valuable insights that helped us refine the user experience and address potential issues before launch. This iterative approach ensured the final product was not only functional but also intuitive and user-friendly for tiffin service providers.
Usability Testing Uncovers Hidden Issues
Usability testing played a critical role in identifying potential roadblocks that users might encounter while interacting with the app. Findings like the need for a dietary preference field and a clear username display demonstrate the value of user testing. By addressing these issues early on, we ensured a smoother and more intuitive user experience for tiffin service providers using MealMaster CRM.