Onzichtbaar design is eenvoudig en elegant en trekt de aandacht niet naar zich toe, het stelt gebruikers in staat om snel hun doelen te bereiken met minimale inspanning, maximale efficiëntie. Kortom, onzichtbaar design creëert gebruikerservaringen die zo natuurlijk zijn dat ze 'onzichtbaar' aanvoelen: niet kunstmatig ontworpen.
Het meest herkenbare voorbeeld van onzichtbaar ontwerp is waarschijnlijk de startpagina van Google. Er zijn geen visuele afleidingen en de pagina is recht voor z'n raap. Het grootste onzichtbare ontwerpdetail is de autofocus op de zoekbalk bij het laden van de pagina, wat de bruikbaarheid vergroot.
De beste ontwerpbeslissingen zijn degene die je niet eens opmerkt. Om een onzichtbaar ontwerp te maken, moet je de fundamenten, d.w.z. typografie, kleuren, knoppen, componenten, ruimte, raster, grootte en positionering, feilloos integreren. Deze elementen moeten op één centrale plek worden gedefinieerd en vervolgens worden gebruikt voor het hele product dat je ontwerpt.
Een van de manieren waarop we dit bij ACA doen, is door een UX/UI-ontwerptaal te creëren in de vorm van een componentstijlgids en deze strikt te volgen in onze projecten. Je kunt meer te weten komen over wat een component stijlgids is en waarom het zo belangrijk is om er een te hebben in een van onze eerdere blog posts.
Mensen verwarren onzichtbaar design vaak met minimalistisch design, maar dat is niet hetzelfde. Minimalistisch design is een manier om onzichtbaar design te bereiken, maar het is niet het hoofddoel. Minimalisme is een visueel concept dat afleidingen wegwerkt voor een schone UI. Alleen het absoluut noodzakelijke wordt opgenomen en daarom bevatten minimalistische ontwerpen veel witte of lege ruimte.
Een goed ontwerp wordt onzichtbaar als het goed wordt uitgevoerd. Het is pas wanneer het slecht is gedaan dat we het opmerken.
- Jared Pool , Schrijver, onderzoeker, spreker, docent en expert op het gebied van bruikbaarheid, software, ontwerp en onderzoek. op Jared Pool
Een onzichtbaar ontwerp is dus een goed ontwerp. Maar hoe bereik je eigenlijk een onzichtbaar ontwerp? We hebben hieronder een aantal tips verzameld die je kunnen helpen.
Het menselijk oog heeft de neiging om een relatie op te bouwen tussen gelijksoortige elementen in een ontwerp. Je kunt gelijkenis bereiken met basiselementen zoals typografie, vormen, kleuren, spatiëring en grootte.
Een component stijlgids is de beste manier om visuele consistentie te brengen in je product. Deze moet alle belangrijke richtlijnen bevatten voor de identiteit en de stem van je product. Elementen die op dezelfde manier worden waargenomen vormen de visuele consistentie. Dit verlaagt de leercurve, bijvoorbeeld voor nieuwe schermen die dezelfde visuele elementen gebruiken.
Het principe van functionele consistentie lijkt erg op visuele consistentie. Als de functionaliteit van je product consistent is, wordt het bruikbaarder en makkelijker te leren voor gebruikers als vergelijkbare acties, formulieren en elementen op dezelfde manier werken en/of zich op dezelfde manier gedragen.
Vergelijkbare patronen die zich op dezelfde manier gedragen vergroten de voorspelbaarheid van het ontwerp, en voorspelbaarheid leidt ertoe dat gebruikers zich veilig en zeker voelen.
Vereenvoudig je gebruikersstromen door je stappen tot een minimum te beperken om verwarring te voorkomen. Laat je gebruikers niet merken wat ze aan het doen zijn, laat ze zo min mogelijk nadenken door eenvoudige en duidelijke stappen.
Als een actie die vier stappen vergt gemakkelijk in twee stappen kan worden voltooid, moet je altijd kiezen voor taken met het minimum aantal gemakkelijk uit te voeren acties.
Het gebruik van één vaste toon in teksten en andere vormen van communicatie maakt het ontwerp consistent en herkenbaar. Het geeft je ook een manier om vertrouwen op te bouwen bij je gebruikers, omdat ze weten wat ze van je kunnen verwachten.
Visuele stroming gaat over beweging en richting, en het oog van het ene deel van een compositie naar het andere leiden in de richting waarin jij wilt dat het zich beweegt. Je kunt flow creëren door een combinatie van visueel gewicht en visuele richting.
Voeg elementen toe die als barrières dienen om de richting waarin het oog beweegt te veranderen. Creëer open paden in de lege ruimte zodat je gemakkelijk door en tussen je positieve ontwerpelementen kunt bewegen. Dit zorgt voor evenwicht en harmonie in je ontwerp.
Hieronder staan een paar voorbeelden. Je kunt op de miniaturen klikken om naar de echte webpagina te gaan en deze in meer detail te bekijken.
Met de beweging in de illustraties (pijl die naar beneden wijst en diagonale illustratie) kun je je gebruikers door de pagina leiden.
Het zichtbare (witte) blok & tekst binnen een viewport suggereert dat de gebruiker naar beneden kan scrollen voor meer inhoud.
De achtergrondillustratie (linksonder) en een open leeg pad tussen secties suggereren dat er meer inhoud is onder wat momenteel zichtbaar is.
Mensen zoeken overal naar patronen, zelfs op het web. We zoeken relaties tussen de dingen die we zien en haken in op patronen die deze relaties bevestigen. Dus waarom het wiel opnieuw uitvinden als het gaat om de manier waarop mensen door een site, app of formulier navigeren? Gebruik patronen die gebruikers gewend zijn te gebruiken. We gebruiken het web tenslotte al geruime tijd en er zijn al bruikbare, beproefde oplossingen.
Gebruikersinterface (UI) patronen zijn herbruikbare oplossingen voor veelvoorkomende bruikbaarheidsproblemen. Wanneer gebruikers dezelfde oplossing geïmplementeerd zien in verschillende producten, zijn dergelijke oplossingen niet alleen vertrouwd voor hen geworden, maar worden ze ook verwacht.
Testen biedt de kans om vroeg in het proces feedback van gebruikers te verzamelen en je ontwerpbeslissingen te onderbouwen voordat je iets gaat bouwen.
Met een klikbaar prototype kun je de interactie van gebruikers met het ontwerp observeren. Stel een duidelijk doel vast voor uw prototype en volg uw vooraf bepaalde eisen. Je kunt al vroeg in het ontwikkelproces het gedrag van gebruikers bestuderen en aanpassingen maken aan je ontwerp om de ervaring van de gebruiker te verbeteren.
Er zijn verschillende tools die we binnen onze teams gebruiken. Dit zijn de belangrijkste:Adobe XD,Marvel enInvision.
Zoals je misschien al hebt gemerkt,is consistentie een belangrijk ontwerpprincipe voor onzichtbaar ontwerpen. Consistentie voorkomt verwarring! Als gebruikers elke keer een nieuwe manier moeten vinden om een soortgelijk probleem op te lossen tijdens het werken in een ontwerp, zullen ze verward en gefrustreerd raken. Een bruikbaar en gebruiksvriendelijk ontwerp biedt altijd een consistente ervaring.
Consistentie is een van de krachtigste bruikbaarheidsprincipes: als dingen zich altijd hetzelfde gedragen, hoeven gebruikers zich geen zorgen te maken over wat er zal gebeuren.
- Jakob Nielsen , Web usability consultant met een Ph.D. in mens-computer interactie. op Jakob Nielsen
Onzichtbaar ontwerp creëert gebruikerservaringen die natuurlijk aanvoelen door eenvoud en consistentie. Het gaat erom zoveel mogelijk uit de weg te ruimen zodat het ontwerp nuttig en duidelijk is voor de gebruikers. Alle elementen die de gebruikers van hun doel dreigen af te leiden, moeten worden verwijderd.
Daarnaast moet het belang van consistentie niet worden onderschat. Consistentie komt in vele vormen terug, of het nu gaat om visuele of functionele consistentie, tone of voice of UI-patronen. Consistentie is waarschijnlijk ook het moeilijkste element van onzichtbaar ontwerpen om echt onder de knie te krijgen. Niemand is perfect als het gaat om ontwerpconsistentie, maar het is belangrijk om ernaar te streven.