Een user interface die perfect aansluit op de machine

Bij het ontwerpen van de Graphical User Interface (GUI) voor de ZIA stond voor Scope vast dat deze visueel perfect moest aansluiten op de vormgeving van de koffiemachine van de Jong Duke. Vooral de verticale oriëntatie, die kenmerkend is voor deze koffiemachine, komt ook in de GUI sterk naar voren.

Interactie structuur ontwerp

Bij het ontwikkelen van de GUI is gestart met het beschrijven van alle benodigde functionaliteiten en hun onderlinge afhankelijkheden in een blokkenschema. Wat moet de machine kunnen? Welk scherm toont wat? Welke knoppen geven toegang tot welke functies? En wat is een logische plek voor alles? Zo is in deze fase de hele interactie met de machine schematisch weergegeven.

Wireframe schetsontwerp

Vervolgens zijn per onderdeel uit het blokkenschema verdere bijzonderheden nader uitgewerkt. Wat zit er nu precies in ieder blok? Welke knoppen willen we plaatsen? Hoe belangrijk zijn de knoppen in hun functie? En waar geven we ze plek en hoe groot moeten ze zijn? In deze fase komt dus het totale wire-frame ontwerp tot stand. Scope heeft hiervoor al in deze fase meerdere concepten zo ver uitgewerkt, dat er een beeld ontstond over hoe de interface er straks uit zou gaan zien. Voor De Jong Duke een houvast in het bepalen van de juiste richting en de keuze voor een bepaald concept.

Detailontwerp

Na de keuze voor een van de schetsontwerp richtingen, heeft Scope het ontwerp uitgedetailleerd en pixel perfect afgemaakt. Daarbij werd bij elke  iteratie slag het ontwerp getest op het daadwerkelijke display van de Zia. Omdat elk scherm andere karakteristieken heeft (resolutie, kleur diepte, contrasten), wilden de Scopers geen genoegen nemen met het beoordelen van het ontwerp op de eigen Apple beeldschermen. Op deze manier ontstond zekerheid over dat de interface er straks op de koffiemachine uit zou zien zoals bedoeld.

De files werden vervolgens zo opgeleverd dat de software programmeurs bij De Jong DUKE er mee aan de slag konden. Door ook in deze fase nauw samen te werken, creëerde Scope met het team een interface die er goed uit ziet, fijn bedient en strak werkt.

Productafbeeldingen

Laatste fase bestond uit het bepalen van het uiterlijk van alle onderdelen van de GUI. Hier werd door Scope gekozen voor het maken  van computer renderingen van de benodigde productafbeeldingen. Op die manier ontstond de gewenste flexibiliteit; alles wat nodig was aan afbeeldingen kon worden gemaakt. En Scope vond het belangrijk om zelf te kunnen bepalen hoe de inhoud, de koffie, thee e.d. zouden worden weergegeven. Met de juiste weergave van de kwaliteit van deze producten moest een zo aantrekkelijk mogelijk, maar wel realistisch beeld worden geschetst van wat je kunt krijgen uit de ZIA koffieautomaat.