Your Workout, Your Schedule – Book Your Gym Time Effortlessly!
Goal
In 2023, as part of my studies at Laurea University of Applied Sciences, I developed the Gym Booking App as part of the “Defining and Designing a Software Product” course. The primary objective of this project was to design and develop a user-centered application prototype, while gaining a comprehensive understanding of Agile methodologies, specifically Scrum. The project provided a balance between both the technical and design aspects of software development, allowing me to gain hands-on experience in transforming an initial concept into a functional prototype.
Throughout the project, my main motivation was to deepen my understanding of the entire app development process, utilizing essential tools such as Miro, Figma, and Atlassian Jira and Confluence. I focused on enhancing my skills in software documentation, reporting, and prototyping, while collaborating with a cross-functional team.
Additionally, I aimed to apply software engineering principles and Agile practices to ensure the efficient delivery of a high-quality product. I actively contributed to the design and functionality of the Gym Booking App, with a specific focus on usability, interface design, and overall user experience. I also contributed to documenting software requirements to provide a clear foundation for development. This project provided me with valuable insights into the software development lifecycle and further developed my ability to work effectively within a team, while meeting both technical and user-centric objectives.
Planning and Development Process
As part of the project, I contributed to the planning and design of the Gym Booking App. My role involved creating technical documentation, designing the system architecture, and developing the app’s sketches, wireframes and prototype. I created a context diagram to provide an overview of the software system, as well as data flow diagrams (DFD) to illustrate how data would flow through the app’s processes. Additionally, I defined the app’s APIs, software architecture, and database schemas, ensuring the system was scalable, efficient, and aligned with user needs.
1. The App’s Context Diagram
I started planning by creating the app’s Context Diagram to provide a high-level overview of the system, illustrating its key components and how they interact with external entities. This diagram helped to define the scope of the project, ensuring that all relevant processes, users, and external systems were clearly identified and understood. It served as a foundation for further design and development, allowing for a clearer vision of the app’s structure and functionality.
2. The App’s APIs
The next step was defining the Gym Booking App’s APIs to ensure seamless communication between the app’s frontend and backend. I defined both internal and external APIs, including the Calendar API for organizing group class schedules, the Sign-in/Log-in APIs for easy access across platforms (iOS, mobile, desktop), and the Paytrail Payment API, which supports multiple payment options from Finnish banks like Nordea, OP, and Danske. These APIs optimized functionality, ensured smooth data flow, and laid the foundation for scalability and future integrations.
3. The Data Flow Diagram (DFD) and APIs
In the next step, I developed The Gym Booking App’s Data Flow Diagram (DFD) and APIs to ensure a clear understanding of how data would flow through the system and establish seamless communication between the app’s components from the perspectives of the gym owner, instructor, and user. The DFD helped map key processes such as class creation, booking, availability checking, payment processing, and feedback collection, providing insight into how data moves between the different system components. Meanwhile, developing the APIs was essential for enabling smooth interactions between the frontend and backend, ensuring efficient communication across all user types, and facilitating future scalability and integrations.
4. The Software (SW) Architecture
I defined the software (SW) architecture for The Gym Booking App using the Model-View-Controller (MVC) design pattern to ensure a clean, scalable, and maintainable structure. The app includes six distinct MVC patterns, which help separate concerns and improve the organization of the codebase.
The Login page shares the same view across all user roles, providing a consistent and seamless login experience. The Login control is linked to Account control, Membership control, and Group class and instructor control. This modular approach allows for easy updates and maintenance, as each control is responsible for a specific set of functions.
Group class and instructor control is further linked to Feedback control and Reservation and queue control, ensuring smooth transitions between user actions such as booking classes, leaving feedback, and managing reservations.
The app uses MySQL for its database, providing a reliable and scalable storage solution. The Apache HTTP Server serves as the web server, ensuring stable and efficient communication between the app’s client and server. By implementing this architecture, I ensured that the app is scalable, maintainable, and easily adaptable to future changes and feature additions, allowing for a seamless user experience across all roles.
5. The Database Schema
I designed this database schema to ensure a structured, efficient, and scalable foundation for a gym management application. It maintains data integrity, optimizes retrieval, and establishes clear relationships between key entities.
The User entity stores login credentials, while Customers, Instructors, and Owners have personal details. Gyms are linked to instructors and owners through many-to-many relationships. Group classes include essential details like name, description, date, time, and location, with schedules managed separately. Memberships define pricing and duration, Payments track transactions, Reservations handle class bookings, and Feedback stores customer reviews.
With this schema, I created a solid framework to streamline gym operations, memberships, scheduling, and customer interactions effectively.
6. The App’s Page View Sketch
I designed the app with 15 main pages, tailored to three user roles: customer, owner, and instructor. The interface and functionality adjust based on the user’s role.
All users can sign in, manage their profile, customize settings, and access the Menu and Group Class pages. Customers can book and cancel classes, track reservations, view activity history, and give feedback. Owners can create and delete classes, while instructors can edit them.
Customers can manage memberships and payments through the Membership, Shop, and Payment pages, with transactions handled via Paytrail. Owners can also manage the shop and access Gym and Statistics pages to edit gym details and analyze customer activity.
This structured design ensures an intuitive and efficient user experience for all roles.
7. The App’s Wireframes
Creating wireframes was the next essential step after defining the database schema because it helped me visualize the app’s structure, user flow, and interactions. Wireframes allowed me to map out each page’s layout, ensuring a clear and intuitive user experience tailored to customers, owners, and instructors. By sketching the app’s interface, I could identify potential usability issues early, refine navigation, and align the design with the app’s functionality. This step made it easier to plan development, improve user interaction, and ensure a smooth transition from concept to implementation.
Working within an Agile framework, I iteratively developed the app, with regular sprints and feedback loops. This allowed me to refine the app based on continuous testing and user feedback, ensuring that I were building a product that truly met the needs of gym users.
8. UI/UX Design and Usability Testing
On the design side, I created the User Interface (UI) for the Gym Booking App. I applied Gestalt Principles to guide the visual design, ensuring the app was intuitive and easy to navigate.
To validate the design, I created wireframes and app’s interactive prototype using Figma. These prototypes were then tested with users to gather feedback on usability and identify areas for improvement. The iterative process of usability testing helped me refine the app’s user experience, ensuring that the final product was both functional and user-friendly.
After the first sprint, I also conducted a Heuristic Evaluation to identify potential usability issues early in the design process.
9. Atlassian Jira and Confluence
I used both Atlassian Jira and Atlassian Confluence to streamline the development process and ensure effective collaboration throughout the project. Jira helped me manage the app’s backlog, organize tasks, and track progress. I created user stories, prioritized tasks, and tracked development through sprints, ensuring smooth execution from start to finish.
On the other hand, Confluence served as the central documentation hub. I used it to store and share key project information, such as the database schema, wireframes, technical specifications, and user stories. It allowed me to keep the team aligned by documenting requirements, sprint goals, and feature descriptions, while tracking decisions and gathering feedback.
By integrating Jira and Confluence, I ensured seamless communication and a structured workflow, making it easier to manage development tasks, track progress, and maintain comprehensive project documentation.
Outcome and Reflection
At the conclusion of the Gym Booking App project, I gained a comprehensive understanding of various software development methods and tools. I learned how to apply Agile principles to a real-world project, as well as how to create technical documentation, design databases, and integrate user-centered design practices into the development process. More importantly, I developed a holistic approach to managing software projects, balancing both technical requirements and user needs.
The project not only deepened my technical skills but also reinforced the importance of collaboration, user feedback, and continuous iteration in the software development lifecycle.
You can explore the interactive prototype of the Gym Booking App created by my team in Figma.
Challenges
During the development of the Gym Booking App, I faced several challenges. Adapting to Agile methodologies, especially Scrum, was initially difficult as I learned to manage sprints, prioritize tasks, and handle shifting requirements. Collaborating with a cross-functional team also presented coordination challenges, requiring clear communication and alignment on goals. Balancing technical functionality with user-centered design was challenging, as was incorporating user feedback while maintaining a cohesive vision. Additionally, keeping software documentation up to date while working on development and design required strong organizational skills. Despite these challenges, they provided valuable learning experiences and helped me develop essential problem-solving and communication skills.
Tools
Miro, Figma, Atlassian Confluence and Jira