The Challenge
Create a mobile app for busy executives to effortlessly monitor and assess business health on the go, from the ground up.
Our clientele, comprised of owners and managers overseeing extensive salon and spa chains, sought a solution to systematically monitor crucial metrics and inform data-driven decisions for enhanced organizational performance. Recognizing that staffing significantly shapes success—constituting 50% of all expenses in the salon and spa industry—they aspired to maximize this investment by fostering team engagement and motivation.
Metrics and Goals
The challenges of this product were the following:
-
See the “big picture” and set goals
-
Track KPIs by centers (sales, revenue, ratings, etc.)
-
Compare with historical data
-
Understand team performance at a glance
-
Compare performance over certain periods
-
Stay connected with the business
Hence, some of the metrics were defined as:
-
Target a 25% CR to Premium Features in 6mo
-
Maintain a user satisfaction rate of 85% or higher
-
Support up to 5 countries and languages
-
Ensure data updates occur in real-time with an accuracy rate of 99.5%
01
Role & Responsibilities
As the sole UX/UI designer, I played a pivotal role in the conception and realization of this innovative product. Drawing from my experience with Zenoti enterprise solutions, I conducted in-depth research, meticulously designed, and successfully implemented a comprehensive suite of applications, enabling our customers to seamlessly manage their businesses. My journey started with a profound understanding of user needs and the intricacies of their workforce ecosystem. Subsequently, in collaboration with my Project Manager, I conducted a rigorous competitive analysis to identify key areas for improvement addressed by other products in the market.
02
Discovery
I initiated the discovery phase by delving into competitive markets to gain insights into existing SaaS solutions catering to similar needs. A prominent contender in this landscape was MindBody, encompassing a comprehensive range of features. Notably, their acquisition of Zeezor introduced a dashboard with metrics, goal-setting capabilities, and additional tools. Despite their robust offerings, an observation emerged – the user experience and interface of MindBody's solution appeared outdated, presenting an opportunity for us to introduce a more modern and user-friendly alternative.
In tandem with evaluating competitors in our niche, we conducted a thorough benchmarking exercise by examining the overall experience offered by industry leaders. Stripe, renowned for its excellence in financial technology, became a pivotal reference point for our analysis. Specifically, we scrutinized their telemetry dashboard, which adeptly displayed critical business metrics, including revenues and other key performance indicators.
Stripe's telemetry dashboard emerged as an exemplar in seamlessly presenting intricate financial data, setting a high standard for user interface design and data visualization. This benchmarking process allowed us to glean valuable insights into best practices and identify areas where we could elevate our own solution. By synthesizing learnings from both our direct competitors like MindBody and industry giants like Stripe, we aimed to craft a product that not only rivaled existing offerings but also exceeded user expectations in terms of usability and data representation.
03
Wireframing & Ideation
Following an exhaustive discovery phase that involved thorough research, competitor analysis, and stakeholder consultations, the wireframing process emerged as a the bridge between conceptualization and execution. Harnessing the insights gleaned from our research endeavors, I embarked on translating these concepts into tangible structures, utilizing wireframes as the architectural blueprint for our app's interface. The wireframing phase served as a crucial step in crystallizing user interactions, information architecture, and the overall navigational flow, providing a visual foundation for the subsequent design stages.
As the wireframing iterations progressed, collaborative feedback became instrumental in refining the user experience and addressing potential pain points. The wireframes not only provided a skeletal structure but also facilitated informed decision-making on design choices, ensuring that each element served a purpose in enhancing user engagement and task efficiency. This iterative dialogue between wireframing and stakeholder input fostered a dynamic design process, where the evolving wireframes became a tangible representation of the shared vision. The wireframing phase, intricately woven into the fabric of our design strategy, not only validated our initial research but also steered the project towards a meticulously crafted user interface, poised to meet the nuanced needs of our diverse user base.
04
Iterations, High-Fidelity Mocks & Prototyping
After gathering insights from competitive and comparative markets, the next phase involved seeking inspiration for our user interface design. To cultivate a visual direction aligned with the financial aspects of our app, I curated a mood board featuring conceptual artwork from banking interfaces and goal-tracking applications. This creative exploration served as a catalyst for envisioning intuitive user flows and crafting a visually compelling dashboard that seamlessly integrates financial metrics and goal-setting functionalities.
Upon completing the visual research phase and engaging in insightful discussions with stakeholders, product specialists, and our valued customers, a clear vision emerged regarding the deliverables. However, recognizing the importance of validation, the next step involved building and testing various designs and user flows. This iterative process allowed us to refine our assumptions, ensuring that the final UI design not only met but exceeded the expectations of our diverse user base.
05
Establishing UI and the Design System
In selecting the color palette for the UI, a deliberate choice was made to convey professionalism and establish a business-oriented interface. The color blue, synonymous with trust and reliability, was strategically incorporated to evoke a sense of credibility and confidence among users. Beyond its aesthetic appeal, blue has a psychological impact that aligns seamlessly with the financial context of our app. Its calming and authoritative qualities not only enhance the visual appeal of the interface but also contribute to fostering a user experience grounded in trust and competence. The meticulous consideration of color extends beyond aesthetics; it serves as a subtle yet powerful element in reinforcing the app's identity as a reliable tool for empowering business decision-making.
In shaping the UI, I took a strategic approach by establishing and maintaining a robust design system. Beyond aesthetics, it played a pivotal role in creating a cohesive and recognizable visual language across the entire application. Additionally, the process involved meticulous tokenization of design elements, ensuring consistency and efficiency in implementation. This thoughtful application of design tokens not only streamlined the development process but also contributed to a unified and harmonious user experience, reinforcing the app's identity as a trustworthy tool for informed business decisions.
06
Focusing Problem-Solving Efforts
In our commitment to delivering an exceptional user experience, addressing user pain points became a central tenet of our design philosophy. Through extensive user research and feedback analysis, we identified key pain points and challenges faced by business owners and managers in their daily operations. From cumbersome data entry processes to intricate navigation hurdles, each pain point was meticulously examined. Our design decisions were then guided by a strategic intent to alleviate these pain points, introducing intuitive solutions that not only streamlined workflows but also brought a sense of ease and efficiency to the user journey. This user-centric approach not only transformed the app into a more accessible and enjoyable tool but also positioned it as a solution tailored to directly address the real-world challenges encountered by our diverse user base.
07
Final Design
After conducting several rounds of rigorous user tests, actively soliciting feedback from our valued customers, and leveraging invaluable insights from tools like Gainsight, a comprehensive understanding of user preferences and expectations was achieved. These iterative testing phases allowed us to refine the design iteratively, addressing any residual pain points and ensuring optimal usability. The integration of customer feedback, in particular, played a pivotal role in aligning the final design with the end-users' needs and desires. As a result, we reached a design iteration that not only met the established objectives but also exceeded user expectations.
Armed with a well-informed and user-centric design, we confidently transitioned into the finalization phase, marking a crucial milestone in the journey toward delivering an impactful and seamlessly integrated business management solution. With the design now poised for development, our collaborative efforts and iterative refinement set the stage for a product that not only meets the technical requirements but also resonates with the end-users on a profound level.
As the design evolved, we meticulously documented the iterative journey, capturing the nuanced changes inspired by user interactions and real-world testing scenarios. This process not only highlighted our responsiveness to user needs but also showcased our commitment to continuous improvement. User-centric adjustments were made based on test outcomes, ensuring that every element of the design contributed seamlessly to a positive and efficient user experience. The iterative nature of our design process, informed by both user tests and industry benchmarks, propelled us toward a final design that stands as a testament to our dedication to delivering a solution that not only meets expectations but exceeds them on every front.
08
Live on the App Markets
The culmination of our design process reached its pinnacle as the envisioned interface seamlessly transitioned into production, officially launching our business management app in 2020. This monumental milestone marked the introduction of a user-centric solution into the app markets, setting the stage for a transformative experience for business owners and managers. Since its launch, the app has garnered a substantial and ever-growing user base, a testament to its resonance within the business community.
Continuous updates have been diligently rolled out, ensuring that the app remains at the forefront of innovation, adapting to evolving industry needs and user expectations. While the app is readily available for download, it beckons users to embark on a journey of streamlined business management. However, to unlock its full potential, a business account is essential, offering users a comprehensive suite of features tailored to meet the dynamic demands of their enterprises.
09
Post-Launch Analysis
Post-launch, our dedication to data-driven insights became manifest as we meticulously monitored and analyzed the performance and usage patterns of the app, particularly after its introduction in the US – our inaugural market. Leveraging the robust capabilities of Gainsight, an online customer success platform, we conducted comprehensive usability studies that delved into user interactions and experiences. The screenshots below provide a visual journey through these studies, capturing key moments in user engagement and behavior. The findings, extracted from Gainsight's behavioral analysis, painted a compelling picture of the app's impact and resonance. The results were resoundingly positive, validating our design decisions and affirming that the app not only met but exceeded user expectations. This post-launch analysis not only served as a testament to the success of our user-centric approach but also fueled our ongoing commitment to refining and enhancing the app based on real-world user feedback and evolving industry trends.
10
The Impact
The impact of our thoughtfully crafted design is evident in the widespread adoption and positive reception from our diverse user base. The app has become an integral tool for many of our customers, streamlining their business management processes and fostering a more efficient and user-friendly environment. The testimonials below offer a glimpse into the transformative experiences our users have had with the app.
Notably, Teresa Malik, the Director of Lovoir Beauty salons, shared her testimonial, underscoring the app's effectiveness in enhancing the operations of their thriving salons. These testimonials not only validate the success of our design but also serve as a testament to the tangible benefits and value it has brought to businesses across various industries. Read more here.
