Studentenes design – Velv-teamet
Rekonstruksjon av arkitektur og wireframes levert av bachelorstudentene (Velv-gruppen). Basert på informasjonsarkitektur, moduldiagram og håndtegnede skisser.
Skjerm 1: Hjemmeside / Login
Landingsside med Aigree-logo og innlogging. Studentene noterer: «noe for seinere» og «kan forklare hva Aigree er».
Skjerm 2: Dashboard
Etter innlogging ser brukeren et dashboard med profil, innstillinger, dokumenter og en «quick upload»-funksjon. Studentene nevner «kunne spørre bot».
Skjerm 3: Dokumenter – mappestruktur med preview
Dokumentvisning med mappestruktur til venstre (Company 1, 2, 3 + My Document) og dokumentpreview til høyre. «Sign Contract»-knapp nederst.
Skjerm 4: Alternativ landingsside
Studentene har skisset en alternativ, mer innholdsrik landingsside med forklarende tekst, ikoner, og chatbot. Merket «Alternativ landingside?».
Mobile-first prinsipper brukt her
Målgruppen bruker mobil. Designet skal fungere med én tommel, på liten skjerm, for folk som kanskje ikke er vant med apper. Hvert steg under tar studentenes konsept og tilpasser det til mobile-first best practice: thumb zone-navigasjon, progressiv avsløring, og minimal kognitiv last.
Skjerm 1: Inngang og innlogging
Studentens versjon har kun logo + login. Forbedret versjon legger til språkvalg og organisasjonsbranding – uten å komplisere.
Skjerm 2: Dashboard
Studentens versjon har ikonbasert toppmeny og generisk layout. Forbedret versjon prioriterer: hva trenger brukeren NÅ?
Skjerm 3: Dokumentvisning med AI
Studentenes split view med sidebar-mapper fungerer på desktop, men ikke på mobil. Forbedret versjon: vertikal stack med dokument øverst, AI-forklaring under.
Skjerm 4: Bekreftelse og oversikt
Studentene har ingen bekreftelsesflyt. Forbedret versjon viser hva som skjer etter at brukeren trykker «Lest og forstått» – og status tilbake på dashboard.
Skjerm 5: Profil og innstillinger
Studentene har «Settings – profile and settings» som en egen side. Forbedret versjon: minimal profilside med det brukeren faktisk trenger.
Ingen skisse av hva som er inne.
Oppsummering: nøkkelprinsipper
✊ Samme interface – annet brukstilfelle
Alt i «Mobile-first forbedret»-fanen viser en bedrift som sender dokumenter til en ansatt. Her viser vi nøyaktig samme interface brukt av LO Sommerpatrulje – en rettighetsorganisasjon som informerer unge arbeidstakere. Ingen kodeendring – kun konfigurering.
Skjerm 1: Inngang via QR-kode
Emil (17) jobber på kafé i sommer. Sommerpatruljen besøker arbeidsplassen, Emil skanner QR-koden på plakaten deres.
Skjerm 2: Dashboard – rettigheter i stedet for dokumenter
Bedrift sender kontrakter. Sommerpatruljen sender rettighetsinfo. Samme kortsystem, annet innhold.
Skjerm 3: Innhold + AI-forklaring
Bedrift viser opplastet PDF med AI-forklaring. Sommerpatruljen viser rettighetsartikkel med AI-oppfølging.
Skjerm 4: AI-sjekk av Emils kontrakt
Emil laster opp sin arbeidskontrakt. AI sjekker den mot rettighetsreglene og gir en sjekkliste. Denne funksjonen finnes ikke i bedriftsflyten.
Ansatte mottar dokumenter fra arbeidsgiver – de laster ikke opp selv for sjekk.
🏢🏢 Når brukeren har flere arbeidsgivere + egne dokumenter
Kasia jobber 60% på sykehjem og 40% på kafé. Hun har fått onboarding fra begge via Aigree. I tillegg har hun lastet opp husleiekontrakten sin selv. Her viser vi hvordan mobile-first-designet håndterer dette – uten at det blir en filhåndterer.
Skjerm 1: Dashboard med organisasjonsvelger
I stedet for mappestruktur (Company 1, Company 2, Company 3) fra studentenes skisse, bruker vi et org-kort med tab-switching. Brukeren ser én organisasjon om gangen.
Kognitivt krevende for målgruppen.
Mapper i mapper i mapper.
Skjerm 2: Kasia bytter til Kafé Bjørk
Ett tapp på pillen – hele dashboardet oppdateres med Kafé Bjørks branding, dokumenter og status.
Skjerm 3: «Mine dokumenter» – brukerens eget arkiv
Studentenes «MY DOCUMENT»-konsept i mobile-first versjon. Her lagrer Kasia dokumenter som ikke kommer fra en arbeidsgiver.
Skjerm 4: Opplastingsflyt
Kasia tar bilde av husleiekontrakten sin. Minimal metadata – bare tittel og valgfri type.
Skjerm 5: Dokumenter-fanen – alt samlet
Bunnmenyen har «Dok»-fanen. Her ser Kasia alle dokumenter på tvers av organisasjoner – en flat tidslinje, ikke en mappestruktur.
Informasjonsarkitektur – Privat bruker
Studentenes sitestruktur for brukersiden. Gule = sider, rosa = popups/modaler.
- Overview and quick actions
- Folders
split view
to understand contract
Informasjonsarkitektur – Bedrift
Studentenes sitestruktur for bedriftssiden. Nesten identisk med brukersiden, men med «Send/share to employee» i stedet for vault.
- Overview and quick actions
- Folders
split view
to employee
Module Dependency Diagram
Studentenes tekniske moduldiagram. Viser frontend/backend-skillet og dataflyt fra login via dashboard til kryptert lagring.
Spørsmål: «Subscription»-modulen – er dette relevant for MVP? «Language module» er kun backend – språkvalg bør også være en synlig frontend-komponent. «Company panel» er udefinert – hva inneholder det? Ingen AI-modul er representert i diagrammet.