Flash Catalyst - Layout del progetto Photoshop
Nell'ultimo tutorial, abbiamo assemblato le immagini per il nostro portfolio che realizzeremo in PhotoshopR e FlashR CatalizzatoreTM. Ora lavoriamo sul layout. Dovresti avere tutti i loghi e le anteprime aperti in Photoshop.

  1. Il design per il portfolio sarà un layout di semplici rettangoli arrotondati. Il rettangolo inferiore 500 x 500 avrà una sfumatura semplice da questi due colori: #ffffff e # c9c1a5.

  2. Successivamente, ho aggiunto uno grande e tre piccoli tappetini per il logo e le miniature. Con il colore di primo piano impostato su nero, ho usato lo strumento Forma personalizzata e la forma quadrata arrotondata per disegnare i quattro tappetini. Ho quindi aggiunto una combinazione di stili di livello Ombra esterna, Ombra interna e Bagliore interno per completare i tappetini.

  3. Usando il carattere Engravers MT, ho aggiunto il titolo all'inizio del layout del portfolio. Successivamente, ho rasterizzato il testo e applicato al testo gli stessi stili di livello che ho fatto con i tappetini.

  4. Successivamente, ho aggiunto le tre anteprime ai tappetini nell'ordine in cui desidero che i loghi vengano visualizzati da sinistra a destra. Ovviamente, imposteremo i pulsanti di navigazione in Catalyst in modo che lo spettatore possa visualizzare i loghi in qualsiasi ordine.

  5. Quindi, ho aggiunto i loghi al pannello Livelli nello stesso ordine.

  6. Infine, ho aggiunto un'ombra discendente (impostazioni predefinite) al livello di sfondo.

    Questo progetto è molto piccolo e di solito non uso cartelle nel pannello Livelli per un progetto di queste dimensioni. Tuttavia, desidero dimostrare che le informazioni dal pannello Livelli di Photoshop verranno mantenute quando importiamo il file in Catalyst. A tale scopo, ho inserito tutte le anteprime in una cartella "Anteprime", tutti i loghi in una cartella "Logos" e tutta la grafica di sfondo in una cartella "Sfondo".

  7. Ora siamo pronti per importare questo layout grafico in Flash Catalyst. Salva il tuo file Photoshop come PortfolioLayout.psd.

  8. Apri Adobe Flash Catalyst. Nella schermata di benvenuto, utilizzeremo Crea nuovo progetto da file di progettazione - Da file Adobe Photoshop PSD. Passare al file PortfolioLayout.psd.

  9. Nella finestra di dialogo, nota che Catalyst ha già riconosciuto che il nostro progetto sarà di 500 x 500 pixel, dalla dimensione del file PSD. Imposta le opzioni di fedeltà su Mantieni modificabile e il colore di sfondo in modo che corrisponda alla tua pagina web.

    Esaminiamo il pannello Livelli in Flash Catalyst. Nota che abbiamo tutti gli stessi livelli e cartelle del nostro file PSD, insieme ai rispettivi nomi. Si noti inoltre che Catalyst ha creato livelli per contenere gli stili di livello che abbiamo applicato in Photoshop. Se fai clic sulle icone di visibilità, vedrai che abbiamo ancora il controllo su questi stili.

Nel prossimo tutorial, inizieremo a creare componenti dell'interfaccia utente dalla nostra grafica.

Copyright 2018 Adobe Systems Incorporated. Tutti i diritti riservati. Le schermate dei prodotti Adobe sono state ristampate con l'autorizzazione di Adobe Systems Incorporated. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Catalyst Flash e Flash Paper è / sono [a] marchi registrati o marchi commerciali di Adobe Systems Incorporated negli Stati Uniti e / o in altri paesi.


Istruzioni Video: Photoshop to Flash Catalyst to Flash Builder (Potrebbe 2024).