🏠 Overview â€ș 🎯 Features â€ș🎯 Annual Summary (Wrapped)

Annual Summary (Wrapped)

Feature Detail

medium complexity extracted Achievements & Gamification Confidence: 100%
2
Components
2
Shared
0
User Stories
Yes
Analyzed

Description

Annual Summary (Wrapped) generates a personalized year-in-review experience for peer mentors, inspired by Spotify Wrapped. The feature aggregates each mentor's activities, hours contributed, contacts supported, and milestones reached over the year and presents them as a shareable visual summary. The goal is to make invisible volunteer effort visible, give mentors a sense of pride, and reinforce motivation to continue contributing year after year.

Sources & reasoning

Wrapped is explicitly named in §2.2 as a shared need across three organizations and listed in Fase 3 (Growth & Engagement) deliverables, fixing both motivation and target_release.

  • Tre organisasjoner er inspirert av Spotify Wrapped og Ăžnsker en funksjon som viser likepersonens bidrag over tid - «Din likepersonsĂ„rek». MĂ„let er Ă„ gi frivillige stolthet og motivasjon
  • docs/source/likeperson.md · line 265-266
    Fase 3 - Vekst og engasjement - Gamification / «Ditt likepersonsÄr» (Wrapped, badges, Advantage Calculator)

Analysis

Business Value

This feature directly addresses volunteer retention, one of the most expensive problems in peer mentor organizations. Three of four workshopped organizations (NHF, HLF, Barnekreftforeningen) explicitly requested a Spotify Wrapped-style summary as a way to recognize and motivate volunteers. Making contributions visible turns abstract activity logs into emotional, shareable artifacts that volunteers can take pride in. Strategically, Wrapped summaries amplify word-of-mouth recruitment when mentors share them externally, supporting the Referral Program. They also give coordinators a concrete tool to thank volunteers, reducing churn in a sector where unpaid contributors are the core resource.

Implementation Notes

Implementation uses the Wrapped Screen UI in Flutter for animated, swipeable card sequences, backed by a Wrapped Generation Service that queries the activities and wrapped_summaries tables. Aggregation runs server-side via the Next.js API on Vercel to keep mobile performance smooth, with results cached per user per year. The service composes metrics (activity count, hours, top contact types, milestones) from existing activity data - no new capture surface is needed. WCAG 2.2 AA compliance applies: every card needs semantic labels for screen readers, animations must respect reduced-motion preferences, and contrast ratios must meet AA. Sharing is optional and uses platform share sheets; nothing leaves the device without explicit user action.

Quality Assurance

Peer Mentor (Likeperson) — primary
1
Scenarios
5
UAT Steps
14
A11y Annotations
2
Role Boundaries
Peer Mentor (Likeperson)

Peer Mentor (Likeperson)

Quick UAT

  1. Logg inn i Meander-appen som likeperson med minst Ă©n registrert aktivitet i innevĂŠrende Ă„r.
  2. Åpne Hjem-skjermen og trykk pĂ„ kortet 'Ditt likepersonsĂ„r' (Wrapped).
  3. Bla gjennom kortsekvensen: totalt antall aktiviteter, timer brukt, kontakter hjulpet og milepĂŠler.
  4. Trykk 'Del' pÄ siste kort og bekreft at delingsarket Äpnes med et bilde av sammendraget.
  5. Lukk Wrapped og bekreft at du returneres til Hjem-skjermen uten datatap.

Quick UAT — Accessibility

  1. Logg inn i Meander-appen som likeperson med minst Ă©n registrert aktivitet i innevĂŠrende Ă„r.
    • Screen reader Skjermleser annonserer 'Hjem, hovedskjerm' etter innlogging.
    • Focus visibility Synlig fokusring pĂ„ e-post- og passordfelt; alle felt har semantiske labels.
  2. Åpne Hjem-skjermen og trykk pĂ„ kortet 'Ditt likepersonsĂ„r' (Wrapped).
    • Screen reader Kortet annonseres som 'Ditt likepersonsĂ„r, knapp'. Rolle og tilstand leses opp.
    • Keyboard / focus Kortet nĂ„s via Tab fra toppen av Hjem; Enter/Space aktiverer.
    • Touch target Wrapped-kort er minst 24×24 CSS-piksler (faktisk ~full bredde).
  3. Bla gjennom kortsekvensen: totalt antall aktiviteter, timer brukt, kontakter hjulpet og milepĂŠler.
    • Screen reader Hvert kort annonserer overskrift og tallverdi som tekst (ikke kun visuell graf). 'Aktiviteter totalt: 47.'
    • Keyboard / focus Pil hĂžyre/venstre eller swipe navigerer mellom kort; ikke-drag alternativ (knapper Neste/Forrige) tilgjengelig.
    • Zoom Brukbar ved 200 % zoom — kort skalerer, ingen avkutting av tall.
    • Contrast Tallverdier har 4.5:1 kontrast mot bakgrunn; status formidles ikke kun med farge.
  4. Trykk 'Del' pÄ siste kort og bekreft at delingsarket Äpnes med et bilde av sammendraget.
    • Focus visibility Synlig fokusring pĂ„ 'Del'-knapp; knappen er merket 'Del ditt likepersonsĂ„r'.
    • Touch target Del-knapp er minst 24×24 CSS-piksler.
    • Live region 'Delingsark Ă„pnet' annonseres som hĂžflig live-region.
  5. Lukk Wrapped og bekreft at du returneres til Hjem-skjermen uten datatap.
    • Screen reader Skjermleser annonserer 'Hjem, hovedskjerm' nĂ„r Wrapped lukkes.
    • Keyboard / focus Lukk-knapp nĂ„s via Tab; Escape lukker ogsĂ„ Wrapped.

Role Boundaries

2 role(s) must NOT access this feature
  • Global Administrator

    Global Admin logger kun inn i Admin-portalen og har ingen mobiltilgang; Wrapped-skjermen er ikke tilgjengelig.

  • Prospective Buyer

    Ingen pÄlogging pÄ Sales Website; Wrapped finnes ikke i offentlig kontekst.

Expected End State

Likepersonen har sett sitt personlige Ärlige sammendrag (Wrapped) med aggregerte aktiviteter, timer, kontakter og milepÊler, og har mulighet til Ä dele det videre. Ingen data endres i databasen utover en eventuell logg pÄ at Wrapped er vist.

Components (4)

User Interface (1)

ui Wrapped Screen medium

Service Layer (1)

service Wrapped Generation Service medium

Shared Components

These components are reused across multiple features

User Stories

No user stories have been generated for this feature yet.