Awards

Case Study

Emerald Beauty

Overview of a web design project

Project Overview

This project focused on creating a user-friendly online beauty salon platform for customers in the UAE, available in two languages. It includes a website for people to learn about the services and a mobile app for customers to book appointments easily. There’s also a special interface for beauty service providers to manage their schedules and services.It features easy booking, secure payment options, and tools for service providers to keep track of their availability. Overall, the aim is to modernize the way people book beauty appointments while ensuring a trustworthy and efficient experience for everyone involved.

Key Objectives

The core goal of this project was to create a complete ecosystem for online salon bookings that serves both end-users and freelance beauty professionals. The platform had to support bilingual content, with English as the primary and Arabic as the secondary language, ensuring inclusivity and regional reach. Key objectives included the development of a modern and mobile-first user interface, the ability for customers to browse and book services with ease, a secure post-service payment system, and a comprehensive admin dashboard for monitoring content and activities. Additionally, the system needed to enable freelancers to showcase their portfolios, manage appointments, and operate under the approval of the platform’s administrative team.
emerald1

Project Management

The project used Agile methodology, with weekly sprints, task reviews, and feedback loops. A cross-functional team—project managers, designers, and developers—collaborated effectively. Design workflows were shared via Figma, and version control was managed in GitHub, ensuring transparency and alignment with client expectations throughout the project..
emerald2

Technologies Used

To bring this project to life, we utilized a full stack of modern technologies. The landing page was developed using React.js to ensure a responsive and visually appealing web presence. The mobile application for both iOS and Android was built using Flutter, allowing for a unified codebase and consistent user experience. On the backend, we implemented Node.js with Express.js to manage server-side operations, while MongoDB served as our primary database for storing user data, bookings, and content. Stripe was integrated for secure payment processing, including a post-service delayed charge mechanism. Firebase was employed for authentication and OTP-based verification, while Firebase Cloud Messaging was used to handle real-time push notifications. The admin panel was built using React.js, providing a comprehensive content management system with moderation capabilities. Hosting was deployed via AWS and Firebase, offering speed, scalability, and reliability.
emerald3

Challenges

Several challenges arose during development, notably implementing bilingual support while ensuring a consistent user interface for both left-to-right and right-to-left text. Real-time booking management was tricky, especially in preventing double bookings and confirming freelancer availability. Integrating a post-service payment model added complexity, as most payment gateways focus on immediate charges. A strict moderation layer for freelancer content, including service descriptions and media uploads, was essential as well. Additionally, maintaining performance and responsiveness across both web and mobile platforms presented a significant technical hurdle.
emerald4

Solutions

Each challenge was addressed with effective solutions. The platform features internationalization for easy switching between English and Arabic, with automatic layout adjustments. A time-slot locking system using WebSocket communication manages real-time bookings, temporarily locking slots during the booking process. We customized Stripe’s API to capture payments only after service completion, confirmed via a backend status update. An admin moderation dashboard allows for the approval or rejection of freelancer portfolios and services. Flutter was selected for mobile app development to use a single codebase across platforms, minimizing development time and bugs. Geo-location filters ensure users can only book freelancers in their area.
emerald5

Results

The final result was a polished platform that met client expectations. The landing page launched with integrated app download links. The Flutter-based apps offered a smooth experience for customers and freelancers, allowing easy browsing, booking, and secure payments. Freelancers could manage availability and showcase portfolios, while the post-service payment feature enhanced user trust. Admins maintained control through a robust dashboard. Beta testing showed over 95% user satisfaction, with no issues reported. The platform was optimized for performance and ready for scaling.

Conclusion

This project successfully delivers a customized beauty salon booking platform, combining elegant design with a customer-centric approach. Features such as bilingual support, secure payments, and real-time availability ensure smooth operations for users, freelancers, and administrators. The results validate the initial vision and set the stage for future updates, vendor expansion, and features like loyalty programs and promo codes. It showcases how thoughtful digital transformation can redefine traditional service industries.

Hello 👋
Chat now via Whatsapp