TechDealsNL

TechDealsNL is een fictieve Nederlandse webshop voor consumentenelektronica, gebaseerd op het bestaande merk TechDealsAsia. Dit project is uitgevoerd tijdens het vak Patterns of Interaction en richtte zich op het ontwerpen van een complete webshopervaring, van de homepagina tot en met het aankoopproces.

Gebruikte tools en software

Figma icon

Figma

Preview of TechDealsNL home pagina
Preview of TechDealsNL home pagina

Probleem

  • Er is momenteel nog geen website om producten te verkopen aan de Nederlandse markt.

Doelgroep

  • Mensen van alle leeftijden die technologie gerelateerde producten nodig hebben.
  • Mensen die op zoek zijn naar een goede deal voor technologie producten.
  • Mensen die een gebruiksvriendelijke webshop willen.

Einddoel

Het doel was om een gebruiksvriendelijke webshop te ontwerpen waarin verschillende UX- en UI-patronen worden toegepast om gebruikers efficiënt door het aankoopproces te begeleiden.

Mijn rol als UX designer

Als UX Designer was ik verantwoordelijk voor het ontwerpen van de volledige webshopervaring. Daarbij lag de focus op het toepassen van interactiepatronen en ontwerpprincipes die bijdragen aan een gebruiksvriendelijke ervaring.

Uitvoering

Tijdens dit project lag de focus op het ontwerpen van een complete webshopervaring, inclusief productpagina's, categorieoverzichten, winkelwagen en checkout. Gedurende het ontwerpproces zijn verschillende UX- en UI-patronen toegepast, zoals visuele hiërarchie, nabijheid, dropdownnavigatie en image sliders. Het project begon als een reeks kleinere opdrachten waarin afzonderlijke patronen werden onderzocht en uitgewerkt. Uiteindelijk zijn deze onderdelen samengebracht tot één samenhangend hi-fi prototype van de webshop.

Gebruikte methoden en technieken

  • Deskresearch
  • Gestalt principes
  • Wireframes
  • Moodboards
  • Hi-fi clickable prototype
Preview of TechDealsNL home pagina
Preview of TechDealsNL home pagina

Kleuren

Het kleurenpalet is gebaseerd op de bestaande kleuren van TechDealsAsia. Groen versterkt de herkenbaarheid van het merk, terwijl geel wordt ingezet voor belangrijke call-to-actions zoals het toevoegen van producten aan de winkelwagen. Hierdoor zijn belangrijke interacties direct herkenbaar voor gebruikers.

Kleurenpalet

#056839Donker groen
#FFB400Helder geel
#FFFFFFZuiver wit
#F02E22Fel rood

Typografie

Voor dit project is gekozen voor de combinatie van Share Tech en Droid Sans. Share Tech ondersteunt het technologische karakter van het merk, terwijl Droid Sans zorgt voor een rustige en goed leesbare basis voor productinformatie en navigatie.

Titles

Share Tech

ABCDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz

0123456789

Tekst

Droid Sans

ABCDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz

0123456789

Preview of SpaceX home pagina

SpaceX

Mijn rol in dit project:UX designer

Het doel was om meerdere interactieve webapplicaties te ontwerpen en ontwikkelen die astronauten tijdens verschillende fasen van hun reis kunnen ondersteunen.

Toon volgende project