Disegno digitale - Icone by Stefania Pizzichi

DISEGNO DIGITALE GRAPHIC DESIGN & ART DIRECTION classe 1 a B // 1° semestre › A.A. 2012-13 Docente LORENZO VALLONE Assistente Giangiacomo galliani

Stefania Pizzichi

disegno digitale GRAPHIC DESIGN & ART DIRECTION A.A. 2012-13 ď&#x192;&#x2DC; stefaniapizzichi.it

DISEGNO DIGITALE GRAPHIC DESIGN & ART DIRECTION

classe 1a B // 1° semestre › A.A. 2012-13 Docente LORENZO VALLONE Assistente Giangiacomo galliani

Stefania Pizzichi

Indice → ICONE "ONE LINE"

1. Stile di riferimento

2. Target e specifiche

3. Set di icone

4. Mock-up

→ ICONE "KAWAII"

1. Stile di riferimento

2. Target e specifiche

3. Set di icone

4. Mock-up

→ Conclusioni

Brief >

Grafica iconica per smartphone

Partendo da una vostra ricerca iconografica di quelle che sono le icone utilizzate dai nuovi e più recenti smartphone (tipo l'Iphone Apple), sviluppate un vostro concept grafico che sia declinabile per linguaggio grafico, utilizzo del colore, utilizzo della forma, facile riconoscibilità e memorizzazone della funzione-applicazione, alle più comuni funzioni di un telefono o tablet touch screen. Partendo quindi da una ricerca degli stili grafici già in commercio, sviluppate su carta le vostre idee a livello di rough (schizzo) e poi disegnatele in vettoriale. Ragionate sul formato visibile di un telefono e pensate a come potrebbe essere la modularità di questi elementi-bottone, chiusi in un'area geometrica piuttosto che aperti con una leggibilità della shape (forma), astratti o più descrittivo-figurativi; pensate al tipo di utenza, al target di riferimento, uomo, donna, ragazzi, bambini, trovate delle soluzioni che rendano efficace questa interfaccia grafica per quel target. Questa grafica a cosa potrebbe ispirarsi? Cercate di cogliere il mood del progetto esplorando il target nel suo background di appartenenza e da li proponete uno stile che meglio si adatti allo "stile di vita" di queste persone.

Icone - elementi di base da sviluppare: › telefono chiamata › video chiamata › messaggi › mail › web › mappe › note › contatti › calendario › orologio › foto › archivio immagini › impostazioni › applicazioni › musica › video › giochi

icone `one lineÂ´

Il progetto di grafica vettoriale "Icone one line" si basa su un tipo di comunicazione molto semplice, immediato, che riprende la facilità di lettura dell'iconografia usata nella segnaletica. Un'unica linea usata, senza mai essere interrotta, per descrivere una sagoma, ovvero la funzione riprodotta dalla app dello smartphone. Questo tipo di espediente grafico nasce nel campo della realizzazione di marchi (e in questo contensto si ritrova la sintesi). è una grafica veloce, per gente che non ha tempo da perdere, la funzione determina l'aspetto, che deve essere, appunto, istantaneo. "Less is more" è il motto del target di riferimento. Di facile intuizione, linea minimalistica, è il design perfetto per amanti di una funzionalità elegante.

→ disegno digitale › ICONE "ONE LINE" > 1. STILE DI RIFERIMENTO

〔 12 〕

→ diseGno digitale › ICONE "ONE LINE" > 2. TARGET E SPECIFICHE

TARGET

SPECIFICHE

Età → 20÷50

Smartphone → Samsung: Galaxy Note (I e II) / Galaxy S (II e III)

Sesso → Prevalenza maschile

Sistema operativo → Android

Occupazione → Studenti e lavoratori del settore "design e affini", sportivi, "Wired-iani", appassionati dell'hi-tech

Specifiche del launcher → Si basa sulla disposizione di tutte le applicazioni in tre macro-aree: 1. Call-center per le app sulle chiamate, social network, messaggistica, chat (da Talk a Messanger), rubrica.... 2. Utility per tutte le app "comode", funzionali: navigatore, note, calendario, impostazioni, web... 3. Svago destinata a: giochi (dal puzzle al solitario), musica, video, fotografie, gallery, sport...

Mentalità → Persone pratiche e piuttosto impegnate, il cui motto quotidiano consiste in "Less is more": vietato perdere tempo in dettagli e interfacce che non aiutano l'identificazione di una specifica app Paese (in ordine di preferenza) → Europa, Canada, USA, Cina, Giappone, Korea Stile di riferimento → Questo espediente visivo "one-line" è un linguaggio molto utilizzato nella realizzazione di loghi, data la semplificazione estrema del segno (alcuni esempi nella pagina accanto, ultima riga).

Ogni macro-area ha un colore di riconoscimento, e la gerarchia del launcher impone una "home" dalla quale si sceglie in che categoria navigare. Progettualmente, i colori, la disposizione e le categorie sono interamente personalizzabili. In home vi è, inoltre, l'icona per navigare tutte le app scaricate sullo smartphone, per un totale quindi, di quattro aree. Da qui la possibilità di navigare le quattro aree tramite spostamenti direzionale: in alto, in basso, a destra e a sinistra; ciascuno per una macro-area.

〔 13 〕

→ disegno digitale › ICONE "ONE LINE" > 3. Set di icone / disegni

〔 14 〕

→ disegno digitale › ICONE "ONE LINE" > 3. Set di icone / vettoriale

〔 15 〕

→ disegno digitale › ICONE "ONE LINE" > 5. mock-up e descrizione

CARATTERISTICHE DELL'INTERFACCIA > SCHERMATA PRINCIPALE

Barra standard delle attività Widget ricerca con Google Widget a scorrimento

BORSA > FTSE MIB +3.81% DAX 30 +2.19%

12:45

Area > Call-center

Data e orario

gio 03.01.2012

Area > Utility

Area > Svago

Meteo e temperatura

Area > Applicazioni (tutte) 12° / 16°

〔 16 〕

→ disegno digitale › ICONE "ONE LINE" > 5. mock-up

CARATTERISTICHE DELL'INTERFACCIA > CATEGORIA SELEZIONATA

Nome dell'area selezionata

> CALL CENTER < Schermate create

〔 17 〕

→ disegno digitale › ICONE "ONE LINE" > 5. mock-up e descrizione

BORSA > FTSE MIB +3.81% DAX 30 +2.19%

12:45 gio 03.01.2012

12° / 16°

〔 18 〕

→ disegno digitale › ICONE "ONE LINE" > 5. mock-up

> CALL CENTER <

> utility&SERVICE <

> FREE TIME <

〔 19 〕

icone `kawaiiÂ´

Il progetto di grafica vettoriale "Icone Kawaii" si basa su un tipo di comunicazione molto colorata e tenera. I tratti sono semplici e ben definiti, la campitura e le cromie sono a tinta piatta. Vari toni dello stesso colore per definire diversi elementi della medesima icona. Uso simultaneo di tinte complementari. Questa tipologia di icone sono il giusto compromesso fra una dimensione figurativa e l'altra iconica: abbastanza descrittive, senza perdere l'essenza dell'icona-simbolo e la relativa immediatezza di leggibilitĂ . Riprendono lo stile dell'arte digitale, utilizzata nella grafica editoriale, come il lavoro artistico di grandi illustratori contemporanei come Jonathan Calugi o Alberto Antoniazzi, solo per citarne alcuni italiani.

→ disegno digitale › ICONE "KAWAII" > 1. STILE DI RIFERIMENTO

〔 22 〕

→ disegno digitale › ICONE "KAWAII" > 2. TARGET E SPECIFICHE

TARGET

SPECIFICHE

Età → 15÷30

Smartphone → Samsung: Galaxy Note (I e II) / Galaxy S (II e III)

Sesso → Prevalenza femminile

Sistema operativo → Android

Occupazione → Studentesse e lavoratrici del settore "design e affini", illustratrici, scrittrici, nail-artist, cake designer

Mentalità → Un po' romantica e sognatrice, sono persone a cui piace essere al passo con i tempi "teneramente". Palette colori basata sulle tonalità pastello. Amanti delle cose "carine", di manga e anime (tipo shojo), sono spesso dei Japan-style addict e appartengono al kawaii-mode. Paese (in ordine di preferenza) → Giappone, Korea, Cina, Europa, Canada, USA Designer di riferimento → Jonathan Calugi, Goran, Alberto Antoniazzi, Tamer Koseli, Katie Kirk, Aranzi Aronzo, Hayao Miyazaki, Loulou&Tummie, Forma&Co.

〔 23 〕

→ disegno digitale › ICONE "kawaii" > 3. Set di icone / disegni

〔 24 〕

→ disegno digitale › ICONE "kawaii" > 3. Set di icone / vettoriale

〔 25 〕

→ disegno digitale › ICONE "kawaii" > 5. mock-up e descrizione

CARATTERISTICHE DELL'INTERFACCIA > SCHERMATA PRINCIPALE

Barra standard delle attività Data e orario

✔ sab 05/01/2013 ➜ h 22:35 Widget ricerca con Google

Area > Call-center

Area > Utility

Area > Svago

Area > Applicazioni (tutte)

06/01

07/01

08/01

3° / 5°

-1° / 1°

-2° / 1°

Meteo e temperatura

〔 26 〕

→ disegno digitale › ICONE "kawaii" > 5. mock-up

CARATTERISTICHE DELL'INTERFACCIA > CATEGORIA SELEZIONATA

Nome dell'area selezionata

Call center 1/3

Schermate create

〔 27 〕

→ disegno digitale › ICONE "kawaii" > 5. mock-up e descrizione

✔ sab 05/01/2013 ➜ h 22:35

〔 28 〕

06/01

07/01

08/01

3° / 5°

-1° / 1°

-2° / 1°

→ disegno digitale › ICONE "kawaii" > 5. mock-up

Call center 1/3

utility&service 1/4

free time 1/2

〔 29 〕

→ Conclusione Il brief proposto è stato molto stimolante, poiché si collima un progetto didattico con una possibile e concreta esigenza di mercato. Proprio da questo punto di partenza mi sono mossa per la realizzazione di entrambi i set di icone. → PRIMO SET: ICONE "ONE LINE" Ho notato che lo stile del primo set di icone corrisponde esattamente ad una richiesta di mercato: le icone "one line" sono piuttosto ricercate negli stock e ne esistono pochi "esemplari" al momento. Ho voluto quindi cogliere l'occasione per crearne uno personale, applicandolo alle icone possibili di uno smartphone. → SECONDO SET: ICONE "KAWAII" Questo set corrisponde ad uno stile vicino alla mia personalità e alla grafica editoriale "wirediana", attualmente molto conosciuta (infografiche e puro disegno digitale piatto). Non adoro - per il fine dell'iconografia - lo stile "appleiano" ricco di impercettibili finezze e poco intiuitivo alla prima occhiata, dunque, ho cercato un giusto equilibro fra il figurativo e l'iconico. Il mood tenero e giocherellone è destinato al target scelto, dentro la quale trovo me stessa. → INTERFACCIA Analizzando la mia user-experience ho notato che molto spesso la ricerca dei pulsanti sulle funzioni pricipali (chiamate e messaggi), all'interno di infinite pagine - anche se ben organizzate - risulta difficile, se ad esempio stiamo camminando di fretta e magari con lo sguardo al semaforo. Ho dunque diviso la "home" del telefono in sezioni principali, definendo l'interfaccia con la gerarchia di un sito, così l'organizzazione è forzatamente più ordinata.