Adobe Experience Design è l’utilissimo tool di Adobe che consente di realizzare il design di siti web ed app in modo semplice e intuitivo. Conosciuto come Adobe XD, è diventato ben presto un valido alleato di ogni web designer che si trova a dover progettare un nuovo sito web o un’app. L’applicazione è dotata infatti di moltissimi strumenti pensati per realizzare mockup e prototipi, strumenti che semplificano non poco il lavoro di chi deve mettere a punto la progettazione di app e UX/UI.
In quest’articolo scopriamo come funziona il tool di Adobe e come sfruttarlo al meglio.
Primi passi su Adobe XD
Una volta aperto Adobe XD, dalla schermata principale è possibile creare un nuovo progetto oppure cominciare con il Sample File – il file di esempio – che offre una panoramica sulle ultime novità del tool. Per chi si approccia per la prima volta al programma, è consigliabile cominciare proprio con il file di esempio, che spiega chiaramente come funziona Adobe XD: troverete diverse tavole da disegno, chiamate Artboard, ognuna delle quali è modificabile e zoomabile per vederne i dettagli; per creare una nuova Artboard, basta cliccare sull’ultimo pulsante della colonna a sinistra “Aggiungi Artboard”.
È possibile scegliere il formato (Apple, Google, Microsoft o Web) a seconda della destinazione del progetto, e l’orientamento, disponibile in versione landscape o portrait. Per aggiungere una grafica già progettata e salvata sul vostro dispositivo, basta trascinare l’immagine direttamente sulla Artboard. Nella colonna di destra, trovate diverse opzioni che variano in base allo strumento che state utilizzando (testo, forme, artboard ecc.) e grazie agli UI Kits, ovvero tutti gli elementi grafici dei software (tastiera, calendario, cronometro ecc.), vi basterà selezionare la parte che vi interessa e incollarla nel progetto.
Prototype, preview e condivisione del progetto
Una delle funzionalità più interessanti di Adobe XD è quella legata alla fase di test che consente di vedere come appare il progetto in versione desktop e mobile, testando così le varie funzionalità e correggendo ciò che è necessario. Mentre in modalità Design si crea e si struttura la grafica, la modalità Prototype consente di collegare più Artboards tra loro, impostare la Home e preparare tutto per la Preview definitiva. Una volta creati i collegamenti tra le schermate (si può scegliere anche l’effetto e i tempi di transizione tra una pagina e l’altra), si può partire con il test vero e proprio dando vita alle azioni e alle funzionalità pensate nella prima fase del lavoro.
Per avviare l’anteprima, basta cliccare sul simbolo Play in alto a destra e, accanto al Play, è possibile generare un link di condivisione: in questo modo potrete inviare direttamente l’anteprima al cliente, che la vedrà tale e quale a come funzionerà una volta sviluppata. Questo è un vantaggio enorme perché il problema di testare con mano una app oppure un sito web è sempre stato un ostacolo per molte aziende e professionisti che non riuscivano a immaginare il risultato finale. Inoltre, ogni volta che farete delle modifiche (perché ci sono sempre delle modifiche da fare!), basterà cliccare su Upload Link per inviare direttamente gli aggiornamenti al prototipo, che registrerà le modifiche senza bisogno che facciate nient’altro.
