このページの本文へ

DESIGN Material Designのデザイン思想を読み解く ― 第2回

Material Designの利用とWebデザインへの影響

2014年08月04日 11時00分更新

矢野りん/デザイナー

  • この記事をはてなブックマークに追加
本文印刷

 グーグルが発表した、次期Android OS (通称Android L)向けの新しいデザイン原理「Material Design」の使い道や使い方について、背景にある思想やWebデザインへの影響を紹介します。

普及の鍵を握るSDKとPolymer

 Material Designは、次期Android OS(通称 Android L)のデザイン原則として、Androidデバイスで動くアプリやサービスへの適用が求められています。Androidの場合、iOSのようにプラットフォーム側がアプリ提供側を審査しないので、基準が示されるだけでは普及のきっかけがありません。

 グーグルはこの問題点を、Material Designのデザイン原則を盛り込んだSDKの提供で克服しようとしています。

md02-1.png
Googleの「android L Developer Preview」で説明されているMaterial Design

 SDKの仕様に沿ってアプリやサービスを開発すれば、半ば自動的にMaterial Designの原則に沿ったUIが構築できます。もちろん、各パラメーターはカスタマイズできますので、基本原則に沿いながら、アプリやサービスに必要な個性は発揮できます。

 もう1つの注目すべき点は、「Polymer」という、グーグルが開発したフレームワークを使うと、HTMLで実装したWebアプリにもMaterial Designの原則を簡単に適用できることです。

md02-2.png
Polymerによるアプリケーション

 Polymerを利用すると、Material Designの原則に則ったUIを簡単に導入でき、PC向け、モバイル向け問わず、Google Chromeなどのブラウザーで動作します。詳しくは「polymer」の「Browser compatibillity」で説明されています。

md02-3.png
Polymerのブラウザー対応

 UIフレームワークといえば、BootstrapやjQuery UIのお世話になること多いですが、特定のプラットフォームのデザイン原則をWebに「持ち出す」試みは、Polymerが初めてです。

 ブラウザーベースのプロトタイピングツール「Polymer Design」も用意されていて、コードを書き慣れていない人でもMaterial Designを取り入れたUIを作成できます。まだデベロッパープレビューの段階なので、実用性には未知数な部分がありますが、UIフレームワークの1つの選択肢として浸透するかもしれません。

 SDKやツールといった開発環境を整備して、Material Designを広く浸透させるのがグーグルの戦略のようです。

この記事の編集者は以下の記事をオススメしています

ASCII.jp会員サービス 週刊Web Professional登録

HTMLリファレンス誘導バナー

CSSリファレンスサイト誘導バナー

Webディレクター江口明日香が行く

ランキング