Build beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code—that helps teams build high quality digital experiences.
スマートフォン対応させるWebサイトが急増しています。しかし、スクリーンが小さくタッチ操作がメインのスマートフォンでは、デスクトップ向けWebサイトのデザインで培ったノウハウの多くが通用しません。このような時代におけるスタンダードなデザインルールを学ぶために、弊社デザイナーの荒砂を中心に、Appleが公開しているiOS Human Interface Guidelineと、Googleが公開しているMaterial Design Guidelineの比較を行いました。(以降、両者をガイドラインと略します) スマートフォン向けのWebサイトのデザインを考える上で、アプリのUIデザインの定石を知ることは重要です。なぜなら、スマートフォンにおいてはWebサイトをブラウズする機会は14%しかなく(comScore調査/2014)、多くの時間をアプリの中で過ごしているためです。さらにユーザは「これは
<追記>オリジナルのデザインスプリント文献翻訳はじめました</追記> THE GUILDのメンバーで、Google主催のプロトタイピングのワークショップ「デザインスプリント」に参加してくるなど。ご招待いただき多謝でございます。 デザインスプリントとは? デザインスプリントはグーグルによるデザイン教育メソッドとそのワークショップ。数時間から数日で一気に籠って、商品のコンセプトデザインやプロトタピングを仕上げてしまう高速なデザイン手法です。Googleのベンチャー機関Google Venturesがよく、投資先に行っているものです。 導入事例としては、最近に日本にも上陸したブルーボトルコーヒーのサイトブランディングで行われたのが有名でしょうか。GoogleX内部でも頻繁に行われているようです。本来は5日間でやるこのデザインスプリント、今回は入門編ということで圧縮して2時間で1つの企画を考えます
Googleの新しいデザインガイドラインとして先ごろ発表された「マテリアルデザイン」。早速この新しいトレンドを取り入れた事例や、スムーズに導入するためのフレームワークが紹介されたりするのを見かけますが、UIの開発に携わるクリエイターとしては、取り入れる前にその思想をしっかりと理解しておく必要があります。というわけで、思想の背景やデザインのポイント、注意点をまとめてみました。 マテリアルデザインが定義された背景 Googleの生み出すサービスは、もはやスマートフォンやタブレットやPC(Android OS)だけに限られたものではなく、腕時計やメガネといったウェアラブル(Google glass、Google Fit)、ハンズオンでの操作を可能にする自動車用システム(Android Auto)などなど、様々な分野に広がっています。 今後も更に様々なスクリーン環境、操作環境が増え続けるのは確実で
ChromeやGmailのアイコンはシンプルであり、一度使うと見るだけでそのアイコンが何を示すのかわかりやすくデザインされているのが特徴的です。そんな企業秘密とも言えそうなGoogleのアイコンやロゴのデザインガイドラインをGoogleのグラフィックデザイナーであるロジャー・オドン氏がBehanceで公開しています。 Google Visual Assets Guidelines - Part 1 on Behance http://www.behance.net/gallery/Google-Visual-Assets-Guidelines-Part-1/9028077 Google Visual Assets Guidelines - Part 2 on Behance http://www.behance.net/gallery/Google-Visual-Assets-Guidel
Structure in Android App Design 我々が"構造"について話すとき、それはどういう意味なのか。みなさんが最初に思いつくのは建築の図面ではないでしょうか?ここでの構造は、各スペースが何を意図しているものか決め、また行いたい活動をどうサポートするか提供します。構造は直接見えるものだけではありません。骨は私たちの体の構造を提供しています。骨により筋肉や内蔵を適切な場所に収めることができます。 "Does your app have good bones?" 我々のアプリケーションはこれらの例両方に似ています。空間を定義し、適切な場所に機能を取り付ける必要があります。 よく構造化されたアプリは少なくとも次の3つの特徴があります。 何かを行うのが簡単かつ効果的 家ではドアの幅は出入りするのに適切なサイズだし、床は硬いし、何かを行うのに適切な光量がある 関連する項目は一緒に
Android Designというサイトがなかなか面白かったので訳してみました。 アプリを作る上で気をつけるべき事を一般論とAndroid特有の事がそれぞれ書かれてあります。 ようこそAndroid Designへ これはAndroidアプリの優れたデザインをする方法を学ぶためのものです。 クリエイティブビジョン 目次 始めに・クリエイティブビジョン ・デザイン原則 ・UI概要 スタイル・デバイスとディスプレイ ・テーマ ・タッチフィードバック ・測定基準とグリッド ・タイポグラフィティ ・色 ・アイコンデザイン ・文章の書き方 パターン・NewAndroidでの新しい事 ・ジェスチャー ・アプリの構造 ・ナビゲーション ・アクションバー ・マルチペインレイアウト ・スワイプビュー ・セレクション ・通知 ・互換性 ・純粋にAndroid 開発用の部品達・タブ ・リスト ・グリッドリスト
本エントリーは Android Advent Calendar 2012 23日目(表)の記事となります。 まえがき 参加表明してから約1ヶ月、どんな記事にするべきか悩みましたが、結局これといったネタが思いつかなかったのと、ももクロネタは案の定 @sobachanko 氏に先を越されたので、僕がこれまで読んでタメになった Android 関連の記事をいくつか紹介してお茶を濁すことにしました。 ちなみに Android Advent Calendar には裏もあります。 本日の裏は @STAR_ZERO さんの「DeployGateについて」です。 裏22日目の @bols_blue さんの「DeployGatePluginを作ってみました。」と併せて読みたいですね。表と裏、裏の方がガチっぽいのは気のせいでしょうか。 Android 開発者が読んでおくべき6つの記事 というわけで本題。どれも
安藤日記 安藤日記:デジタルガジェット好き「安藤幸央」の日々のメモ ( yukio.andoh@gmail.com ) [ http://twitter.com/yukio_andoh ] Design Sprint Newsletter https://designsprint.substack.com/ SIGIXD 2nd ------------------------------------------------------- http://sigixd.org/2nd.php Googleにおけるインタラクションデザイン #川島さんの示唆に富んだ話がすばらしかった。 川島 優志氏 シニアウェブマスター・アジア太平洋マネージャー: "Behind the web design & Doodle creation" Judy Shade UX Researcher: "UX at
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く