Document

Androidの新しいOSであるLollipopと新しいデザインガイドラインMaterial Designの発表を受けて、 Goodpatchでは、第一線で活躍するAndroidエンジニアにお集まりいただき、Android交流会を開催しました。今回は、交流会の内容を元にAndroidとMaterial Designについての情報をお届けします!

DSC_6875

Lollipopで何が変わる?

新しいNexusは3種類!

Nexus-Family

http://www.google.com/intl/all/nexus/

Lollipop搭載機種として、新しく3種類のNexusが発表されました。
新スマートフォン Nexus 6、新タブレット Nexus 9、そして、Nexus Playerです。

player-entertainment-1024
Nexus Playerは、テレビにつなぐストリーミングメディアプレーヤー兼ゲーム機です。 Android TVで Google Play 映画やテレビ番組を視聴することができ、コントローラーを購入すればゲームを楽しむこともできます。

様々な機能が更新

lollipop-blog

今回のアップデートにより、多くの機能が更新されました。細かいものも含めればなんと5000を超えるそうです!

・通知機能の強化

ロック画面から、ロックを解除せずにそれぞれの通知に応答できるようになりました。また、新たなヘッドアップ通知により、優先度の高い通知は他のアプリの前面にウィンドウ表示されるようになりました。

・デバイス共有

家族や友達のスマートフォンからログインして自分のスマートフォンと同じように電話をかけたり、メッセージを閲覧したりできます。 また、マルチアカウントに対応したので、家族や友人とデバイスを共有することが簡単にできるようになります。

・インスタントセットアップ

NFC搭載のデバイスなら、新しい端末と古い端末同士をタッチさせるだけで簡単にセットアップできます。

他にも、

  • 新しい節電機能が搭載され、以前より90分ほど長くもつように
  • セキュリティ強化
  • スマホとタブレット間のシームレス連携が可能に
  • Quick Settingが改善され、新しいコントロールが追加
  • ネットワーク接続強化
  • AndroidRuntime パフォーマンスが4倍に
  • デスクトップ PC並みのグラフィックを実現
  • OK Googleの音声コマンドが、画面がオフの状態でも使える
  • 15言語を新たに追加し対応言語は68以上に

などなど、多くの機能が追加、改善されました!

気になるMaterial Design

Google-Images-1500x1000

Googleの新しいガイドラインであるMaterial Designが、Lollipopから導入されます!Material Designは、物理法則に従ってつくられたデザインです。画面の中でも、現実世界にできるだけ近い体験ができるように設計されています。具体的には、

・重なった紙のような奥行きを、影を用いて表現することで、ユーザーがどの階層にいるのか明確にする。

・物を投げたときの加速度を動きに取り入れることによって、日常に馴染みのあるアニメーションにする。

などといったことが挙げられます。

車からパソコン、スマートフォンまですべてのデバイスの体験を共通にするというのがGoogleの思想です。そして、Material Designはその思想の一環であり、画面サイズの異なるデバイス間で統一感のある体験を提供します。

参考になるサイトや動画、アプリなど

Material design

Material Designの公式ガイドランです。絵やアニメーションが多くわかりやすいので、まだ見ていない方は是非チェックしてください!リソースのダウンロードもできます。

スクリーンショット 2014-11-04 20.23.58http://www.google.com/design/spec/material-design/introduction.html

また、動画もとてもわかりやすいです!

 

INSTAGRAM with Material Design

これはEmmanuel PacamalanさんによるInstagramをMaterial Designにしてみた動画です。
押した箇所から波紋のように広がるアニメーションや、前後の画面のつながりを見せたアニメーションなど参考になりそうです。

 

Inbox

Inboxは、Material Designが搭載された初の正式なGoogleアプリです。 現在はアプリを持っている人に招待してもらうか、サイトからリクエストを送ることで使うことができます。

スクリーンショット 2014-11-04 16.03.36

http://www.google.com/inbox/

使い方の動画も公開されているのでどんなアプリかはこちらを見ればだいたいつかめると思います。

 

Google Calendar

11月3日に発表された新しいカレンダーアプリです。Lollipop5.0とAndroid 4.1以降に搭載されています。デザインだけでなく機能も大きく変わります。Inboxと連携して、レストランの予約情報などが自動でカレンダーに表示されます。また、入力した言葉から次に入力する言葉を予測したり、予定項目に関連のある画像が自動で表示されたりします。

スクリーンショット 2014-11-05 13.15.06

http://www.google.com/landing/calendar/

こちらも動画があるのでチェックしてください!

今後、エンジニアとデザイナーはどう連携するべき?

DSC_6874

Material Designにより、今までになかった動きのアニメーションを作ることが増えるため、今後デザイナーとエンジニアは、より密になって協力しあう必要がありそうです。今回お集まりいただいたエンジニアの方々に、エンジニアとデザイナーが互いに協力して製作するためのアイデアをいただきました!

デザイナーにレイアウトXMLの設定や調整方法を2日くらいかけて教える。

静止画だけではデザインが判断できず、実装後に調整が必要なこともあると思います。基本的なレイアウトの設定方法をデザイナーと共有することによって、微調整は、デザイナーが一人でも出来るようになります。2日という時間は短くはないですが、教えた時間に見合った工数で作れるようになるとのことなので、是非検討してみてください!

プロトタイピングツールを活用する

専門的な知識がなくても使えるプロトタイピングツールは、デザイナーとエンジニアの連携を助けます。Goodpatchが開発した Prottは、チームのコミュニケーションを活性化させるのに最適です!今後のアプリケーション開発にぜひ取り入れてみてください!

スクリーンショット 2014-11-04 21.28.17

https://prottapp.com

実際に例を見せて動きを共有する

デザイナーの頭の中にあるアニメーションのイメージを正確に伝えるのは難しいですが、UIの集まったサイトやアプリを使えば、簡単にイメージを共有することができます。Dev Apps Directはたくさんのライブラリデモ を見れるAndroidアプリです。

スクリーンショット 2014-11-04 17.41.13

http://www.inappsquared.com/devappsdirect.html

過去記事にも、アニメーションの参考になるサイトのまとめがあるので活用してください!

どんな動きにするか悩んだときに!UIアニメーションのインスピレーションを得られるサイトまとめ

 

いかがでしたでしょうか。今回が初めての交流会でしたが、設計の工夫やツールなどを共有しあえて、とても充実した会になりました。今後も積極的に交流会を開いて、情報を発信していこうと思います!