Platformen så dagens lys i 2021

Mindhelper-skolen

Mindhelper-skolen.dk hjælper unge til at håndtere angst og nervøsitet. Jeg har stået for hele designet og den tekniske udvikling af platformen.

App screenshot

Pæne tal fra projektet

Drømmen er altid at bygge et produkt, målgruppen tager til sig. Så det her er tal, der giver smil på læben.

Gennemførte lektioner i forløb
80.000+
Synes indholdet er let at forstå
79 %
Brugere, der synes indholdet er nyttigt
95 %

Baggrund

Platform til online-forløb for unge

Mindhelper-skolen.dk er en platform, der blev udviklet for at tilbyde unge i Danmark et selvstyret online-forløb, hvor de kan arbejde med deres mentale sundhed over længere tid.

Bummelum

Platformen er en del af Mindhelpers indsats for at hjælpe unge med selvhjælp, og fokuserer på at give dem dybdegående redskaber til at håndtere deres udfordringer – fx angst – i stedet for blot at levere hurtige tips og råd.

Det startede som et pilotprojekt, der blev sat i verden for at teste effekten af åbne selvhjælpsforløb, og evalueringen har vist imponerende resultater. 95 % af brugerne fandt indholdet nyttigt, og deltagerne oplevede et gennemsnitligt fald på over 13 % i deres angstsymptomer. En undersøgelse af brugeroplevelsen viste desuden, at 61 % fandt siden meget brugervenlig, og den modtog ros for sit enkle og intuitive design.

Min rolle i projektet

UI Design, brugervenlighed og teknisk udvikling af platformen.

Som ansvarlig for både design og udvikling af platformen havde jeg en bred rolle i projektet. Jeg stod for interaktionsdesignet, designet af selve platformen, frontendudviklingen med Nunjucks og TailwindCSS, samt opsætningen af backend med 11ty static site generator. Mit arbejde sikrede, at brugerne oplevede en enkel og brugervenlig platform, som var let at navigere i, selv for dem med begrænset teknisk kunnen.

Det tekniske setup

  • 11ty Siden bliver bygget som en Static-site med 11ty SSG. Indhold hentes via API'er fra Headless WordPress, Vimeo og lignende services.
  • TailwindCSS CSS er skrevet direkte i sidens komponenter med TailwindCSS.
  • JavaScript Det enkle setup betyder en minimal brug af JavaScript i frontend, fordi alt databehandling håndteres i build-processen.

Frontend-udvikling

Jeg implementerede et responsivt design med fokus på mobile-first, så sitet fungerer problemfrit på alle enheder. Koden er struktureret modulært for at sikre skalérbarhed og let vedligeholdelse, og menu-navigationen er optimeret for at minimere distraktioner og skabe fokus på de enkelte forløb.

Static site generator og headless backend

Jeg anvendte 11ty til at generere sitet statisk, hvilket sikrede hurtige load-tider og letvægts-funktionalitet. Med Rollup bundling reducerede vi kompleksiteten, og sitet blev optimeret til at levere indhold hurtigt og effektivt.

Integration med hosting CI / CD

Jeg satte en CI/CD-pipeline op via Netlify, som automatisk bygger og deployer sitet ved ændringer i Git-repositoriet. Desuden er der integreret cookieless-tracking fra Plausible.io, som gør det muligt at følge brugernes interaktion med indholdet uden at krænke deres privatliv.

Virker det så - eller hvad?

Løsningen har vist sig at være yderst effektiv. I evalueringen af online-forløbet rapporterede 92 % af deltagerne, at forløbet var godt eller fremragende, og hele 95 % fandt videoindholdet nyttigt. Derudover oplevede deltagerne et gennemsnitligt fald i angstsymptomer på 13 %, hvilket viser, at platformen formår at hjælpe de unge med at håndtere deres mentale udfordringer.

Platformens simple og intuitive design har også bidraget til en positiv brugeroplevelse, hvor størstedelen af brugerne fandt sitet let at navigere.