29 juli 2019

Adobe Xd versus Sketch

Natasja Van der Jonckheyd
Digital Marketeer bij Catena Company

De termen UX en UI design zijn bijzonder populair. Het blijft nog steeds een stijgende trend. Voor UX en UI designers zijn robuuste UX design tools onmisbaar geworden en daar zien we nu twee grote spelers het voortouw nemen: Adobe XD en Sketch.

UX design vs UI design

UX design staat voor “User Experience Design”. Dit betekent niet meer of niet minder dan voor bezoekers een logische flow creëren in je website of applicatie. Een UX designer maakt een stappenplan op, over hoe gebruikers in een toepassing of applicatie gemakkelijk hun weg zullen vinden zonder enige frustraties of obstakels.

UI design staat voor “User Interface Design”. Dit gaat over het visuele aspect van de website of applicatie. Naast de gebruiksvriendelijkheid is de visuele aantrekkelijkheid van een website of app minstens even belangrijk en hiervoor worden grafische elementen gebruikt, of gekeken naar de lay-out.

Geschiedenis

Voor de opkomst van deze tools maakten veel designers gebruik van Adobe Photoshop voor het bouwen van mockups van websites en apps, maar het was niet de meest uitgelezen oplossing. Na verloop van tijd werden bestanden te zwaar en werd het alsmaar moeilijker om verder te werken aan designs.

Adobe XD vs Sketch

De twee tools bij uitstek zijn Sketch en Adobe XD. Vroeger was Sketch dé voorkeursoplossing. Nu is Adobe XD een volwaardig alternatief geworden.

Het team achter Sketch zag dat veel designers gebruik maakte van Adobe Photoshop en dat dit niet de ideale omgeving was. Als marktleider zorgden ze voor het kunnen hergebruiken van symbolen, snellere workflows en dat ontwerpen slim en efficiënt kunnen worden vormgeven. Maar de werkelijke kracht van Sketch zit hem in zijn plug-ins. Eventuele features die Sketch niet aanbiedt, kan  je zelf toevoegen d.m.v. plug-ins, waarbij je als gebruikers zelf de ideale tools kan toevoegen.

De Adobe design community liet van zich horen en stuurde een duidelijke noodkreet naar Adobe. Er was een grote nood aan een volwaardige UX/UI design tool.

Adobe antwoordde hierop met ‘Project Comet’ dat na zijn bèta versie hernoemd werd naar Adobe XD. De insteek was dat designers kunnen designen aan “de snelheid van hun gedachten”.

De echte aandachtstrekker was de ‘repeat-grid’ functie: een grid die je snel kan dupliceren en van plaats kan wisselen. De ideale oplossing dus om snel je designs aan te passen, zonder dat dit veel werk vergt. Sinds de aankondiging op Adobe MAX 2018 heeft ook Adobe XD toegang tot heel wat plug-ins die de gebruiker kan instellen en positioneert het zich hierdoor als volwaardig alternatief voor Sketch.

Welke functies Adobe XD nog heeft, lees je in onze blog hier.

Vergelijking Adobe XD vs Sketch

Interface

Sketch en Adobe XD delen een gelijkaardige interface en ook voor Adobe veteranen is de interface van Adobe XD iets waarin ze snel hun weg in zullen terugvinden. Echter, Adobe XD moet het stellen zonder de bekende toolbar bovenaan.

Repeat Grid

De grootste aandachtstrekker in Adobe XD is de ‘repeat grid’ functie. Een tool die er voor zorgt dat er veel tijd kan worden bespaard. Zo kan je eventueel bepaalde elementen snel laten herhalen, in de stijl die je verkiest.

Prototypes

Het prototype is een visuele weergave van de website of applicatie die de klant kan bekijken om een indicatie te krijgen van de status van het project. Adobe XD heeft zijn eigen web sharing functie, waardoor je je ontwerp snel kan bekijken. Bij Sketch moet je hiervoor een plug-in aanspreken.

Met Adobe XD heb je ook de mogelijkheid om te kiezen voor functies zoals ‘auto animate’ (waar je vroeger 30 minuten tijd nodig had om iets te animeren, doe je dat nu op 5 seconden) en ‘voice prototyping’ waarmee je voice commando’s ontwerpt voor Siri, Alexa, handicap, …

Samenwerking

Wat betreft het samenwerken met andere tools heeft Adobe XD ook een grote  voorsprong. Zo werkt Adobe XD uiteraard met (bijna) alle programma’s binnen de Creative Cloud suite en Adobe Photoshop gebruikers kunnen zelfs hun interface in Adobe XD importeren.

  Adobe XD Sketch
 Prototyping (het testen van je website/app)   Ja (inclusief “auto animatie” en “voice prototype”)   Nee (met plug-ins)  
 Vector afbeeldingen   Ja (werkt ook samen met Adobe Illustrator)   Ja  
 Foto’s bewerken (geavanceerd)   Nee (werkt wel samen met Adobe Photoshop)   Ja  
 Plug-ins   Ja Ja (groter aanbod)  
 Repeat grid   Ja   Nee (met plug-ins)  
 Exporteren van assets   Ja   Ja  
 MacOS versie   Ja   Ja  
 Windows versie   Ja   Nee  
 Testen?   XD Starter Plan: Gratis   Gratis proefversie 30 dagen  
 Openen van files .sketch, .ai, .psd, … .sketch

Op vlak van functionaliteit, komen beide toepassingen heel dicht bij elkaar in de buurt. De leercurve voor beide programma’s is niet zo hoog en het overstappen van de ene tool naar de andere is eenvoudig. De gelijkenissen zijn treffend.

  • Campus Blairon 712
    2300 Turnhout-België
  • Tel: +32 (0)14 70 22 12
    Fax: +32 (0)14 70 22 13
  • info@catenacompany.be
  • BTW: BE0884434617
We are social
Support