Design: Sketching out functionalities
Based on the key findings I crafted a minimalist and user-friendly design, centering around familiar mental models and presenting only essential information in each context.
Start page
Embarking on a journey of iterative refinement, the startpage evolved through rigorous testing with a small audience, transitioning from displaying brands to highlighting types of transportation and integrating a location-finder to elevate user experience.
Result page
Crafting the result page was a process of uncovering user priorities, encompassing essential details such as transportation types, ride duration and the most affordable and swiftest options.
Development: Bringing the design to life
After having a understanding of what the service should look like, it was time to actually make the service work.
Frontend
The frontend was crafted using HTML, CSS, and Bootstrap for a responsive design that works seamlessly across devices. JavaScript was employed to create interactive features such as autocompletion for location inputs and handling checkboxes for ride options.
Backend
On the backend, the Flask framework was used to create routes that handle user input, communicate with APIs, and render dynamic templates. I designed utility functions to work with geolocation data and the HERE API, allowing users to find the best routes and estimate prices.
Challenges along the way
Delving into the development, several challenges surfaced that demanded resolution.