Progettare un Blinkie per Flash CS3 Animation

• Potrebbe 18, 2024

La proprietaria di J3 Designs mi ha chiesto di creare un blinkie pubblicitario per il suo sito Web di scrapbooking digitale. Voleva mantenere la classica eleganza del marchio aziendale e mi ha dato una serie di grafiche che aveva già utilizzato per il suo logo. Questi consistevano in un cameo, pizzi, sfondi grunge, fiocco, fiori secchi e due coccinelle. Queste grafiche sono state originariamente create a 300 dpi ed erano molto grandi. Quindi il mio primo lavoro è stato quello di ridurre ogni elemento grafico a 72 dpi e una dimensione abbastanza piccola da poter essere utilizzata in un blinkie da 150 x 50 pixel. Da questo test, ho potuto determinare quali degli elementi potevano essere utilizzati a dimensioni così ridotte senza perdere troppo dei loro dettagli.

Sono rimasto sorpreso dal fatto che la maggior parte degli elementi ha funzionato bene con una tale riduzione di dimensioni, ad eccezione del cammeo e dei fiori secchi. Se ridotto a un'altezza di 50 pixel, la maggior parte dei dettagli sono stati persi da questi elementi. Ma il cameo era una parte così importante del logo, ho deciso di utilizzare solo la metà superiore del cameo. In questo modo, non ho dovuto ridurre l'immagine a dimensioni così ridotte e ho salvato la maggior parte dei dettagli del cameo.

Ho iniziato a costruire il design con gli elementi di sfondo statici. Questi elementi non farebbero parte dell'animazione. Scelgo uno dei quattro sfondi grunge inclusi negli esempi grafici come livello generale di sfondo. Successivamente ho aggiunto il pizzo e il cameo. Per risparmiare spazio nella parte superiore del blinkie per l'animazione del testo, ho posizionato il pizzo ad angolo nell'angolo in basso a sinistra. Alla fine ho aggiunto una delle due coccinelle. Ma quelle coccinelle stavano solo aspettando di essere animate.

Il fondamento dell'animazione sarebbe costituito da diverse animazioni di testo. Ma quelle coccinelle continuavano a guardarmi, così ho deciso di aggiungere una seconda animazione con le coccinelle. Una coccinella sarebbe visibile durante l'animazione del testo e poi la seconda coccinella sarebbe apparsa da sotto il cameo. Alla fine, strisciavano insieme. Per fare ciò, ho dovuto dividere il livello di sfondo in più livelli. Il primo livello di sfondo sarebbe la grafica grunge. Il secondo sarebbe il pizzo e il cameo. Certo, avevo bisogno di PNG di entrambe le coccinelle, il pizzo e il cameo per mantenere la trasparenza in Flash.

Quindi, ora avevo quattro livelli nel mio blinkie, oltre al livello di animazione del testo, che avrei aggiunto in seguito.

La maggior parte dei bagliori sui siti di scrapbooking sono 150 x 50 pixel. Questo non ti dà molto spazio per un'animazione di testo complicata. Ho deciso di utilizzare gli effetti della sequenza temporale incorporati per animare il testo. La prima parte dell'animazione sarebbe il nome del designer. Esistono cinque designer per questo sito Web, incluso me stesso. Poiché il nome della mia attività commerciale è stato il più lungo, decido di creare l'animazione originale usando il mio nome. Quindi, sarebbe facile cambiare il nome del designer per gli altri quattro blinkie. Ora che il design è stato realizzato, siamo pronti per creare la nostra animazione.

J3 Designs

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.