Today, pet owners increasingly view their pets as integral members of their families. When they embark on travels, whether for business or leisure, and are unable to accompany their pets, their initial instinct may be to entrust them to a local dog hotel. It's reassuring to know that there's a dependable caretaker available to look after their beloved companions in their absence. This shift in perspective, coupled with growing affection for pets, has led to a rise in pet-related expenditures and the burgeoning popularity of pet hotels. Hence, the prominence of such establishments has markedly escalated.
OVERVIEW
Established in 2010, JetPet Resort operates two premier locations in British Columbia, Canada, situated in Vancouver and North Vancouver. Driven by a profound love for pets and a thorough comprehension of their needs, the new ownership meticulously developed the Richmond facility, subsequently expanding to include additional sites in North Vancouver and Olympic Village. Their array of services encompasses top-tier dog daycare, grooming, and deluxe boarding, all within a hotel-style environment designed to ensure the safety, enjoyment, and relaxation of their cherished furry guests.
Originally conceived to cater to the pet care and boarding requirements of their clientele, the company swiftly evolved to meet the escalating demand across the Lower Mainland. Recognizing this surge in interest, their team is keen to introduce a bespoke booking application for both new and existing clients, offering seamless accessibility and convenience. This user-friendly platform will facilitate account creation, dog profile management, and secure booking with a range of payment options.
In today's business landscape, the significance of an online booking app cannot be overstated. A mobile application serves as a strategic tool for enhancing brand interaction and fostering customer allegiance, delivering a more immersive and efficient user experience compared to traditional mobile websites. By investing in a mobile app, companies effectively place their brand within the pockets of their customers, establishing a direct and enduring connection. Among the myriad advantages offered by a booking app is the ability for customers to make reservations at their convenience, day or night, aligning perfectly with the expectations of modern mobile users, who prioritize speed, efficiency, and functionality.
BRIEF
The goal of this project was to develop a functional prototype design tailored for JetPet Resort, our client. Our focus was on addressing the challenges faced by a local business seeking to develop a mobile application tailored to the specific needs of its clientele.
Our approach involves a thorough examination of the customer base's requirements, culminating in the creation of a user-friendly prototype application that effectively communicates the brand's identity. We aim to produce an efficient, streamlined booking application that not only meets the demands of the company's current online presence but also accommodates its evolving business landscape and increasingly diverse user demographic.
To achieve this, we utilized Adobe Photoshop, Illustrator, and XD in our design process.
Our high-level goals were to complete the design of this working prototype in 4 different phases:
1. User Research Plan (Compilation)
- User Research Reports from users
- Flow Chart and Production Document
2. Wireframe Creation
- Wireframe Prototype from the client brief and user research
- Design of Layout, Functionality, and Ease of Use/Clarity
3. Final Prototype Design (High Fidelity)
- Visual Design: hierarchy, consistency, match brand
- Functionality: Features are relevant and working
- Ease of Use/Clarity: The prototype is easy to navigate
- UI/UX elements are clear, and feedback from the users is implemented
4. User Testing
- To document any difficulties, surprises, comments or questions
- Giving users a Scenario and Task to perform
MY ROLE
I led the content design for both the graphics and payment form. Additionally, I meticulously developed the project timeline and authored the production document outlining each team's tasks from initiation to completion. Furthermore, I crafted all low-fidelity wireframes and refined the high-fidelity wireframe from scratch.
During the client presentation, I showcased two videos depicting the high-fidelity prototype and final product, elucidating their functionality. As a result of our efforts, the app was successfully delivered according to the projected timeline.
THE 4 PHASES
Utilizing Adobe design software, our team crafts a functional prototype for our client, JetPet Resort. We are dedicated to formulating a robust plan and framework for the desired application, adhering to the four prescribed stages.
STAGE 1: USER RESEARCH
This stage involves looking at the current users/customers and identifying what current pain points they face regarding the booking services that JetPet offers. Using User Research Methods such as user interviews and surveys, our team started gathering information by deciding to have 6 users complete a survey and/or an interview. These users are within the parameters of the target user group.
General Research Objectives
- To gather information from different pet owners, between the ages of 25 and 55 years old with different lifestyles and backgrounds, who have had little or no experience using an online booking app for companies with daycare or boarding services.
Research Goals
- Collect data to narrow down specific needs for app users.
- User-friendly for all ages including those who are not tech-savvy.
- Easy and secure payment method.
Background
To research solutions for people of various ages who own dogs and are not familiar with using a booking app. Designing an app for them that is a quick and easy task for them to sign up, create accounts, book and pay online for dog services that would make them comfortable when using the app.
Research Methodology
- We conducted interviews with six users who own dogs via in-person, phone calls and email asking what they look for when using a booking app for dog boarding.
Research Participants
- We conducted various interview methods with six different participants from different age groups, different dog's ages and breeds, and different lifestyles. Out of these six, we only picked the top three.
Interview Questions
- We created 12 personal questions for these 6 pet owners related to their pet dog and their lifestyles; we also had them answer 8 mobile app-related questions.
Conclusion
- After gathering all the answers from the users, we concluded that what drives them to use the app depends on the app usage ability, how easy to book online, from creating an account, signing up, entering their info, dog's info, and their payment info was fast and easy. There were only a couple of minor errors on the app that need fixing: 1) the boarding calendar did not allow to pick the other days but only one day. 2) the UI design for some screens is missing the company name, JetPet - only the logo was present. Due to the fast timeline (due date) of this project, we did not have time to fix these changes on the final High Fidelity Prototype but we are still very satisfied with the result.
User Research Report
Collection of data from six different users
Timeline
The Flow Chart
Created digitally that contains all screens present in the application that show how they link to each other. The following are some of the features:
- Loading landing page with slow pulse reveal logo animation
- Option to Sign Up (Forget Password)
- To fill in the dog info and other notes to proceed
- Option to add or remove additional dog and its info
- Would have access to the calendar to choose dates and durations for boarding services
- Payment options
STAGE 2: WIREFRAME (LOW FIDELITY)
This low-fidelity wireframe prototype is focused primarily on functionality and not design. The only design elements we had to consider were layout and hierarchy hence we kept the following in mind:
- Used no actual images, logos, placeholders or image icons with descriptive text used in place of images, banners etc. current pain points they face regarding the booking service in question.
- Created an artboard for each mobile screen as per the flowchart to link in the prototype to ensure correct user flow, considering how phone applications navigate from one screen to another - for example, adding buttons or swipe actions to navigate between screens.
STAGE 3: FINAL PROTOTYPE DESIGN (HIGH FIDELITY)
Since the wireframe is completed, we have now begun the design phase of the prototype in Adobe XD. With the functionality and layout complete, this phase of the project focuses on the design elements of the prototype, while keeping in mind the colour scheme of the business, style of images, visual hierarchy, consistent design of existing collateral (website), and typefaces that should be digital "friendly", consistent, and legible.
The creation of the high-fidelity prototype (stage 3) was a collaborative effort and this specific task was put together by 3 other designers (Eunju, Valantina, and Rosie) including me..
STAGE 4: USER TESTING STAGES
As User Testing typically involves a scenario, we devised one wherein we instructed three individuals to carry out the identical task: booking a three-night boarding stay for a single dog. We distributed the wireframe XD file as a link to these three participants (friends and family), who then provided us with feedback, including comments, questions, and notes on areas of difficulty. They also shared insights on the overall design, usability, and any frustrations or pain points they encountered while navigating the app.
The Scenario
" ...
Delort Jamal, a 25-year-old recent graduate residing in a North Vancouver high-rise, enjoys a comfortable lifestyle. His occupation entails frequent local travel, but his boss has now assigned him international trips. Delort owns a 6-month-old Yorkie named Rocky, whom he entrusts to a local dog sitter in the building during his local travels.
For an upcoming 3-night business trip, Delort needs to arrange Rocky's accommodation. While he previously made reservations at JetPet Resort via phone, this time he opts to use the newly developed app on his phone. With efficiency in mind, Delort swiftly navigates through the app, creating an account, selecting the desired service, and setting the dates for February 9-12, 2022, for Rocky's stay at the Loft suite. He schedules to retrieve Rocky at 5 pm upon his return and opts to pay with his VISA card, requesting a receipt via email.
Delort aims to complete the entire booking process in under 15 minutes, ensuring a seamless experience with the new app.
... "
POSITIVE RESULTS
The JetPet mobile app's design has significantly enhanced the booking process, delivering a positive impact. Introducing an online booking application proves to yield a remarkable return on investment, not only boosting appointment numbers but also driving higher profitability for JetPet bookings. The app streamlines scheduling, enabling more efficient resource planning and reducing administrative costs.
Given time constraints, our team prioritized simplicity and core functionality in the app's development, which has proven effective. One aspect that remains outstanding from the high-fidelity design is the implementation of a slow pulse reveal logo animation during the landing page loading, as outlined in the flowchart.
If only our timeline allowed, additional features could have been incorporated to enrich the user experience, keeping them engaged within the app ecosystem and away from competitors' offerings. Some potential features include adaptable calendar syncing with Google, Teams, and other calendar applications, automated notifications and reminders via email or text, options for short-notice cancellations and rescheduling, subscription services with automated newsletters, integrations for a smoother user interface, comprehensive customer account management including payment history, and the addition of a chat box for technical and administrative support.
