SlideShare a Scribd company logo
1 of 41
Download to read offline
WearのUIガイドライン解説と
円型画面UXのポイント
安藤幸央 2014/3/27 @yukio_andoh
Android Watch
vs
Android Wear
CC by Swaminathan
Design Principles of Android Wear
デザイン原則
http://developer.android.com/wear/design/index.html
Wearのデザイン原則(安藤日記)
http://www.andoh.org/2014/03/design-principles-of-android-wear.html
Creative Commons
Google Now
glancability
一目で容易に
理解できる
glance = チラ見
●状況に応じて対応でき、洗練されていること
これらのデバイスは、コンピューティングに対
する新しい認識レベルをもたらします。ユー
ザーからの注目や入力を要求するのではなく、
Android Wear デバイスは彼等の状況と状態を
認識し、適切な時に適切な情報を役立つ方法で
表示してくれます。それらはタイムリーで、関
連性があり、限定的なものです。
●一覧的であること
我々の視野に入らない時でさえ、ウェアラブルデ
バイスは一日を通してずっと使用されます。効果
的なアプリは、なるべく手間を省き、一日中、関
連する情報の小さな断片を提供するために、最適
化され、情報負荷を最小限にして提供してくれま
す。短く、機敏で、即時的なものです。
●全く操作無し、または少ない操作ですむこと
小型の外見によりもたらされる強みに忠実であ
りながら、どうしてもユーザー入力が必要な場
合にのみ、Android Wear は簡単な操作で実現
します。ほとんどの入力は、タッチ、スワイプ
や音声に基づいているので、細かな入力操作を
必要とする入力が回避されます。身振りや、簡
単で、素早く操作できるものです。
●有益であること
Android Wear は、優れた個人秘書のようなも
のです:あなたとあなたの好みを知っているの
で、どうしても必要な場合にのみ、あなたの操作
を中断させます。そして、予め準備された答えを
提供するために常に手元にあります。効率的で、
丁寧で、俊敏な反応をもったなものです。
glancability
一目で容易に
理解できる
glance = チラ見
大きさと色の濃さ、文字の少なさ
不安定な状況の外で使う
via. Mobile Frontier
誰に覗かれているかわからない
CC by Abby
font > font
sound < sound
CC by Nina Matthews
趣味趣向、嗜好品
via. pinterest
一人が複数の腕時計を持つ
via. pinterest
ファッションアイテム
via. Kahuna Ladies Leather
スタイルとシチュエーション
via. TAG Heuer
「便利」だけでなく「好み」も
via. TAG Heuer
円形UX
CC by Kevin Dooley
MOTO 360
世の中には丸いものがいっぱい
Cathryn Briggs
実はアイコンで慣れているハズ
by buatoom
意識が中心に集まる
Photo by Alex Miller
角が無い
via. pinterest
「Android Wear Round (320 x 320: hdpi)」か「Android Wear Square (280 x 280: hdpi)」
多角形と円形との関係性
上下左右があいまい
上下左右があいまい(横線)
操作には両手を使う
CC by Victor Bezrukov
操作には両手を使う/見るだけ
画像の半分は隠れる前提
黄金比
安定
躍動
奥行き
背景
重心
正方形UX
CC by Vinoth Chandar
領域
分割
縁
動き
断絶
空間
奥行き
音のデザイン
CC by mikael altemark
JIS S0013 報知音
騒音下である場合
●基本周波数が 2.5Khz を越えないことが望ましい
実機のスピーカーで試す。高音、低音が弱い、周波数特性がフラットではない。共振する場合がある。
適切な音圧で ブーミーにならないように。
0.2秒くらい。
●音種別の構造化、音のIA も必要
●複合音(二つ以上の周波数成分を主とする音)耳の不自由な人も聞き取りやすい
音を止める手段を。
音以外の情報を付加していなくても聞き分けられる(&音だけで示さない)
音や音色よりも、鳴っている時間的な違い
地震警告音(一度も聞いた事が無い人でも、何か危険なことが起きていると印象づける)
音は響くものなので、必ず実際の状態に近い状態で。
ゲームのサウンドデザインに学ぶ。
専門のサウンドデザイナーにお願いする。
音の著作権を尊重する(用途が限定される。使い回せない、勝手に再録できない)
●音は画像のように一覧できないので、ジャッジしにくい
たくさん聞いていると、どれが良いのかわからなくなる
二つを聞きくらべる。基準の音より良いか悪いかで判断する。
視覚と聴覚と組み合わせて評価する。アニメーションの動きにあっているか?
タイミングがずれているだけで良い音もあること。
素材は 44.1kHz/16bit または 48kHz/16bit
データ変換したら、スタジオ機器と実機で、必ず聞いて確認すること。
必ずステレオとも限らないし、音像が片寄ってしまう場合もある。
いい音は高い。ぴったり合う素材も っていない。
サウンドアイデンティ専門の企業がある。
何回も聴く音、飽きる音がある。目立つ音なだけではダメ。
音の影響力はとても強い。視覚を半分、半分以上補足する。
企業のイメージ。 BMW の CM の最後に鳴る音とか。
●Audiobrain in NY
http://www.audiobrain.com/
Fleksy
Spead Reading by Ryan Breault
OK, Google.
おい、ぐぐる
Thank you.
@yukio_andoh

More Related Content

More from Yukio Andoh

デザインのリファクタリング (慣れを大切に)
デザインのリファクタリング (慣れを大切に)デザインのリファクタリング (慣れを大切に)
デザインのリファクタリング (慣れを大切に)Yukio Andoh
 
SIGGRAPH ASIA 2020 みどころ紹介
SIGGRAPH ASIA 2020 みどころ紹介SIGGRAPH ASIA 2020 みどころ紹介
SIGGRAPH ASIA 2020 みどころ紹介Yukio Andoh
 
UX MILK All Night 2020 (Yukio Andoh)
UX MILK All Night 2020 (Yukio Andoh)UX MILK All Night 2020 (Yukio Andoh)
UX MILK All Night 2020 (Yukio Andoh)Yukio Andoh
 
Ethical UX / uxmilk fukuoka 2019/12/17
Ethical UX / uxmilk fukuoka 2019/12/17Ethical UX / uxmilk fukuoka 2019/12/17
Ethical UX / uxmilk fukuoka 2019/12/17Yukio Andoh
 
SIGGRAPH 2019 preparation
SIGGRAPH 2019 preparationSIGGRAPH 2019 preparation
SIGGRAPH 2019 preparationYukio Andoh
 
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方Yukio Andoh
 
VoiceUIのデザインと音声サービスの勘所
VoiceUIのデザインと音声サービスの勘所VoiceUIのデザインと音声サービスの勘所
VoiceUIのデザインと音声サービスの勘所Yukio Andoh
 
VUIテクノロジーアップデート& VUIビジネストレンド紹介
VUIテクノロジーアップデート& VUIビジネストレンド紹介VUIテクノロジーアップデート& VUIビジネストレンド紹介
VUIテクノロジーアップデート& VUIビジネストレンド紹介Yukio Andoh
 
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」Yukio Andoh
 
Voice UI/UX Design Guideline
Voice UI/UX Design GuidelineVoice UI/UX Design Guideline
Voice UI/UX Design GuidelineYukio Andoh
 
Design JP vol2 (Motion Design & Animation)
Design JP vol2 (Motion Design & Animation)Design JP vol2 (Motion Design & Animation)
Design JP vol2 (Motion Design & Animation)Yukio Andoh
 
UX Jam x UX Sketch 2017 HD
UX Jam x UX Sketch 2017 HDUX Jam x UX Sketch 2017 HD
UX Jam x UX Sketch 2017 HDYukio Andoh
 
Shin UX 2017 - UX strategy - UX review
Shin UX 2017 - UX strategy - UX reviewShin UX 2017 - UX strategy - UX review
Shin UX 2017 - UX strategy - UX reviewYukio Andoh
 
BPStudy #111 iOS 10 and iPhone 7
BPStudy #111 iOS 10 and iPhone 7BPStudy #111 iOS 10 and iPhone 7
BPStudy #111 iOS 10 and iPhone 7Yukio Andoh
 
DesignJP prototyping 20160825
DesignJP prototyping 20160825DesignJP prototyping 20160825
DesignJP prototyping 20160825Yukio Andoh
 
UX Strategy 2016/06/18
UX Strategy  2016/06/18 UX Strategy  2016/06/18
UX Strategy 2016/06/18 Yukio Andoh
 
UX milk (UX Jam) 20160108
UX milk (UX Jam) 20160108UX milk (UX Jam) 20160108
UX milk (UX Jam) 20160108Yukio Andoh
 
Google Cardboard and VR Tips (at KL)
Google Cardboard and VR Tips (at KL)Google Cardboard and VR Tips (at KL)
Google Cardboard and VR Tips (at KL)Yukio Andoh
 
google cardboard and VR tips
google cardboard and VR tipsgoogle cardboard and VR tips
google cardboard and VR tipsYukio Andoh
 

More from Yukio Andoh (20)

デザインのリファクタリング (慣れを大切に)
デザインのリファクタリング (慣れを大切に)デザインのリファクタリング (慣れを大切に)
デザインのリファクタリング (慣れを大切に)
 
SIGGRAPH ASIA 2020 みどころ紹介
SIGGRAPH ASIA 2020 みどころ紹介SIGGRAPH ASIA 2020 みどころ紹介
SIGGRAPH ASIA 2020 みどころ紹介
 
UX MILK All Night 2020 (Yukio Andoh)
UX MILK All Night 2020 (Yukio Andoh)UX MILK All Night 2020 (Yukio Andoh)
UX MILK All Night 2020 (Yukio Andoh)
 
Ethical UX / uxmilk fukuoka 2019/12/17
Ethical UX / uxmilk fukuoka 2019/12/17Ethical UX / uxmilk fukuoka 2019/12/17
Ethical UX / uxmilk fukuoka 2019/12/17
 
Ethical UX
Ethical UXEthical UX
Ethical UX
 
SIGGRAPH 2019 preparation
SIGGRAPH 2019 preparationSIGGRAPH 2019 preparation
SIGGRAPH 2019 preparation
 
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
SIGGRAPH ASIA 2018 : BOF : SIGGRAPH ASIA 2018の歩き方
 
VoiceUIのデザインと音声サービスの勘所
VoiceUIのデザインと音声サービスの勘所VoiceUIのデザインと音声サービスの勘所
VoiceUIのデザインと音声サービスの勘所
 
VUIテクノロジーアップデート& VUIビジネストレンド紹介
VUIテクノロジーアップデート& VUIビジネストレンド紹介VUIテクノロジーアップデート& VUIビジネストレンド紹介
VUIテクノロジーアップデート& VUIビジネストレンド紹介
 
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
Voice UI Designer Meetup Tokyo 「 VUIデザインの勘所」
 
Voice UI/UX Design Guideline
Voice UI/UX Design GuidelineVoice UI/UX Design Guideline
Voice UI/UX Design Guideline
 
Design JP vol2 (Motion Design & Animation)
Design JP vol2 (Motion Design & Animation)Design JP vol2 (Motion Design & Animation)
Design JP vol2 (Motion Design & Animation)
 
UX Jam x UX Sketch 2017 HD
UX Jam x UX Sketch 2017 HDUX Jam x UX Sketch 2017 HD
UX Jam x UX Sketch 2017 HD
 
Shin UX 2017 - UX strategy - UX review
Shin UX 2017 - UX strategy - UX reviewShin UX 2017 - UX strategy - UX review
Shin UX 2017 - UX strategy - UX review
 
BPStudy #111 iOS 10 and iPhone 7
BPStudy #111 iOS 10 and iPhone 7BPStudy #111 iOS 10 and iPhone 7
BPStudy #111 iOS 10 and iPhone 7
 
DesignJP prototyping 20160825
DesignJP prototyping 20160825DesignJP prototyping 20160825
DesignJP prototyping 20160825
 
UX Strategy 2016/06/18
UX Strategy  2016/06/18 UX Strategy  2016/06/18
UX Strategy 2016/06/18
 
UX milk (UX Jam) 20160108
UX milk (UX Jam) 20160108UX milk (UX Jam) 20160108
UX milk (UX Jam) 20160108
 
Google Cardboard and VR Tips (at KL)
Google Cardboard and VR Tips (at KL)Google Cardboard and VR Tips (at KL)
Google Cardboard and VR Tips (at KL)
 
google cardboard and VR tips
google cardboard and VR tipsgoogle cardboard and VR tips
google cardboard and VR tips
 

Recently uploaded

自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineerYuki Kikuchi
 
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NTT DATA Technology & Innovation
 
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察  ~Text-to-MusicとText-To-ImageかつImage-to-Music...モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察  ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...博三 太田
 
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdfAWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdfFumieNakayama
 
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)UEHARA, Tetsutaro
 
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)Hiroshi Tomioka
 
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?akihisamiyanaga1
 
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdfクラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdfFumieNakayama
 

Recently uploaded (8)

自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
 
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
 
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察  ~Text-to-MusicとText-To-ImageかつImage-to-Music...モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察  ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
 
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdfAWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
 
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
 
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
 
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
 
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdfクラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
 

Android wear ui guidelines ( and Circle Design UX )