Timeline
March - July 2023
Project Type
University Project at the Technical University of Applied Sciences of Augsburg
Responsabilities
UX Research & Usability Testing
Interface Design
Animations
Have you ever had the problem of not knowing where to start when you are exploring a new city? We weren't unfamiliar with this situation, so when we were given the opportunity as part of a Master's course in Web Technologies and Artificial Intelligence, we jumped at the chance to try and find a solution.
Using the OpenAI API, we were able to explore this technology by creating our own website to help travellers find new and exciting activities in the city of Augsburg, Germany. As the service was intended to be used mainly on the move to get quick and easy plan recommendations, we decided to design and develop a web application with a mobile-first approach.
This first iteration was realised completely in german, planning to add in the future an english translation to adapt to more users.
The main goal was to design and develop an app from scratch to a finished prototype, with the added challenge of integrating AI. To do this, we formed a multi-disciplinary team consisting of a project manager, a back-end developer, a front-end developer and myself as the designer.
To ensure that we could start building and testing as quickly as possible, we followed an iterative process where design and development started in parallel as soon as the first components and screens were ready.
The first step in the ideation phase was to define the target audience and create user personas, which would then be key to deciding what features the app should include. Augsburg is a city visited and populated by all age groups and we didn't want to leave anyone out. So we decided to create a user-friendly and intuitive app that could adapt to their different needs. Below are some of the user personas that were used as a starting point for the design process.
Less is more. Something we designers have heard a thousand times. But sometimes it really is, and this was one of those times. Since the app will be used on the go, we didn't want the user to have to go through unnecessary steps to get their plan recommendation. For this reason, we kept the features as minimal as possible and instead focused on a good user experience and seamless AI integration.
The final main fuctions were sketched in paper and low fidelity prototypes, which included a questionnaire where the user can indicate their preferences about activities, number of participants or budget, and a AI generated plan suggestion based on their answers.
After several iterations, a limited colour palette was chosen, inspired by the green colours that symbolize the city of Augsburg. A component library is built on figma, which also serves as a space to document and hand over all design specifications to development. A prototype is also created to be tested with different users.
Upon opening the app, users are taken to the main screen where they can start the survey or learn more about the app. As AI is still a new topic for many users, we included a FAQ section to increase trust in the site.
The user then answers some questions about their constraints and interests. These answers are used to generate a prompt and send it to ChatGPT, which then sends back a recommendation for plans to do that day in the city. Here the user has the option to generate another response with the same parameters or to start the questionnaire again.
Other parameters that the user can choose from are the type and category of the activity, weather is related to culture, nature, sport or going out. This was used as part of the prompt for ChatGPT to get a precise recommendation.
Thank you for reading this far! I hope you found this case study interesting. If you would like to have more information about the project or chat about Artificial Intelligence in interface design please drop me an email. You can also check my other projects below.
