Nel tutorial che vi proponiamo oggi, vedremo come creare un’elegante ma efficace scritta di errore 404 con Adobe Photoshop. Lasciate pure qualsiasi dubbio o domanda nei commenti .

In primis, creiamo la nostra area di lavoro: utilizzeremo un documento 530 x 280 px; successivamente riempiemo lo sfondo con un grigio (#232323).

Utilizziamo lo strumento Testo per creare la scritta “404″con un font chiaro, leggibile e semplice. In questo caso utilizziamo un Arial Bold a 300 pt e di colore bianco; la posizioniamo al centro del documento.

Ora è il momento di far capire al visitatore di questa pagina di non aver trovato il contenuto desiderato. Utilizzeremo, quindi, l’ormai simbolica scritta “Error page not found“. Dato che noi, però, badiamo maggiormente al design, dobbiamo in primis trovare una posizione adatta ed efficace, ma al contempo elegante, per il nostro testo. Per questo, posizioneremo la nostra scritta in questo modo:

Per ottenere questo risultato, dovremmo creare 3 scritte: una con scritto “error” da ruotare di circa -55°, un’altra con scritto “page”, ed un’altra ancora con scritto “not found” sempre ruotata di -55° circa.

Per quanto riguarda la scritta “page”, per fare in modo che segua una traccia curvilinea, bisognerà creare un tracciato e successivamente posizionarvi sopra con lo strumento testo. In questo modo, il testo si andrà a disporre lungo il tracciato creato.

Selezioniamo, ora, tutti i livelli di testo dalla palette dei livelli, clicchiamo su di essi con il tasto destro e scegliamo l’opzione “Convert to smart object”. In questo modo si formerà un’unico livello, che però sarà costituito dai livelli iniziali: sarà possibile modificare sia lo smart object come livello unico, sia i livelli originali (facendo doppio click sullo smart object).

La funzione dello smart object in questo caso è relativamente utile: lo abbiamo utilizzato per una completezza e maggiore ricchezza della guida; avremmo ottenuto, infatti, lo stesso risultato unendo i livelli.

Aggiungiamo ora uno stile livello allo smart object, in modo da renderlo più gradevole ed elegante all’occhio:

Ecco il nostro risultato: