Originally created as an interactive PDF by an agency, the tool was later integrated into the new Lasteabi website. This required a full redesign for accessibility, consistency, and web usability, while preserving the original concept.

My role & approach

I was responsible for the UX and UI design, from early structuring to final development support. I worked closely with counselors, the service manager, and development teams throughout the process.

Key responsibilities:

• Mapping the user journey from a young person’s perspective

• Creating a web-ready design system based on the original PDF and Lasteabi’s CVI

• Redesigning interactive elements to meet WCAG requirements

• Building desktop and mobile prototypes for all age groups

• Supporting development and accessibility testing

Design decisions & improvements

User journey & structure

I reorganized the original PDF views into a clear, logical flow suitable for web use. I also unified the entry point into one shared start view with age selection, instead of separate PDFs.

Accessibility-first UI

Several original design elements did not meet accessibility standards. I redesigned buttons and interactive elements to improve contrast, clarity, and usability, ensuring WCAG compliance across devices.

Illustrations & visual tone

To avoid repetition and keep young users engaged, I created unique illustrations for each category, maintaining a playful but calm tone aligned with Lasteabi’s visual identity.

Prototyping & content flow

I first prototyped one age group, validated the logic internally, and then scaled the solution to the remaining groups. I simplified the final steps by combining encouragement and next-steps into one clear, supportive view that directs users to anonymous helpline support.

Development & collaboration

The design was developed in collaboration with:

• TEHIK – platform integration and technical framework

• Trinidad Wiseman – front-end and back-end development

I stayed involved throughout development, reviewing progress, refining details, and ensuring accessibility across browsers and screen sizes. The framework was intentionally designed to be reusable, and has since sparked interest from other public sector organisations.

Accessibility & testing

Accessibility was a core focus throughout design and development. Together with developers, I refined heading hierarchies, background graphics, and interactive elements to prevent readability issues on smaller screens.

Final testing led to additional improvements, such as:

• Downloadable final views for users

• Clear return and navigation buttons

• Missing elements in mobile view (e.g. download button, logos)

A small group of young users tested the tool and responded positively to the friendly tone and illustrations. Feedback from older users informed future plans to further tailor content by age group.

Outcome & reflection

Tundetester will launch as an accessible, youth-friendly digital tool fully integrated into Lasteabi’s website. I was trusted with final design decisions on behalf of Lasteabi during development.

This project strengthened my skills in:

• Designing for accessibility at scale

• Translating static concepts into flexible digital systems

• Collaborating closely with developers

• Confidently advocating for the target audience with clear, research-based reasoning