BUBBLE CHILDCARE
Pre and After School Care Booking App
Project Overview :
Bubble Childcare App, is a mobile application designed to simplify pre and after school care arrangements for busy parents, creating an intuitive and user-friendly experience that connects parents with reliable childcare options.
With Bubble, parents can effortlessly book and manage their children's care schedules, ensuring peace of mind and quality care.
The goal is to support parents in balancing their busy lives while providing children with enriching and enjoyable experiences.
My Role :
As the lead UX designer for the Bubble Childcare App, I spearheaded the design process for the parent/carer-facing elements of the application. My primary focus was on creating a seamless and user-friendly experience that simplifies the booking process.
I designed intuitive interfaces and streamlined workflows to ensure that parents can easily navigate the app and manage their childcare needs efficiently. This project highlighted my ability to manage and execute a comprehensive design strategy, delivering a product that is both functional and aesthetically pleasing.
Future development will build upon this foundation to include provider-facing elements and a comprehensive dashboard.
Understanding the User
User Research Summary
To ensure the Bubble Childcare App met the needs of parents and carers, I undertook comprehensive user research centred around my own child's primary school. This included conducting one-on-one interviews with parents at the school to gather in-depth insights into their childcare booking experiences and challenges, as well as distributing online surveys to the broader school community to collect quantitative data on user preferences, pain points, and desired features. Based on this research, I developed a user persona to represent the primary user group and their goals, motivations, and behaviours.
Additionally, I created a user journey map to visualise the typical steps parents take when booking childcare, highlighting key touch points and potential pain points. I conducted a competitive analysis to understand market standards and identify opportunities for differentiation and improvement.
Aggregated User Profile
JANE DOE
ABOUT
Jane Doe is a 35-year-old marketing manager living in Mickfield, Suffolk with her husband and two young children. Balancing a demanding career and family life, Jane often finds herself stressed by the cumbersome process of arranging pre and after school care. She values efficiency and reliability in services she uses, and she wants to ensure her children are in a safe and engaging environment while she is at work. Jane is tech-savvy and appreciates solutions that streamline her daily tasks.
GOALS
Quickly book reliable pre and after school care for her children.
Ensure her children are in a safe, engaging environment.
Balance her professional and personal responsibilities more effectively.
FRUSTRATIONS
Inconsistent booking methods involving paper forms, phone calls, and emails.
Difficulty in finding real-time availability for childcare options.
Poor user experience with existing childcare booking websites.
PAIN POINTS
Booking processes that are time-consuming and prone to errors.
Uncertainty about the availability of childcare services.
Navigating clunky and unintuitive interfaces on current booking platforms.
PERSONALITY
Introvert
Extrovert
Analytical
Creative
Busy
Time Rich
Messy
Organised
Independent
Team Player
USER journey
User research : pain points
1
2
3
Starting the design
Architecture & Flow, Digital Wireframes, Low-Fidelity Prototyping & Usability Studies
To identify and plan the architecture and user flow of the Bubble Childcare App, I employed a visual approach using virtual post-it notes in FigJam. This method allowed for a dynamic and flexible way to organise and visualise the app’s structure and interactions.
Initially, I started by gathering all relevant insights from the user research phase, which included pain points, goals, and typical user behaviours. Using FigJam, I created a digital workspace where I could brainstorm and map out these insights. Each note represented a key element, such as a user task, a screen, or a feature. This approach provided a clear and visual way to see how different components of the app would interact and how users would navigate through the app.
I mapped out the primary user journey, from initial login to booking childcare services. This allowed me to identify essential screens and interactions needed for a seamless user experience. By arranging and rearranging the notes, I could experiment with different flows and quickly spot any potential bottlenecks or areas of confusion. This iterative process was crucial in ensuring that the architecture was intuitive and user-friendly.
Digital wireframes
To bring the user flow and architecture of the Bubble Childcare App to life, I utilised Marvel, a powerful prototyping platform. This tool was instrumental in the rapid development of initial design concepts through lo-fi wireframes, allowing me to visualise and iterate on the app’s structure quickly.
Starting with the user flow and architecture mapped out in FigJam, I translated these elements into simple, low-fidelity wireframes in Marvel. This approach focused on functionality and layout rather than detailed aesthetics, ensuring that the core interactions and navigation paths were clearly defined. By creating these wireframes, I could rapidly ideate and experiment with different design solutions, ensuring that the app’s interface would be intuitive and aligned with user needs.
Marvel allowed me to quickly create and link wireframes, simulating the user journey and testing the flow of the app. This rapid prototyping technique was crucial for identifying any usability issues or gaps in the user experience early in the design process. The ability to easily adjust and refine wireframes based on immediate feedback ensured a flexible and iterative approach to design development.
Lo-fi Prototyping
To prepare for initial user testing, I leveraged Marvel to develop a lo-fi prototype of the Bubble Childcare App. The aim was to create a functional, interactive prototype that allowed users to experience the core functionalities and flow of the app without the distraction of detailed visual design elements.
Starting with the lo-fi wireframes created in Marvel, I linked these individual screens to simulate user interactions. Marvel's prototyping tools allow for adding of hotspots and transitions, enabling a realistic representation of the user journey. By focusing on the primary tasks and user flow, I ensured that the prototype addressed key user needs identified during the research phase, such as booking childcare and managing schedules.
The simplicity of the lo-fi prototype allowed users to focus on the usability and functionality of the app rather than its aesthetics. This approach was particularly effective in identifying any navigational issues or confusing interactions early in the design process. Users could click through the prototype, perform tasks such as searching for childcare options, and make bookings, providing valuable insights into the app's usability.
View Lo-Fi Prototype
usability study
Study Type :
Unmoderated Usability Study
Location :
Remote, United Kingdom
Participants :
5 Participants
Length :
20 to 30 Minutes
Study Findings
1
2
3
Digital Wireframes
After completing the initial lo-fi wireframes in Marvel, the next step was to transition these designs into Figma to begin the UI design phase. Exporting the wireframes from Marvel and importing them into Figma was a straightforward process that facilitated a smooth transition from wireframing to detailed UI design.
Marvel offers the capability to export wireframes as images or PDF files. For this project, I exported the wireframes as high-resolution images, ensuring that all the layout details were preserved. This method allowed me to have a clear reference for each screen when working in Figma. By exporting each screen individually, I could maintain the structure and flow established during the wireframing stage.
refining the design
Design System
To expedite the UI design process for the Bubble Childcare App, I developed a lightweight design system based on the M3 Google Materials design kit. By selecting and customising key components such as buttons, forms, and navigation elements, I ensured the design aligned with the app's branding and user needs.
Establishing this design system early on allowed for consistency across all screens and interactions, streamlining the design process and facilitating rapid prototyping and iteration. The predefined components and styles made it easier to implement changes and updates, speeding up development.
The lightweight system was flexible and adaptable, accommodating new requirements as they arose. This approach ensured a user-friendly and visually consistent UI, providing a solid foundation for future enhancements. Overall, the design system significantly enhanced the efficiency and quality of the app's UI design process.
Mockups
Building on the initial lo-fi wireframes, I transitioned to creating high-fidelity mockups within Figma. This phase was crucial for transforming basic structures into detailed, visually appealing designs that closely resembled the final product.
Starting with the wireframes as a foundation, I meticulously added visual elements such as colour schemes, typography, icons, and images. Each element was carefully chosen to align with the app's branding and enhance user experience.
Interactivity was also a key focus during this stage. I incorporated interactive elements to simulate real user interactions, providing a more comprehensive view of the app's functionality. This helped in identifying potential usability issues and allowed for early testing and feedback.
By developing high-fidelity mockups, I could present a polished version of the app to stakeholders and gather valuable input before moving into the development phase. These mockups served as a vital bridge between the initial concept and the final product, ensuring that the design vision was clearly communicated and effectively realised.
hi-fi Prototyping
After developing the high-fidelity mockups in Figma, I used Marvel to create a high-fidelity prototype of the Bubble Childcare App. This step was essential to bring the design to life and facilitate a realistic, interactive experience for users. Using Marvel, I imported the high-fidelity mockups and linked them to simulate user interactions. This included creating clickable areas, transitions, and interactive elements that closely mirrored the intended functionality of the final app.
The high-fidelity prototype was then published on Marvel's test platform, allowing me to roll it out to a group of prototype users. This enabled me to conduct thorough user testing in a real-world context, gathering valuable feedback on the app's design, usability, and overall experience.
Users could navigate through the prototype as they would in the final app, providing insights into how the design performed under actual usage conditions.
By utilising Marvel for the high-fidelity prototype, I ensured that the feedback collected was based on a highly realistic representation of the app. The high-fidelity prototype was a crucial step in validating the design and ensuring it met the needs and expectations of its users.
View Hi-Fi Prototype
Accessibility Considerations
1
2
3
design progression
Takeaways & Next Steps
Impact :
Reflecting on the design process for the Bubble Childcare App, I gained several key insights.
Simplifying the booking process was highly effective, with users appreciating the streamlined and intuitive flow.
The user-friendly interface was also well-received. The minimalist design allowed users to navigate the app effortlessly, validating the importance of a clean and straightforward layout.
The improved navigation structure was a success. Users found it easier to locate and access features thanks to clearer labels and better positioning of key sections. This highlighted the impact of intuitive design and thoughtful information architecture on enhancing the user experience.
Learnings :
Throughout the design process for the Bubble Childcare App, I learned the critical importance of user feedback and iterative design.
Regular user testing provided invaluable insights that guided the refinement of the app, ensuring it met real user needs. I also discovered that simplifying complex processes, like booking childcare, can significantly enhance user satisfaction and engagement.
Additionally, I learned that a clean, intuitive interface and clear navigation are essential for a positive user experience. These learnings will inform my approach to future projects, reinforcing the necessity of a user-centred design methodology.