Clausens Fiskehandel

Projektbeskrivelse
Dette projekt blev lavet i grupper på 1. semester af Multimediedesigner-uddannelsen. Formålet med opgaven var at forbedre vores evner inden for programmering og at sikre, at vores design kunne gøres responsivt, så det fungerede optimalt på både mobil og desktop. Vi skulle arbejde med et eksisterende website og optimere det ved at gøre det mere brugervenligt, overskueligt og funktionelt.

Vi valgte at arbejde med Clausens Fiskehandel, en velrenommeret fiskeforretning i Aarhus, da deres eksisterende hjemmeside var rodet, forvirrende og ikke brugervenlig. Opgaven gik ud på at skabe en ny og forbedret hjemmeside med fokus på brugervenlig navigation og en informationsarkitektur, der gjorde det let for både unge og ældre kunder at finde den information, de ledte efter.

Målgruppe
Clausens Fiskehandel har en bred målgruppe, men vi identificerede især to primære segmenter:

  • Ældre kunder (45+): Disse kunder har handlet i butikken gennem mange år og forventer god service og kvalitet. De har ofte behov for en overskuelig og lettilgængelig hjemmeside.

  • Yngre kunder (20-40 år): En digitalt vant målgruppe, som søger information online og ønsker en moderne og inspirerende hjemmeside.

Indhold og Designproces
For at optimere Clausens Fiskehandels hjemmeside arbejdede vi gennem en struktureret designproces:

Research: Vi gennemførte interviews, analyserede brugerbehov og undersøgte, hvordan nuværende kunder navigerede på hjemmesiden.

Moodboard og Style Tiles: Vi udviklede et visuelt univers med en maritim farvepalette inspireret af havet og fiskemiljøet.

Wireframes og Mockups: Vi skitserede forskellige layoutmuligheder og skabte en prototype, der sikrede en intuitiv brugeroplevelse.

Responsivt Design: Hjemmesiden blev udviklet med en mobile-first tilgang, så den fungerede optimalt på smartphones, tablets og desktops.

 

Teknologi og Programmering
For at sikre en responsiv og brugervenlig hjemmeside implementerede vi følgende teknologier:

  • HTML & CSS: Struktureret og semantisk korrekt kode med fokus på fleksibilitet.

  • Flexbox & Grid: Brug af moderne CSS-teknikker for at sikre et responsivt layout.

  • Media Queries: Tilpasning af designet, så det skalerede og fungerede på alle skærmstørrelser.

  • Interaktive Elementer: Implementering af hover-effekter, let tilgængelig navigation og dynamiske billeder for at forbedre brugeroplevelsen.

Projektet gav os værdifuld erfaring med at optimere og redesigne en eksisterende hjemmeside med fokus på responsivt design. Vi har lært vigtigheden af brugerundersøgelser, informationsarkitektur og struktureret kodning. Gennem dette projekt har vi forbedret vores evner i både design og programmering og skabt en løsning, der er langt mere intuitiv og brugervenlig end den oprindelige hjemmeside.

© 2025 All Rights Reserved.