Cultor College

L'Autore

Ahmed Hussam, attualmente Manager per lo sviluppo dell'interfaccia utente alla Link è anche Adobe User Group Manager in Egitto. Architetto con oltre 15 anni di esperienza nel mondo dello sviluppo e progettazione web è collaudato sviluppatore CFML e ha gestito due dei più creativi team di successo in Egitto negli ultimi 10 anni.

Ahmed Hussam collabora con i corsi e gli sviluppi dei prodotti Adobe, scrivendo anche tutorials per webdesign tuts+.

Sviluppare un concetto significativo è un passo cruciale in qualsiasi progetto di design ... ma è una capacità che veramente poche persone hanno il tempo di comprendere e apprezzare.
Ahmed Hussam ci guiderà attraverso questo particolare processo di ispirazione e creazione.

Procederemo, passo per passo, attraverso questo procedimento fino ad arrivare ad elaborare un buon concetto per iniziare il nostro web design.

Perchè sviluppare un concetto nel Web Design .?

Nel mio articolo, Il principio della Gestalt: Teoria del Design per i web designer, abbiamo stabilito la necessità di avviare qualsiasi progetto con i contenuti base prima di entrare nei dettagli, in questa parte si discuterà la metodologia fondamentale del design di base.
Qualsiasi forma dovrebbe avere un concetto dietro di sè, purtroppo, un sacco di designer si focalizzano solo su una bella forma che in realtà non ha significato alle sue spalle. O peggio, si progetta un intero sito web basato su quadri pre-esistenti senza nemmeno un attimo di riflessione su come un design originale potrebbe portare un po' di significato reale al progetto.

"Un buon progetto di design ha, alle sue spalle, un significato, non è fatto solo di belle forme, o caratteri accattivanti. Ogni elemento dovrebbe dire qualcosa sul progetto di cui fa parte".

A questo punto, se si segue la metodologia di raccolta dei requisiti creativi (Come ottenere i giusti requisiti creativi dal vostro cliente), si dovrebbero avere input sufficienti per capire e scegliere quale stile o forma di contenitore è il più adatto al progetto.

Si inizia con la raccolta di immagini di riferimento.

Uno dei modi più facili e più semplici per trovare idee è quello di chiedere al vostro cliente alcune parole chiave che descrivano come lui vuole che la gente pensi del suo sito .... energico, fresco, giovane, solido .... ecc, semplicemente inserendo queste parole chiave in qualsiasi motore di ricerca immagini come Google o Bing.
Effettuando questa ricerca si può ricavare una grande biblioteca di immagini ed idee da cui far partire il brainstorming per il nostro nuovo progetto.

La progettazione inizia con un brainstorming

Non respingete a priori nessuna idea ... per quanto strane che siano.
E' sempre più facile abbassare i toni di un progetto che cercare di vivacizzarli.. seduti di fronte alle immagini che avete selezionato, con carta e matita (che sono strumenti eccellenti in questa fase) iniziate a disegnare i concetti che vi vengono in mente, perchè disegnare aiuta a sviluppare e memorizzare, anche perchè le idee tendono a svanire in fretta nella mente.

Un esempio, se un cliente mi chiede un design "fresco", proverò ad inserire "fresco" in Google (o nel vostro motore di ricerca preferito) per dare un'occhiata ai risutati.
Ecco un esempio di ciò che è scaturito:

Come fanno queste immagini ad ispirarmi? Che cosa dovrebbero dirmi relativamente all'impostazione del mio progetto ?
Beh, sapendo che il mio cliente vuole un design "fresco" e usando questo metodo per interpretare le immagini avrei compreso che:

* Dovrei usare soprattutto forme organiche o curve
* Sono preferibili sfumature di colore leggero Light "fresco"
* Uso dello stile "di cristallo" e di componenti semi-trasparenti.
* Utilizzare parecchio spazio bianco non inserendo troppe componenti.

Io di solito preferisco fare questo esercizio insieme con 2 o 3 altri progettisti, in quanto aiuta a rimbalzare diverse idee a vicenda. Chiederei a ciascuno di cercare le immagini da solo per 15 o 20 minuti, poi di sedersi insieme, cominciando a dire ciò che vediamo in ogni immagine. C'è da sorprendersi nel constatare come altre persone possono vedere qualcosa di totalmente diverso da quello che pensiamo o vediamo noi: questo può aprire strade completamente nuove per noi.

In questa prima fase del processo di progettazione è importante parlare! La parola "fresco" significa cose diverse per persone diverse, così non ci baseremo esclusivamente sulla ricerca iniziale dei risultati di immagini o sulla nostra personale interpretazione come fonte definitiva della nostra ispirazione.

Non copiare idee, rubale!

"I buoni artisti copiano,
i grandi artisti rubano"
- Pablo Picasso (1881 - 1973)

La mia interpretazione di questa citazione è: la copia di un'altra idea farà di voi un buon designer, tuttavia, "rubando" un'idea o un concetto da un altro progetto e utilizzando saggiamente (senza copiare palesemente), farà di voi un grande designer.

Rubare un'idea è difficile - molto più difficile rispetto alla copia - è infatti necessario capire veramente il concetto, astraendolo dal luogo dove l'avete trovato ed adattandolo adeguatamente al vostro progetto.

Un caso da studiare: il furto delle Piramidi

In un recente progetto, stavo lavorando con un team per realizzare un sito per un portale del turismo egiziano. Il cliente non voleva il solito stile "Piramidi, Karnak, faraonico" che molti si sarebbero aspettato.
Volevano qualcosa di moderno, però volevano mantenere un'identità egiziana che avrebbe dovuto affermare letteralmente "questo sito è dell'Egitto".
E 'stata una vera sfida, ma passando attraverso la metodologia citata precedentemente abbiamo raccolto immagini come queste:

Ora il cliente non voleva disegni e clichè che mostrassero direttamente geroglifici o immagini di antichi templi egizi e roba del genere, ma guardando le immagini abbiamo cominciato a costruire l'idea che potevamo utilizzare alcuni elementi come le pareti inclinate e l'antico portale egiziano perchè facessero comprendere che il sito era un portale per l'Egitto.

Il problema è che l'unico stile tipico dell'Egitto è quello dei faraoni. Se avessimo utilizzato l'arte araba, per esempio, non sarebbe stato tipico dell'Egitto. Lo stesso vale per le spiagge e le immersioni marine.
Se avessimo usato qualsiasi altro stile, non sarebbe stato unico dell'Egitto, fatto che era un requisito rigoroso richiesto dal cliente.
Allo stesso tempo, ci è stato detto di non usare immagini o geroglifici dell'antico Egitto in quanto il cliente voleva promuovere tutti i tipi di turismo egiziano, non solo le visite ai templi e alle piramidi.
Alla fine siamo arrivati a un disegno come questo:

Abbiamo semplicemente preso parte dell'ingresso del "portale" con i piloni del tempio di Karnak, utilizzando solo le linee oblique per identificare le mura. La zona centrale è stato utilizzata per animare immagini diverse dell'Egitto; abbiamo usato la zona sinistra per il logo e la navigazione, mentre l'intera area a destra è stata utilizzata per il contenuto.

E' stato un concetto molto semplice, eppure ha soddisfatto tutti i requisiti. Sarebbe stato difficile che ci venisse in mente un'idea simile, se non avessimo guardato le foto e le immagini scaturite da una semplice ricerca della parola "Egitto".

"Siamo stati in grado di rubare le idee del il Tempio di Karnak e le Piramidi, e poi usarle nel nostro disegno".

I buoni concetti parlano da soli

Alcuni hanno sostenuto che questo concetto poteva non risultare molto chiaro quando le persone avessero guardato il sito. Questo può sembrare strano, ma i concetti non hanno bisogno di essere "capiti" dal primo sguardo ad un disegno ... e non hanno bisogno di essere visivamente chiari a tutti.
Ciò può essere facilmente comprensibile esaminando i loghi, prendiamo ad esempio quello della Mercedes:

A prima vista, per la maggior parte della gente, è solo una stella a 3 punte. Tuttavia, il concetto alla base di questa stella è che rappresenta il suo dominio su terra, mare ed aria: il braccio superiore rappresenta l'aria e i 2 bracci in basso la terra e il mare.
Chi lo sapeva? Pochissime persone al di fuori della società tedesca ... ma non è questo il punto, e ora? Una bella idea, parla da sè anche se la gente non capisce subito cosa significa esattamente, le forme intenzionali e le idee da cui derivano assumono sempre una vita propria.
I disegni senza un concetto non hanno quel tipo di vita ... stanno semplicemente seduti lì.

Trovare l'ispirazione per i concetti

Un'altra grande fonte di ispirazione è cercare di stare lontano dallo schermo del computer. Molti designer, per ispirarsi, tendono a visitare altri siti, che contengono ogni giorno ottimi progetti.
Mentre questo è un buon esercizio di altre fasi (come la raccolta dei requisiti e il dettaglio delle componenti), probabilmente non sarà di grande aiuto quando si sta cercando di creare il vostro concetto principale.

Spesso è meglio guardare ad altre fonti di fuori dello schermo: pannelli pubblicitari, riviste, manifesti e spot televisivi sono fonti molto buone, se avete tempo, soprattutto perchè le norme che disciplinano il web design sono molto diverse dal disegno per la stampa o per gli spot TV, che possano fornire una prospettiva diversa e particolare che aiuti a produrre idee molto originali che possono essere adatte al vostro progetto.

Anche i progetti architettonici possono essere una buona fonte di ispirazione:

A seconda del cliente e degli obiettivi, ciascuno degli edifici qui sopra può proporre nuovi concetti e nuove idee da utilizzare per il vostro sito come negli esempi seguenti (nello stesso ordine):

Si noti come ciascuna delle foto architettoniche qui sopra può essere facilmente trasformata in design di un sito web.

Il trucco è tenere sempre gli occhi aperti e utilizzare tutto come fonte di ispirazione, non fermarci a guardare solo gli altri progetti sul web o cercare di creare qualcosa da soli.

Conclusione

"Vedere viene prima delle parole. Il bambino guarda e riconosce prima di poter parlare".
- John Berger, Ways of Seeing

Se non avete letto "Ways of Seeing" di John Berger, vale la pena trovarne una copia in brossura (o almeno una versione e-book). Non voglio scavare troppo in profondità nei dettagli, ma è un libro che esplora i modi in cui la gente vede il mondo che li circonda. Il messaggio di fondo è che vedere è un istinto vitale e primordiale di noi umani: "vediamo" prima di leggere, prima di parlare, e prima di camminare.

Così noi, come web designer, possiamo richiedere un certo significato speciale a questa verità. Dovremmo stare attenti ai concetti che stanno dietro ai nostri progetti, perchè sono la prima cosa che la gente "vede". Prima delle parole sulla pagina o delle immagini appariscenti o in movimento, che abbiamo realizzato con duro lavoro, la gente vede il guscio - il concetto - che crea l'impressione generale del sito.
I dettagli sono importanti, non fraintendetemi, ma non si possono davvero fissare i dettagli fino a quando non si ha un progetto significativo dove inserirli.

Un grazie speciale a Ahmed Hussam, che ha realizzato questo articolo in mezzo al caos che sta sconvolgendo l'Egitto.