Il gadget più hot - e possibilmente il più discusso - in questi giorni è la stampante 3D. È uno strumento che potrebbe rivoluzionare il modo in cui i prodotti sono realizzati. Ma c'è un altro argomento tridimensionale che fa ondine anche nel mondo del design: le immagini in 3D.
Anche se il design del sito web vive in due dimensioni, non impedisce ai designer di flettere i propri muscoli creativi e di spingere i limiti dello schermo con più oggetti e progetti che hanno un aspetto reale. Diamo un'occhiata a come puoi sfruttare al meglio la tendenza 3D.
Lavorare in tre dimensioni
Quando si tratta di progettazione di siti Web, è probabile che gli effetti tridimensionali vivano effettivamente in uno spazio 2D. (Soprattutto perché provare a mettere insieme qualcosa che richiede occhiali speciali non è particolarmente efficace.) Come sapresti quali utenti hanno avuto?)
Quando si tratta di utilizzare, gli effetti 3D possono funzionare abbastanza bene per una varietà di diverse opzioni del sito. Dalle interfacce dello stile di gioco allo shopping e all'identificazione del prodotto, un'interfaccia che gli utenti possono quasi toccare risulta piuttosto utile.
Sta diventando anche più alla moda incorporare effetti e stili 3D nel design. Proprio come i designer hanno iniziato a pensare il 3D qualche anno fa, la folle popolarità del design piatto ha fermato la tendenza, perché imitare un'estetica realistica richiede tecniche scoraggiate come un piatto acquisito slancio. Effetti come ombre esterne, smusso e rilievo sono fondamentali quando si tratta di creare profondità di campo nello spazio da 2D a 3D.
Una tendenza in evoluzione
Quindi, come puoi sfruttare al meglio questa tendenza in continua evoluzione? Mescola e abbinalo con altri stili di tendenza per il massimo impatto.
Qui ci sono alcune cose da considerare quando si tratta di utilizzare le immagini 3D:
- Aggiungi un tocco realistico agli elementi che gli utenti vorranno toccare
- Aggiungi profondità al gameplay o agli elementi video
- Fallo parte dell'interfaccia con lo scrolling della parallasse
- Non sovraccaricare gli utenti e attenersi a un trucco 3D nel design
- Mantieni il resto del design semplice
- Quando si tratta di usabilità, guida gli utenti su come navigare o utilizzare gli strumenti
Stratificazione e influenza materiali
Lavorare con effetti 3D sta guadagnando slancio grazie a Material Design. Il concetto di design basato su Google ha contribuito a riportare alcune delle tecniche e degli effetti che andavano fuori moda con stili più piatti e minimali.
Ciò include l'uso di ombre esterne: sì, sono tornate. Ma prendono una considerazione più attenta in modo che le ombre di caduta imitino sempre la luce da una "sorgente". Ciò significa che le ombre dovrebbero apparire naturali perché un elemento ha profondità, non esistono solo per evidenziare un pezzetto di testo o un oggetto.
Mentre non vuoi impazzire con le ombre, le minuscole ombre su più oggetti sono OK. Le ombre migliori sono quelle che hanno uno scopo ma non sono ovvie per l'utente occasionale. Se qualcuno può? Vedere? l'ombra, probabilmente è troppo. Optare per le ombre che sono pallide, morbide e sottolineano la realtà.
Uno dei concetti chiave di Material Design è l'idea di sovrapporre oggetti sui piani. La documentazione sottolinea anche l'uso dello spazio 3D:
L'ambiente materiale è uno spazio 3D, il che significa che tutti gli oggetti hanno dimensioni x, ye z. L'asse z è perpendicolarmente allineato al piano del display, con l'asse z positivo che si estende verso il visualizzatore. Ogni foglio di materiale occupa una singola posizione lungo l'asse z e ha uno spessore 1dp standard, equivalente a un pixel di spessore su schermi con una densità di pixel di 160.
Sul Web, l'asse z viene utilizzato per la stratificazione e non per la prospettiva. Il mondo 3D viene emulato manipolando l'asse y.
Quindi, quando si pensa al 3D, è altrettanto vitale considerare come gli oggetti si muovono e interagiscono così come lo è pensare alle tecniche di progettazione coinvolte nella loro creazione.
Illustrazioni 3D e animazione
Uno dei luoghi in cui puoi davvero portare le immagini 3D al livello successivo è con illustrazioni, immagini di oggetti e animazioni. I rivenditori online, in particolare, fanno un ottimo lavoro nell'incorporare gli effetti animati 3D nelle pagine dei prodotti.
Uno dei migliori usi di questo è con opzioni di visualizzazione a 360 gradi per i prodotti che gli acquirenti possono virtualmente spostare ed esaminare con pochi clic o tocchi. Converse fa un ottimo lavoro con le sue pagine di scarpe. Gli utenti possono spostare ogni spettacolo per vederlo da qualsiasi angolazione, oltre a cambiare i colori e le altre opzioni su una tela che fanno sentire l'utente come se fosse in un ambiente che tiene la scarpa e la guarda.
Questo è un uso efficace delle immagini 3D per la progettazione di siti Web. È complicato e interessante, ma travolgente per l'utente. (Questo è il vero trucco per fare questo - o qualsiasi tecnica di progettazione, in realtà - lavorare in un modo che abbia senso per gli utenti.)
Suggerimenti e trucchi
Quando si tratta di grafica 3D, la semplicità è migliore. Non vuoi sommergere gli utenti con troppi effetti o elementi che sono solo per lo spettacolo. Poiché il design tridimensionale è tutto un'illusione visiva sul flat, tela del sito, è importante non impazzire con i trucchi. Concentrati sull'usabilità del contenuto e decidi da lì se il 3D è la strada giusta da percorrere.
Quando si tratta di utilizzare 3D, tenere presente questi suggerimenti:
- Usa il 3D per separare gli oggetti dai loro dintorni (stratificazione)
- Mirare a leggere ombre o goffrature e ricordare di considerare "naturale"? fonte di luce quando si tratta di angoli e posizionamento
- Deve sembrare reale
- Sfumature e punti salienti possono anche creare profondità e stratificazione
- Usa gli effetti 3D in modo coerente tra le pagine
- Se 3D è associato a un'azione, come un clic, fornisci indicazioni che aiutano l'utente a capire cosa fare (i pulsanti sono un elemento 3D comune)
- Scala gli elementi in modo appropriato; Il 3D è un'illusione della realtà, quindi gli oggetti dovrebbero sentirsi? Reali? in dimensioni, peso e ambiente
Conclusione (e una parola di cautela)
Ora quello che vuoi evitare è finire con la tipografia 3D o le immagini che assomigliano alla parola arte dai primi word processor. (Puoi farti prendere e finire con questo risultato più velocemente di quanto pensi.)
Il trucco per effetti tridimensionali è sottigliezza. Ci dovrebbero essere elementi di realtà e stratificazione, ma non dovrebbe essere un trucco ovvio? o effetto. I buoni effetti 3D incoraggiano gli utenti a interagire e giocare con l'interfaccia, grazie a una tecnica che li aiuta a conoscere più intuitivamente cosa fare.