Pianificazione dell’interfaccia utente con Adobe XD ui-planning-adobe-xd
Nella maggior parte dei casi, la pianificazione di un nuovo sito Web inizia con modelli e progetti statici. Adobe XD è uno strumento di progettazione leader di settore per la creazione di esperienze utente. Adobe consiglia di pianificare l’implementazione di Sites tramite i modelli dell’interfaccia utente di utilizzo che si avvale di Adobe XD o di altro strumento.
Prerequisiti prerequisites
Questo è un tutorial in più parti e si presume che i passaggi descritti nel capitolo precedente siano stati completati. Questo capitolo è semplicemente una sezione di osservazione e apprendimento, non è necessaria alcuna azione per poter procedere con i capitoli successivi.
Per seguirlo con i video sarà necessario installare Adobe XD, è disponibile una versione di prova gratuita.
Obiettivo
- Rivedi il kit di interfaccia utente fornito dal modello per siti standard e dal team di progettazione WKND.
- Scopri come utilizzare i kit di interfaccia utente per mappare e pianificare un’implementazione di AEM Sites.
- Scopri come passare le progettazioni dell’interfaccia utente create in Adobe XD a uno sviluppatore front-end per l’implementazione.
Cosa verrà creato what-you-will-build
In questo capitolo vengono esaminati due file Adobe XD, uno per il modello per siti standard e un altro per il sito WKND proposto. Il
Kit interfaccia utente modello per siti standard standard-site-template-uikit
Passaggi di alto livello:
- Scarica il file XD del modello per siti standard.
- Esamina il kit di interfaccia utente per Adobe XD.
- Simula il passaggio dei progetti a uno sviluppatore front-end.
Kit di interfaccia utente WKND wknd-ui-kit
Passaggi di alto livello:
- Scarica il file XD dell’articolo WKND.
- Esamina le progettazioni del modello di articolo WKND.
Congratulazioni. congratulations
Congratulazioni, hai imparato come utilizzare i kit di interfaccia utente di Adobe XD per mappare e pianificare un’implementazione di AEM Sites.
Sono disponibili ulteriori kit dell’interfaccia utente per l’ispezione e il download.
Passaggi successivi next-steps
Nel capitolo successivo viene creato un nuovo modello di pagina basato sulla progettazione dell’articolo WKND.
Scopri come creare e modificare i Modelli di pagina. Informazioni sulla relazione tra un modello di pagina e una pagina. Scopri come configurare i criteri di un modello di pagina per fornire governance granulare e coerenza del brand per i contenuti. Viene creato un modello di articolo ben strutturato per la rivista, basato su un modello fornito da Adobe XD.