Capita spesso di vedere una serie di link distribuiti orizzontalmente separati dal carattere pipe “|”, il simbolo grafico dell’asticella verticale. Inoltre, se è presente una buona stesura HTML, ci si accorge che questa serie di link – apparentmente orizzontali – altro non sono che liste puntate UL o OL. Ne deriva che invece di scrivere:
Sarebbe meglio usare:
1 2 3 4 5 |
Apre – in beta – Skypemote.com, un progetto nato da un’idea mia e di Nicola (flussodigitale.com), che propone un semplice editor per realizzare simpatici disegni da “incollare” in Skype. L’editor è stato realizzato in Adobe Flash CS3 e, tempo permettendo, vorrei rilasciare anche una versione – desktop – Adobe AIR.
Se utilizzate Skype per “chattare”, con questo editor potrete stupire sicuramente i vostri interlocutori. Se trovate questo servizio utile e divertente, non dimenticate di contribuire con proposte, suggerimenti e – se volete – con qualche donazione!! 
Seguite il progetto perchè ci saranno prossimamente altre “simpatiche” novità.
Da Apple al Web 2.0 le immagini “riflesse” hanno inondato Intrenet. Spesso abusate sono tuttavia sempre di grande effetto. Saperle realizzare bene non è impresa complicata e, con un pizzoco di fantasia, si possono rendere meno “ovvie” e “scontate”… se proprio non ne potete fare a meno.
Prima di tutto vediamo come impostare una riflessione base. La tecnica per impostare una riflessione base, almeno quella che preferisco e che uso continuamente, è di semplice e rapida implementazione. Questo metodo permette la massima libertà di modifiche successive e mantiene la trasparenza nel caso vogliate salvare l’immagine in PNG 24 con trasparenza.
1. Come sempre apriamo Phosotoshop e carichiamo l’immagine che vogliamo riflettere su un layer apposito
2. Duplichiamo il nostro layer (trascinate il layer da duplicare sull’icona 
) e nominiamolo “shadow” o “reflex”
3. Dal menu “Modifica” selezionate “Trasforma” / “Rifletti verticale”
4. Trascinate il nuovo layer “reflex” sotto al layer originale e spostiamolo alla base del layer originale
5. Selezioniamo il layer “reflex” e, tenendo premuto il tasto ALT, aggiungiamo una maschera cliccando sull’icona 
“mask” nella tool window dei layer; il layer “reflex” dovrebbe sparire
6. Selezioniamo la maschera nel layer “reflex” e cliccate sull’icona 
di riempimento
7. Impostiamo una sfumatura da nero o bianco a trasparente: 
8. Tracciamo la sfumatura dal centro del layer originale al centro del layer “reflex”
Normalmente non lo faccio, tuttavia visto che anche su undolog si tratta grafica & design, non posso esimermi da segnalare il restyling del blog di UPI on Paper. Inoltre, disegnando anch’io, quando vedo una “mano” bella è più forte di me! Con il nuovo layout, poi, le illustrazioni di UPI sono ancora più godibili.
La tecnica di Text Replacement che presento oggi è, per certi aspetti, davvero interessante. A differenza della classica sostituizione per immagine tramite CSS, questa tecnica usa un filmato Flash per sovrascrivere i titoli del nostro sito. Nonostante sia un pochino più articolata, in quanto richiede la creazione di un filmato Flash e l’uso di Javascript, permette di ottenere una serie di vantaggi non indifferenti:
Noterete, anche, che in questa procedura i CSS non sono praticamente presi in considerazione!
Nel post Flash CS3: creare un effetto Reflex su qualsiasi MovieClip avevamo visto com’è possibile scrivere una classe, che estende un MovieClip, per collegarla a DesignTime ad un qualsiasi MovieClip in libreria. Ho scoperto, tuttavia, che può risultare più utile ed economico fare il percorso contrario. Ho creato una classe Reflex (Reflex.as), con l’intenzione di usarla esclusivamente da codice. Ho creato questa classe pensando di passare nel costruttore il puntatore ad un MovieClip. La nuova classe Reflex contiene in sostanza lo stesso codice prima inserito nella ReflexMe, ma leggermente modificato in modo da poter funzionare espressamente da codice:
1 2 3 4 | // import undolibrary.sfx.*; // var rx:Reflex = new Reflex( movieClipInstance ); |
Introduco oggi un argomento interessante e vasto che ha il suo “core” nell’uso della classe DisplacementMapFilter. Questa classe permette di applicare un Filtro mappa di spostamento ad un oggetto visuale Flash (Bitmap, Sprite, etc…). Di filtri, Flash CS3, ne ha vari ed appartengono tutti alla stessa famiglia. Tuttavia il DisplacementMapFilter ha caratteristiche davvero particolari, come vedreno, che lo rendono straordinario nella generazione di effetti davvero spettacolari.
La classe BitmapData permette di applicare in modo semplice effetti utilissimi per svariati scopi. Avevamo già visto come creare un effetto “nebbia tv” con poche righe di codice (Flash CS3: creare effetto nebbia TV in 1 secondo). Ora ci occuperemo di un altro effetto “spettacolare” che, come vedremo in seguito, permette di realizzare degli interessantissimi effetti grafici, come nell’esempio mostrato qui sotto: variate i parametri per osservare i differenti effetti, cliccando con il mouse sull’immagine generata questa può essere spostata.
Per l’occasione ho anche aggiunto un nuovo semplice componente (Check) in Undolibrary! Quindi aggiornate il vostro repository SVN. Il sorgente è disponibile qui: MapEffect.zip
Inauguro con questo Post una nuova sezione Eventi & iniziative, viste le numerose segnalazioni che spesso mi vengono proposte. Ovviamente segnalerò quelle inerenti ai temi di questo Blog.
“Arrivano i Guru“, si terrà a Roma ad Ottobre 2008, e vede per la prima volta in assoluto, la presenza in Italia di Martin Evening, massimo esperto di digital imaging, nonchè autore di innumerevoli libri di successo su Photoshop, venduti in tutto il mondo.
Vista l’unicità dell’evento, quest’anno l’organizzazione ha ideato un “Tour” di 8 tappe, in altrettante città italiane, la cui partecipazione è TOTALMENTE GRATUITA.
Durante i vari incontri gli Adobe Guru Marianna Santoni, Claudio Marconato, Tiziano Fruet, e Davide Vasta, intratterranno i partecipanti con 5 ore di seminari di approfondimento su vari temi, dalla fotografia digitale, al design ed al Web design. Ci saranno 3 tappe che avranno luogo al Sud (Napoli, Bari, Catania), notoriamente “snobbato” da eventi di grande rilevanza. Il sito Web ufficiale è questo: http://www.arrivanoiguru.com
(segnalato da: Davide Vasta)
Quando Shadowbox apre la sua finestra per mostrare un contenuto (immagine, iframe, Movie, ecc…), visualizza, nell’attesa, un gif animato che viene fornito nel pacchetto. Se la pagina che sta utilizzando Shadowbox si trova allo stesso livello della cartella images, tutto funziona bene. Per default, infatti, Shadowbox cerca la gif animata sotto images/loading.gif – o images/loading-light.gif se avete scelto gli stili light (shadowbox-light.css). Altrimenti, e spesso c’è il rischio anche di non accorgesene, se ci troviamo in una diversa alberatura, viene generato un bel codice 404 – di pagina non travata; nel nostro caso di file non trovato!
Per risolvere il problema basta inizializzare Shadowbox con un parametro opportuno che indica proprio il percorso assoluto della cartella images: su undolog.com, ad esempio, ho posizionato la gif animata del loading direttamente nella cartella images presente in root (come circa un miliardo di altri siti . Per rendere accessibile questa cartella a Shadowbox, a prescindere dal percorso, ho inserito semplicemenete:
1 2 | // init shadowbox with assetURL parameter Shadowbox.init( {assetURL: 'http://www.undolog.com/' } ); |
Ultimi Commenti
Giovambattista Fazioli: @Nik: Sono contento! In bocca al lupo dunque!!
Nik: Lunedì ho l’esame di informatica su java, grazie mi sei stato utilissimo, il libro che ho era poco chiaro...
Marco: Ti ringrazio moltissimo, mi hai illuminato
ho risolto impostando [cc_objc] //OptionViewController.m -...
Giovambattista Fazioli: @Marco: Ti consiglio un approccio credo più corretto. Se hai eseguito il subclass del tab...
luigi: molto chiaro e semplice devo ammettere che anche scrivendo da un pà difficilmente uso delegati creati da...