Visitech kundeportal
En selvbetjeningsportal for Visitechs industrikunder, der de kan holde oversikt over produktene de har kjøpt, sende dem inn til reparasjon og følge reparasjonssaker videre på ett sted.

Problemstilling: Visitechs kunder manglet ett sted for å finne produktinformasjon og håndtere reparasjoner og reklamasjoner. Informasjonen var spredt mellom ordrebekreftelser, skjemaer og e-post.
Prosess Gjennom workshops, object mapping og brukertesting kartla jeg behovene og strukturerte portalen rundt produktene kundene eier. Jeg designet løsningen og bygde front end-en med claude code.
Løsning En kundeportal der kundene får oversikt over produktene sine, finner produkt- og garantiinformasjon og registrerer og følger reparasjoner og reklamasjoner.
Hva
Visitech lager avanserte komponenter som brukes i blant annet 3d-printing og andre industrielle maskiner. Kundene er virksomheter over hele verden som kjøper disse produktene og bygger dem inn i egne systemer. Produktene må fra tid til annen sendes tilbake til Visitech for reparasjon eller reklamasjon.
Tidligere hadde kundene ingen felles flate for å holde oversikt over hvilke produkter de hadde kjøpt, og serienumre og garanti lå spredt i gamle ordrebekreftelser og e-poster. Hvis noe måtte repareres, fylte kunden ut et skjema, og så foregikk resten av prosessen på e-post.
Det vi bygger for Visitech, er derfor en helt ny kundeportal som samler dette på ett sted. Kunden kan logge inn og se produktene sine, registrere og følge reparasjoner og reklamasjoner, og etter hvert også håndtere programvare og oppdateringer.
Min rolle
Dette var et kundeoppdrag med et lite team bestående av meg som designer og to utviklere. Jeg hadde ansvar for konseptet og hele UX-designet, fra å forstå domenet og finne ut hva portalen skulle være, til struktur, brukerflyter og ferdige grensesnitt.
Jeg bygde også front end-en selv i kodebasen ved hjelp av claude. Utviklerne hadde ansvar for backend, api-er og integrasjoner mot Visitechs systemer, i tillegg til å sette opp repoet slik at vi kunne jobbe på denne måten.
Prosess
Startpunkt: Kundens egen prototype. Visitech kom opprinnelig til oss med en idé om en reparasjonsportal og en tidlig prototype som viste hva de så for seg. Tanken var først og fremst å gi kundene bedre oversikt over reparasjonssakene sine.
Prototypen var et godt utgangspunkt for å forstå ambisjonen, men jeg brukte den først og fremst som utgangspunkt for diskusjon. Før vi låste løsningen, gikk jeg tilbake til behovene og prøvde å forstå hva kundene faktisk trengte å gjøre, og hvordan informasjonen i systemet hang sammen.
Kundeworkshops. Sammen med Visitech kartla jeg hvem som bruker løsningen, hvilke typer saker de håndterer, og hva som faktisk skjer fra et produkt får et problem til det er tilbake hos kunden. Målet var å forstå domenet godt nok til å kunne gjøre denne prosessen enkel og forståelig i portalen.
I workshopene kom det frem at behovet var større enn bare å følge reparasjonssaker. Kundene manglet også et sted der de kunne se hvilke Visitech-produkter de hadde, finne informasjon om dem og se historikken deres. Det gjorde at vi begynte å se på løsningen som en kundeportal, ikke bare en reparasjonsportal.
Object mapping (ooux). Før jeg begynte å designe skjermer, kartla jeg de viktigste tingene brukeren forholder seg til i portalen og hvordan de henger sammen. Disse tingene var blant annet assemblies, components, ulike salgsordre og reparasjonssaker (RMA).
Denne kartleggingen gjorde det enda tydeligere at produktene måtte stå sentralt i løsningen. En reparasjonssak eksisterer fordi noe har skjedd med et produkt, og det samme produktet har også informasjon, historikk, garanti og etter hvert programvare knyttet til seg. Produktet ble derfor et naturlig utgangspunkt for strukturen i portalen.
Da objektene og relasjonene mellom dem først var på plass, ble det også enklere å finne en naturlig navigasjon og struktur for skjermene.

Prototype og brukertester. Med denne strukturen som utgangspunkt bygde jeg en prototype med claude design og testet den med kunder av Visitech. Testene bekreftet hovedbehovene og ga meg konkrete innspill til blant annet språk, informasjonsmengde og flyt.
AI-drevet design-til-kode (AI dlc). Design og utvikling foregikk hånd i hånd. Jeg designet i figma og claude design og bygde selve front end-en i repoet med claude code.
Den korte veien fra idé til fungerende grensesnitt gjorde at jeg kunne prøve ut løsninger direkte i den faktiske portalen, ikke bare i en klikkbar prototype. Jeg kunne gjøre en endring i designet, bygge den og se hvordan den fungerte i løsningen uten å være avhengig av en tradisjonell overlevering til en utvikler. Det gjorde det mulig å iterere raskere og ga meg mer kontroll over hvordan designet faktisk ble implementert.
Resultat
Portalen er i dag en pilot som videreutvikles, men kjernen i løsningen er på plass. Kunden kan logge inn og få oversikt over Visitech-produktene sine, se serienummer, part-nummer og garanti, registrere en reparasjon eller reklamasjon på få minutter og følge saken videre i en tydelig tidslinje.
På sikt skal portalen også brukes til blant annet programvare og oppdateringer. Det som startet som en løsning for å følge reparasjonssaker, har dermed blitt en felles inngang til produktene kunden har hos Visitech.
Underveis bygde jeg også opp et gjenbrukbart designsystem med komponentbibliotek og designtokens som er speilet mellom figma og kode. Det gir et konsistent grensesnitt på tvers av portalen og gjør det enklere for både meg og utviklerne å bygge videre på løsningen.
Brukertestene bekreftet at det fungerer godt å samle produktoversikt og reparasjonssaker på ett sted. Informasjon som tidligere var spredt mellom ordrebekreftelser, skjemaer og e-poster, blir samlet i en struktur og et språk kundene kjenner igjen. Det gjør en tidligere uoversiktlig prosess mer forståelig og forutsigbar.
For min egen del var dette et prosjekt der jeg fikk eie hele veien fra brukerinnsikt og konsept, gjennom ooux og interaksjonsdesign, til front end-koden. Ved å bruke AI-verktøy både i design og implementasjon kunne jeg ta mer ansvar for helheten enn det en tradisjonell designrolle vanligvis gir rom for.



























