Utvalgt arbeid

ODVVS

Oversikt

Et nettsted for tjenestene til Oslo & Drammen VVS.

Detaljer

At a glance

Type prosjekt
Tospråklig tjenestenettsted
Min rolle
Designet og implementerte nettstedet, fra struktur og visuell retning til den tospråklige byggingen.
Kategori
Nettopplevelser
Status
I drift2026
AI i produktet
Ingen AI i driftNettstedet har ingen AI-funksjon i drift.

Hva jeg gjorde

  • Definerte strukturen på nettstedet og veien fra en tjeneste til en henvendelse
  • Designet den visuelle retningen, hierarkiet og de responsive oppsettene
  • Implementerte det tospråklige nettstedet med automatiske ytelses- og visuelle kontroller
  • Forberedte det tekniske grunnlaget for en senere nettbutikkfase

AI i prosessen

Planlagt, designet og implementert med AI-assistert utvikling. AI-verktøy hjalp meg med å utforske løsninger, skrive utkast til implementasjon og tester, og gå gjennom kode. Jeg bestemte omfanget, strukturen, hva som ble testet og hva som ble sluppet.

Bygget med

  • TypeScript: Applikasjonskode
  • Next.js: Rammeverk, ruting og bildeoptimalisering
  • Tailwind CSS: Stiling
  • next-intl: Norske og engelske ruter og innhold
  • Motion: Innganger og overganger i grensesnittet
  • Playwright and Lighthouse CI: Visuell regresjon og ytelsesbudsjetter i CI
  • Vercel: Drift og forhåndsvisninger

Besøk nettstedet(opens in a new tab)Discuss a project like this

Neste prosjekt

Boligplass
The Oslo & Drammen VVS homepage: three plumbers in navy uniforms under a clear sky, with four service cards for plumbing, ventilation, core drilling and new bathrooms

Behovet

En bedrift innen rør, ventilasjon og service trengte et nettsted som presenterer tjenestene tydelig, gir besøkende en direkte vei til en rørlegger, og fungerer på både norsk og engelsk. Det måtte også gi rom for en senere nettbutikk uten å bygge nettstedet på nytt.

Mitt bidrag

Jeg definerte strukturen, designet den visuelle retningen og oppsettene, og implementerte nettstedet. Bedriften leverte fotografi, tjenestebeskrivelser og kontaktopplysninger. Bransjeerfaringen og sertifiseringene som vises på nettstedet tilhører selskapet.

The Oslo & Drammen VVS homepage: three plumbers in navy uniforms under a clear sky, with four service cards for plumbing, ventilation, core drilling and new bathrooms
Forsiden: menneskene først, så de fire tjenestene som en bilderad.

Beslutning

Menneskene først, tjenestene etterpå

Bakgrunn
Kunder i håndverksbransjen velger et firma de stoler på, og bedriften hadde sterke bilder av sitt eget team.
Hva jeg bestemte
Åpningsskjermen viser teamet i full bredde, med de fire tjenesteområdene som en bilderad rett under og en kontaktknapp i toppen.
Avveining
Et stort åpningsbilde koster båndbredde, så det leveres tilpasset skjermen, og tjenesteraden er innenfor rekkevidde på første skjerm på telefon.
Slik fungerer det
  • To registre i én kodebase: merkevaredrevne markedssider og et nyttebetont butikkområde, forberedt for en senere fase.
  • Norsk og engelsk er separate lokaliserte ruter med felles komponenter, slik at innholdsendringer treffer begge språk.
  • Visuelle regresjonssnapshots og Lighthouse-budsjetter kjører i CI, slik at en layoutendring eller en ytelsesregresjon fanges opp før den deployes.

Verifisering og leveranse

Nettstedet ble sjekket mot ytelsesbudsjetter og visuelle snapshots ved hver endring, gjennomgått i mobil- og desktopbredde, og publisert som fase én. Nettbutikken er en senere fase og inngår ikke i denne casen.

Resultat og refleksjon

Publiserte et tospråklig tjenestenettsted. Den tydeligste lærdommen var at en håndverksbedrift trenger færre og bedre sider: én sterk vei fra en tjeneste til en henvendelse gjør mer enn en stor meny.