Di icone menu ce ne sono tante, ma non tutte hanno la stessa funzione.
Hamburger, kebab, bento…
In primis, perché i loro nomi fanno riferimento al cibo?
Tutto nasce dall’icona capostipite, l’Hamburger menu, creata dal designer Norm Cox più di 30 anni fa per l’interfaccia Xerox Star.
Progettata per essere semplice e funzionale, doveva ricordare un menu contestuale e mimare l’aspetto dell’elenco delle voci nascoste.
Con il passare del tempo sono state create tante altre icone menu, impariamo a conoscerle un po’ meglio.
Hamburger icon
La più utilizzata nelle interfacce mobile per siti responsive ed applicazioni (nel caso in cui ci fossero più di 4/5 voci, come alternativa alla Tab Bar).
Sconsigliata nelle visualizzazioni desktop.
Kebab icon
Nata dal Material Design di Google.
Utilizzata per aprire controlli specifici e piccoli inline menu.
Si trova convenzionalmente in alto a destra.
Con ketchup, ma senza cipolla.
Bento icon
Apre una serie di app o strumenti correlati al prodotto in utilizzo.
L’esempio più lampante è Google, che con questa icona apre la carrellata di altri servizi (Drive, Maps, Play, Meet…).
Meatballs icon
Questa icona ha la stessa funzione della versione Kebab, ovvero mostrare componenti correlate.
La sua composizione grafica orizzontale la rende molto pratica da usare all’interno di elenchi e tabelle.
Döner icon
La soluzione “ad imbuto” più nota ed utilizzata per presentare del filtri.
Spesso accoppiata a funzioni avanzate quali “Filtra per” o a filtri globali.
Veggie Burger icon
Può sembrare una presa per il culo per concludere il post, ma vi assicuro che esiste.
Versione alternativa al classico Hamburger Menu, la funzione è la stessa, lo stile è più minimal.
Non molto diffusa, è più facile trovarla in UI più sperimentali/artistiche.
