Ho suddiviso il tutorial in 4 parti che al loro interno avranno a loro volta 3-4 capitoli.

PRIMA PARTE

Nella prima parte vi introdurrò il progetto che realizzeremo insieme, imposteremo il template e disegneremo la Navbar, la Hero image e l’About me section.

SECONDA PARTE

Nella seconda parte realizzeremo la Services section, la Portfolio section, la Blog section e la Contact section.

Completeremo così tutta l’architettura dell’informazione del nostro sito-portfolio. Nei 2 video successivi andremo ad impostare il colore al nostro portfolio e lo prototiperemo con la funzione “prototipo” di Adobe Xd.

TERZA PARTE

Nella terza parte ci occuperemo del colore.

Farò una premessa dove spiego come testare i colori in modo che questi abbiano un buon contrasto e i testi siano leggibili su un dark theme.

Successivamente passeremo alla pratica e andremo a dare colore a tutte le sezioni del nostro sito portfolio.

QUARTA E ULTIMA PARTE

Nell’ultima parte andremo a dedicarci inizialmente ad una fase di refining dove miglioreremo l’aspetto di 2 componenti.

Poi passeremo alla fase di prototipazione dove andremo a creare dei link “cliccabili” alle voci di menù della Navbar.

In questo modo il nostro Portfolio diventerà dinamico e le voci saranno realmente cliccabili come un sito vero.

Infine concluderò il tutorial con alcune considerazioni e vi mostrerò anche altre versioni dello stesso progetto.

Se siete già padroni di Adobe Xd troverete questo video tutorial molto semplice. In caso contrario non preoccupatevi.

Se vi mancano le basi di Adobe Xd e non conoscete l’area di lavoro del software, potete guardare il video dove spiego le basi di Aboxe Xd.

https://www.youtube.com/watch?v=ITlLk…

Vuoi imparare a disegnare un sito web da zero?

Guarda il video corso gratuito che ho realizzato per te! -> Video corso di Web Design con Adobe Xd

The post Creare un sito portfolio con Adobe Xd first appeared on Webdesignerd.