Technigo UX course final project Tyck Till app
This January I completed a 22-week intensive UX/UI Design Bootcamp at Technigo! For our final project, me and my colleague Nathalie Gologan delved into the task of enhancing the UX-design of Stockholm Stad's Tyck Till app.
Tyck Till is a Swedish city app that allows the citizens of Stockholm to have their say around the city's traffic and outdoor environment. We decided to investigate the user journey and redesign the app to make it more intuitive and easy to use.
UX design process: Research – Define – Ideate – Prototype – Test.
DATE
December 2023 - January 2024
ROLE
UX/UI designer
PROJECT TYPE
Technigo final project, UX design
Technigo UX design Bootcamp, final project
Project duration: 3 weeks.
Given that the app has been well-established for several years, and still has low ratings in the app stores, our initial question was: “Why does the user experience fall short of this promising concept?”. If we conduct an evaluation of the current interface and carry out user research, what pain points can we find? We decided to find out.
Research and discovery – The methods
In our discovery stage, we aimed to understand user expectations and identify pain points when using the product. The research began with heuristic evaluations using Nielsen Norman's 10 guidelines for a quick and cost-effective assessment of app user-friendliness. Following this, we analysed App/Play Store ratings and reviews for both positive and negative patterns. Our primary method for problem identification and understanding user preferences was usability testing. We selected three tasks and observed our five users as they performed them, conducting follow-up interviews to achieve a comprehensive assessment of the user experience. Lastly we ran a competitor analysis to gain strategic insights into features, flows, and design solutions of competitors.
Research and discovery – The findings
Pain points identified included form sections with excessive and unclear information, contradicting flexibility and usability heuristics. The form also failed the "visibility of system status" rule, which emphasizes the importance of providing users with appropriate and timely feedback.
When looking at ratings and reviews, the most complaints were around the user interface, with users desiring an updated design and a more efficient way to submit errands.
Usability tests revealed participants spending significant time on subject selection. During interviews, they described the app as basic, with multiple information and error messages slowing down the flow. 90% of them appreciated the option to receive feedback on the errand.
Our analysis of similar design solutions showed a trend of single-paged forms, similar to Tyck Till’s. Features such as choosing your location first and displaying all existing errands on the map were new discoveries.
Ideation – Low fidelity wireframes
For ideation and sketching, we dived into FigJam and started brainstorming. By mapping out the current user journey, as well as analysing the interviews, we gained a better overview of what could be merged or simplified.
Despite being a minimalistic app with a single-page form, there was a maze of extra screens and pathways that got uncovered along the way – making it seem unnecessarily complicated.
We decided to keep the minimalist design, considering the positive feedback from users, but divided the tasks into step-by-step screens to reduce cognitive load.
Ideation - Mid fidelity wireframes
Instead of the user being met by a task that requires effort, they start with something easy; choosing the location of the matter.
A visible progress indicator and more prominent headings were added to help users estimate the number of remaining steps and understand their relative position in the form. Additionally, an autosave feature was implemented to reassure users that their information won’t get lost during the form-filling process.
By adding a summary slide, users have the opportunity to review their answers in one place before submission.
As a final touch of the updated form we created an animation for the final screen to show appreciation and motivate the user to continue contributing to a safer outdoor environment in Stockholm.
Prototype and test – The test
To test our initial prototype, we utilised Useberry. Our ten participants were instructed to perform a task within the prototype. At the end of the task we asked them to answer three follow-up questions inspired by the System Usability Scale.
Key findings from the test revealed that the average time to submit a report was less than 3 minutes, a positive result given that some studies show that mobile users typically spend around 5 minutes in an app. The heat map showed that all features and buttons were clicked, indicating good visibility and usability.
The majority of the participants responded that they appreciated the clear headings, logical flow of steps, and the summary screen at the end. Even so, there were comments about the feedback-toggle being confusing and difficulties in distinguishing between categories.
In response to this feedback, we implemented iterations and added the final touches.
Prototype and test – The prototype
The new design system incorporates typography, icons, and colours from Stockholm stad’s existing brand manual. Overall we wanted a clean, new design that still belonged to its brand.
We updated the copy to sound more relatable and user-friendly, catering to a broad age group within the target user base. Our careful selection of words aims to assist users in completing tasks effectively and confidently
Please feel free to try out the final prototype in Figma by clicking the image below.
