![\"\"](\"https:\/\/exmachina.ch\/creative\/wp-content\/uploads\/2024\/02\/Apple-bento.webp\")
<\/p>\nQuesto approccio unisce estetica e funzionalit\u00e0, con un risultato sempre diverso. Scopriamo come lo stile Bento Grid pu\u00f2 cambiare radicalmente un sito, prendendo ad esempio la nostra nuova versione del sito di Ex Machina, dove abbiamo applicato questo approccio.<\/p>\n
Immaginate un box del cibo tipo Bento: ogni sezione \u00e8 accuratamente organizzata e separata, creando un’esperienza visiva equilibrata e piacevole. Trasferiamo questo concetto nel web design e avremo lo stile Bento Grid: una disposizione strutturata del contenuto in sezioni modulari, ognuna con il proprio focus e scopo.<\/p>\n
<\/p>\n
Molti ritengono che la tendenza dello stile Bento Grid sia stata ispirata dai video e dal sito di Apple. In questi video, Apple presentava le specifiche tecniche dei suoi prodotti in una griglia visivamente accattivante, combinando variet\u00e0 visive e applicazioni tipografiche. Questo approccio unico nel presentare dettagli tecnici, che potrebbero sembrare noiosi, in uno stile di griglia intrigante, ha suscitato notevole interesse.
\nD’altra parte, alcuni sostengono che le vere origini dello stile Bento Grid possano essere rintracciate nel Metro design di Microsoft con il lancio di Windows Phone 7. Questo sistema di design enfatizzava una disposizione chiara e pulita dei contenuti, che pu\u00f2 essere considerato un precursore dello stile Bento Grid.<\/p>\n
![\"\"](\"https:\/\/exmachina.ch\/creative\/wp-content\/uploads\/2024\/02\/Windows_8-Metro.png\")
<\/p>\n
![\"\"](\"https:\/\/exmachina.ch\/creative\/wp-content\/uploads\/2024\/02\/Apple-Bento2.png\")
<\/h2>\nNel nostro nuovo sito per Ex Machina abbiamo applicato una griglia modulare che, nella versione desktop, \u00e8 applicata a tutta la larghezza del sito, evitando le brutte e noiose aree vuote ai lati quando si visualizza un sito su uno schermo molto grande, oltre ad utilizzare meglio lo spazio a disposizione. Fino a poco tempo fa realizzare questo tipo di griglie poteva essere abbastanza lungo a livello tecnico nonostante il concetto molto semplice; ma recentemente alcune nuove tecnologie, diventate molto comuni, permettono di creare facilmente griglie di tutti i tipi.
\nNello stile Bento Grid, il sito \u00e8 suddiviso in moduli o celle, ciascuna contenente un elemento di design o di contenuto. Questa struttura modulare porta ordine e chiarezza, facilitando la navigazione per l’utente.
\nNel sito di Ex Machina abbiamo diviso le varie sezioni, organizzando i testi in modo che possano essere letti facilmente oppure dare la possibilit\u00e0 al visitatore di scansionare velocemente il sito e individuare l’area di suo interesse.<\/p>\n
![\"\"](\"https:\/\/exmachina.ch\/creative\/wp-content\/uploads\/2024\/02\/EXM-OLD-NEW.png\")
<\/p>\n
Fondamentale per questo stile \u00e8 l’equilibrio visivo e la simmetria. Questi elementi contribuiscono a creare un layout armonioso e esteticamente gradevole, migliorando l’esperienza complessiva dell’utente.
\nNel sito di Ex Machina non tutti i box sono riquadrati; alcuni sono senza bordi, rendendo il sito pi\u00f9 leggero e dinamico e creando anche un concetto di vuoto e pieno fondamentale nel design. Infatti, “riempire” sempre tutto \u00e8 un errore; gli elementi devono anche “respirare”, lasciando aree vuote.<\/p>\n
Ogni box del Bento Grid pu\u00f2 essere interattivo, funzionando come un link, un pulsante, o includendo video o animazioni. Ci\u00f2 aggiunge un livello di coinvolgimento e dinamismo al sito.<\/p>\n
Il design Bento Grid, al primo approccio, pu\u00f2 dare la sensazione opposta per cui esiste, quella di essere sopraffatti dalla quantit\u00e0 di informazioni presenti sulla pagina.
\nQuesto accade perch\u00e9 tutti gli elementi sono ravvicinati tra loro, rendendo tutto pi\u00f9 compatto. Ma questa sensazione scompare nel momento in cui si inizia a leggere i contenuti; tutto diventa pi\u00f9 chiaro e piacevole, semplice da fruire.<\/p>\n
![\"\"](\"https:\/\/exmachina.ch\/creative\/wp-content\/uploads\/2024\/02\/Bento-grid-esempio.png\")
<\/p>\n
Lo stile Bento Grid, a un primo sguardo, potrebbe sembrare poco creativo e, sulla distanza, ripetitivo, ma \u00e8 esattamente il contrario. Avere delle solide basi (la griglia sottostante) permette di utilizzare i box in modo molto creativo e inserire al loro interno, in modo libero, tutti gli elementi che vogliamo e che ci possono aiutare a comunicare meglio il messaggio che vogliamo dare.
\nIl risultato \u00e8 che ogni sito \u00e8 davvero diverso dall’altro; chiaramente lo stile di base a griglia rimane, ma non ci sar\u00e0 mai un sito uguale ad un altro, come succede sempre pi\u00f9 spesso nel mondo del web design che ormai si affida in gran parte a template gi\u00e0 pronti, i quali, per forza di cose, rendono i siti tutti cloni uno dell’altro.<\/p>\n
La flessibilit\u00e0 del Bento Grid lo rende adatto a tutti i tipi di sito. \u00c8 molto usato per i portfolio, dove ogni modulo pu\u00f2 rappresentare una diversa categoria di lavori, consentendo una visualizzazione organizzata e dettagliata. Va bene per l’e-commerce, dove i diversi moduli possono mostrare categorie di prodotti, promozioni e recensioni, facilitando la navigazione e l’acquisto. \u00c8 ottimo anche per i siti di notizie o blog, dove ogni sezione pu\u00f2 dedicarsi a un diverso argomento o categoria di notizie, organizzando il contenuto in modo intuitivo e accessibile.<\/p>\n
Il Bento Grid non \u00e8 solo una tendenza di design, \u00e8 un approccio che fonde estetica e funzionalit\u00e0 in un formato unico e versatile. Se desiderate che il vostro sito si distingua per chiarezza, bellezza e facilit\u00e0 d’uso, il Bento Grid \u00e8 un’opzione da considerare seriamente. Con questo stile, potete offrire ai visitatori un’esperienza web memorabile e piacevolmente organizzata.<\/p>\n