Se hai domande o un'idea da condividere, partecipa nella community di Adobe XD. Desideriamo ricevere il tuo feedback e vedere le tue creazioni.
Ultimo aggiornamento il
27 ott 2022
- Guida utente di Adobe XD
- Introduzione
- Novità di Adobe XD
- Domande frequenti
- Progettazione, prototipazione e condivisione con Adobe XD
- Gestione colore
- Requisiti di sistema
- Nozioni di base sull'area di lavoro
- Cambia la lingua dell'app in Adobe XD
- Accesso ai kit di progettazione per interfaccia utente
- Accessibilità in Adobe XD
- Scelte rapide da tastiera
- Consigli e suggerimenti
- Progettazione
- Tavole da disegno, guide e livelli
- Forme, oggetti e percorso
- Selezione, ridimensionamento e rotazione degli oggetti
- Spostamento, allineamento, distribuzione e disposizione degli oggetti
- Operazioni raggruppa, blocca, duplica, copia e rifletti sugli oggetti
- Impostazione di tratto, riempimento e ombra esterna per gli oggetti
- Creazione di elementi ripetuti
- Crea progetti prospettici con trasformazioni 3D
- Modifica di oggetti mediante le operazioni booleane
- Testo e font
- Componenti e stati
- Mascheratura ed effetti
- Layout
- Video e animazioni Lottie
- Prototipazione
- Creazione di prototipi interattivi
- Animazione dei prototipi
- Proprietà dell'oggetto supportate per l'animazione automatica
- Creazione di prototipi con tastiera e gamepad
- Creazione di prototipi con comandi e riproduzione vocali
- Creazione di transizioni temporizzate
- Aggiunta di sovrapposizioni
- Progettazione di prototipi vocali
- Creazione di collegamenti con ancoraggio
- Creazione di collegamenti ipertestuali
- Anteprima di progettazioni e prototipi
- Condivisione, esportazione e revisione
- Condivisione delle tavole da disegno selezionate
- Condivisione di progettazioni e prototipi
- Configurazione delle autorizzazioni di accesso per i collegamenti
- Utilizzo dei prototipi
- Revisione dei prototipi
- Utilizzo delle specifiche di progettazione
- Condivisione delle specifiche di progettazione
- Ispezione delle specifiche di progettazione
- Navigazione delle specifiche di progettazione
- Revisione e inserimento di commenti nelle specifiche di progettazione
- Esportazione delle risorse di progettazione
- Esportazione e download delle risorse dalle specifiche di progettazione
- Condivisione di gruppo per le aziende
- Eseguire il backup o trasferire le risorse XD
- Sistemi di progettazione
- Documenti cloud
- Integrazioni e plugin
- Utilizzo di risorse esterne
- Utilizzo delle risorse di progettazione da Photoshop
- Operazione di copia e incolla di risorse da Photoshop
- Importazione o apertura delle progettazioni di Photoshop
- Utilizzo delle risorse di Illustrator in Adobe XD
- Apertura e importazione delle progettazioni di Illustrator
- Copia di vettori da Illustrator a XD
- Plug-in per Adobe XD
- Creazione e gestione dei plug-in
- Integrazione di Jira per XD
- Plug-in di Slack per XD
- Plug-in di Zoom per XD
- Pubblicazione di progetti da XD a Behance
- XD per iOS e Android
- Risoluzione dei problemi
- Problemi noti e risolti
- Installazione e aggiornamenti
- Avvio e arresto anomalo
- XD si arresta in modo anomalo quando viene avviato su Windows 10
- XD si chiude quando si esce da Creative Cloud
- Problema relativo allo stato dell’abbonamento in Windows
- Avviso di app bloccate all'avvio di XD su Windows
- Generazione di dump di arresto anomalo su Windows
- Raccolta e condivisione del registro degli arresti anomali
- Documenti cloud e Creative Cloud Libraries
- Creare prototipi, pubblicare e revisionare
- Impossibile registrare le interazioni di prototipi su macOS Catalina
- Problemi con i flussi di lavoro di pubblicazione
- I collegamenti pubblicati non vengono visualizzati nei browser
- I prototipi non vengono visualizzati correttamente nei browser
- Il pannello dei commenti viene visualizzato in modo imprevisto sui collegamenti condivisi
- Impossibile pubblicare le librerie
- Importare, esportare e lavorare con altre app
Scopri come visualizzare e ispezionare attributi quali colori, testo, misure, stati di componenti, interazioni e molto altro ancora nelle specifiche di progettazione.
In un collegamento alle specifiche di progettazione condivise, puoi visualizzare e provare il prototipo, aggiungere contestualmente commenti e feedback e scegliere di ottenere misurazioni e informazioni sulle specifiche per il progetto.
Il collegamento delle specifiche di progettazione viene aperto in modalità Prototipo per impostazione predefinita. Per ottenere le informazioni sulle proprietà e sulle specifiche, passa alla scheda delle specifiche di progettazione facendo clic sull'
icona nella barra di destra.
Una volta selezionata la scheda delle specifiche di progettazione, puoi selezionare gli elementi e ispezionarli sull'area di lavoro per avere attributi come colori, testo, misurazioni, stati e altre proprietà visualizzati nella finestra di Ispezione proprietà.
Fai clic sull'icona {} per passare alla scheda delle variabili. Questa scheda è disponibile quando il designer pubblica un collegamento alle specifiche di progettazione per il Web. Quando il designer definisce i nomi delle variabili per i colori e gli stili carattere in un progetto, puoi visualizzare le informazioni sul token del progetto nella scheda variabili.
Continua a leggere per scoprire come visualizzare e abbinare gli attributi nelle specifiche di progettazione.
Vista dei dettagli della schermata
Quando fai clic all'esterno di una tavola da disegno, viene visualizzata la vista dei dettagli della schermata. In questa vista, puoi analizzare la schermata e dettagli come i punti salienti delle interazioni.
Dettagli e proprietà delle schermate
A. Dettagli della schermata: visualizza le dimensioni della schermata.
B. Colori: visualizza i colori contrassegnati per l'esportazione.
C. Proprietà della griglia del layout: attiva/disattiva per visualizzare le griglie.
Utilizza il cursore Opacità per controllare la trasparenza dei colori.
Nota:
Se contrassegni un livello per l'esportazione nell'app XD, i colori utilizzati in quel livello non verranno visualizzati nella vista dei dettagli dello schermata.
Sovrapposizioni
Fai clic su Punti salienti dell'interazione per visualizzare i dettagli della tavola da disegno, gli stili, il design e le dimensioni della finestra di visualizzazione, la posizione della sovrapposizione, i colori, gli stili dei caratteri e le informazioni di destinazione per la sovrapposizione applicata.
Punti salienti dell'interazione
Tieni premuto il tasto Maiusc per visualizzare i punti salienti dell'interazione. Per controllarli, fai clic sull'artefatto visualizzato nella sezione Interazioni o tieni premuto il tasto Maiusc e fai clic sui punti salienti dell'interazione.
Vista dei dettagli del livello
Quando selezioni un livello su una tavola da disegno, viene visualizzata la vista dei dettagli del livello. Nella finestra di Ispezione proprietà, puoi visualizzare il nome del livello e le proprietà, come le dimensioni e l'aspetto.
Testo e aspetto
A. Proprietà del testo: seleziona una riga di testo per visualizzare le proprietà del testo aggiunte con unità predefinite come px, pt e dp.
B. Aspetto: visualizza i colori utilizzati in un oggetto o nel testo nella sezione Aspetto.
Forme
Seleziona una forma per controllarne i seguenti attributi:
- Larghezza, altezza e rotazione.
- Attributi di aspetto, come colori, dimensione del bordo, trattino, spazio, tratti e opacità.
Immagini
Seleziona un'immagine per controllarne i seguenti attributi:
- Larghezza, altezza e rotazione.
- Opacità.
Video
Seleziona un video per controllarne i seguenti attributi:
- Larghezza, altezza e rotazione.
- Nome immagine poster.
- Riproduzione automatica, riproduzione in loop e impostazioni audio.
- Se il video deve essere tagliato, indica l'ora in cui la clip video dovrebbe iniziare e finire.
- Opacità.
Testo della singola sezione
Passa con il mouse sulle singole sezioni di un elemento di testo per evidenziare le singole sezioni simili all'interno dell'elemento di testo.
Collegamenti ipertestuali
Collegamenti ipertestuali agli oggetti
- Quando selezioni un oggetto su una tavola da disegno, tutti i relativi collegamenti ipertestuali vengono visualizzati nella sezione Interazioni della finestra di Ispezione proprietà.
- Posiziona il puntatore del mouse su un collegamento ipertestuale nella sezione Interazioni per identificare l'oggetto associato sulla tavola da disegno.
- Per copiare l'URL di un collegamento ipertestuale negli Appunti, nella sezione dei dettagli dell'oggetto, fai clic sul collegamento ipertestuale.
- Quando fai clic su un collegamento ipertestuale nella sezione Interazioni, si apre il collegamento. Per copiare l'URL del collegamento ipertestuale dalla sezione Interazioni, fai clic con il pulsante destro del mouse.
- Nella sezione Interazioni, quando fai clic su un collegamento ipertestuale che utilizza un protocollo diverso da https o mailto, non dispone di un protocollo o ha un dominio non valido, l'URL non si apre. Viene visualizzato un messaggio di errore nella parte inferiore dello schermo.
- Se su un oggetto sono definite più interazioni di collegamenti ipertestuali, non è possibile copiarle dalla sezione dei dettagli dell'oggetto. Fai clic con il pulsante destro del mouse sui collegamenti ipertestuali nella sezione Interazioni per copiarli.
Collegamenti ipertestuali di testo
- Quando selezioni un oggetto di testo, la finestra di Ispezione proprietà (sia le sezioni Interazioni che dei dettagli dell'oggetto) mostrano qualsiasi interazione del collegamento ipertestuale per l'oggetto nel suo insieme.
- Puoi esaminare le interazioni dei collegamenti ipertestuali definite per l'oggetto di testo, allo stesso modo di qualsiasi collegamento ipertestuale dell'oggetto.
- Quando selezioni il testo (testo del sottointervallo) all'interno dell'oggetto e se tale testo ha un collegamento ipertestuale separato, la sezione dei dettagli dell'oggetto riflette l'URL del collegamento ipertestuale. Tuttavia, la sezione Interazioni continua a visualizzare il collegamento ipertestuale e altre interazioni definite per l'oggetto.
- Per copiare l'URL di un collegamento ipertestuale di testo di singole sezioni negli Appunti, fai clic su di esso nella sezione dei dettagli dell'oggetto.
Per informazioni sui collegamenti ipertestuali in XD, consulta Creazione di collegamenti ipertestuali.
Frammenti di codice
Codice CSS
- Per generare il codice CSS, nell'app XD, seleziona Esporta per Web in Condividi > Sviluppo e pubblica le specifiche di progettazione.
- Dalla sezione degli snippet CSS, puoi visualizzare e copiare il codice CSS della progettazione.
- Per copiare e incollare lo snippet di codice, premi e trascina gli snippet, passa all’editor di codice e incollalo.
Codice HTML
- Per generare il codice HTML per i file Lottie e video, nell'app XD, seleziona Esporta per Web in Condividi > Sviluppo e pubblica le specifiche di progettazione.
- Dalla sezione HTML, puoi copiare il codice HTML della finestra di Ispezione proprietà.
- Per copiare e incollare lo snippet di codice, premi e trascina gli snippet, passa all’editor di codice e incollalo.
Stati dei componenti
- Seleziona un oggetto nella tavola da disegno e se l'oggetto selezionato è un componente, puoi ispezionarne i molteplici stati.
- Per visualizzare i diversi stati del componente selezionato nella tavola da disegno, fai clic sulle opzioni sotto l'elenco Componente nella finestra Ispezione proprietà.
- Nella sezione Interazioni puoi visualizzare tutte le interazioni associate allo stato attivo del componente selezionato.
- Fai clic sullo stato inattivo del componente dall'elenco per visualizzare gli stati sulla tavola da disegno e le rispettive interazioni.
- Se il nome del componente è lungo e puoi leggerne solo una parte, seleziona il nome nella finestra di Ispezione proprietà per copiarlo.
Nota:
Non puoi scaricare tutti gli stati di un componente. Nell'app XD, se il designer contrassegna più istanze di un componente per l'esportazione, verrà esportata solo l'ultima istanza nel pannello Livelli.
Livelli nascosti
- Passa il mouse e fai clic con il pulsante destro sull'area specifica per visualizzare l'elenco dei livelli e i relativi dettagli contestuali in quel punto del pixel.
- Se il nome del gruppo è lungo e puoi leggerne solo una parte, seleziona il nome nella finestra di Ispezione proprietà per copiarlo.
Ulteriori informazioni
Per ulteriori informazioni sull'analisi delle specifiche di progettazione in XD, guarda questo video.
Tempo di visione: 8 minuti
Passaggi successivi
Ti abbiamo illustrato i primi passi per visualizzare e ispezionare le specifiche di progettazione. Continua e scopri come verificare le specifiche di progettazione ed estrarre le risorse dalle specifiche di progettazione.
Hai una domanda o un'idea?
