THINK AHEAD!
A website for a nonprofit educational board game from Graz that helps young people prepare for life after school, covering education, finances, health, and housing.
- Nuxt
- Vue
- TypeScript
- UnoCSS
- Nitro
- Umami
View project details
My contribution
Built the responsive Nuxt/Vue website with TypeScript, reusable UI components, typed content models, and UnoCSS design tokens. Implemented a data-driven quiz with difficulty levels, randomized questions, scoring, and keyboard focus management. Added consent-aware Umami event tracking through a server-side Nitro endpoint with payload validation and privacy-signal checks. Configured route-specific SEO metadata, canonical URLs, structured data, and XML sitemap generation.
Technical outcome
A component-based website that brings the game, quiz, and downloadable materials together. Optimized web performance with compressed WebP assets and self-hosted variable fonts; improved usability and accessibility with responsive layouts, semantic markup, keyboard navigation, and reduced-motion support.
