Il design mobile mi ha abbozzato più verticalmente. E non penso sia solo io.
Vedo sempre più siti su piattaforme che incorporano più componenti verticali nel loro design complessivo. Dimentica? Sopra la pergamena ,? parliamo di andare verticale.
Design orizzontale vs. verticale
Per molto tempo, il design del sito web si è incentrato su un aspetto piuttosto distinto? mentalità. La progettazione di tablet e dispositivi mobili richiede di modificare l'orientamento predefinito e tutti i siti per dispositivi mobili ben progettati offrono davvero un'influenza verticale per progettare progetti, sia online che stampati.
Molti degli stessi principi di base si applicano sia che si lavori orizzontalmente o verticalmente. La tipografia pulita, una tavolozza di colori e immagini forti e l'organizzazione generale sono importanti.
Progettare in uno spazio verticale non è però un nuovo concetto. I designer di stampa lo fanno da anni - pensa a giornali e riviste come esempi classici. La novità è la possibilità verticale quasi illimitata. Nei progetti Web verticali, è possibile estendere la profondità a piacere (sebbene ciò non sia sempre consigliato).
Crea uno spazio verticale
A volte la prima sfida è creare uno spazio verticale adatto al tuo progetto. Succede quasi automaticamente quando si lavora su qualsiasi progetto che include una controparte mobile, ma per quanto riguarda il sito stesso? (Questo, nell'attuale ambiente del browser, non avrà mai veramente una forma verticale coerente).
Se hai un blog o un sito web con una barra laterale, il tuo spazio di lavoro potrebbe essere già più verticale di quanto pensi. Enfatizza quella forma con altre parti verticali, come una forte immagine su e giù o un breve blocco di testo che legge verticalmente.
Un'altra opzione è estendere il tuo spazio oltre la pergamena. Creare schermate a cascata? che sono navigati dall'alto verso il basso. Questo è un concetto che è stato disapprovato per qualche tempo, ma sta guadagnando terreno nuovamente perché gli utenti sono stati "riqualificati"? per scorrere un sito Web grazie all'abbondanza di applicazioni mobili e tablet che funzionano in questo modo.
Puoi anche pianificare il tuo progetto intorno a diversi spazi verticali creando una griglia di diverse colonne larghe. In questa configurazione, ogni colonna ha uno scopo distinto (molto simile a una barra laterale) che crea uno spazio di lavoro verticale. È possibile creare un'area di lavoro verticale a colonna singola restringendo la larghezza dei pixel dell'area di lavoro e riempendo il resto con un'immagine di sfondo.
La chiave non è forzarla. A volte semplicemente non sarai in grado di far funzionare uno spazio verticale. Se non è possibile progettare utilizzando un orientamento completamente verticale, provare a utilizzare alcuni elementi di progettazione verticale, come barre di navigazione o immagini, all'interno del progetto generale.
Utilizzando elementi verticali
A volte pianificare un progetto verticale è qualcosa di più dello spazio complessivo. Prendi in considerazione l'utilizzo di elementi verticali in uno spazio orizzontale per creare un effetto verticale. Sperimenta con foto verticali o blocchi di testo alti e sottili. Ma di nuovo non forzarlo; questi strumenti sono efficaci solo se funzionano con (non contro) i tuoi contenuti.
Crea anche elementi statici, come barre di navigazione o loghi, anche in verticale. Ricorda solo di strutturare questi elementi in modo che rimangano utilizzabili. Le barre di navigazione funzionano meglio per un layout a scorrimento quando non sono troppo profonde e si spostano con la pagina man mano che gli utenti navigano. (Non vuoi che gli utenti si sentano frustrati nel cercare di trovare le cose).
Puoi anche usare il colore per stabilire un aspetto più verticale del tuo sito. Pensa allo sfondo: le strisce verticali possono aggiungere un "più alto"? sentire quando si posiziona dietro altri oggetti.
Design verticale in azione
Il design di stampa ha fatto affidamento su una tela verticale per centinaia di anni. Alcune delle pubblicazioni più famose - The New York Times, USA Today, Vogue e People - hanno formati più alti di quanto non siano ampi.
Ma non finisce lì. I poster di film sono uno degli esempi più noti di progetti di design orientati verticalmente.
Sempre più biglietti da visita, anche se spesso stampati orizzontalmente, assumono un formato verticale. Perché? Perché li fa risaltare tra le centinaia di altri nello stack. Lo stesso vale per altri materiali promozionali stampati come magneti e adesivi. Per i progetti di stampa, la decisione di utilizzare un orientamento verticale quando la maggior parte degli altri sta lavorando orizzontalmente può davvero aggiungere un po 'di pop e stile al progetto.
Considerazioni verticali
? I layout verticali possono diventare pesanti e difficili da navigare in fretta?I layout verticali possono diventare pesanti e difficili da navigare in fretta. Assicurati di dare ampio peso alle intestazioni e agli strumenti di navigazione durante la progettazione in uno spazio verticale in modo che l'utente (o il lettore) non perda traccia di ciò che sta guardando.
Potresti considerare di aumentare di alcuni punti il testo (e con un vantaggio aggiuntivo) quando utilizzi un formato verticale e probabilmente includerai i dispositivi di navigazione (che siano barre di scorrimento o descrizioni) che seguono l'utente attraverso il sito web.
Fai attenzione anche allo spazio orizzontale nel layout verticale. Resisti alla tentazione di forzare uno stile orizzontale in uno spazio diverso; probabilmente non sarà all'altezza. Non vuoi unire altri elementi insieme solo per farli stare in uno spazio più ristretto. Guarda come riordinare o impilare gli elementi in modo che l'area di lavoro non si senta affollata.
Amore verticale
Qui ci sono alcuni siti che stanno prendendo il concetto verticale e in esecuzione.
Attivare
Il sito è costruito verticalmente e ti aiutano a navigare usando lo scroll per aprire? la bottiglia e il resto del sito. (Questo non invecchia mai.)
Enviro Homes
Questa barra di navigazione nella parte superiore di questo sito a base verticale, regola in modo da avere sempre la visualizzazione perfetta sullo schermo del computer.
Lotta Nieminen
Questo sito utilizza colonne verticali per stabilire la forma.La combinazione di rettangoli ti incoraggia a spostarti nella pagina.
100% pura Nuova Zelanda
Scorrendo verso il basso in questa pagina si crea un effetto video che ti consente di vedere più neozelandesi.
Conclusione
Amo il risorgere e l'enfasi che i concetti mobili stanno avendo su progetti orientati verticalmente. Anche il cambiamento degli ambienti utente e l'emergere del design reattivo influenzano questa tendenza.
Nel complesso, la progettazione verticale non è molto diversa dalla sua controparte orizzontale. All'inizio può essere un po 'poco familiare, ma usando gli stessi strumenti e concetti che riguardano il buon design in uno schema orizzontale è possibile creare grandi progetti verticali. Se sei preoccupato per il risultato, inizia in piccolo e sviluppa alcune parti verticali da incorporare in un progetto prima di andare completamente verticale. Potresti solo scoprire quanto ti piace la nuova vista!
Fonti di immagini: Illyissimo, Food Sense, Simon Collison e Spigot Design.