Aigree – Studentenes design (Velv-team)
🔒 Studentenes design
Skriv inn passord
📱 Studentenes skisser
✨ Mobile-first forbedret
✊ LO Sommerpatrulje
🏢🏢 Flere arbeidsgivere
🏗️ Informasjonsarkitektur
⚙️ Moduldiagram

Skjerm 1: Hjemmeside / Login

Landingsside med Aigree-logo og innlogging. Studentene noterer: «noe for seinere» og «kan forklare hva Aigree er».

Studentens skisse
aigree
log in
Enkel landing med logo + login-knapp. Ingen organisasjonsbranding, språkvalg eller forklaring av tjenesten.

Skjerm 2: Dashboard

Etter innlogging ser brukeren et dashboard med profil, innstillinger, dokumenter og en «quick upload»-funksjon. Studentene nevner «kunne spørre bot».

Studentens skisse
P
📁
👤
@name
[Dokumentområde]
📤 Quick upload
🤖
«kunne spørre bot»
Dashboard med P (profil), meny, dokumenter. Quick upload og chatbot-ikon. Ingen velkomstkort fra organisasjon.

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.

Studentens skisse
Documents
Company 1
↳ CONTRACT
↳ HANDBOOK
Company 2
Company 3
MY DOCUMENT
ADD + ✓
P
Contract
🤖
AI/se
SIGN CONTRACT
Split view: Mappestruktur med flere bedrifter + egne dokumenter til venstre, dokumentpreview til høyre. AI-knapp og «Sign Contract» i bunnen.

Skjerm 4: Alternativ landingsside

Studentene har skisset en alternativ, mer innholdsrik landingsside med forklarende tekst, ikoner, og chatbot. Merket «Alternativ landingside?».

Studentens skisse
Log in | Contact
🤖
Chat
📄
📋
🏠
🔒
📸
❤️
🔑
Offentlig landingsside med informasjon om Aigree, feature-ikoner, chatbot og kontakt. Tenkt som marketing/info-side, ikke app-inngang.

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.

Studentens versjon
aigree
log in
Forbedret
aigree
Forstå dokumentene dine – på ditt språk
🏢
Bedrift 1
har invitert deg
Velg språk
🇳🇴 Norsk
🇬🇧 English
🇵🇱 Polski
🇺🇦 Укр.
G Logg inn med Google
Organisasjonsbranding: Brukeren ser hvem som har invitert dem. Bygger tillit – spesielt viktig for målgruppen.
Språkvalg før login: Språket må velges FØR innlogging slik at all videre tekst vises på riktig språk. Reduserer friksjon for ikke-norskspråklige.
Forklarende undertekst: «Forstå dokumentene dine – på ditt språk» forteller umiddelbart hva tjenesten gjør.
✏️
Google-login tydeliggjort: Full knappetekst i stedet for generisk «log in».

Skjerm 2: Dashboard

Studentens versjon har ikonbasert toppmeny og generisk layout. Forbedret versjon prioriterer: hva trenger brukeren NÅ?

Studentens versjon
P
📁
👤
@name
[Dokumentområde]
📤 Quick upload
🤖
Forbedret
📋 2 dokumenter venter på deg
🏢
Bedrift 1
Velkommen til oss!
Her finner du kontrakten din og viktig info for oppstart.
Dokumenter
📄 Arbeidskontrakt
Ulest
📄 Personalhåndbok
Ulest
🏠Hjem
📁Dokumenter
👤Profil
🔄
Topp-ikoner → bunnmeny: Navigasjon flyttes til thumb zone (iOS/Android-konvensjon). Profil, meny og dokumenter tilgjengelig med én tommel.
Velkomstkort fra organisasjonen: Brukeren ser hvem som har sendt dem hit og hva de skal gjøre. Bygger tillit og kontekst.
Statusbanner: «2 dokumenter venter» gir tydelig handlingsveiledning – brukeren skjønner umiddelbart hva de skal gjøre.
🔄
Dokumenter som kortliste: I stedet for et udefinert «dokumentområde», ser brukeren konkrete dokumenter med status. Tappbare kort med chevron (›) indikerer at det er noe å trykke på.
Quick upload fjernet: I onboarding-flyten laster ikke brukeren opp selv – de mottar dokumenter fra organisasjonen. Upload kan legges i Dokumenter-fanen ved behov.
🔄
Chatbot-ikon fjernet fra dashboard: AI-hjelp er mer nyttig i kontekst (inne i et dokument) enn som et generisk ikon på dashboard.

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.

Studentens versjon (desktop)
Documents
Company 1
↳ CONTRACT
↳ HANDBOOK
Company 2
Company 3
MY DOCUMENT
Contract
🤖
SIGN CONTRACT
Forbedret (mobile-first)
← Dokumenter / Arbeidskontrakt
PDF · Fra Bedrift 1
🤖 AI-forklaring · 🇵🇱 Polsk
Stanowisko
Sykepleier, 100% stilling
Wynagrodzenie
42 000 kr/mnd ✅
⚠️ Okres próbny
6 mnd prøvetid
Spør AI om kontrakten...
Spør
✓ Lest og forstått
🔄
Split view → vertikal stack: På mobil fungerer ikke sidebar med mapper. Dokumentet vises øverst, AI-forklaring under. Brukeren scroller nedover – naturlig mobilmønster.
🔄
Mappestruktur → breadcrumb: «← Dokumenter / Arbeidskontrakt» erstatter mappetreet. Én nivå tilbake er nok – brukeren har typisk 1–3 dokumenter, ikke et arkivsystem.
🔄
AI som popup → AI integrert: I stedet for en separat chatbot-knapp, er AI-forklaringen en del av dokumentvisningen. Brukeren trenger ikke vite at det er «AI» – de ser bare en forklaring på sitt språk.
🔄
«Sign Contract» → «Lest og forstått»: Aigree håndterer ikke juridisk signering. Bekreftelsen er at brukeren har lest og forstått – ikke signert. Viktig distinksjon.
Company 1/2/3-mapper fjernet: Mappestrukturen forutsetter at brukeren har flere arbeidsgivere med flere dokumenter. I praksis er det én arbeidsgiver med 1–3 dokumenter. Filstruktur er unødvendig kompleksitet.
«MY DOCUMENT» fjernet: Personlig opplasting er en annen funksjon (vault) enn onboarding. Blander to produkter i ett interface.

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.

Studentens versjon
Studentenes skisser har ingen skjerm for hva som skjer etter «Sign Contract». Brukeren returneres til vault uten bekreftelse eller statusoppdatering.
Forbedret
Din onboarding 1 av 2
📄 Arbeidskontrakt
✅ Lest og forstått
📄 Personalhåndbok
Ulest
🏠Hjem
📁Dokumenter
👤Profil
Fremdriftsindikator: «1 av 2» med progress bar gir brukeren oversikt over hvor de er i onboarding-prosessen. Motiverer til å fullføre.
Statusvisning per dokument: ✅ for lest, gul stripe for ulest. Brukeren ser umiddelbart hva som gjenstår uten å måtte åpne hvert dokument.
Feedback loop: Etter bekreftelse returneres brukeren til dashboard med synlig endring. Gir mestringsfølelse – «det jeg gjorde hadde effekt».

Skjerm 5: Profil og innstillinger

Studentene har «Settings – profile and settings» som en egen side. Forbedret versjon: minimal profilside med det brukeren faktisk trenger.

Studentens versjon
⚙️
Settings
- profile and settings
Kun nevnt som boks i arkitekturen.
Ingen skisse av hva som er inne.
Forbedret
← Tilbake
K
Kasia Nowak
kasia@gmail.com
🌐 Språk
Polsk
Endre
🏢 Organisasjon
Bedrift 1
❓ Hjelp
Logg ut
🏠Hjem
📁Dokumenter
👤Profil
✏️
Konkret innhold: I stedet for en udefinert «Settings»-boks, viser vi de 3–4 tingene brukeren faktisk trenger: språk, organisasjon, hjelp, logg ut. Ingenting mer.
✏️
Språkbytte tilgjengelig: Brukeren kan endre språk etter innlogging – viktig om de valgte feil i starten.
Ingen avanserte innstillinger: Målgruppen skal aldri måtte konfigurere noe. Minimale valg = mindre forvirring.

Oppsummering: nøkkelprinsipper

📱 Mobile-first
Bunnmeny i thumb zone, vertikal scroll, ingen sidebars. Designet for én tommel.
🎯 Oppgavebasert
Dashboardet viser hva brukeren skal gjøre, ikke hva systemet kan gjøre. «2 dokumenter venter» i stedet for mapper og menyer.
🤖 AI i kontekst
AI-forklaring vises der dokumentet er – ikke som en separat funksjon brukeren må finne. Kontekst reduserer friksjon.
🏢 Organisasjonen først
Brukeren inviteres av en organisasjon – ikke av «Aigree». Branding og velkomst bygger tillit fra første sekund.
✅ Feedback loops
Etter handling ser brukeren resultatet. Progressbar, statusikoner og bekreftelser gir mestringsfølelse.
✂️ Progressiv avsløring
Vis bare det som er relevant nå. Mapper, innstillinger og avanserte funksjoner skjules til de trengs. Mindre = tydeligere.

✊ 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.

Bedrift 1
aigree
Forstå dokumentene dine – på ditt språk
🏢
Bedrift 1
har invitert deg
🇳🇴 Norsk
🇬🇧 EN
🇵🇱 PL
🇺🇦 UK
G Logg inn med Google
LO Sommerpatrulje
aigree
Forstå dokumentene dine – på ditt språk
Sommerpatruljen
har invitert deg
🇳🇴 Norsk
🇬🇧 EN
🇵🇱 PL
🇺🇦 UK
G Logg inn med Google
Identisk interface. Eneste forskjell: logo (✊ i stedet for 🏢), navn («Sommerpatruljen» i stedet for «Bedrift 1»), og aksentfarge (rød i stedet for grønn). Alt annet er likt. Organisasjons-IDen i QR-koden bestemmer brandingen.

Skjerm 2: Dashboard – rettigheter i stedet for dokumenter

Bedrift sender kontrakter. Sommerpatruljen sender rettighetsinfo. Samme kortsystem, annet innhold.

Bedrift 1
📋 2 dokumenter venter på deg
🏢
Bedrift 1
Velkommen til oss!
Her finner du kontrakten din og viktig info for oppstart.
Dokumenter
📄 Arbeidskontrakt
Ulest
📄 Personalhåndbok
Ulest
🏠Hjem
📁Dok
👤Profil
LO Sommerpatrulje
Sommerpatruljen
Vet du hva du har rett på?
Hei! 👋 Her finner du info om rettighetene dine som ung arbeidstaker.
📞 815 00 LO 🌐 lo.no
Dine rettigheter
💰 Lønn og overtid
3 min lesetid
🕐 Arbeidstid og pauser
2 min lesetid
📋 Kontrakten din – hva skal stå der?
4 min lesetid
📤 Last opp kontrakten din
Få en AI-sjekk av arbeidskontrakten
🏠Hjem
📁Dok
👤Profil
Samme komponent, annet innhold. Dokumentkortene bruker nøyaktig samme layout. For bedrift: kontrakt og håndbok. For Sommerpatruljen: rettighetsartikler. Sommerpatruljen har en ekstra «last opp kontrakten din»-CTA – konfigurerbart per organisasjon.

Skjerm 3: Innhold + AI-forklaring

Bedrift viser opplastet PDF med AI-forklaring. Sommerpatruljen viser rettighetsartikkel med AI-oppfølging.

Bedrift 1
← Dokumenter / Arbeidskontrakt
PDF · Fra Bedrift 1
🤖 AI-forklaring · 🇵🇱 Polsk
Stanowisko
Sykepleier, 100%
⚠️ Okres próbny
6 mnd prøvetid
Spør AI om kontrakten...
Spør
✓ Lest og forstått
LO Sommerpatrulje
← Rettigheter / Lønn og overtid
💰
Lønn og overtid
Kilde: LO Sommerpatrulje
Minstelønn
Ingen lovfestet minstelønn, men tariffavtaler gjelder. Kafé: 187,66 kr/t (over 20 år).
Overtid
Over 9 t/dag eller 40 t/uke = minst 40% tillegg.
Feriepenger
Alle har rett til 10,2% av brutto årslønn.
Spør AI om din situasjon...
Spør
📤 Last opp kontrakten din for sjekk
Samme vertikal-stack, to innholdstyper. Bedrift: PDF → AI forklarer → «Lest og forstått». Sommerpatrulje: Artikkel med konkrete tall → AI svarer på spørsmål → «Last opp kontrakt»-CTA. Chatfeltet er identisk. Forskjellen: hva som står under chatten – bekreftelsesknapp vs. oppfølgingshandling. Konfigurerbart per organisasjon.

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.

Bedrift 1
Ikke relevant for bedriftsflyten.

Ansatte mottar dokumenter fra arbeidsgiver – de laster ikke opp selv for sjekk.
LO Sommerpatrulje
← AI-sjekk / Din kontrakt
🤖 Sjekk av kontrakten din
Skriftlig kontrakt
Arbeidstid spesifisert
Overtidsbetaling⚠️
Ikke nevnt i kontrakten. Du har likevel krav på 40% tillegg.
Lønn
155 kr/t – under tariff (168,66 kr/t for under 20 år).
Feriepenger
Ikke nevnt. Alle har rett til 10,2% feriepenger.
Oppsigelsestid
2 problemer funnet
Lønnen din er under tariff og feriepenger mangler. Vi anbefaler å ta kontakt med LO.
📞 Kontakt Sommerpatruljen
Ny funksjon, samme plattform. Kontraktssjekken er unikt for rettighetsorganisasjoner. AI sammenligner opplastet dokument med regelverk og tariffavtaler konfigurert i admin-panelet. Sjekklisten bruker samme kortkomponent med status-ikoner (✅ ⚠️ ❌). Kan slås av/på per organisasjonstype.

🏢🏢 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.

Studentens mappestruktur
Documents
▼ Company 1
CONTRACT
HANDBOOK
▶ Company 2
▶ Company 3
📁 MY DOCUMENT
Fil-explorer-logikk.
Kognitivt krevende for målgruppen.
Mapper i mapper i mapper.
Forbedret: Org-switcher
🏥 Solvik sykehjem
☕ Kafé Bjørk
📁 Mine
🏥
Solvik sykehjem
✅ Onboarding fullført
📄 Arbeidskontrakt
✅ Lest
📄 Personalhåndbok
✅ Lest
📄 HMS-rutiner
✅ Lest
🏠Hjem
📁Dok
👤Profil
🔄
Mapper → pill-switcher: I stedet for å navigere en filstruktur, tapper brukeren på organisasjonen de vil se. Én aktiv om gangen. Horisontalt scrollbar om det blir flere.
«Mine» som egen pill: Studentenes «MY DOCUMENT» blir en likeverdig fane ved siden av organisasjonene. Ikke en mappe inni en mappe.
✏️
Kontekst beholdt: Når Kasia velger Solvik sykehjem, ser hun bare dokumentene derfra. Ingen informasjonsoverbelastning.

Skjerm 2: Kasia bytter til Kafé Bjørk

Ett tapp på pillen – hele dashboardet oppdateres med Kafé Bjørks branding, dokumenter og status.

Kafé Bjørk valgt
🏥 Solvik
☕ Kafé Bjørk
📁 Mine
📋 1 dokument venter på deg
Kafé Bjørk
1 av 2 fullført
📄 Arbeidskontrakt
✅ Lest
📄 Allergihåndtering
Ulest
🏠Hjem
📁Dok
👤Profil
Hele konteksten bytter. Branding (blå i stedet for grønn), velkomstkort, dokumenter, status – alt tilhører Kafé Bjørk. Kasia ser bare det som er relevant for denne arbeidsgiveren. Teknisk: samme dashboard-komponent, filtrert på organisasjons-ID.

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.

Mine dokumenter
🏥 Solvik
☕ Bjørk
📁 Mine
Ditt private dokumentarkiv
Last opp dokumenter du vil ta vare på. Kun du har tilgang.
📄 Husleiekontrakt
Lastet opp 3. jan
📄 Lønnsslipp desember
Lastet opp 20. des
📤
Last opp dokument
PDF, bilde eller foto
🏠Hjem
📁Dok
👤Profil
Studentenes idé beholdt: «MY DOCUMENT» fra skissene er tatt med – brukeren kan laste opp egne dokumenter som husleiekontrakt, lønnsslipp, forsikringspapirer.
🔄
Mappe → flat liste: Ingen undermapper. Dokumentene vises kronologisk med opplastingsdato. Enkelt nok for målgruppen.
Tydelig privacy-indikator: «Kun du har tilgang» bygger tillit – spesielt viktig for folk som laster opp sensitive dokumenter som husleiekontrakter.
Upload-CTA: Stor, tydelig «Last opp»-boks med støtte for PDF, bilde eller foto (kamera). Foto-opsjonen er viktig – mange i målgruppen tar bilde av papirdokumenter.

Skjerm 4: Opplastingsflyt

Kasia tar bilde av husleiekontrakten sin. Minimal metadata – bare tittel og valgfri type.

Last opp dokument
← Mine dokumenter
Last opp dokument
📸
husleiekontrakt.jpg
Gi dokumentet et navn
Husleiekontrakt
Type (valgfritt)
Arbeidskontrakt
Husleie
Forsikring
Annet
🤖 Få AI-forklaring?
Vi forklarer innholdet på ditt språk
💾 Lagre
Minimal metadata: Bare to felt – navn og type (valgfritt). Ingen datoer, mapper eller kategorisystemer brukeren må forstå. Type velges med tappbare pills, ikke dropdown.
AI-forklaring som opt-in: Toggle for å få AI til å gå gjennom dokumentet. Gir verdi fra studentenes vault-konsept (ren lagring) + Aigrees kjernefunksjon (forklaring).
Foto-støtte: Mange i målgruppen har papirdokumenter. «Ta bilde» → lagre → få forklaring er en naturlig flyt.

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.

Studentens mappevisning
Documents
▼ Company 1
CONTRACT
HANDBOOK
▶ Company 2
📁 MY DOCUMENT
Mappestruktur krever at brukeren vet hvilken «mappe» et dokument ligger i.
Forbedret: Tidslinje
Dokumenter
Alle
🏥 Solvik
☕ Bjørk
📁 Mine
Januar 2026
📄 Husleiekontrakt
📁 Mine · 3. jan
Desember 2025
📄 Lønnsslipp
📁 Mine · 20. des
📄 Allergihåndtering
☕ Kafé Bjørk · 15. des
📄 Arbeidskontrakt
☕ Kafé Bjørk · 10. des
📄 HMS-rutiner
🏥 Solvik · 1. des
🏠Hjem
📁Dok
👤Profil
🔄
Mapper → tidslinje med filtre: Alle dokumenter sortert kronologisk. Fargekodede venstrekanter viser hvilken organisasjon de tilhører. Filter-pills øverst for å vise bare én kilde.
✏️
Kjent mønster: Tidslinje med filtre er det samme mønsteret som epost-apper, banktransaksjoner, og sosiale medier. Målgruppen kjenner det allerede.
Ingen kognitiv overhead: Brukeren trenger ikke huske «hvor la jeg det?» – alt er synlig, nyeste øverst. Filter om de vil begrense.

Informasjonsarkitektur – Privat bruker

Studentenes sitestruktur for brukersiden. Gule = sider, rosa = popups/modaler.

Landing + sign in → Google
Dashboard - Home
- Overview and quick actions
Settings - Profile and settings
↓ fra Dashboard
Vault - My documents
- Folders
Document preview - Inline view /
split view
Sign document - Return to vault after
↓ fra Document preview
Aigree contract AI - Ask and get help
to understand contract
User handbook for the company
Side / ny page
Pop up / overlay

Informasjonsarkitektur – Bedrift

Studentenes sitestruktur for bedriftssiden. Nesten identisk med brukersiden, men med «Send/share to employee» i stedet for vault.

Landing + sign in → Google
Dashboard - Home
- Overview and quick actions
Settings - Profile and settings
↓ fra Dashboard
Vault - My documents
- Folders
Document preview - Inline view /
split view
Sign document
Send / share the signed document
to employee
Side / ny page
Pop up / overlay
Observasjon: Bruker- og bedriftsflyten er nesten identiske. Eneste forskjell er at bedrift har «Send/share to employee» etter signering. Det mangler: organisasjonsbranding, innholdskonfigurasjon, AI-innstillinger, språkvalg, og «lest og forstått»-flyt.

Module Dependency Diagram

Studentenes tekniske moduldiagram. Viser frontend/backend-skillet og dataflyt fra login via dashboard til kryptert lagring.

Subscription
Login
Generic dashboard
Logout
↙ If User ↘ If Company
Download
User dashboard
Settings
Company dashboard
Company panel
Language module
Upload
Download
Encryption
Security algorithm
Decryption
Database Hook
Database
Frontend (synlig for bruker)
Backend (ikke synlig)
Database
Styrker: Tydelig skille frontend/backend. Kryptering/dekryptering som separate moduler er god sikkerhetstankegang. Database Hook-abstraksjon gir fleksibilitet.

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.