• Visit NINJA ACADEMY
  • Rss
  • Twitter
    • Segui @ninjamarketing
  • Linkedin
  • Facebook
  • Instagram

News

  • Advertising
  • Instagram
  • Elon Musk
  • Facebook
  • Spotify
  • Eventi
Barilla rinnova il suo Archivio Storico: 145 anni di storia...
Super Bowl 2022, gli spot di questa edizione che non...
Pepsi lancia un incredibile trailer per il Super Bowl con 5...
Ci ha lasciato Ennio Doris, e il nuovo emozionante corto di...
Abbonamenti per i creator: cosa sappiamo di Instagram...
Instagram, Facebook e WhatsApp non funzionano, blackout...
Instagram lancia “Cerca sulla mappa”: scopri...
Facebook lancia l’API Messenger per gli utenti...
Starlink: 40 satelliti distrutti da una tempesta...
Elon Musk ha venduto circa 5 miliardi di dollari di azioni...
Da Tesla a General Electric, chi sono i manager CEO più...
Google, partnership con SpaceX per l’internet satellitare...
I Reels arrivano anche su Facebook
È vero che Facebook e Instagram lasceranno l’Europa?...
Facebook ha deciso il suo nuovo nome: si chiamerà Meta
Trump l’ha fatto davvero: ha lanciato il suo social...
Playlist di San Valentino: quali sono le canzoni più...
Spotify presenta Wrapped 2021: gli artisti, le canzoni, gli...
Spotify presenta la seconda edizione di Radar Italia e...
Diversity, inclusion, equality: Spotify contro la...
Open Days Ninja nel Metaverso: esplora in anteprima le...
La professione digitale più bella del mondo è…
Diritto allo Smart Working per le donne che soffrono di...
B2B Rocks, il programma della prima giornata

Insight

  • Metaverso
  • Trend 2022
  • NFT
  • Creator Economy
  • Lavoro
  • eSport&Gaming
Creator Economy e Decentralizzazione come base per la...
Nike e Adidas: la sfida si è spostata nel Metaverso
Anche Microsoft punta al Metaverso con l’acquisizione...
Milioni di dollari per la terra virtuale: guarda quanto...
10 Tendenze eCommerce da seguire nel 2022
70+ report e trend per la tua strategia vincente nel 2022
Gli 8 Creative Trends 2022 che marketer e designer non...
10 trend chiave che guideranno i piccoli business nel 2022
Cosa sono le DAO – Decentralized Autonomous...
Glossario degli NFT: le parole chiave da conoscere
Nike e Adidas: la sfida si è spostata nel Metaverso
NFT Marketing: casi di studio per la strategia del tuo brand
Creator Economy: impatto dei content creator...
Cos’è la Creator Economy e quali sono gli strumenti...
Creator Economy: scopriamo le Pin Ideas di Pinterest
Spiegare l’AI alle PMI (e fare 1 milione di views)....
Talent Acquisition vs Recruitment: non sottovalutare il...
New Ways Of Working: come la Gen Z vede il mondo del lavoro
Content Manager: chi è, cosa fa, carriera, formazione,...
Great Resignation: l’identikit degli italiani che...
Anche Microsoft punta al Metaverso con l’acquisizione...
Le migliori attivazioni di brand fashion negli eSport
Gaming e criptovalute si incontrano nel Metaverso (e i...
Gaming e NFT: Ready Player One sta per diventare realtà?

Tutti i TopicsChiudi

Ninja Marketing
  • Advertising
  • Branding
  • Consumer Trends
  • Creatività
  • Design
  • Digital Marketing
  • Event Marketing
  • Innovazione
  • Marketing Strategy
  • Marketing Tools
  • Media
  • Relazioni Pubbliche
  • Social Media Marketing
  • Webinar
  • Guide
Ninja Company
  • Aziende
  • Diritto
  • CSR
  • Finanza & Mercati
  • Digital Transformation
  • Management
  • Retail
  • Sales
  • IT
Ninja HR
  • Comunicazione Interna
  • Employer Branding
  • Formazione
  • Lavoro
  • Leadership
  • Produttività
  • Recruiting
  • Smart Working
  • Talent Management
  • Welfare
Ninja Brands
  • Amazon
  • Apple
  • Facebook
  • Google
  • Instagram
  • Linkedin
  • Microsoft
  • Netflix
  • Oracle
  • Snapchat
  • Tesla
  • TikTok
  • Twitter
  • Virgin
  • YouTube
  • 0Carrello
Logo Ninja Logo Ninja
  • News
  • Insight
  • Topics
  • Academy
  • Diventa PRO
  • Menu
  • Accedi
  • Home
  • Marketing
  • Business
  • Future
  • Life
  • PRO
  •   Ninja Academy
  • Ninja Deals -->
  • Twitter Linkedin Facebook Instagram YouTube
  • Accedi
  • Home
  • News
    • Advertising
    • Instagram
    • Elon Musk
    • Facebook
    • Spotify
    • Eventi
  • Insight
    • Metaverso
    • Trend 2022
    • NFT
    • Creator Economy
    • Lavoro
    • eSport&Gaming
  • Topics
    • Ninja Marketing
    • Advertising
    • Branding
    • Consumer Trends
    • Creatività
    • Design
    • Digital Marketing
    • Event Marketing
    • Innovazione
    • Marketing Strategy
    • Marketing Tools
    • Media
    • Relazioni Pubbliche
    • Social Media Marketing
    • Webinar
    • Guide
    • Ninja Company
    • Aziende
    • Diritto
    • CSR
    • Finanza & Mercati
    • Digital Transformation
    • Management
    • Retail
    • Sales
    • IT
    • Ninja HR
    • Comunicazione Interna
    • Employer Branding
    • Formazione
    • Lavoro
    • Leadership
    • Produttività
    • Recruiting
    • Smart Working
    • Talent Management
    • Welfare
    • Ninja Brands
    • Amazon
    • Apple
    • Facebook
    • Google
    • Instagram
    • Linkedin
    • Microsoft
    • Netflix
    • Oracle
    • Snapchat
    • Tesla
    • TikTok
    • Twitter
    • Virgin
    • YouTube
  • Diventa PRO
  •   Ninja Academy
  • Twitter Linkedin Facebook Instagram YouTube
  • Share on Twitter
  • Share on Facebook
  • Share on Linkedin
  • Send an email
Logo Ninja

Diventa free member

Vuoi leggere questo articolo e le altre notizie e approfondimenti su Ninja? Allora registrati e diventa un membro free. Riceverai Breaking News, Marketing Insight, Podcast, Tips&Tricks e tanto altro. Che aspetti? Tieniti aggiornato con Ninja.
Logo Ninja

Diventa free member

Vuoi leggere questo articolo, le altre notizie e approfondimenti su Ninja? Allora lascia semplicemente nome e mail e diventa un membro free. Riceverai Breaking News, Marketing Insight, Podcast, Tips&Tricks e tanto altro. Che aspetti? Tieniti aggiornato con Ninja.
Sei già un membro Ninja? Accedi

Material Design, una guida online per un'interfaccia web a prova di Google

Score

1.5K Share

  • Share on Twitter
  • Share on Facebook
  • Share on Linkedin
  • Send an email

Lorenzo Paciaroni 

  • Twitter
  • Linkedin
  • Share on Twitter
  • Share on Facebook
  • Share on Linkedin
  • Send an email

Pubblicato il 12/03/2015

material-desig

Da qualche mese Material Design è l'interfaccia di Android che Google applica ai suoi dispositivi e ora, dopo aver uniformato l'app Google contatti (che nelle prossime settimane sostituirà la vecchia), ha pubblicato la guida online di Material Design per sviluppare siti ottimali in ogni loro elemento grafico.

Dalle animazioni agli stili, dal template ai componenti, un completo how to non solo per quanto attiene ai dispositivi mobili ma per ogni prodotto web. Un lungo elenco di specifiche, fornitissimo di do e don't, che un web designer dovrebbe inserire tra i suoi segnalibri e consultare quotidianamente.

Material design, dalla tipografia cartacea al web responsive

Il punto di partenza per questo design, come la metafora "materiale" lascia intuire, è la carta coperta dall'inchiostro, alla quale unire la tecnologia per creare una superficie virtuale sulla quale muovere e far interagire gli elementi. Ma a differenza della carta, questo design si amplia e ridimensiona in maniera intelligente, in base all'esperienza cercata dall'utente tramite un dispositivo mobile o la finestra di un browser.

material-design

Gli oggetti hanno tre dimensioni, quindi nella piattaforma gli elementi sottostanno a luci e ombre hanno uno spessore, un'elevazione sui piani, una precisa area occupata, possono cambiare posto, muoversi, combinarsi e relazionarsi tra loro sui tre assi. Chiunque abbia un dispositivo con sistema operativo Android avrà fatto caso a queste logiche nelle quotidiane interazioni con il suo OS.

Best practices, do e don't

In questa dettagliatissima guida non mancano esempi e tutorials. Tramite illustrazioni, brevi filmati e descrizioni Google, per ogni sezione, mostra come fare e come non fare per aderire ai suoi standard, in una serie di do e don't che non lasciano più margine di errore a chi sviluppa interfacce per il web.

Le interazioni nel responsive design hanno regole precise, le loro animazioni direzioni obbligatorie in ingresso e in uscita, e il touch - così come il click: su desktop valgono le stesse regole del mobile, questa è una guida su come comunicare, non solo con quali strumenti farlo - deve innescare reazioni previste e prevedibili, pena un deficit di usabilità che può spingere l'utente a lasciare la pagina.

material-design

In merito allo stile, l'esperienza Android raccoglie molti tricks su come gestire colori, font e forme; le icone (la libreria completa è su github) devono essere semplici, intuitive, geometriche, pulite, piatte; immagini, testi e icone vanno combinati secondo logiche comunicative e di lettura rigorose, avatar e gallerie sono un'arma a doppio taglio per il suo impatto visivo che va presa per il manico.

Nelle molte sezioni in cui è articolata la guida, parlando di layout e componenti Google fornisce utili consigli su come strutturare le pagine, su come realizzare bottoni, dialoghi, griglie e liste, slide, menu e tooltips; nei pattern istruzioni su selezioni e ricerche; nell'usabilità linee guida sull'accessibilità e, nell'area risorse, la possibilità di scaricare palette colori, templates (per mobile, tablet e desktop) già compilati, font e icone di sistema.

Una risorsa web per l'uso quotidiano

Quanto deve essere grande un'icona su un particolare dispositivo? Quali colori per i link attivi e inattivi? Dove posizionare informazioni e elementi grafici? Che dimensioni dare al font? Queste e mille altre domande hanno ora una risposta data non da un forum qualsiasi ma dal gigante di Mountain View. Facili da trovare (il menu ha un indice dove è difficile perdersi), semplici da applicare, veloci da capire grazie agli esempi giusti e sbagliati.

Il sito più (very) bello del mondo, se l'usabilità non ne supporta i contenuti, ha fallito il suo obiettivo, che resta, sempre, il comunicare qualcosa nel migliore dei modi possibili. Ogni web designer sa quanto conti questo aspetto e dedica gran parte del suo lavoro proprio a ottimizzare l'ambito dell'esperienza utente; per questo Material Design - prima e principale risorsa del progetto Google Design - è uno strumento indispensabile nel lavoro degli sviluppatori per il web, da tenere sempre a portata di mano, nonostante questa guida sottolinei a volte anche delle ovvietà, ma in certi casi è meglio risultare ridondanti che dare informazioni per scontate.

Scritto da

Lorenzo Paciaroni 

WebDesigner, calligrafo, giornalista, writer. Comunicatore freelance, copywriter freestyle, sviluppatore freeware. Nerd, resistente. Un curriculum di lavori diversamente digni… continua

Condividi questo articolo

  • Share on Twitter
  • Share on Facebook
  • Share on Linkedin
  • Send an email

Segui Lorenzo Paciaroni  su Twitter .

Amiamo ricevere i tuoi commenti a ideas@ninjamarketing.it

Leggi anche

SEO Trend 2022: 6 tendenze che non puoi non conoscere quest’anno
Nuova versione di Pagespeed Insights e Google Page Experience arriva su desktop
Come far crescere le tue quote di mercato tutelando la privacy delle persone

Vuoi fare Carriera nel Digital Business?

+100.000 professionisti e 500 grandi aziende hanno incrementato i loro Affari grazie a Ninja.

Non aspettare, entra subito e gratis nella Ninja Tribe per avere Daily Brief, Free Masterclass e l’accesso alla community di professionisti.

INIZIA GRATIS

Ninja

  • About
  • Filosofia Ninja
  • Il Clan
  • Top contributor
  • Advertise
  • Partner
  • Contatti

Top Contributor – Last year

1
Mariagrazia Repola

Copywriter

2
Flavia Alvi

Social Media Manager

3
Urania Frattaroli

Creative Copywriter

Vuoi fare Carriera nel Digital Business?

+100.000 professionisti e 500 grandi aziende hanno incrementato i loro Affari grazie a Ninja.

Non aspettare, entra subito e gratis nella Ninja Tribe per avere Daily Brief, Free Masterclass e l’accesso alla community di professionisti.

INIZIA GRATIS

ISCRITTO A

Seguici

Ninja Magazine è una testata registrata presso il Tribunale di Salerno n. 14/08 - Codice ISSN 2704-6656
Editore: Ninja Marketing Srl, Centro Direzionale Milanofiori, Strada 4, Palazzo A - scala 2, 20057 Assago (MI), Italy - P.IVA 04330590656.
© Ninja Marketing è un marchio registrato, tutti i diritti sono riservati
Puoi ripubblicare i contenuti citando e linkando la fonte nel rispetto della Licenza Creative Commons
PRIVACY POLICY, CONDIZIONI D’USO E COOKIE POLICY
Scorrere verso l’alto