01<\/h6>\n\n\n\nModalit\u00e0 Goblin – massimalismo<\/h3>\n\n\n\n
<\/p>\n<\/div>\n\n\n\n \u2018Goblin Mode\u2019 \u00e8 stato scelto come la Parola dell’Anno 2022 di Oxford.\nIl termine si riferisce a \u201cun tipo di comportamento che \u00e8 sfacciatamente autoindulgente, pigro o trasandato, e che tipicamente rifiuta le norme o le aspettative sociali.\u201d \u00c8 diventata la prima parola dell’anno ad essere stata decisa tramite voto pubblico. <\/p>\n\n\n\n Non \u00e8 un segreto che, come societ\u00e0, siamo lentamente scivolati nell’autoindulgenza negli ultimi decenni.\nA volte \u00e8 imbarazzante e a volte eccessivo, ma lo si pu\u00f2 vedere in tutti gli aspetti della vita occidentale.\nAbbigliamento sportivo, fare shopping online per tutto, ordinare fast food quando ci sentiamo pigri e abbuffarci con le ultime serie TV.\nQuesti sono solo alcuni esempi della vita moderna che creano l’atmosfera perfetta per far emergere il nostro goblin interiore, ed \u00e8 intrigante pensare a come questo influenzer\u00e0 il design web in futuro. <\/p>\n\n\n\n Queste nuove norme sociali evolute, come riflette il termine goblin, sono interessanti quando le correlazioniamo al design UI e UX.\nAlla base, il design UI e UX \u00e8 un campo basato su standard, migliori pratiche e lo studio degli utenti, cercando di essere il pi\u00f9 inclusivo possibile.\nUno dei modi in cui vediamo questa tendenza in azione \u00e8 attraverso siti web goblin che mettono il marchio al primo posto, prima dell’utente.\nIgnorando le migliori pratiche e persino l’accessibilit\u00e0 a volte, questi siti web mettono in discussione cosa sia la \u201cbellezza.\u201d\nAspirano a rafforzare la presenza del marchio<\/a>, rendendo il sito web memorabile e coinvolgente utilizzando uno stile grezzo, un eccesso di immagini, duplicazioni, colori forti, rumore, animazioni di ingresso dure, oggetti multipli, ecc.\nPossiamo innamorarci di questi siti web, o criticarli, ma non possiamo fingere di non aver mai usato uno o due di questi espedienti per migliorare la presenza di un sito web. <\/p>\n<\/div>\n\n <\/p>\n<\/div>\n\n\n\n Dall’altro lato dello spettro rispetto al massimalismo, vediamo un movimento di semplicit\u00e0 che afferma che tutto ci\u00f2 di cui abbiamo bisogno \u00e8 un po’ di equilibrio – un esercizio di \u201crallentamento.\u201d\nQuesta tendenza crea un’esperienza piacevole e rilassante per l’utente ed \u00e8 opposta alla \u201ccultura dell’apparenza.\u201d <\/p>\n\n\n\n Vedremo sempre pi\u00f9 siti web che esplorano la semplicit\u00e0 attraverso la riduzione dei dettagli, cercando di raggiungere l’anonimato.<\/p>\n\n\n\n Questi siti web a volte agiscono come una struttura o un wireframe progettato, utilizzando una tipografia<\/a> minimalista, una gamma limitata di stili di carattere all’interno del sito, colori tenui che si allineano con grandi immagini o con illustrazioni amorfe che sostituiscono le illustrazioni UX dettagliate. Inoltre, a volte una dolce animazione di scorrimento avvolge il sito web, facendoti fluttuare nella serenit\u00e0.<\/p>\n\n\n\n Sorprendentemente, pu\u00f2 essere un processo difficile progettare un sito web<\/a> come questo, poich\u00e9 \u00e8 necessaria la maturit\u00e0 del designer per capire dove si trova l’essenza e cosa \u00e8 ridondante. Questi siti web a volte risaltano di pi\u00f9, sia in termini di stile che di performance<\/a>, distinguendosi dai siti web concorrenti carichi di contenuti e immagini.<\/p>\n\n\n\n Templeton Clothing<\/a> \u00e8 un sito di ecommerce delle Alpi settentrionali bavaresi. Basta uno sguardo rapido alla loro sezione principale per capire il loro atteggiamento; animazione al rallentatore, nessuna promozione o CTA. Senza usare parole, ti stanno chiedendo di rilassarti e scorrere. I bordi lineari complessivi in bianco e nero e le grandi immagini si adattano al loro \u201canti-design\u201d, mettendo in risalto i prodotti come elemento principale e il branding come secondario.<\/p>\n<\/div>\n\n <\/p>\n<\/div>\n\n\n\n L’anno scorso abbiamo parlato di scrollytelling<\/a>, e anche se sembra passato un decennio, quest’anno sembra che l’esperienza web abbia fatto diversi passi avanti con nuovi modi di coinvolgere.<\/p>\n\n\n\n Prima di creare un sito web<\/a>, mappiamo un percorso utente e per motivi funzionali – creiamo una struttura e un framework. Se lo paragoniamo al mondo reale, il sito web \u00e8 un percorso che vogliamo che l’utente percorra verso la conversione<\/a>. La domanda che questa tendenza solleva \u00e8, qual \u00e8 questo percorso utente e come dovrebbe apparire nel 2023?<\/p>\n\n\n\n Questo approccio ‘delizia’ ci ispira a iniziare a pensare al sito web come a qualcosa di pi\u00f9 di un semplice insieme di pagine, ma piuttosto come a un’esperienza tridimensionale.\nL’obiettivo generale, ovviamente, \u00e8 mantenere gli utenti coinvolti e curiosi, e guidarli lungo il percorso con sorprese e gioiose easter-egg lungo la strada.\nUn ottimo esempio di tale delizia allegra \u00e8 il cursore animato, che pu\u00f2 svolgere un ruolo importante nel migliorare l’esperienza utente nel web design. <\/p>\n\n\n\n Da questa scuola di pensiero, possiamo pensare alle funzionalit\u00e0 che eravamo soliti trascurare come tecniche, biforcazioni nel percorso, come il menu o i link interni, CTA<\/a> e le estremit\u00e0 del percorso stesso – come il footer o il 404. In queste \u201caree di conflitto<\/a>,\u201d possiamo mappare le sensazioni che gli utenti potrebbero provare come successo o fallimento, interesse, fiducia o sospetto, ecc. Aggiungere animazioni, messaggi di marketing<\/a> e motivi umoristici pu\u00f2 facilitare l’esperienza utente e rafforzare il legame tra l’utente e il brand. Sembra che, per il momento, i clienti non abbiano sentimenti forti riguardo a queste aree, il che le rende il luogo ideale per liberare la nostra creativit\u00e0. <\/p>\n\n\n\n Studio Brot<\/a> \u00e8 un’agenzia di design che si concentra sulla pubblicit\u00e0 e il branding. I loro servizi sono suddivisi e semplificati, presentati all’utente sotto forma di una metafora della panificazione del pane (Brot – tedesco per pane). Ci siamo innamorati delle loro tecniche di navigazione e delle varie animazioni in tutto il sito web che ti tengono sempre sul filo del rasoio, facendoti chiedere cosa aspettarti dopo.<\/p>\n<\/div>\n\n <\/p>\n<\/div>\n\n\n\n Come parte della sfocatura dei confini tra fisico e virtuale, \u00e8 affascinante immergersi e prevedere i cambiamenti nell’arena dell’e-commerce<\/a>. \u00c8 un po’ un paradosso. Da un lato, il design fisico sta diventando iper digitalizzato, ma dall’altro, alcuni audaci siti web di ecommerce<\/a> suggeriscono un’esperienza di acquisto sensuale e tangibile. <\/p>\n\n\n\n Per una buona ragione, molti di noi amano entrare in un negozio di abbigliamento, l’odore dei vestiti nuovi, o provare una camicia e sentire la morbidezza del tessuto.\nQuesta tendenza web cerca di riprodurre un’esperienza di shopping reale attraverso display di prodotti interattivi che aggiungono un altro strato di dimensione per rendere l’intero processo di acquisto quasi tangibile. <\/p>\n\n\n\n Anche con un budget ridotto, possiamo cercare di stimolare i sensi dell’utente utilizzando animazioni lottie, rotazioni e animazioni 3d – tutto per incoraggiare l’utente a esplorare e interagire con il prodotto che stiamo vendendo.\nQuesto crea una sensazione potente e memorabile di scoperta delle caratteristiche del prodotto, degli angoli e dell’illuminazione con un grande senso di giocosit\u00e0.\nIl trucco \u00e8 capire come il tuo prodotto \u00e8 diverso dagli altri e come far interagire l’utente con esso. <\/p>\n\n\n\n Grace<\/a> \u00e8 un prodotto nutrizionale, con un approccio di marketing di grande impatto. Permettono agli utenti di simulare l’esperienza di unboxing, giocare con il pacchetto e rivelare il prodotto attraverso un percorso utente accuratamente studiato che non \u00e8 nemmeno possibile nel negozio fisico. <\/p>\n<\/div>\n\n <\/p>\n<\/div>\n\n\n\n Anche se siamo lontani dalle prime fasi della tecnologia IA, solo di recente \u00e8 diventata accessibile al pubblico e sembra che tutti ne stiano parlando.\nNell’ultimo anno abbiamo assistito all’emergere di diversi motori IA online che sembrano essere dei game changer.\nMotori come ChatGPT, dall.e2, Midjourney, Stable diffusion per citarne alcuni, insieme alla tecnologia deepfake, hanno suscitato un ampio dibattito su come potrebbe essere il nostro ruolo come creatori in futuro. <\/p>\n\n\n\n Gran parte della conversazione ruota attorno all’idea che l’IA render\u00e0 presto obsoleta la necessit\u00e0 di professionisti creativi.\nQuesto \u00e8 un approccio piuttosto distopico.\nLa verit\u00e0 \u00e8 che l’IA nel suo stato attuale \u00e8 pi\u00f9 uno strumento da usare per noi piuttosto che un sostituto futuro.\nE lo useremo. <\/p>\n\n\n\n Abbiamo visto questa tendenza accelerare negli ultimi mesi con l’esplosione di dall.e2 e Midjourney sulla scena con le loro capacit\u00e0 di creazione di immagini mozzafiato.\nPi\u00f9 recentemente, l’introduzione di ChatGPT nel mix, e la microcopia non \u00e8 mai stata cos\u00ec accessibile.\nMa \u00e8 importante ricordare che i risultati che otteniamo da questi motori richiedono lavoro, e come qualsiasi strumento, pi\u00f9 lo padroneggiamo, maggiore sar\u00e0 il nostro controllo.\nConcentriamoci sulla creazione di immagini.\nSe prendiamo Midjourney per esempio, puoi facilmente creare immagini da semplici prompt di testo.\nQueste sono immagini che una volta richiedevano un’eternit\u00e0 per essere create o persino trovate e acquistate i diritti.\nMa i prompt semplici ti portano solo fino a un certo punto.\nLa chiave \u00e8 affinare le tue query man mano che procedi, concentrandoti sulle aree che ritieni necessitino di lavoro.\nPi\u00f9 scavi in profondit\u00e0, pi\u00f9 velocemente arriverai ai risultati desiderati. <\/p>\n\n\n\n <\/p>\n<\/div>\n\n <\/p>\n<\/div>\n\n\n\n A maggio celebreremo 20 anni di WordPress.\nL’introduzione di WordPress ha innescato una sorta di rivoluzione, portando la creazione di siti web alle masse.\nOra siamo nel 2023 – e ogni poche settimane leggiamo di uno sviluppo digitale diverso e sensazionale. <\/p>\n\n\n\n A volte, vogliamo essere all’avanguardia della tecnologia come buoni early adopters, leggere un articolo e imparare un nuovo strumento o tecnica e condividere le nostre scoperte con la nostra comunit\u00e0 di creatori web.\nMa di tanto in tanto, preferiamo saltare la curva di apprendimento, rannicchiarci e aggrapparci al passato confortevole anche in questa era di accelerazione digitale.\nVediamo ancora molti motivi degli anni ’80-’90.\nLa cosa che troviamo intrigante \u00e8 la nostalgia per la vecchia tecnologia, come il primo computer che avevamo a casa o il lettore di dischi compatto dall’aspetto buffo. <\/p>\n\n\n\n Quindi, per i ritardatari tra noi, o per quelli con affetto per il Y2K, notiamo in particolare collage, pixelizzazione, colori forti, interfacce utente simili a MS-DOS e influenze dei vecchi giochi arcade. <\/p>\n\n\n\n Hie<\/a> \u00e8 un’agenzia di talenti per creatori di contenuti. Usano oggetti nostalgici e li reimmaginano da un punto di vista contemporaneo. Questa giocosit\u00e0 \u00e8 progettata per solleticare la nostra curiosit\u00e0 e attirare la nostra attenzione.<\/p>\n<\/div>\n\n <\/p>\n<\/div>\n\n\n\n La capacit\u00e0 di attenzione delle persone diminuisce ogni anno.\nPossiamo incolpare i social media, Tiktok<\/a> e Instagram ovviamente, ma siamo anche consumatori oltre che creatori.\nData questa realt\u00e0, l’interfaccia utente non pu\u00f2 rimanere statica. Il movimento<\/a> \u00e8 un ottimo strumento per attirare gli utenti, e pu\u00f2 essere un’esperienza molto efficace e immersiva.\nNell’ultimo anno abbiamo visto come il movimento viene utilizzato per mantenerci coinvolti, portandoci a consumare pi\u00f9 contenuti.\nCi permette come utenti di sentirci interagire con il sito web a un livello pi\u00f9 alto di prima, e in modo pi\u00f9 significativo, per di pi\u00f9. <\/p>\n\n\n\n I nostri utenti sono abituati a vedere pixel che si muovono e saltano in giro; si aspettano di ricevere indicazioni per ogni singola azione.\nQuesto feedback fa sentire l’utente come un partecipante attivo, facendolo sentire presente e concentrato.\nUn modo per creare tale esperienza \u00e8 attraverso l’animazione di scorrimento morbido, realizzata utilizzando effetti di parallasse fluttuanti tra le sezioni che facilitano micro animazioni.\nUn altro esempio, che ci aspettiamo diventi pi\u00f9 popolare, \u00e8 il movimento che supera le norme – arrivando persino a giocare con il senso di equilibrio e gravit\u00e0 dell’utente.\nVedremo pi\u00f9 animazioni o video integrati che mirano a giocare con i tuoi occhi, con animazioni di ingresso brusche, esplosioni potenti, zoom-in, font variabili, adesivi rotanti e cos\u00ec via.\nA volte pu\u00f2 essere stancante, ma l’attenzione dell’utente \u00e8 cos\u00ec preziosa che cercheremo di attirarla con qualsiasi mezzo necessario. <\/p>\n\n\n\n Estudios Victor Cordon<\/a> \u00e8 una piattaforma creativa che supporta la comunit\u00e0 artistica indipendente. Usano un movimento costante e senza soluzione di continuit\u00e0 mentre scorri da una sezione all’altra. Una cosa da notare, che abbiamo trovato sia bella che unica, \u00e8 che i componenti sullo schermo sono effettivamente statici, ma il movimento creato dallo sfondo d\u00e0 un senso di fluidit\u00e0 e movimento costante.<\/p>\n<\/div>\n\n <\/p>\n<\/div>\n\n\n\n In contrasto con l’estetica del design pulito, vediamo sempre pi\u00f9 siti web che spingono letteralmente i confini al limite con layout tipografici unici.\nQuesta tendenza \u00e8 piuttosto sorprendente considerando che questa pratica di design \u00e8 comune su supporti che sono a corto di spazio, come il retro delle confezioni, i poster dei festival musicali, le etichette e la segnaletica, ecc.\nForse questa tendenza ha a che fare con la nostra nostalgia per i design che utilizzano materiali reali, che abbiamo abbandonato a favore dello schermo e dell’esperienza interattiva. <\/p>\n\n\n\n Con l’obiettivo di attirare l’attenzione, i pi\u00f9 interessanti giocano con tipografia<\/a> e griglie lasciando andare i layout web convenzionali nella loro missione di creare un’esperienza visiva basata sul testo memorabile. Questi siti web tendono a utilizzare intestazioni di grandi dimensioni con tipografia in stile brutalista<\/a>, che non \u00e8 tipicamente utilizzata sul web. Come parte di questo movimento, potremmo anche vedere pi\u00f9 siti web con sezioni che hanno solo un paragrafo con una dimensione del carattere cos\u00ec grande da occupare l’intera sezione. Tutto insieme, aggiunge un elemento dinamico alla pagina, anche quando \u00e8 statica. <\/p>\n<\/div>\n\n <\/p>\n<\/div>\n\n\n\n In un’epoca in cui le voci degli estremisti si fanno sentire nel mondo reale, abbiamo l’opportunit\u00e0 di fare la differenza qui nell’universo web alternativo che abbiamo creato.\nDopotutto, noi creatori del web siamo una grande comunit\u00e0.\nAbbiamo l’opportunit\u00e0 di aggiungere pi\u00f9 valore e rendere il world wide web un posto migliore, pi\u00f9 inclusivo<\/a>. <\/p>\n\n\n\n Con l’aumento della dipendenza digitale nella nostra societ\u00e0, da quando \u00e8 arrivato il Covid19, gli utenti trascorrono molto pi\u00f9 tempo online per ottenere anche i servizi pi\u00f9 basilari.\nQuando iniziamo un progetto, solitamente creiamo un brief accurato e adattiamo il design per uno specifico user persona<\/a> e bisogno.\nForse quest’anno, la nostra risoluzione per il nuovo anno potrebbe essere cercare di vedere Internet attraverso gli occhi degli altri – rendendo la tecnologia utilizzabile per tutte le persone, indipendentemente dalle loro abilit\u00e0, situazione economica, et\u00e0, istruzione o posizione geografica. <\/p>\n<\/div>\n\n <\/p>\n<\/div>\n\n\n\n I social media, con le loro infinite possibilit\u00e0, hanno ancora alcune limitazioni; condividere un solo link nel tuo profilo \u00e8 sicuramente una di queste.\nCos\u00ec \u00e8 nato il ‘Link in bio’.\nIl Link in bio \u00e8 fondamentalmente una landing page<\/a> progettata per connettere social, siti web, negozi, video, musica, podcast, eventi e altro ancora.\nTutti si uniscono in questa pagina progettata per connettere, formare nuove relazioni e convertire. <\/p>\n\n\n\n![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/01\/image-2.png\")
<\/a>
Bornfight studio<\/a> \u00e8 una piccola agenzia specializzata nella produzione web. Il loro atteggiamento Goblin si manifesta attraverso il tono di voce del loro sito web, che \u00e8 molto \u201cin-your-face,\u201d sfacciato e un po’ impertinente. Prendi ad esempio il loro divertente banner dei cookie – \u201cla vita \u00e8 amara quindi usiamo i cookie,\u201d o l’affermazione schietta che lavorano per complimenti e denaro, e le travolgenti, ma splendide, animazioni hover di immagini sovrapposte.<\/p>\n\n\n\n02<\/h6>\n\n\n\n
Semplicit\u00e0 e minimalismo<\/h3>\n\n\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/01\/2.png\")
<\/a>03<\/h6>\n\n\n\n
Delizie iper in un viaggio sul sito web<\/h3>\n\n\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/01\/3-1.png\")
<\/a>04<\/h6>\n\n\n\n
Ecommerce – Un’esperienza quasi tangibile<\/h3>\n\n\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/01\/image-2-1.png\")
<\/a>05<\/h6>\n\n\n\n
L’IA sta bussando alla nostra porta<\/h3>\n\n\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/01\/5-1.png\")
<\/figure>\n\n\n\n06<\/h6>\n\n\n\n
Nostalgia in tempi di sovraccarico digitale<\/h3>\n\n\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/01\/6.png\")
<\/a>07<\/h6>\n\n\n\n
Il movimento genera emozione<\/h3>\n\n\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/01\/7.png\")
<\/a>08<\/h6>\n\n\n\n
Layout tipografici – Ci manchi stampa<\/h3>\n\n\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/01\/8.png\")
<\/a>
La pagina web di Parazker<\/a> ha molto da prendere in considerazione. Questo singolo pieghevole avrebbe potuto essere facilmente distribuito su pi\u00f9 pieghevoli e pagine, eppure questa presentazione crea un senso di familiarit\u00e0, come le etichette sulle confezioni o i codici a barre. I designer qui hanno condensato tutte le informazioni in un’unica piega, in modo che gli utenti possano visualizzarle tutte in un colpo d’occhio.<\/p>\n\n\n\n09<\/h6>\n\n\n\n
Accessibilit\u00e0 – rendiamo il web un posto migliore<\/h3>\n\n\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/01\/9.png\")
<\/figure>\n\n\n\n
\u00c8 un piccolo cambiamento di mentalit\u00e0 e un piccolo aggiustamento del workflow<\/a>. Inizia dalla fase di avvio con la responsabilit\u00e0 di educare i clienti sull’accessibilit\u00e0 e sui requisiti legali che comporta. Pensarci fin dalla fase iniziale del brief e investire un po’ pi\u00f9 di tempo e sforzo pu\u00f2 aiutare a modellare lo stile di design del sito web. Possiamo usare colori e dimensioni dei caratteri in modo saggio, cos\u00ec come testo alternativo e supporto per la navigazione tramite tastiera. Progettare attraverso la lente di questa sfida non solo pu\u00f2 creare nuovi stili e convenzioni, ma pu\u00f2 cambiare il modo in cui viviamo il web nel suo complesso.<\/p>\n\n\n\n10<\/h6>\n\n\n\n
Esplorazione della pagina indice del link in bio<\/h3>\n\n\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/01\/10.png\")
<\/figure>\n\n\n\n