Limestone City Bikeshare Project
Create a high fidelity prototype for the business expansion of Limestone City Bikeshare
Overview
The Limestone City Bikeshare Project was a solo student project that aimed to create a high-fidelity prototype for the development of the Limestone City Bikeshare business. To achieve this, I started the research phase by conducting a competitive analysis to study the user types and information architecture of competitors' websites. I further proceeded with my research by conducting card-sorting sessions to confirm the IA diagram of the prototype. The final prototype included all the key findings from research to better accommodate users. Since this was a solo project, my role was a UX researcher, UX designer and information architect.
Client Name: N/A
Platform: Web
Key Performance Metrics: Competitor’s online presence
My Role: UX researcher and designer; Information architect
Tools/ UX Methods Used: Competitive Analysis, Card Sorting, IA Diagram, Design Patterns, Wireframing, Prototyping, Design Iteration, Adobe XD.
Problem Statement
Limestone City Bikeshare, a newly established bike-sharing service, needs a website to introduce its business to users.
Research Stage.
Competitive Analysis
I conducted a competitive analysis by analyzing the online presence of three competitors: Bike Share Toronto, Lyft, and BIXI Montréal. I identified the strengths, weaknesses, features, and design patterns on their websites. Additionally, I scrutinized user reviews of these competitors to capture user sentiments and user types. Through this research, I was able to draw out the business goals, user goals, and user types of these competitors. In preparation for the information architecture stage, I also created sitemaps for each website to discover commonalities.
Key takeaways
01
In terms of design patterns, all competitors use home link. Two out of three have a flat hierarchy in their website structure and are using vertical dropdown menus.
02
They utilize a set of branding colors and the colors are frequently adopted in the websites.
03
In terms of interface, all of them have wisely utilized spaces to limit the options available to users at one glace.
Define Stage.
Business and User Goals
The business and user goals were developed from the competitive analysis research. I extracted commonalities from the competitors' goals and brainstormed two sets of goals to accommodate the business nature of Limestone City Bike Share.
Business Goals
-
To have 1500 active members subscribe to the membership among which at least 300 of them should be monthly member by the project's end.
-
To increase the no. of membership subscriptions and user retention rate in the long-term.
-
To maintain bike maintenance costs at a low level.
-
To bring satisfaction to users
-
To encourage low-carbon transit and local tourism.
User Goals
-
To save cost on transit.
-
To protect the environment by choosing a sustainable way for transit.
-
To enjoy outdoor activities and exercising with friends.
-
To enjoy the scenery of Kingston.
-
To ride the bikes safely.
-
To have flexibility deciding where they want to park the bikes.
-
To pay for memberships without barriers and frustrations.
User Types
Also, I was able to suggest the possible user types for the business of Limestone City Bike Share through studying the user profiles of the competitors.
01
Given the mobility and exercise requirements, the main focus of the user base is young people.
02
One of the main user groups is students, who are attracted to the flexibility and affordable pricing of shared bikes.
Card Sorting
I further studied the sitemaps of the competitors' websites, taking the business goals into consideration. Then, I created an initial group of cards for the card sorting activity. My objective for this activity was to understand how users perceived the created cards and how they grouped them logically. A closed card sorting was conducted, and participants were invited to join virtually.
Results
-
They didn’t know what “Network”, “Station Network” and “Cooperation” means.
-
“Log-in” and “Sign-up” should be Lv 1 categorie
Reorganizing final grouping of cards
After reviewing the results from the card sorts, I reorganized the cards to form the final grouping below. "Re-organized" means renaming ambiguous cards, add new cards to cater the business goals and other arrangements to make the grouping more logical. This grouping had been used to develop the sitemap.
Sitemap
I did not 100% apply the result I got from the card sorting to create the sitemap. The final sitemap was reorganized to adapt to the business and user goals in a logical manner.
I decided to adopt a flat IA to make all pages and features visible on my website. The IA focused on explaining how the rent and return bike process works and promoting the plans and membership.
Design Stage.
Wireframing
In terms of UI, I care about whether the content was clearly presented and whether the users have the freedom to navigate around the pages. Therefore, I adopted a minimalistic design. I also utilized some design patterns to enhance their user experience, i.e., having them informed of the current state of the website by the breadcrumbs so they won’t get lost. Here are the design patterns that I used:
-
Accordion Tabs
-
Home link
-
Dropdown menu
-
Slideshow
-
Pricing table
-
Breadcrumbs
-
Search bar
-
Back button
Prototyping
Finally, I further developed the wireframes to hi-fi prototypes with interactivity.
Key Learnings
-
Each structure of a website and design pattern was used for specific reasons. Deciding whether or not to adopt a particular pattern requires extensive research on users' expectations. The same applied for the website hierarchy. There was no right or wrong way to use a flat or deep hierarchy; it all depended on how the content will be presented. This stage might require more time to balance the business and user perspectives.
-
This project was good practice for familiarizing myself with future client projects. Given its limited scope, I heavily relied on the results of the competitive analysis to make design decisions. This limitation also highlighted the importance of conducting sufficient user research before the design phase, to gain a deep understanding of users' perspectives on my designs.
Room for further improvement
-
Conduct wider user research: In addition to competitive analysis, it would be beneficial to conduct user research to gather insights directly from potential users. This can be done through surveys and interviews. System analytics are also an efficient way to capture the user demographics in a objective sense.
-
Develop personas: With sufficient user research and ideally after talking to potential users, it would be beneficial to develop personas. Personas are essential for guiding onward product research because they help ensure that the design will be user-centered.
-
Use a variety of testing methods: To obtain user feedback on the design by testing the wireframes/prototypes, there are different methods I can use for usability testing, including think-aloud testing, A/B testing, and remote testing. Utilizing a variety of methods can provide a comprehensive understanding of how users interact with the product, and facilitate design iteration as well.