Adobe XD Interactive is het vervolg van de Cursus Adobe XD en speciaal ontwikkeld voor vormgevers. Heb je basiskennis van Adobe XD dan kun je deze cursus ook goed volgen.

Vormgevers ontwerpen voor een website of webshop het visuele design. Echter het design kan tegenwoordig niet meer alleen statisch bekeken worden. Gebruikers bekijken het design op diverse apparaten: desktop, tablet of mobile en zijn interactief bezig met het zoeken naar de juiste content. De vormgever moet dus rekening houden met verschillende layout mogelijkheden van dezelfde content en met de usability ( gebruiksvriendelijkheid ) van bijvoorbeeld knoppen, uitklapmenu’s, swipende content, links, grootte van afbeeldingen etc. dat kun je alleen als je het zelf ook interactief kunt testen.

Het ontwerpproces starten met een wireframe waarbij de elementen alleen in de structuur zichtbaar zijn en het verschil van plaatsing op mobiel en desktop duidelijk wordt, helpt de designer een goede basis te leggen voor het visuele ontwerp. In Adobe XD kun je behalve dit wireframe bouwen, ook nog de interactiviteit testen. Dat is heel belangrijk: ziet de gebruiker wel hoe je een menu kunt openen maar ook weer sluiten? Is de knop wel groot genoeg voor bediening met een vingertop? Staan de knoppen niet te dicht bij elkaar, voor gebruik op een mobieltje? Al deze vragen en hun antwoorden hebben invloed op het ontwerp.

In deze korte cursus leer je een wireframe voor de home pagina van een webshop voor mobile en desktop opbouwen en testen op usability. Je leert inzien dat de layout voor desktop aangepast moet worden voor mobile. Je leert werken met een basis wireframe, om inzicht te krijgen in mogelijke oplossingen voor het verschil in aanwezige ruimte. bijvoorbeeld, grootte of plaatsing van beeldelementen aanpassen, of het interactief openen en sluiten van content-area’s om ruimte te besparen. Je leert elementen interactief maken in Adobe XD, zodat deze in preview mode getest kunnen worden op functionaliteit en usability.

Studieprogramma Adobe XD Interactive

  • Interface-wireframe
  • Header, Navigatie, Content, Footer
  • Navigatie en Hamburger Menu
  • Button en Mouseover effect
  • Dropdownmenu
  • Invul venster
  • Ontwerp uit Illustrator importeren als vector
  • Photoshop interactie met XD