「I/O Extended 2018 Shibuya (Material Design Only!!)」行ってきた①
「ひとりで公式サイト見ててもようわからん」となりまして、Material Designのイベントに参加してきました。note枠じゃないけど自分の記録用に。
■1分でわかる概要
I/O Extended 2018 Shibuya (Material Design Only!!)
■どんなセミナー?
Material Designについて、Google社の方やI/O2018に参加したデザイナーさんが語ってくれる会。株式会社Goodpatchさま主催(ありがとうございます!)
■Material Designって?
Googleが提唱するデザインガイドライン。→公式
2018年5月に大幅アップデートされて話題!公式のこの動画でなんとなくわかりますよ。
■I/O2018って?
Google I/Oは、Googleの開発者向けカンファレンス。デザインだけの話ではありません(参考にGIZMODEのまとめ記事をどうぞ)
内容みっしりなのでわけて書いていきます。今回はセッションひとつ分。
※おねがい:アマチュアWeb制作者が書く覚え書きです。なんか違ってたら教えてください!
■セッション1:「Material update」
Google合同会社 鈴木 拓生氏
・そもそもMaterial Designってなんでできたの?
→以前は、Google内の各サービス・各デバイスでデザインがばらばらだった。それを統一するために作ったもの。実は元々iOS用のフレームワークだった(2013年頃の話)現在では150万ほどのアプリがマテリアルデザインを使っている。
・今回なんでMaterial Themingができたの?
→「Material Design使うと全部Googleっぽいデザインになっちゃう」問題解消。デザインの制約が厳格だった。
・Material Themingで何が変わった?
→「物質的なメタファーである」という本質は以前と同じ。拡張性が高くなって、デザインの幅が広がった!
・Material Themingの導入事例
→GooglePay、Gmail、Googleニュースなど。Google以外ではLyftなど。
・取り入れるメリット
決済画面やログイン画面等、事務的な画面のデザインの手間を省く。より重要な部分のデザインに注力することができる。
・Material Designの構成
公式のメニューにある「Material System」「Material Foundation」「Material Guidelines」の3項目。
Material System:概要。大枠の話。
Material Foundation:色、タイポグラフィーなど、要素について。
Material Guidelines:実際のコンポーネント。
公式ページは動画も豊富だしインタラクティブなデザインなので、触って使ってみてくださいとのこと。すぐにフォントがDL出来たりします。
・Developについては筆者が無知なので割愛します。。。
・Toolsについて
→SketchプラグインMaterial Theme Editorが登場。近々InVisionStudioにも対応!(公式Twitterで発表済み)
・その他
→MaterialDesignはこの4年間で頻繁にアップデートされてきた。フィードバックをもとに、たくさんデータ採って分析して反映してるそうです(なんかすごいごちゃっとしたグラフ見せてもらった)
■まとめ
Material Designは…
普遍的なデザインが作れるガイドラインが、体系的にまとまっている。
Material Themingは…
デザインの自由度が上がったので、いろんな場面で使える!
使ってみたいと思ったら…
まずは公式のガイドラインやツールを触って理解。ただ、エンジニア的には対応コストがかかる場合があるそうなので要注意(後のセッションで詳しく)。でも実務で使わないとしても、学ぶ価値あり◎
1つめのセッションは以上です!
あと3名のセッション+質疑応答というボリュームたっぷりの会でした。続き書けるかどうかあやしいですがnote枠じゃないので許してください。
主催者さま登壇者さまに改めて感謝!