Tomatpassion

Bakgrund

Tomatpassion är en e-handelsplattform, en webbplats som säljer frön och delar kunskap om odling. Webbplatsen hade en tydlig målgrupp men saknade en enhetlig visuell identitet och vissa delar av strukturen kunde förbättras.

Utmaning

  • Otydlig navigationsstruktur

  • Dubbla sidor med liknande innehåll (Tomatkunskap, Blogg)

  • Låg kontrast i text och knappar

  • Avsaknad av tydlig startsida (hero-sektion)

  • Begränsad personlig närvaro (“Om mig”)

  • Tydliga signaler för interaktion i Blogg sidan, vilket kan skapa osäkerhet hos användaren.

Heuristisk analys
Identifierade flera usability-problem, bland annat struktur, kontrast och otydlig interaktion.

Kvantitativ research
Genomförde en kvantitativ datainsamling med 14 användare. Resultatet visade att köpfunktionen fungerar bra men att vissa begrepp och strukturer kan förtydligas

Process

Branding & design
Utvecklade en ny visuell identitet med fokus på personlighet, kunskap och engagemang. Tog fram färgpalett, typografi och en ny logotyp.

Design & prototyp
Skapade design system i Figma och tog fram en prototyp med förbättrad struktur, tydligare navigation och bättre kontrast (Desktop-version, mobilversion).

Implementation
Implementerade designen i WordPress (Elementor) och uppdaterade flera sidor enligt den nya strukturen.

Resultat

Redesignen resulterade i en mer användarvänlig och sammanhållen upplevelse, med fokus på tydlighet, struktur och tillgänglighet.

Startsidan
Ny startsida med tydligare struktur, förbättrad visuell hierarki och en introducerande hero-sektion som kombinerar inspiration och e-handel. Omstrukturerad navigation och kategorisering för att göra det enklare för användaren att hitta rätt produkter.

Blogg sidan
Förtydligade interaktionen i bloggsektionen genom att introducera knappar, vilket gör det mer intuitivt för användaren att navigera vidare till hela artiklar.

Produktsidor
Förbättrad kontrast i produktbeskrivningar och knappar för att öka läsbarhet och tillgänglighet.

Sektion “om mig” / Footer
Introducerade mer personlig kommunikation för att stärka förtroendet och skapa en mer mänsklig upplevelse av varumärket.

Ny footer

Mobilversion
Analys av användarbeteende visade att webbplatsen används i lika stor utsträckning på desktop och mobil. Detta resulterade i att designlösningen anpassades för att fungera optimalt på båda enheterna.

Projektet är i slutfas och vissa delar är fortfarande under utveckling.

Nästa
Nästa

UX : Stig- digitaltjänst för karriärmatchning