Andreas Koutsoukos
← All work

Verkkokauppa.com

2018

Consistency for a large online store.

An atomic design system connecting Sketch libraries and React components.

Client / Project
Verkkokauppa.com
My role
UX Designer
Focus
Atomic design system and interface library for Verkkokauppa.com
Navigation components and product cards for Verkkokauppa.com
Verkkokauppa.com · Interface libraryClick image to view full size ↗

01 / Verkkokauppa.com

A broad service needs shared patterns.

The Verkkokauppa.com interface library brought the store’s core views and components together into one consistent design language.

A broad service, multiple device types and a rapidly changing product range required scalable solutions and shared component states.

02 / Verkkokauppa.com

Build from the smallest pieces.

I built an atomic design system in Sketch and defined the structure of the React components in collaboration with the development team.

Working inside the agile development process meant connecting user interface design with the decisions needed to implement those components.

  • Atomic design library in Sketch
  • Shared component states
  • React component structure with the development team

03 / Verkkokauppa.com

Bring design and implementation together.

The work covered user-centered design artifacts, requirements, research and high-fidelity interface design. The interface library gave those decisions a shared place across the store’s views.

My contribution & tools

  • UX design
  • Atomic design
  • Sketch
  • UI design
  • React component collaboration

Next project

Ruokavirasto

Two services, one consistent experience.

Vipu & Tukisovellus design and development

View case study