Go back
Go back
Go back
Cyclista App
Cyclista App
Project Type
Project Type
Project Type
Capstone Project
Timeline
Timeline
Timeline
3 weeks
My Role
My Role
My Role
Started the app idea with research, created user flow based on key insights, developed a design system in Figma and took care of the Final UI
Overview
Overview
Overview
Many cyclists struggles to get safety when they encounter a problem with their bike, and many doesn't have an idea whether the route they are taking has an incline. The app was developed to address the growing need for safer and informative bike rooutes.
Many cyclists struggles to get safety when they encounter a problem with their bike, and many doesn't have an idea whether the route they are taking has an incline. The app was developed to address the growing need for safer and informative bike rooutes.
Challenge
Design an app that targets leisure riders and daily commuters that struggles with navigating city roads safely.
Challenge
Design an app that targets leisure riders and daily commuters that struggles with navigating city roads safely.
Challenge
Design an app that targets leisure riders and daily commuters that struggles with navigating city roads safely.
Solutions
Starting from designing and testing of the wireframes, we prioritized the features that enables users to ask nearby bikers for help. Nearby bikers will be notified if another user asked for help. On the live map feature, we also implemented a modal that informs our users that the route they are trying to take has an incline, road works, and etc.
Solutions
Starting from designing and testing of the wireframes, we prioritized the features that enables users to ask nearby bikers for help. Nearby bikers will be notified if another user asked for help. On the live map feature, we also implemented a modal that informs our users that the route they are trying to take has an incline, road works, and etc.
Solutions
Starting from designing and testing of the wireframes, we prioritized the features that enables users to ask nearby bikers for help. Nearby bikers will be notified if another user asked for help. On the live map feature, we also implemented a modal that informs our users that the route they are trying to take has an incline, road works, and etc.
While working on the wireframes, I conducted user testing to iterate the designs from the design sprint based on user feedback.
While working on the wireframes, I conducted user testing to iterate the designs from the design sprint based on user feedback.
While working on the wireframes, I conducted user testing to iterate the designs from the design sprint based on user feedback.
Site map for the user flow of the app
Site map for the user flow of the app
Site map for the user flow of the app
Design Showcase
The final design solutions revolves around safety, finding a community, and being informed on the routes. Users are able to view the live map, ask for help when needed, view social feed, challenges and modify their settings.
Design Showcase
The final design solutions revolves around safety, finding a community, and being informed on the routes. Users are able to view the live map, ask for help when needed, view social feed, challenges and modify their settings.
Design Showcase
The final design solutions revolves around safety, finding a community, and being informed on the routes. Users are able to view the live map, ask for help when needed, view social feed, challenges and modify their settings.
Onboarding screens (From log in and sign up page)
Onboarding screens (From log in and sign up page)
Onboarding screens (From log in and sign up page)
Design System
All elements in the design system was built for consistency through out the whole app design and to create a modern and professional look and feel to increase trust and confidence in the system. From foundation to all design components, following atomic design methodology.
Design System
All elements in the design system was built for consistency through out the whole app design and to create a modern and professional look and feel to increase trust and confidence in the system. From foundation to all design components, following atomic design methodology.
Design System
All elements in the design system was built for consistency through out the whole app design and to create a modern and professional look and feel to increase trust and confidence in the system. From foundation to all design components, following atomic design methodology.
