Sustainable web

Varighed: 4 uger

Projekttype: Gruppeprojekt + individelt

Værktøjer: Figma, Html, Css, JavaScript, Google Lighthouse, Wave

Projekt beskrivelse

Sustainable Web er et redesign af Spilcaféens spiloversigt med fokus på bæredygtigthed, webtilgængelighed, responsivt design og forretningspotentiale.

Projektet tager udgangspunkt i en tidligere løsning, som blev analyseret gennem webaudits og brugertests. Målet var at identificere og forbedre udfordringer inden for performance, tilgængelighed for at skabe en mere bæredygtig, intuitiv og inkluderende spiloversigt.

Problem

Når forbindelser brydes

Før

Spilcafe 1.0

  • Forvirrende navigation
  • Utilgængelig tastaturbetjening
  • Manglende labels og semantik
  • Forstyrrende brugerflade
  • Dårligt mobilflow

Efter

Spilcafe 2.0

  • Intituv navigation
  • Tilgængelig navigation med mus og tastatur
  • Tydelige labels og semantik
  • Enkel og rolig brugerflade
  • Optimeret responsivt flow

Proces

Fra analyse til forbindelse

1. Analyse og indefikation af problemer

Den eksisterende spiloversigt blev undersøgt gennem automatiserede- og manuelle test. Lighthouse, Wave og EcoGrader identificerede problemer med performance, tilgængelighed og bæredygtighed, mens brugertests viste udfordringer med navigation, filtrering og indhold. Resultaterne dannede grundlag for de vigtigste forbedringer.

2. Design og redesign

Med udgangspunkt i analysen opdaterede jeg styletile og undersøgte relevante designkonventioner. Derefter udviklede jeg et nyt layout og en prototype i Figma med fokus på en tydeligere og mere overskuelig brugeroplevelse. Samtidig arbejdede jeg med at skabe et roligere visuelt udtryk.

3. Optimering og implementering

Det nye design blev omsat og HTML, CSS og JavaScript blev optimeret. Jeg fjernede bl.a. den forstyrrende karrusel, forbedrede navigation og tastaturbetjening, tilføjede korrekte labels og implementerede et nyt system til favoritknapperne. Løbende tests blev brugt til at kontrollere, om ændringerne forbedrede løsningens performance og tilgængelighed.

Billede af Sustainable web projekt proces med testresultater, wireframes, styletile  m.m
× Billede af sustaniable-web projekt proces, med persona, wireframes, styletile, moodboard, produktbilleder m.m

Resultatet

Design, der forbinder mennesker og miljø

Mockup af spilcaféens spiloversigt interface

Resultatet blev en optimeret og mere tilgængelig spiloversigt med fokus på bæredygtighed, performance og en intuitiv brugeroplevelse. Billeder, navigation, filtrering og tastaturbetjening blev forbedret for at gøre løsningen både mindre ressourcekrævende og nemmere at bruge.

Projektet gav mig erfaring med at bruge webaudits og brugertests til at identificere problemer og omsætte dem til konkrete design- og udviklingsløsninger. Samtidig fik jeg en større forståelse for, hvordan bæredygtighed og webtilgængelighed kan tænkes ind gennem hele designprocessen.

← Tilbage til forside