MOBILE APP DESIGN
City Cycles Mobile App Figma Project Cover Image
Project: Project for City Cycles to find a booking tool and a clear path for finding bicycle options, tour options, and providing users with a check out cart, and a reservation page that leads user to final check out with confirmation of order. These elements were missing on the original website.

Challenge: Based off the user research, I wanted to Design a functional Mobile App prototype, for on-the-go Users, that would be easy for existing and new customers to navigate and use, while also addressing the Customer's concerns and missed business opportunities and simultaneously eliminating some of the previous user frustrations that were found during the User Research phase of the project.

- The Wireframe was designed in Figma and the Prototype was originally designed in InVision, but I later updated Prototype inFigma

Role: UX Designer
Tools: Figma | InVision
Year: 2020

UX Case Study

Customer: City Cycles is a Bike Rental Shop that offers rentals and tour packages

The Problems: The users/consumers visiting the website to book a bike rental or tour package could not easily navigate the website to find Where or How to book (too many steps or indirect paths).
Once some users did find the reservations link, it then took the users to an email link versus a booking tool solution to complete their order. This experience left the users feeling unsure if the reservation was booked or what to ask for in the email.
Overall most users felt unsure and confused when attempting to book a bike rental & tour. Thus, resulting in users calling the store to book a bike rental, instead of using the online link to email option.

City Cycles UX Research Case Study Slide 2

UX Research Process

In order to help find potential solutions to these problems for City Cycles and their Users, I performed the following types of UX Research and data Collection.

UX Research Methods
* Interviewing Users
* Conducting Surveys
* Reviewing Google Analytics
Quantitative Data
* Website Analytics
* Survey Results
Qualitative Data
* Heatmaps
* Journey Maps
* User Personas
* User Interviews
City Cycles Customer Journey Map

The UX Research Process

Throughout the User Research process with city Cycles, I faced some challenges & obstacles. Luckily I was able to use problem solving skills to overcome any setbacks along the way and continue working towards ideas and solutions.

Challenges & Obstacles:
* Meeting & exceeding the customer's need for a booking tool that would improve the customer booking and retention, while also delivering a positive user experience. To prove the goal was met & the booking tool would be a successful solution, I used Google Analytics & A|B testing.
Problem Solving:
* Diving deeper into the GA data to ensure the User Persona was validated
* Providing customer with a Mobile App design solution to better target their customer base & improve the customer acquisition model.
* Researching and finding and good UI booking tool option to plug into design

The Results

City Cycles people graphic

Key Findings & Results: After preforming research, collecting data, and analyzing the results this is what I found:
-ISSUE: Overall the users were not satisfied by the website or the using the website to book a bike rental &/or tour.
           -  User Feelings: Confused, Frustrated, & Unclear
                * All of the user feelings were negative and equate to business loss
-SOLUTION: We wanted to improve the overall customer/user satisfaction and the average booking rate to increase AOV and Customer retention.
           -  Utilized a smart booking/reservations tool with a call to action (CTA) button for reservations as well as a link in navigation that will make the user feel clear and confident in their purchase(s). In turn, this will create positive user feedback, positive reviews, & positive word of mouth in the community, which will lead to increased: profits, new to file customers, & customer retention. The solution goal is to reduce bounce rates and consumers/website users calling into store to book their bike rentals and tours.
                
Takeaway & Discoveries: The most interesting takeaway or discovery from the City Cycles UX Research Process was that the Bounce rate correlated to the Users leaving the website and then calling the store to book a bike rental &/or city tour. I was surprised so many customers still called the store to book a rental. If the issue was resolved, and the new online booking tool successful, then ~25% of user should book online once published to website and then increase incrementally quarterly and year over year once it gains traction with reviews. This will help to reduce the current declines shown in the Google Analytics data.

Learnings: As a result of this UX Research, I learned:
- Quantitative & Qualitative Research are critical to this project
- Google Analytics is the Quantitative proof the customer needed to see to show them the numbers, in real time, of the business decline, the impact of having no mobile app or booking tool on website, and gave me the ability to discuss with them in an unbiased way about opportunities & areas for improvement based off the data.
- Solution based tools that are customer & consumer friendly easy as concept and theory and a pretty drawing mock-up. The product design needs to incorporate data & research, provide a solution to a problem, go thru testing, & align with the customers expectations & business needs.

UX Recommendations

UX Recommendations:
- Create a CTA button for the Reservations on the Main Page so it is clear and obvious to consumers/users.
- Make sure the link to the PLPs for the Catalog of Bikes includes pricing in product tiles
- Create an online booking process that is clear, with calendar dates for selection, time of pick-up/drop-off, reservation package type, cost, discount, and order confirmation to consumer/user with confirmation number.

Next Steps:
After preforming the UX research and presenting solution to customer, City Cycles, then I designed the wireframe & prototype, with a mobile first solution as a booking app, as more users were on the go. See below for the Design.

City Cycles UX Recommendations image phone

City Cycles UX Design Wireframe and Prototype in Figma

City Cycles Wireframe/Prototype in Figma

Design File 

Want to work together?

If you like what you see and want to work together, get in touch!

info@LadieLKDesigns.com
^