デザイナーズハック 012 定例MTG 〜オリンピックで海外から来た人もかんたんに買えるような、駅の発券機のインターフェースを研究してみる〜

▼今回のMTG内容

○今回のお題：オリンピックで海外から来た人もかんたんに買えるような、駅の自動発券機のインターフェースを研究してみる

2020年のオリンピック、ご存知のとおり東京に決まりました。
東京はこれからいろんなところが整備されていくと思いますが、今回はそれも視野に入れて、駅の発券機のインターフェースを考えてみたいと思います。

今の東京では、ほとんどの人がSuicaやPASMOなどといったICカードを使っていて、改札を入るとき、乗り換えるとき、出るとき、タッチするのみで通ります。

たまにICカードを忘れて電車に乗ることになったときは、もう大変。
切符売り場の前で立ち尽くしてしまいます。
どう大変なのか、今回解決したい問題を挙げておきます。

【問題1】駅名を探しづらい

頭上に、とても大きな路線図と、駅名表があります。
路線図からは、都内のことをよく知っている人（もしくは鉄道に詳しい人）でないと、目的の駅を見つけることはほぼ不可能です。

また、あいうえお順で駅名一覧が書かれている表があるときもありますが、これも、字が小さい上に、かなり頭を上に向けないといけないので、長時間探すのはつらいです。

【問題2】線をまたがる乗換が必要なときの値段がわからない

JR／東京メトロ／都営地下鉄などの線が違う乗換をするとき、発券機とその上の路線図・駅名表だけで値段を判断するのは、たぶん無理だと思います。
ときどき、東京メトロの発券機に「都営線乗換」のようなエリアがあり、それを押すと乗換用の切符が買えたりしますが、知っている人でないと無理でしょう。

以上2点です。
今回のデザイナーズハックMTGでは、東京の電車の切符を、ICカードなしでもだれもがわかりやすく買える方法を考えたいと思います。

解決ヒント

解決にあたり、考えるときのヒントを出しておきます。

【解決ヒント1】ハードウェアを一新してみる

 現在の発券機に、駅名からの検索ができず、料金の表示しかないのは、おそらく現在の発券機のハードウェアの問題だと思います。

新幹線の自動発券機では、駅名を指定できますが、普通の電車ではまだできません。これは、新幹線の駅数は限られており（東海道新幹線でも17個）、そうそうすぐに駅が増えたりしないからだと思います。

特に東京の場合、普通の電車の発券機に駅名を入れてしまうと、パンクしてしまう、もしくはメンテナンスが大変なのだと思います。
（一部、地方ごとで、特定の駅名とその料金が表示されているところもあります）

ハードボタンのついた発券機で料金の表示しかでないのはまだわかりますが、タッチパネル式の発券機でも料金の表示しか出ないのは、最近では少々違和感があります。

ここでは、ハードウェアを今のものから別のものに変えることにして、たとえばWebベースのOSにしてみたり、安価なAndroid OSを入れてみたりすることも、（架空ではありますが）考えてみてください。

そうすることによって、各機器のメンテナンスが簡単になります。

【解決ヒント2】タッチパネルとハードボタンをどう使うかを考える

自動発券機も、昔はすべてがハードボタンでしたが、最近ではタッチパネルも併用しているものも多いです。よく見るのは、

• 通常の操作はタッチパネル内
• まとめ買いはハードボタン

というパターン。
このボタンの使い分けについては、推測でしかありませんが、ハードウェアの関係上、「いつでも切り替えられるように」という理由が大きいのではないでしょうか。

以上2点を参考にしてみてください。

※本来なら、メーカーの方や有識者の方を招き、メンターとして助言をいただくべきなのですが、そういった会は、今後このコミュニティの基盤ができてきたら、ぜひ開きたいと思っています。

▼ディスカッションスタイル

今回から、2つのスタイルを設けます。

1. あらかじめ考えてくる宿題パターン

今回のお題について、あらかじめ考えて、自分の中でひとつのプロトタイプを作ってくるスタイルです。
当日の時間は、考えてきた人どうしで発表・共有し、それについてディスカッションします。

2. 当日の2時間でグループワークをするパターン

この場合、特に考えてくることは必要ありません。
2時間という短い時間ですので、さくっと情報を整理をして、かんたんなデザインプロトタイプまでを作ってみます。

▼その他

○プロトタイプについて

プロトタイプを作る方法は、なんでもOKです。
当日にグループワークをする場合には

• ペーパープロトタイプ
• イラストレーターなどのツールを使ってのプロトタイプ

などが妥当ですが、あらかじめ考えてくる宿題パターンの場合、他にも

• ブラウザ上で動くプロトタイプ
• iOSやAndroidで動くプロトタイプ
• FlashやAfterEffectsなどでつくった動くプロトタイプ

など、動くものもありです。

○対象者

• Webやアプリのインターフェース設計に携わっている人
• ハードウェアデバイスのインターフェース設計に携わっている人
• これらに興味のある人

※会のモデレーターはいますが、講師はおりません。

○持ち物

• 紙やペン（ペーパープロトタイプの場合）
• パソコン（イラストレーターなどのツールを使う場合）
• 名刺など

※無線LANと電源は準備しています。
※紙は一応こちらでも準備しておきます。

○発表

• 考えた成果物を発表します。
• ペーパープロトタイプの場合は、成果物を写真or動画で撮り、パソコンにて表示させます。

○目的

• 普段使ったことのある製品を、自分だったらどう設計するかを考えることにより、新しいインターフェースを考えることの練習をする。
• 人の発表を聞くことにより、同じもののインターフェースを考えるときに他の人がどう考えているのかを知る。
• 得た体験を、自分の業務や生活に活かす

○タイムテーブル

• 18:30 開場
• 19:00 開始
• 21:00 発表
• 22:00 交流会
• 22:30 終了

（だいたいの目安です）

アンケートでお題を募集しています。ぜひご協力おねがいします。

お題の募集は終了しました。ご協力ありがとうございました。

デザイナーズハック 012 定例MTG 〜オリンピックで海外から来た人もかんたんに買えるような、駅の発券機のインターフェースを研究してみる〜

2013.09.27 @admin

デザイナーズハック 011 定例MTG 〜ウォシュレットのリモコンを研究してみる〜

▼今回のMTG内容

前回まで、「組み込みデザインを見据えたインターフェース勉強会」としてテレビのUIをシリーズで4回かけて考えてきました。 今回からは、単発で、いろんなインターフェースを研究していきたいと思います。

○今回のお題：トイレのウォシュレットのリモコンを研究してみる

いろんなビルや飲食店などでも、ウォシュレットのあるトイレが増えてきました。いつもリモコンを見て思うのは、インターフェースがかなりバラバラ。

家のトイレにありそうなウォシュレットリモコン

羽田空港のウォシュレットリモコン ボタンは押しやすそうですが、音姫と流すものは別々です。

わりとフラットなウォシュレットリモコン

流すボタンがリモコンについているものも多くありますが、そういうものはわかりにくいようで、「流す↓」や「大」「小」など、シールが貼られています。

シールが貼られるということは、おそらく店側の気まわしですので、リモコンのインターフェースとしてはあまりベストではないということではないでしょう。

だれもが使いやすいウォシュレットリモコンを、自分たちなりに考えてみたいと思います。

※本来なら、メーカーの方や有識者の方を招き、メンターとして助言をいただくべきなのですが、そういった会は、今後このコミュニティの基盤ができてきたら、ぜひ開きたいと思っています。

○対象者

• Webやアプリのインターフェース設計に携わっている人
• ハードウェアデバイスのインターフェース設計に携わっている人
• これらに興味のある人

※会のモデレーターはいますが、講師はおりません。

○どこまでやるか

2時間という短い時間ですので、さくっと情報を整理をして、かんたんなデザインプロトタイプまでを作ってみます。
方法は、ペーパープロトタイプ、イラストレーターなどのツールを使ってのプロトタイプ、その他なんでもOKです。

○持ち物

• 紙やペン（ペーパープロトタイプの場合）
• パソコン（イラストレーターなどのツールを使う場合）
• 名刺など

※無線LANと電源は準備しています。
※紙は一応こちらでも準備しておきます。

○発表

• 考えた成果物を発表します。
• ペーパープロトタイプの場合は、成果物を写真or動画で撮り、パソコンにて表示させます。

○目的

• 普段使ったことのある製品を、自分だったらどう設計するかを考えることにより、新しいインターフェースを考えることの練習をする。
• 人の発表を聞くことにより、同じもののインターフェースを考えるときに他の人がどう考えているのかを知る。
• 得た体験を、自分の業務や生活に活かす

○タイムテーブル

18:30 開場
19:00 開始
21:00 発表
22:00 交流会
22:30 終了
（だいたいの目安です）

2013.09.09 @admin

▼今回のお題

TVシリーズ最終回！
次回も発表＆ディスカッションにしたいと思います。
発表については、次の2部門にします。

1) アイデア＆企画部門

こんなTV、そしてこんなUIいいんじゃない？というアイデア。
前回もやりましたが、今回もこの部門の発表を募集します。

2) プロトタイプ部門

実際にプロトタイプを作って発表する部門。
実装技術は問いません。プロジェクター上で発表できれば、動画でもHTMLベースでも、その他なんでもOKです。

次回は、自分の企画に「ターゲット」を設定してください。
テレビは本来、万人向けです。老若男女問わずです。
ですが、それにしばられていては新しい体験も向き不向きがでてきます。
「俺のUIは○○向けだ！」を設定し、自信をもって考えてください。

• 発表時間は1人10分か20分ぐらいを目安に。
• 各人の発表時間によって発表人数は変わりますが、先着で可能な限りはできるようにします。
• 見るだけの参加でもOK。
• 発表希望者は、登録時のアンケートに記入してください。サイトには随時反映させていきます。

■タイムテーブル

18:30 開場
19:00 開始
19:10〜 発表・ディスカッション
21:00 終了後のお楽しみ、ピザを囲みながらUIやデザインなど困っていること相談会
22:00 中締め

※終了後の食事をもう少し充実させるため、参加費を1人1,000円とさせていただきました。

■発表者

• やまさき しげのりさん – 10分
• かわした たろうさん – 10分
• あきば ちひろ – 10分

その他

今回で、TVシリーズをいったん最終回にします。
次からも、お題を決めてそれについてインターフェース、デザイン、体験を考えるという軸ははずさず、いろいろなことにチャレンジしていきたいと思います。

こんなのやりたい！という意見がありましたら、登録時のアンケートに記入していただくか、ML・Facebookページ・Twitterなどに投げてください。
よろしくお願いいたします。

2013.07.09 @admin

組み込みデザインを見据えたインターフェイス勉強会 その3

デザイナーズハックは、技術にとらわれずに体験からデザインを考えていくコミュニティです。

定例MTGは今回で2回目ですが、とりあえずは月1回を目標に顔をあわせてミーティング、そしてデザインをわたしたちから発信したいなと思っています。

そこでひとつ大きなテーマとして、しばらく「組み込みデザイン」としてテレビのインターフェイスを考えていきます。

デザイナーズハック 009 定例MTG

今回のお題

前回出たアイデアを参考にしたりして、それぞれ各自、テレビの企画／コンセプト・UIを自分で考えてきて、それをまとめて発表する場にします。
※テレビシリーズはあと2回でいったん区切りつけたいと思っていますので、ぜひご参加ください。

■発表ネタ

テレビの企画・コンセプトと、それにもとづくUI設計（ワイヤーレベル）※細かいデザインやプロトタイプは、まだなくてOKです（あってもOKです）、次の回での発表とします。 ※プロトタイプでの技術は問いませんので、体験や要望などから考えてください。

• 発表時間は1人5分〜maxで20分ぐらいを目安に。
• 各人の発表時間によって発表人数は変わりますが、先着で可能な限りはできるようにします。
• 見るだけでもOK。
• 発表したい人は、申込時のアンケートに「発表します！」と書いておいてください。サイトには随時反映させていきます。

■タイムテーブル

• 18:30 開場
• 19:00 開始
• 19:10〜 発表・ディスカッション
• 21:00 終了後のお楽しみ、ピザを囲みながらUIやデザインなど困っていること相談会
• 22:00 中締め

■発表者

• 安藤幸央さん – 5分
• Shigenori Yamasaki（ヤマサキシゲノリ）さん – 10分
• 宮路 優さん – 10分
• 秋葉 ちひろ – 10分
• 今村 博宣さん – 15分
• 秋葉 秀樹さん – 5分

※今村さんからは「コンピュテックス台北 2013」の報告をしていただきます！

■メンター

メンターとして、ハードウェア方面からは今村 博宣さん、UI方面からは安藤 幸央さんに来ていただき、いろいろツッコミをいれてもらいます！

■おまけ1

Google TV、Nexus Qの現物を見れるかも！？（予定）

■おまけ2

Firefox OSを、PandaBoard（いわゆる基板）にのせ、ワンチップAndroidならぬ「ワンチップFirefox OS TV」が実現しました！

ちゃんと、テレビにうつっています。
ホーム画面はサイズが固定されているので真ん中にきゅっとなってしまいますが、大きい解像度に対応できるアプリを入れておけば、Firefox OS上で テレビのUIを確認することもできます。

操作は、現時点ではUSB接続のマウス。
Bluetooth接続はまだ使えないようなので（ソース元：wiki.mozilla.org）、Wi-Fi子機としてつなぐことになりそうです。

【6/17 追記】

現在、PS2のコントローラと接続できていて、アナログスティック、十字キー、○×ボタンなどを認識することが可能です。

（これは画像です）

当日はこちらも持ってきていただく予定ですのでお楽しみに！

デザイナーズハック 009 定例MTG

2013.05.31 @admin

組み込みデザインを見据えたインターフェイス勉強会 その2

デザイナーズハックは、技術にとらわれずに体験からデザインを考えていくコミュニティです。

定例MTGは今回で2回目ですが、とりあえずは月1回を目標に顔をあわせてミーティング、そしてデザインをわたしたちから発信したいなと思っています。

そこでひとつ大きなテーマとして、しばらく「組み込みデザイン」としてテレビのインターフェイスを考えていきます。

デザイナーズハック 008 定例MTG

今回のお題

「テレビの在り方を考えてみよう」

• テレビの在り方（そもそもどんなときに見るのか）
• 何を提供するのか（テレビ番組がいちばん優先なのか、インターネットコンテンツが優先なのか）
• リモコンでの心地良い操作とは？

参考までに

先日ひまむらさんが見せてくれたAndroid TVのスクリーンショット

安藤幸央さんのスマートテレビのUIデザインに関する資料（2010年ごろのもの）

スマートTVの画像検索結果

タイムテーブル

（余談）

2013.04.30 @admin