Sidestruktur

Webdesign

En nettside som gjør veien til lappen lett å følge

Fram Trafikkskole på Sofiemyr har blå biler som folk kjenner igjen i trafikken. Vi laget sidestrukturen og designet en nettside i samme blå, der eleven ser hele løpet fra første time til oppkjøring.

Kunde

Fram Trafikkskole

Bransje

Trafikkskole

Leveranse

Sidestruktur og webdesign

År

2026

Fram Trafikkskole sine blå biler på rad

Fra trafikalt grunnkurs til oppkjøring

Fram gir opplæring i bil, motorsykkel og tilhenger, i tillegg til trafikalt grunnkurs. Målet er at eleven skal gå fra første time til oppkjøring trygg, klar og selvsikker.

Nettsiden skulle vise hele løpet, prisene og lærerne, så eleven vet hva som venter før første time.

Ideen

Det blå fra bilene lyser mot en mørk bakgrunn, som et frontlys i mørket.

Uttrykket

Logoen står hvit, som på bilene

Logoen er Fram sin egen og var på plass før vi startet. Den håndskrevne «Fram» har en sveip over seg som ligner en vei som svinger fremover.

På den mørke nettsiden står logoen hvit, akkurat som på bilene. Nettsiden og bilene ser ut som samme avsender.

Fram Trafikkskole-logoen på lys og mørk bakgrunn

Blått fra bilene, gult som i trafikken

Blått er fargen folk allerede forbinder med Fram, fordi bilene er blå. Når nettsiden bruker samme blå, kjenner eleven igjen skolen fra trafikken. Den mørke bakgrunnen får det blå til å lyse og gjør bildene av bilene tydelige.

Gult brukes bare på stjernene i anmeldelsene og som varsel, slik gult brukes i trafikken. Da beholder fargen betydningen sin.

Blå

#3C82F5

Mot nesten svart 5,3:1

Lys blå

#84B0F9

Mot nesten svart 8,9:1

Gul

#FFB916

Mot nesten svart 11,3:1

Mørk blå

#181E2F

Hvit tekst 16,6:1

Nesten svart

#0A0D12

Hvit tekst 19,5:1

Lys grå

#E9EAEB

Mot nesten svart 16,2:1

Trafikklys på kursene

Kursene har statusmerker i trafikklysets farger: grønt for ledige plasser, gult for få plasser og rødt for fullbooket.

Alle som skal ta lappen, kan det språket fra før. Eleven ser om det er plass på kurset uten å lese.

Ledige plasser

Få plasser

Fullbooket

Kurs med statusmerker i trafikklysfarger
Typografien til Fram Trafikkskole med Bebas Neue og Urbanist

Skilttekst i overskriftene

Bebas Neue er høye, smale versaler som minner om tekst på veiskilt, og passer en trafikkskole. De smale bokstavene gir plass til lange norske ord som «førerkortklasse» i store overskrifter, også på mobil.

Smale versaler blir tunge å lese i lengre tekst. Brødteksten er derfor Urbanist, en rund og vennlig font som passer elever som ofte er unge.

Nettsiden

Frams egne biler i toppen

Toppbildet viser bilene på rad, ikke stockbilder, så eleven ser bilen hen skal kjøre. Overskriften er «Førerkortet gjort enkelt, trygt og oversiktlig».

Knappen «Kom i gang med lappen» har samme blå som bilene, og Google-vurderingen står rett under.

Toppen av forsiden til Fram Trafikkskole med de blå bilene
Trafikalt grunnkurs i et bredt kort og tre kort for førerkortklassene

Grunnkurset får det brede kortet, som naturlig første steg

Trafikalt grunnkurs ligger øverst i et bredt kort, fordi alle må ta det før de kan øvelseskjøre.

Klasse B, A/A1/A2 og hengerkurs står under i tre like kort, hver med sitt eget kjøretøy på blå flate. Eleven finner riktig klasse på tegningen.

Tjenestene er valgt i rekkefølge etter popularitet, for å bidra til en enklere kundereise og flere konverteringer. 

En bil som kjører nedover siden

«Slik hjelper vi deg frem til førerkortet» er tegnet som en vei. En liten blå bil kjører nedover tidslinjen når man scroller, og streken bak den blir blå.

Stegene veksler side med bilder fra Frams egen opplæring, så løpet får ansikter og steder.

Veien til førerkortet tegnet som en tidslinje med en blå bil
Tre prispakker der den midterste er merket Mest populær

Pakkekonsepter som eksempel i designfasen

Som en del av prosjektet foreslo Replan å legge frem pakker, på lik linje med de største i bransjen.

Fram Basic koster 29 500 kr, Fram Standard 32 062 kr og Fram Total 37 400 kr. Prisene står i samme font som overskriftene og leses like raskt som et skilt.

Den midterste pakken er fylt med blått og merket «Mest populær», og prismatch er forklart rett under.

Én anmeldelse om gangen

Hver anmeldelse får hele bredden, med store, svake anførselstegn rundt.

Den aktive prikken under er strukket ut i blått som en fremdriftsmåler, så man ser at det finnes flere.

Anmeldelse fra en elev med prikker under
Avslutningsblokken med fire løfter, to knapper og lærerne

Lærerne til slutt

Alle sidene slutter med samme blokk: fire korte løfter med hake, to knapper og en video av lærerne.

Det siste eleven ser før hen bestemmer seg, er menneskene som skal sitte i passasjersetet.

Alle sider

Bestilling øverst til høyre

Bestillingsknappen står i blått øverst til høyre på alle sider. Det er ett klikk til å bestille, uansett hvor eleven er.

Forsiden

Svarene før spørsmålet

Prismatch, gratis avbestilling og Google-vurderingen står rett under toppen. Det er det de fleste lurer på før de bestiller.

Veien til lappen

Strekningen du har kjørt

Streken bak bilen blir blå mens man scroller. Eleven ser hvor i løpet hen er, og hva som gjenstår til oppkjøring.

Bla gjennom sidene

Forsiden, prissiden og tjenestesiden deler meny, farger og avslutningsblokk. Hold musepekeren over en side for å bla nedover den.

Forsiden

Priser

Hele prissiden til Fram Trafikkskole

Tjenester

Hele tjenestesiden til Fram Trafikkskole
To fra Replan jobber sammen ved et møtebord på kontoret

Ta en prat med oss om nettside og branding

Vurderer du å ta et steg opp i bransjen? Vi hjelper deg med å kartlegge hvilke løsninger din bedrift trenger, og hvilke løsninger som er tilgjengelige i ditt budsjett.

Kontakt oss
Secret Link