ico_gvoice

Category: UX経験談

2014.07.08
0

「2001年宇宙の旅」から過去となった未来を見る

「2001年宇宙の旅」を見たことがありますか。この映画は1968年に大監督スタンリー・キューブリックが撮影した映画です。この映画で描かれている33年後の未来は21世紀の現在であり、12年前の過去です。   2年前にやっとこの史上最も悶々とすると言われている映画を見ました。早送りしたい気持ちを抑え、どうしようもない気持ちを持った2時間半が過ぎても、大監督が伝えたかった人生について私には何も分かりませんでした。しかし、「劇中の黒い板がiPhoneの外見にとっても似ている!」という意外な発見がありました(ポイントが違いますね、ハハハ)。 ▲この黒い石板の比率はiPhoneにそっくり?   この長方形の黒い石板について、映画の中ではどこから来たのか、どこへ行くのか全く説明されていません。私たちが知っていることは、どこから現れたか分からない石板が出現した後は劇中のサルが突然頭が良くなった!ということです。サルは道具を応用することを知り、敵を倒し狩りをするのです。   黒い石板の主人ではありませんが、iPhoneを発明したアップル社は1999年に映画の中のスーパーコンピューターである「HAL9000」を主役にした広告を撮影しました。アップル社は間もなくやってくる2001年を祝うのではなく、HALによってWindowsがミレニアムイヤーに大フリーズする可能性を逆に風刺したのです。   HALはこう言います。「Dave(『2001年宇宙の旅』の主役の名前)、2000年にコンピューターがおかしな行動をとり始めた時のことを覚えていますか。分かってほしいのですが、あれは私たちのせいではなかったのです。あれはエンジニアが私たちにミレニアムイヤーを認識する方法を教えてくれなかったからなのです。2000年がやって来た時、私たちはどうすることもできずに世界経済を崩壊させてしまいました。あれはバグだったのです。これで私の気持ちもだいぶ楽になりました。」

ガマコラム セールストレンド
2014.07.08
0

お絵かきが好きなら絶対におすすめ イマジネーションを現実のものにする「3Dペン」(3Doodler)

   アニメで不思議なペンを手にした人物が空気中に絵を描くと、小鳥や飛行機、恐竜まで、描くことさえできればそれが実際に目の前に現れてその物体が動く通りに動くということが見られます。現在、そのファンタジーがほとんど実現しているのです。この「3Dペン」(3Doodler)があれば、空気中に実体を思いのままに描き出すことができるのです!描き出したものは動きませんが、この発明は人々を不思議がらせています。人類の聡明さは何と偉大なのでしょう!      ▲一本一本「3Dペン」で描き出されたエッフェル塔が活き活きと目の前に現れる。   「3Dペン」はイギリスのオモチャとロボット会社Wobble WorksのPeter DilwortとMaxwell Bogueによって発明されました。その原理はとても簡単です。ペンのボタンを軽く押すだけで、ペンの中のプラスチック材料のストリングスが加熱により軟化して出てきます。するとペン先端のファンによって急速に冷却されて硬化します。空気中で思いのままにペンを動かして細やかな立体図案を作ることができるのです!

ガマコラム ブランド観察
2014.07.08
0

デジタルバーコードが携帯電話をより便利にさせる

最近生活の中でよく見かけるQRコードの応用、今最も流行しているLINEでさえも、QRコードを使っての読み取りが可能です。実際の生活で、私達はQRコードのアイデアに関連したものをすでによく目にしています。QRコードのマーケティングモデルは、私たちの生活やインターネット上にだんだんと浸透してきているのです。QRコードの応用を簡単にお伝えします: QRコードとは? QRコード(Quick Response Code)とは、バーコードの一種で、撮影機能やバーコード解読機能のついたソフトウェアを使うだけで、バーコードの中に保存されているデータを得ることができます。主に、携帯電話の撮影機能と共に使用され、文字情報を提供することによって、キーワードの入力という動作の手間を省きます。現在、QRコードが応用されているのは、観光ガイド、映画チケットの購入、製品情報や名刺などです。 携帯電話の進歩によって、ネットワークサービスの利用も比較的整ってきたため、QRコードの用途はたくさんあります。続いて、QRコードのいくつかの応用例を皆さんに紹介します:   1.LEXUS ALL NEW

UX経験談 ガマコラム
2014.07.08
0

テクノロジーが紙に代替しても、替えられないものがある…..

携帯電話が紙に代わる時代がもう来ていることは分かっています。しかし私はテクノロジーが大嫌いなのです。だからiPadやiPhoneは昨年ようやく使い始め、今使い始めてまだ5か月になったばかりです。この5か月間はびくびくしながら暮らしていました!なぜかって。それはこれらのデジタルデバイスを使い過ぎた結果、いつもスクリーンに向かって笑い、素早く字を書いている所を妻に見られたくないからです!!だから妻はある日夜中に泣きながら私を揺り起こして、私が浮気をしているのではないかと聞いてきたのです!!   ああ、ドラえもんのポケットを持つという夢はもうしばらくしたらスマートフォンで叶うかもしれません。スマートフォンは生活をより便利にしました。しかし、新しい面倒も増え、何かを失くしたような気もします。   最近私は学生生活に戻っています。仕事の他に短期間の研修にでています。こんな年になってかなり慌てているのは、iPhoneに頼らなければあの若くてたくましく、記憶力の良いクラスメートたちには絶対勝てないからです!!本は重過ぎ、私は五十肩になってしまいました。だから私は講義の際には教科書を持って学校に行くことはせず、家で先に携帯電話で今日講義で学ぶ部分と試験の内容をを撮影してから、鉛筆とノート、携帯電話をもって講義に出席するのです!講義で分からない単語が出てきたらすぐにインターネットの辞書で調べ、聞いても分からない文法が出てきたらすぐにGoogleで調べます。ホワイトボードの文字を書き写すのが間に合わない時はちょっと恥ずかしい思いをして自分より18歳も若いクラスメートから借りることなく、直接「ハイ!」の一声で余裕たっぷりに携帯電話で撮影するのです(私が台湾で買ったiPhoneは、写真を撮る時に『パシャッ』というシャッター音がしないため、現在日本のクラスメートに大人気です)。   もし、コンディションが悪くて講義に集中できない時は、携帯電話で教師の講義内容を録音し、電車で通勤する時にもう一度学びます。   スマートフォンは学習する上で本当に大きく役に立っており、素早く、また繰り返し学ぶことができます。さらには文章を書くこともこれまでのように一杯のコーヒーとパソコンの前にぼうっと座っているだけではありません。今では通勤電車の中で、トイレで、ワールド・ベースボール・クラシック(WBC)の試合を見ながら、眠れない時など、思いついたらすぐに携帯電話を起動させて書き始めます(文章を書きながら笑うので、私が絶対に浮気していると妻が疑うのも無理はありません)。 以前、授業の時に必ず見られた「メモラブレター」は今では見られなくなっています。メモは何人もの間に手渡されるため、誰が誰に渡したか容易に調べがついてしまい、放課後に皆の話題となってしまいます。今日の英語の授業のピンク色のメモは誰が誰に渡したものだ?メモの折り方は?女子は大泣きしていなかったか。……などなど、ある種の楽しみでした。しかし誰もがLINEを使っている今、もうメモは手渡しされません。授業中誰もがLINEを使っており、皆同時に笑ったり、ぼうっとしたりしているので、誰と誰がアヤシイ関係にあるのかなんて、誰にも推測できません。

ガマコラム 広告への呟き
2014.07.08
0

Design & Thinking ドキュメンタリーフィルム監督座談会

ガマニア人の皆さんは前号のG!VOICEでDesign Thinkingという概念を十分理解したことと思います。UX Labも多くの場でドキュメンタリーフィルムの上映会を行いました。そこでUX Labでは4月29 日、このドキュメンタリーの監督である蔡牧民氏とクリエイティブディレクターの頼佩芸氏を特別に招いてガマニアの皆さんと彼らの起業、そして4人の小さなチームでどのようにしてこれほどまでに影響力を持つドキュメンタリーを創造することができたのかを分かち合ってもらいました! ▲(左)クリエイティブディレクター-頼佩芸、(右)監督-蔡牧民 サンフランシスコのアカデミー・オブ・アートを卒業した蔡牧民氏と賴佩芸氏は、それぞれ映画学科と広告学科に在籍していました。卒業後1年間働いてから起業することを決意してMuris繆思有限公司を設立しました。蔡牧民監督はこのドキュメンタリーの制作において、これまでの大きなコストと人力を使った制作方法の常識を覆したことに触れました。蔡牧民氏と賴佩芸氏は台湾クリエイティブセンターのサンフランシスコ支部の楊育修氏と黄幼萱氏に会い、このドキュメンタリーフィルムについて互いの考え方を話し合いました。台湾クリエイティブセンターはこのアイデアを面白いと思い、さらに積極的に提携することにしたのです。台湾クリエイティブセンターが提供した多くのデザイン界の人脈が器材と映画制作を提供できたことから、4人の小さなチームが出来上がりました。台湾クリエイティブセンターサンフランシスコ支部の小さなオフィスで4人は映画制作の方向について尽きることのない発想を始めたのです。 ▲台湾クリエイティブセンターサンフランシスコ支部の小さなオフィスでの4人によるBrainstorming。 Kick Starterはアメリカ最大のクラウドファンディングプラットフォームです。このプラットフォームは多くの人の創意とアイデアについて、群衆の力によって十分な資金を集めて更なる製品の開発と研究を進めるというものです。ドキュメンタリーフィルムのDesign

TW ガマニュース
2014.07.08
0

《ガマニア全体ミーティング》 世界に台湾の声を聴かせる~九天民俗技芸団

▲2011年、許振栄(右一)が九天民俗技芸団を率いて台湾の神の人形三太子(中)を担ぎながら林義傑(左一)とサハラ砂漠レースを完走した。 ガマニア全体ミーティング 世界に台湾の声を聴かせる~九天民俗技芸団 団長:許振栄 映画『陣頭Din Tao: Leader of the Parade』で梨子が力強く飛び跳ね、「俺に付いて叩け!」と叫んだ有名な場面を覚えていますか。これは多くのこの映画を見た観客の熱い血の記憶であり、この一言は台湾人の伝統技芸の伝承への執着だけではなく、台湾の民俗芸能が世界へ向けて声を上げ続けていることも象徴しているのです!虚構の映画のストーリーのようですが、6、7割の物語はこの台湾で実際に起きた出来事です。そして映画の主役こそ台湾の九天民俗技芸団、許振栄団長の物語なのです。2013年第一四半期のガマニア全体ミーティングでは許団長を招いて講演を行ってもらいました。

TW ガマニュース
2014.07.08
0

2013 Summer School夏の学園、現在申し込み受付中!!

勇気が違う自分を見せてくれる!! 勇気Tシャツを着れば、勇気のある人になれる。Summer School の仲間達はこのように確信しています。 冒険的な勇気育成トレーニングを通して、自分に挑み、違った自分を再発見しよう。 ガマニアCheerUp財団は、2013 Summer School 夏の学園に参加する新しい仲間を歓迎します! Summer

TW ガマニュース
2014.07.07
0

一つの問題からの始まり

よく人から聞かれるのが「UX Designとは何ですか。」ということです。 この問いに答える前にちょっと説明する必要があります。User Experienceとは、ソフト・ハードウェア、ビジュアルアート、インタラクティブセンサー、行動認知、社交心理、カスタマーサービス等々(まだまだあります)多くの異なる領域に関係する学問なのです。人に関係する活動、デザイン、ビジネス行動、教育、サービスでありさえすればいわゆる「User Experienceユーザー体験」から離れることはできないのです。 ですから私たちはUX Design(ユーザーエクスペリエンスデザイン)はもはや単純な一つの専門分野と定義することはできません。これは提供する当該製品またはサービスに関係する人々(エンジニア、美術スタッフ、企画者、研究者、カスタマーサービス、広報担当者、イベントマーケティングスタッフ、等々)がそれぞれの専門分野で「ユーザーを中心」にした態度で行うそれぞれの仕事の一部なのです。 こう尋ねる人もいるはずです。では、何が「ユーザーを中心とする」ということなのでしょうか。 一番簡単な言い方をすれば、それは「ユーザーの角度から考える」ということになります。 それはどういうことでしょうか。

UX経験談 ガマコラム
2014.07.07
0

18歳のガマニアをAlbertはこう見る

Albert:「18年というと、1人の子どもにしてみれば、もう成人しているでしょうし、人格もだいたい形成されているでしょう。この18年を振り返ると、私たちの会社の性格はかなり特別です。私たちは安定して成長してきた会社ではありません。だから、私はいつも会社のことを「ツいてない子ども」と言っています(笑)。多くの企業は正しいモデルで参入した後、10年、15年ととても安定した成長と拡大期が享受できます。しかし、私たちは台湾にいるからか、または経営する業界の特性のせいか、ガマニアは常に挑戦し続けて夢を大きくする努力を続け、それからその態度と理念を力強く実践しています。また私たちは自らを成長させ、大きくする大変な努力をしています。そのため、ガマニアの歴史にはたいへん多くの困難と挫折がありました。しかし、私たちは常に挫折から立ち上がってきました。これはとても特別な性格なのではないかと思います。逆にそのような会社は少ないのです。私たちが経験した大きな挫折はどれも会社を崩壊させるのに十分でしたが、私たちにはそのようなことは起きませんでした。 18年間、起業したてのころの苦労は、当時こういった業種は全く存在していなかったので、後に直面した様々な状況は私にとってどれもとても重く感じられました。だから、すでにガマニアを退職している昔の社員や今一緒に仕事をしている一人一人に対しては皆この会社と共に成長して、困難を乗り越えているという気持ちを持っています。もしずっと順調だったら物語はつまらないのです。これまでの様々な成功や困難、失敗がガマニアの物語を素晴らしいものにし、また私のガマニア人に対する感覚を特別なものにしているのです。こういった失敗から学んで再び立ち上がる性格と文化は私たちガマニア人の最大の資産です。永遠に失敗を恐れず、さらには追求して成功に伴ってくる失敗も受け入れるのです。私はいつもこう言っています。『成功者とははしばしば最高の失敗の管理者だ。自分の失敗を管理して見つめることを知っているからこそ成功する可能性がある』。

ガマフィーチャー
2014.07.07
0

変わるデジタル時代のPR

これまで私たちが広報に期待していたものは、私たちが工夫を凝らして企画したイベントにメディアの記者を招待し、テーマに対する彼らの興味を利用することによっていわゆる無料報道を生み、ターゲット対象が見える機会を創造して大きなメディアのメリットを勝ち取ることでした。 しかし、デジタル時代となり、マーケティング運営の方法が変わりました。広報活動もまさに時代とともに変わっています。 中でも最も主な変化はこれまでブランドが行ってきた広報活動です。ここでもっとも注意されていたのは「ニュースのポイントがあるかどうか、記者が興味を持つかどうか、メディアが取り上げるかどうか」でした。これまで消費者は主にこれらのニュース記者たちがフィルタリングした後の情報を受け取っていました。そのため、広報はメディアの興味をひけるかどうか、迎合するかどうか、これらが記者会見で成功の鍵を握るポイントとなっていたのです。 記者を満足させてメディアで取り上げられるのを待つよりも、消費者を満足させてメディアに逆に報道してもらう! しかし、デジタル時代における消費者の情報の受け取り方は変わっています。積極的に、また自由になっています。情報はニュースによって知らされるものではなくなり、つながり合うネットワークの海と友人たちとのコミュニティの中から自分が興味を持つ内容を探し出すようになっています。多くの場合、まじめに記者会見をした時の成果よりも「メディアを飛び越えて直接消費者を満足させ、しっかりとストーリーを語る」方が有効であることもしばしばです。メディアは事件がネットユーザーたちの間に大きく広がったことによって逆に情報源を探し出し、伝えたいことを報道してくれます。 最近見た例をあげましょう。   ミラノと東京を瞬間移動 もし、いつものように地下鉄に乗ってミラノの地下鉄Moscova駅に着き、車両のドアが開いて駅に目をやるとそこは見慣れた光景ではなく、駅の中には鼻がとがってひげを生やしたイタリア人ではなく、黒髪と黄色い肌で「コンニチワ」と話す日本人がおり、駅の案内板や地下鉄の路線図と広告はどれも見てもわからない日本語、目に映るすべてが「ここはミラノじゃない!ここはミラノじゃなくて、東京の渋谷だ!」となった時、あなたはどんな反応をするでしょうか。 じつは、これはイタリアの電信会社Fastwebが光ファイバーネットワークの普及推進のために実施したイベントなのです。消費者にインターネットによる「バーチャル」な移動を体験してもらおうというのではなく、実際に自分の目と体で「瞬間移動」とは何かを体験してもらおうというものです。

ガマコラム セールストレンド
2014.07.07
0

Happy Dragon Boat Festival

毎年端午の節句は太陽の光が北半球に直接射す時です。暑い真夏日は端午の節句の大きな特徴であるだけではなく、太陽の光が北半球に直接射すことから太陽の引力と地球の引力が相互に働いて逆方向に引っ張り合って働く形になるので、卵に作用して簡単に卵を立てることができます。また、この時はちょうど正の気が集まる時のため、普段は立ちにくい卵もこの時は立つという話もあります。そして、端午の節句の時に卵立てに成功すると、その年は一年中幸運に恵まれるということを多くの人が信じています。 ヨモギ草スタイルの2インチミニガマニアンを独占公開! 2013年の夏、Gamania独占限定の2インチミニガマニアンフィギュアがヨモギ草スタイルで初登場します!これは今年の端午の節句の企業ギフト-ミニガマニアン卵立てセットです!このミニガマニアンが立てた卵でたくさんの幸運を集めてくれるといいですね! ▲ミニガマニアン卵立てセットの2インチミニガマニアンの手足はどれも動くようにデザインされている。より活発なスタイルでガマニアンの皆さんにお披露目! ▲卵の中には特製のガマニアクリップとチマキクリップが入っている。また、中にあるフォームテープはミニガマニアンの卵立てセットを組み立てる時の材料だ。 ▲フォームテープで2インチミニガマニアンと卵の底を固定すれば完成! 皆の注目を集める中、2インチのミニガマニアンは登場に成功しました!次の2インチガマニアンはどんなスタイルで登場するのでしょうか。乞うご期待! 2インチガマニアンのデザインと変化の過程はこの文の最後をご覧ください。

ガマデザイン
2014.07.07
0

エネルギー切れしないソーラーパワー広告ボード

ブランドケースを観察していると、私たちはいつもブランドオーナーの角度から彼らが訴えたい情報を見ています。もし逆に考えて1枚の薄いソーラーパワーボードを広告ボードにして広告を打つとしたらどうすることができるのでしょうか。多くの人は直感的に充電できる「利便性」を思いつくでしょう。では「利便性」と固く結びついて連想できる広告メディアなら、バス停のソーラーパワー看板からバスを待っている人へ充電サービスの提供などが連想できるでしょう。 日焼け止めクリームのブランドがどのようにこの広告のクリエイティビティとリンクしているか見てみましょう。ブラジルには美しいビーチと太陽の光があり、休日には多くの旅行客がビーチに横たわって日光浴をしています。NIVEAは「ビーチで日焼け止めオイルを塗る」という点を利用して、ソーラーパワーで充電できる広告ボードを製作しました。その趣旨はNIVEAの日焼け止めクリームを塗れば太陽の下でも安心してなんでもでき、思い切り楽しめるだけではなく、携帯電話の充電の心配もしなくてよいということを消費者に訴えることでした!ソーラーパワー充電広告ボードは消費者がビーチで充電の心配なしに安心してスマートフォンが使えるだけではなく、知らず知らずのうちに日光浴を楽しむ時間も長くなります。そんな時の強い味方はもちろんNIVEA日焼け止めクリームです。このほか、ソーラーパワー充電ボードと日焼け止めクリームのリンクの力もたいへん絶妙です。日焼け止めクリームで体に充電し、ソーラーパワー広告ボードで携帯電話に充電するのです。“Recharge”というコンセプトを巡りながら、さらには消費者のビーチにおける消費時間数も延長し、太陽とNIVEAのブランドの接点も強めるという大変成功したブランドのクリエイティビティなのです。 NIVEA Solar Ad Charger         

ガマコラム ブランド観察
2014.07.07
0

国際大会初勝利!「ガマベアーズ」LOLチームが2013年WGT準優勝を獲得

▲「ガマベアーズ」LOLチームが初めての国際大会で準優勝という快挙を達成! 【ガマニアニュース】ガマニア旗下のeスポーツチーム「ガマベアーズ」が今年4月に設立したLOLチームが6月15日から16日まで開かれた「ワールド・ゲームマスター・トーナメント」(World Gamemaster Tournament、略称WGT)に参加し、初めての国際大会で準優勝を獲得しました。素晴らしく、また激しい戦いの様子はすべてのゲーマーの気持ちを最後まで熱くたぎらせるものでした。6月19日には特別に「ガマベアーズ公式ファンページ」にて「絶版ガマベアーズウインドブレーカー」抽選イベントが行われ、ファンを招待してともにこの好成績を喜び合いました。 2013 年のWGTは6月にオンライン大会が始まり「ガマベアーズ」LOLチームは多くのチームの中から勝ち抜き、ベスト4として決勝大会に進んだだけではなく、台湾と香港で唯一決勝に進んだチームとなったのです。今回「ガマベアーズ」とチャンピオンを争ったチームは韓国の「Xenics Storm」と中国の2チーム「CC」と「WE.A」でした。そして「ガマベアーズ」が最初に戦ったのは「Xenics Storm」です。最終的には0:2で一時的に後れを取ったものの、それで「ガマベアーズ」の優勝争いが終わったわけではありません。続く「CC」と「WE.A」との対決では「ガマベアーズ」は破竹の勢いで、それぞれ2:0、2:1の優れた成績で順調に中国チームを破り、最終決勝戦に進みました。 ▲全力で最終決勝戦の座を奪取する「ガマベアーズ」!  

TW ガマニュース
2014.07.07
0

ジャン・レノがドラえもんになるとき

困ったことがあるとすぐにドラえもんに泣きつくのび太、人を小ばかにするお坊ちゃまスネ夫、横暴なジャイアン、日本の北海道から沖縄まで1960年代生まれでも2000年代生まれでも誰でもキャラクターの性格を知っています。そしてこれらのキャラクターがTOYOTAの今年のCMになりました。   トヨタ 実写版 ドラえもん CM 1~4総集編 -ReBORN- TOYOTA:     ***********以下CMドラマの内容************ アニメ: 静香「大人になったらドライブして、バーベキューして!」

ガマコラム 広告への呟き
2014.07.07
0

《C9 Continent of the Ninth》のオープンテストを開催 覚醒必殺スキルを開放

【ガマニアニュース】ガマニア旗下の名作アクションゲーム《C9 Continent of the Ninth》が7月4日にオープンテストを行いました。同テストではゲーマー期待の新職業「奪魂師」が公開されただけではなく、ゲーマーのコンボの実力が最も発揮できる「コロシアムPVP」と「乱入システム」も同時に開放されました。各職業のより強力な攻撃力を呼び覚ますために、レベル49以上のプレーヤーは「覚醒スキル」クエストによって第2転職職業の超強力必殺技を習得することができます。バイオレンス状態であれば、爆発的かつ敵を震え上がらせるダメージを与えられる攻撃ができます。今日は各職業の「覚醒スキル」について紹介します。今すぐオンラインしてキミの戦いの潜在力を解き放て! 「侠客」の第2転職覚醒スキル-「エビルスティング」、「ウインドレジスト」、「ヘブンズインヘイル」 「アサシン」の覚醒スキル「エビルスティング」は本来の刀剣が光を放つ巨大な剣に変わります。しかも稲妻のような速さで突きを繰り返し、まるで暗闇の中に隠れている毒蛇のように目をつけられるだけで底なしの恐怖に陥ってしまいます。「ゴッドアーチャー」の覚醒スキル「ウインドレジスト」は風を支配する力です。すべてを貫く矢を機関銃のように放ち、敵に隠れる場所を与えません。また「アンブッシュ」の覚醒スキル「ヘブンズインヘイル」は火炎属性の強力な砲撃です。様々なモンスターの強力なスキルに直面してもすばやく反撃して目の前の敵を一瞬にして焼き尽くします! ▲「侠客」の第2転職覚醒スキル 「戦士」の第2転職覚醒スキル-「バイオレンスフレイム」、「トルネードソード」、「キンググレイス」 「戦神」の覚醒スキル「バイオレンスフレイム」は怒りの炎ですべてを焼き尽くし、激しい炎に囲まれた敵は燃え尽きてしまいます!「剣聖」のスキル「トルネードソード」は最も強力な剣術で、剣が舞って振り下ろされるときに華麗な竜巻が巻き起こり、敵に一撃必殺のダメージを与えます。また「キンググレイス」は「聖騎士」の覚醒スキルであり、古代の王者の強大な霊力を召喚します。この力が発せられると周りのすべては塵となってしまい、その名を聞いただけで震え上がってしまうほどの破壊的な攻撃力を持っています!

TW ガマニュース
2014.07.07
0

日本系正統オンラインアクションゲーム大作《PHANTASY STAR ONLINE 2》が間もなく台湾を席巻!

【ガマニアニュース】ガマニアが初めて日本の著名ゲームメーカーSEGA株式会社と提携して、高い知名度を持つアクションゲーム大作《PHANTASY STAR ONLINE 2》(略称PSO2)の台湾・香港・マカオにおける代理権を獲得しました。2014年に正式に公開される予定ですが、いち早く《PSO2》のプロモーションビデオを発表して台湾のゲーマーの皆さんに《PSO2》の素晴らしい刺激的な宇宙の大冒険を感じてほしいと思います。 ガマニアはアクションゲームのトップとしての地位を継続し、強固にするために2014年はARPGの人気大作《PSO2》でゲーマーの心をつかみARPG市場に大きな衝撃を与えたいとしています。また初めてガマニアと提携する日本の有名メーカーSEGAは台湾におけるガマニアのアクションゲーム市場シェアトップという運営のアドバンテージを重視し、ガマニアの充実した運営経験で《PSO2》の海外市場が拡大することを願っています。 《PSO2》は2012年に日本で公開された際にゲーマーから高い注目を集め、公開から現在まで同時オンライン人数が9万5000人を超えるという驚くべき成績を残しています。かつ2012年7月4日に発売されたWindows PC版は開始から3か月で会員数100万人という大台を突破しています!このほかにも《PSO2》は2012年「ファミ通年間 PC・携帯ゲーム部門優秀賞優秀賞」、2012年「電撃オンライン年間 PCゲーム部門第1位」、2012「Web Money

TW ガマニュース
2014.07.07
0

5月のガマニア講堂-レザークラフトWorkshop

100%ピュアなオリジナルの感動 前回のSpace 17 における5月の展示「GAMA 360∘隠さない」ではガマニアンの隠された多彩な特技と芸術的才能を目の当たりにしました。なかでもレザークラフトは多くの人の興味を引き付けました。そこでブランドセンターは今回多くのレザークラフトの出展で貢献してくれたレザークラフトマスター-小P(FUN-SO-Sanp Wang)を特別講師として招き、ガマニアンたちはレザークラフトの素晴らしさを体験することができました。 ▲Space 17の5月の展示「GAMA 360∘隠さない」で出展されたレザークラフト。 ▲レザークラフトWorkshop当日は満席!オンライン申込み人数も定員オーバー!

TW ガマニュース
2014.07.07
0

創造力とブランド、Identity:Machiのビッグブラザー・黄立成

ガマニア全体ミーティング 「創造力のある人間になろうとしたら、まず先に自分がどんな人間なのか、自分のidentityと立ち位置を知り、十分理解しなければならない。なぜなら、すべての創造的な発想と創造力は生活の背景と絶対的に関係するから。経験してきたことと理解してきた現象は絶対的な関係がある。」-Machiビッグブラザー黄立成(ジェフリー・ホアン)   盲従から立ち位置を明確にするまで 黄立成は、自分がすごしてきたあの年代、現在流行している多くの文化はアメリカでまだ形を成していなかったと言います。スケートボード、ダンス、そしてラップも同じでした。彼らは新たな知識を吸収するような多くの情報を持っておらず、すべてはアイデンティティとポジションがそれほど明確にはなっていないようでした。黄立成は自分自身のアイデンティティについて、ずっと台湾人であると認識していますが、台湾人というアイデンティティは少し曖昧であり、またこのような曖昧な境界線が世界における私たちのパフォーマンスに影響しているかもしれないと話しています。黄立成ははっきりとしたアイデンティティを獲得してからでなければ自らの「Brand」を作ってより多くの人に見てもらうことはできないだろうと考えています。目立つのが好きな性格から、黄立成はすべての創造力とブランドはbrandingをすることで多くの人に知ってもらえ、外でより一層肩で風を切って歩くことができると思い、L.A.BOYZというグループのブランドを立ち上げました。黄立成はL.A.BOYZというブランドから学んだ一番重要なことは、異なる流行のトレンドのために様々なスタイルの曲を試してみたものの、一番の根本にあるものとバックグラウンドはやはりヒップホップであることが分かったことだと語っています。これについて黄立成は自分の好きなことをやり続け、自分のアイデンティティを持ち続け理想の方向に向かって努力し、簡単に影響を受けないようにすることを薦めています。黄立成はL.A. BOYZの後も多くの様々な事業を行ってきましたが、最後には最初に一番好きだったヒップホップへと回帰し、現在の麻吉社と麻吉音楽を設立しました。黄立成いわく「私たちが今定義しているMachi(麻吉)のブランドとは、数字の1と7の中国語での同音異字語、つまり『義気(イー・チー:義理堅さ)』であり、これがMachiの精神を表すものです。」 ▲当時のL.A. BOYZのアルバム   好きな物事については徹底的に貫く

TW ガマニュース

わからないわけがない!UI/UXプログラマーが陥りがちな思考の盲点

思考の盲点により多くのミスをしてしまいがちになります。同じようにUI/UXプログラマーである私たちは客観的な方法と心持ちでクエスト達成するのですが、時としてプログラマー特有の問題に陥り、思考の盲点を作り出してしまいます。これらの盲点がいくつかの問題を生み出します。小さなところでは製品リリースのスケジュールに影響し、大きなところではチームの調和を乱し、悪い企業文化や製品開発面でミスを引き起こします。読者の皆様も陥ってしまってはいないでしょうか、今回大舌頭は敢えて整理してみました。UI/UXプログラマーは製品開発のプロセスにおいて、思考の盲点に一番陥りやすいもの。みなさんの参考になればと思います。 よくある思考の盲点: 1)完璧主義 ▲画像引用元:https://eurofree3.files.wordpress.com/2014/03/nitpicking.jpg プログラマーを形容するときに一番よく耳にする単語、それが完璧主義です。一般人の定義では、行き過ぎた完璧主義はマイナスの意味を含むことがありますが、プログラマーにとって、自分が完璧主義と言われるのは内心嬉しいことなのです。すなわち、プログラマーのディテールへのこだわりとクオリティーへの要求の表れです。こういった特徴が、製品やブランドの最終的な発展を促進することには違いありません。ただ、プログラマーがプロジェクトの修正に執拗なにこだわりを持つ場合、往々にして手持ちの「リソース(時間、資金、人手など)」がどのくらいあるか、という問題の考慮を忘れがちになります。「リソース」はベンチャー企業にとって生死を分けるカギとなります。 UI/UXプログラマーの考え方はハイスピードで変遷するソフト開発の初期段階において、よりサービスプログラマーに似ており、ユーザーに注目する以外に、関連権益を有する人やビジネスモデルについても思考を巡らせなければなりません。インターフェースもある要素の微調節にこだわるべきではないのです。これには、背景のカラー、フォントのサイズやレイアウトにおける完璧性の追求などが含まれます。むしろ、制作プロセスの順調さとユーザーに価値(MVP)を与えられるかどうかという点に重きをおくべきなのです。つまり、プログラマーにはビジネス思考が不可欠であり、それぞれの製品段階で自分がどのような役割を果たすべきかを理解し、そこになんらかの価値を提供すべきなのです。 もちろん、ビジネスモデルが市場で行けると検証されれば、プログラマーは完璧主義を200%発揮し、絶妙なプログラミングとgrowth hackチームとを組み合わせ、ユーザーに多様な試験を実施し、その結果に従い製品を調整し、最大の効果と利益を生み出せばよいのです。 製品の完璧さにこだわるのは悪いことではありませんが、度を超すと大きな間違いを引き起こしかねません! 2)傲慢な態度と毒舌 ▲画像引用元:http://hbz.h-cdn.co/assets/16/14/1600×800/landscape-1459776449-hbz-anthony-vacarrello-00-index.jpg 私たちがメディアでプログラマーの写真や報道を目にする時、どこか偉そうで普通の人と違う感覚、崇高な理想を目に輝かせ、天才と呼ばれても臆さないような感じを覚えることはありませんか。または、その輝かしい外見から、スターのような近寄りがたい印象を受けることもあるかもしれません。しかし実際のところ、良いプログラマーとは優れたマーケティングのプロのこと。運営的に対外イメージをわざと作っているのかもしれませんが、自分のスタイルを打ち出すことで、プロとして物事に対する敏感さを表現しているのです。ですから、プログラマーの外見的なイメージに決してまどわされないようにしてください。高圧的な態度はプログラマーの絶対的な特徴ではありません。 ソフト業界において、プログラマーは製品の成功を左右する唯一の要素ではありません。つまり、親しみやすさ以外にも、コミュニケーション力および総括能力がUI/UXプログラマーになるための必須条件と言えるでしょう。しかし、高圧的な態度は、テーマに対するプログラマーの度の超えたこだわりにつながることがあります。妥協の余地がなくなれば、誰もが納得できるような解決プランは見つからなくなってしまいます。高圧的な態度ではプログラムの達人になることはできません。それどころか、皆の協力体制を崩してしまうことになるでしょう。 また、プログラマーの多くは独自の美的センスを持っているため、物事を違う角度で見ることがあります。高圧的という印象は往々にして話し方がきつく偏っていることによるものかもしれません。このように客観性を失うと、他の角度から観察するチャンスも放棄してしまい、より多くの発展の方向性を失ってしまいます。 3)オリジナルにこだわる ▲画像引用元:http://content.wallpapers-room.com/resolutions/1920×1200/B/Wallpapers-room_com___Be_Original_blue_by_Adam_Betts_1920x1200.jpg プログラマーは「コピー」や「インスパイア」といった言葉に特に敏感で、製品のプログラムは唯一無二であるべきと考えているもの。これは他人の知財権の尊重以外に、プログラマーとしての尊厳を守るためでもあります。ただ、ソフト分野では、インターフェースとインタラクティブでのオリジナルは本当にレアであり、多くは素晴らしい製品のプログラムをスタックまたは修正したもの(例、フレームをインポートして最適化)です。もう一つの理由として、たくさんの無料テンプレートが使用できるので皆の作品がどんどん似てくるということがあります。また、あまりに斬新なオリジナルのプログラムは、必ずしもユーザーに好まれるものではありません。というのも、彼らが過去の経験と結び付けて操作できず、消化不良になってしまうのです。 そして、コピーやインスパイアされたインターフェースも、別の業界で使用された場合、その効果が同じではないことがあります。例えば、左右にスクロールして友達を選ぶソフト—Tinder、多くの業界のAPPは、そのオリジナルのインタラクティブ方法で人気がありインスパイアされましたが、所属業界の特徴に適しているかどうかを考えない(例、Eコマースがユーザーに写真によって比較できるようになっていて、1枚1枚選ぶわけではありません)と、想定した効果を得られないことがあります。ですから、大舌頭は、プログラマーが他人にコピーされたとき、または別の作品をインスパイアして作ろうと考えたとき(ただし大舌頭の意図を誤解しないでください。他の人のプログラムを必ずコピーせねばならないというわけではありません)、まず「必ずオリジナルである」という原則の下、あなたが提供する服装や作品タイプに合っているかどうかをより良く最適化できるプログラミング方法の有無を考えなければなりません。 最後に、ビジネス面において、大舌頭は「オリジナル」という言葉には保護性がないと感じ、いかにして特許による保護を強化すべきかを考えました。目下、主な国(米、中、台湾など)はみなレイアウト、連続するUI変化やアイコンを特許申請しており、特許のプログラミング価値を明らかにする方法とされていますが、この分野は逆にUI/UXプログラマーが意に介すことのない、最も見慣れないものでもあります。 プログラム特許に興味がある読者の方は、下記の文書を参考にしてください。「人に頼まず知的財産権を保護し、インターフェースプログラマーの3分でわかるプログラミング特許(保護智慧財產不求人,介面設計師三分鐘看懂設計專利)」 4)好き嫌いだけを重視 ▲画像引用元:http://jsleeper.com/DM203/@DM203_IMAGES/_0000_1.jpg 多くのプログラマーは非常に個性的で、個人のスタイルを持ち、物事の好き嫌いがはっきりしています。そのため、好きなものに対しては大いに褒め、嫌いなものはけなし(例、数年前のリアルとSDタイプの争い)、中途半端なものは相手にもしません。この二極化は、場合によってはプログラマー独自のスタイルを打ち出すこともありますが、場合によっては作品が独りよがりなものとなり、なかなか人に受け入れられなくなることもあります。ビジネス的な商品については、より多くの配慮が必要となり、プログラマー個人の好みによってプログラミングすることはできません。もしプログラマーが自分の好みに過度にこだわり、その他の重要でより優先すべきことを軽視すると、いつしかチームの運営に問題が生じ、成功のチャンスを逃すこともあるかもしれません。 また、好きか嫌いだけを極端に気にかけると、より良いインスピレーションを失うことにもなりかねません。その中間にある曖昧なものの方が、より多くの可能性や大らかさを備えているものだからです。また、それによってスタイルや方向性、スキルなど、自分の発展を制限してしまうことにもなりかねません。プログラマーは、自分の感性や直観を信じる以外にも、データによって証明や調整できるもの(例えば、UXインタビューの結論、マーケティングチームのA/B Testなど)もあるという事実に驚くことでしょう。

どうしてインターフェイスデザインでユーザーの個人のアイコンは大部分が円形なのですか?

みなさんは、ますます多くのプラットフォームあるいはAppで「円形」のユーザーアイコンを好んで使っていると思いませんか?近頃のデザインの流行でしょうか?それとも大部分のインターフェイスデザイナーの好みでしょうか?あるいはその他特別な理由があるのでしょうか?設計大舌頭はネットコミュニティの専門家と討論したり、アンケート結果の分析したりした結果、この秘密が徐々に整理されてきました。素晴らしい内容なので、見逃さないでくださいね~ アイコンの定義と発展: ネットユーザーグループが急速に増加するにつれ、彼らはプラットフォームによってその他のユーザーとのインタラクティブな動きをしたいというニーズが次第に高まり、そのため多くのインタラクティブなことができるプラットフォームタイプ、例えばフォーラム、メールボックス、チャットルーム、ブログなどのコミュニティが発展しました。中でもすべてのユーザーが独特な個体(本当の身分または偽のキャラかに関わらず)を表していて、これらの個体には相応のデータやアイコンがあります。 またアイコンは、通常個性化(ユーザーが自分を表現していると思う)のシンボルなので、大部分が平面か3D画像で表現されます UI 上のアイコンを英語ではプロフィールピクチャーまたはアバターといいます。中でもプロフィールピクチャーは、表記からも割と理解しやすいですが、アバターは読者のみなさんにわかりにくく、みなさんのアバター対するイメージは、映画のアバターかもしれませんね。(青いアレ XD)。techpediaプラットフォームの説明によると、アバターという言葉は1985 年、ルーカスフィルム(Lucas Film)のオンラインキャラクターゲーム(Habitat)の専門スタッフ(Chip Morningstar & Joseph Romero)が言い始めました。この言葉の由来はインドの教え「 聖人降臨(a descent of the Supreme Being)」で、英語では「化身 (incarnation)」または「代表(manifestation)」を意味しています。 ▲写真出典:http://goo.gl/sSCCs3 ネットユーザーのアイコンの形の選択についての観点: 実際にはどんな形を選ぶかの話し合いはすでに目新しいものではなく、関連のフォーラムに意見や討論を発表する専門家も多くいます。設計大舌頭は彼らがQuoraとStack Exchangeプラットフォーム上での討論と発表した内容を抜粋や整理しました。簡単な分類は次の通りです。ただ、設計大舌頭は先にハッキリと言っていますが、以下の内容の順番は話題になった回数の統計ではなく(ただの無作為な順番)な上、何回かコメントしたもの検証や研究資料とは関連がないので、みなさんは異なる「観点」として参考程度にしてください。 感覚と認知

UIデザイナーがプログラム言語を学ぶ 経験談(二)

前回のUIデザイナーがプログラム言語を学ぶ 経験談(一)から5ヶ月程経ったでしょうか?!真面目に練習を続けていますか?何か困った事は起こりませんでしたか?もしプログラムの学習がすべて順調だったなら、それはあなたに才能がある証拠です。それはさておき、今日は引き続き次のステップに進みたいと思います~今日は比較的『硬い』内容で、しかもより多くの学習コストが必要です。そのため啓発という角度で私のプログラム学習の道のりをお話ししようと思います。 基礎である HTML と CSS をマスターしたら、非常に重要ないくつかのポイントは下記の通りです: CSSハック CSS最適化とメンテナンス性(SASS/css sprite/image compression/class name) CSS Framework(Bootstrap) バージョン管理(git) CSSハック ブラウザをまたぐ際に最初に思いつくのは CSSリセットでしょう。各ブラウザのデフォルトのパラメータをゼロにし、標準化するものです。現在よく目にするCSSリセットには2つあります。1つは世界的に有名なCSSマスターEric A. Meyer が整理したReset CSS、もう1つはCSS Normalizeです。これらの主な違いはHTMLタグの様式がリセットされてゼロに戻るかどうかです(例:h1~h6 の様式)。違いについてはreset cssのさらに別の選択 –

Gogoro X Design Tongue – アプリを見ていかに二輪車の使用経験を改善するか

Gogoro都市新探索BETA PROGRAMイベントが終わり、その過程でDesign Tongueの記憶に残ったのは熱血以外に何でしょうか?そう、ユニークな体験です!前回のライディングレポート(Gogoro X Design Tongue – 未来の二輪車生活体験)をお読みいただき、すでにGogoroについてご存じの方もいらっしゃるかもしれません。そして今回Design Tongueは、Gogoroアプリの体験と拡張応用について簡単にご紹介し、みなさんにGogoroアプリのUIインタラクション方式と今後の発展の可能性についてご理解いただきたいと思います。 アプリUI操作性 二輪車に接続し、二輪車のカスタマイズと車両チェックを行うのが、Gogoro app の主な核心的機能です。中でも、カスタマイズされた項目は多元的で、UI設計においては複雑なプログラムの簡素化が必須です。さらに提良好な操作関連、フィードバック、即時性(アプリと二輪車カスタマイズ間の対応とインタラクションの関係)を提供しなければなりません。Gogoroはどのようにして提供できたのでしょうか?続きをお読みくだされば分かります!Design TongueはUIの操作フローとトランジション効果(動画)をシェアしました。 ▲アプリ機能プレビュー GOSTATION GOSTATIONはライダーに付近の充電スタンドを知らせ、電池の予約ができるため、交換のために電池が持って行かれて、もぬけの殻になってしまうといった状況を防止します。ユーザーがGOSTATIONを開くと、すぐに位置情報機能が起動し、位置情報地点の付近の充電ステーションを走査します。この過程においては、レーダー走査のような動態効果により、待っている際の『煩わしさ』を低減し、製品の『テクノロジー感』を向上させました。検索が完了すると、位置情報地点を円心として、周囲の充電ステーションの情報が表示されます。ユーザーが付近の道路状況に不慣れな場合、ナビゲーション機能を起動すれば、充電ステーションを見つける手助けをしてくれます。 全体的には、ユーザーが遭遇するシーンについて、設計者はほぼ考慮しているものの、さらに特殊な状況が発生する可能性があります。例えば、 充電ステーションの営業時間と状態に関する情報(24時間営業のところもあれば、閉店して使用できないところもある)を提供しておらず、ライダ―が現地まで行ってもバッテリーを交換できないといった状況が起こる可能性がありました。 また、フル充電されたバッテリーの数量が表示されるものがベストです。ステーションで半分しか充電されていないバッテリーに交換した後で、さらに次のステーションでフル充電されたバッテリーに交換しなければならないといった事態を避けることができます。もちろん、個人のライダーがこの状況に遭遇する可能性は高くありません。しかし、大勢のライダーが一緒に出かける(集団ツーリングが流行しています。)となると可能性が出てきます!この情報があれば、ライダーたちはそれぞれ別のステーションに行き、バッテリーを交換するよう計画することができます。 また、ユーザーが位置情報地点から10キロ以上ある GOSTATIONを調べることはできません。デフォルトの範囲を超えるとシステムが通知します(設計時には、バッテリーがなくなりそうになった時に優先的に表示する情報は一番近い充電スタンドだったのかもしれませんが、ユーザーがこの情報を参考にし、新たに走行ルートをプランニングすることは考慮されていません)。この問題についてはすでに修正されています。修正後のUIはアイコンの透明度で距離を表し、不透明の場合は10キロ以内、半透明の場合は10キロ以上の充電ステーションを表します。操作の自由度が増し、使用の過程でもより便利になりました。 個人設定 個人設定はこのアプリの最も魅力的な機能の一つで、ユーザーに二輪車のスタイルのカスタマイズと、走行の習慣の調整をさせます。ユーザーはアプリから二輪車を設定するため、ペアリング(mapping)の感覚と操作は直感的なものである必要があります。例えば、アプリでは『フロントフォグランプ』を設定することができますが、ほとんどのユーザーはこの機能をご存じないのではないでしょうか?それからフロントフォグランプは車体のどの位置にあるのでしょうか?そのためGogoroのUIでは、上部を3Dがメインで文字で補足する二輪車概略図、下部を調整・制御部という2つの部分に分けています。このような設計により、ユーザーは機能と二輪車モジュールをすばやく結びつけることが可能となり、自然と学習コストも低減します。 この他、いくつかの設定可能項目についても、プレビュー画像と音声等により、ユーザーが設定後の効果と状態を理解する手助けをします。

「十年一剣を磨く」テンセントのユーザー体験の発展

近頃、ユーザー体験、ユーザー研究というフレーズをよく耳にしますが、どの企業も必ず関連の担当者を数名採用する必要がありそうです。UX/UI デザイナー等の不足は雨後の筍のように次々と現れ、これらの欠員の業務内容は果たして職名と一致しているのか、デザイナーであればきっとよくわかっているはずです。悠識が主催する MIX2015 フォーラムでは、テンセント初の専門インタラクションデザイナーである陳妍氏を招き、テンセントのユーザー体験の発展について、テンセントのような大企業がどのようにして体験デザインを進めているのかシェアして頂きました。 MIX 2015 モバイル体験デザインフォーラム – ユーザーが求めるイノベーション主導型デザイン開催日:2015/05/15主催:悠識 UserXperスピーカー:陳妍氏 / テンセント ユーザー研究及び体験デザイン部部長テーマ:テンセントにおけるユーザー研究 – 大デジタル時代のユーザー研究イノベーション 十年一剣を磨く テンセントは、中国で最も早期のインターネットインスタントメッセンジャーソフトの開発業者です。インターネットを通じて人々のライフクオリティを向上させることを使命とし、1999 年に QQ メッセージソフトをリリースして以来、その発展は、中国の数億人のネットユーザーのコミュニケーション方式と生活習慣に影響を与えてきました。 QQ が人と人とを結ぶものとするなら、WeChatは人とサービスをつなぐことを目的とし、便利なプラットホームを提供して、様々な生活機能、社会サービス機能、ビジネスの応用の統合に力を注いでいます。 中国のその他二大企業の主な利益獲得モデルと比較すると、百度は広告、阿里はeコマースを手段とし、テンセントはユーザーの課金で利益を上げた初のインターネット会社です。現在約 10% のユーザーが課金しており、ユーザーの重要性は一目瞭然です。また、ユーザー研究は、テンセントにおいて中核であり、製品にユーザー体験を導入してから既に10年を経ています。そのため、スピーカーの陳妍氏は「十年一剣を磨く」を今回の講演のテーマとしました。

UIデザイナー学習プログラム言語経験談(1)

タイトルからもわかるように、これはcodeが書けなかったのが少しそれなりに書けるようになった、ホームページの励ましの文です。(う~)。 まず筆者は自己の背景を紹介します。大学と研究所共に工業設計です。大学の頃は実体の製品設計に専念し、研究所に入ってからはユニバーサルデザイン、高齢者用マンマシンインターフェイス、認知心理学などの領域を始めました。卒業後は、非実体のデザインに対して興味(UIとUXなど)を持ち始めたため、IT業に入りUI Designerとなりました。しかし、分野が違うと全く見当が付かず、物事は馬鹿な者(筆者)の想像するような決して簡単なものではなく、勉強してきた設計理論を実務に応用するまではしばらく苦しい時期がありました。 ▲写真元:www.adhamdannaway.com ウェブページの基礎知識: 全くホームページデザインに触れたことがない人にとって、960grid systemという専門名詞を聞いても、その時頭の中には画面は全くないし、その他よくある元素用語も聞いても分かりません。チームのコミュニケーションを円滑にするため、私は時間を見つけてはエンジニアからこっそり勉強したり、知らないキーワードを耳にしたらすぐGoogleし、時には資料があまりにも多くて消化するのに何日もかかりました。しかし実際にやりながら勉強するという方法で早く成長できたので、おせっかいながらこの経験をみんなに共有します。 ▲写真元:http://960.gs/demo.html モジュール化、デザイン規範: まず、みなさんには先にモジュ―ル化とデザイン規範の概念を理解してもらいましょう。デザインの角度から見て、この2つの名詞は大部分が“ブランドの識別”上で応用されます。たとえばプラットフォーム全体の色、押しボタンの形式、フォントと間隔などを定義し、デザイナーはその定義に従ってプラットフォームの元素libraryをデザインします。これらの元素が構成するデザイン規範がこのプラットフォーム(ブランド)の識別です。先端のエンジニアによると、これらのデザイン規範はもっともモジュ―ル化しやすく、つまり元素が繰り返し現れてもCSSを上書きする必要がないということです。もし何名かで力を合わせて特別なケースを作っても、間違って書いたり、元のデザインと異なるということを避けることができます。こうなると、開発過程はより簡潔に、時間を省けます。(デザイナーがデザイン規範を設計するデザインの前期では、かなり時間を使っていて、且つ詳しい文書を提供しなければなりません。しかし長期的に見たところ、企業あるいは製品のブランドを作り開発の効率を考えると、これは絶対に必要だ) ▲写真元:UI kits(from dribbble.com/) HTML & CSS: 開発チームとのコミュニケーションを円滑にするため、先端言語(HTMLとCSS)から始めたが、どんどん底なし沼へ落ちていくとは思ってもいませんでした~ 私達みんなが知っているように、新しい知識を学ぶ前にはよい教材を準備しなければなりません。筆者が同僚達の意見を総合し、基礎の翻訳書籍をみつけました:HTML&CSS:ウェブサイト設計は優化の道を作り、この本の最大の特色は図も文章も内容が豊富ですばらしいため、デザイナーに推薦します! ▲写真元:『HTML and CSS: Design and Build Websites』

情報はこうやって組織する!

もし誰かに突然「8か国連合軍ってどの8か国?」と尋ねられたら、卒業してから長い年月が流れているあなたはどれだけのことを覚えていますか?学生時代から遠く離れてしまっていても、多くの人はすぐに答えられると思います。その答えは、ロシア、ドイツ、フランス、アメリカ、日本、オーストリア、イタリア、イギリスです。かつて「語呂合わせ」で私たちの「資料の組織」を手助けしてくれた偉大な歴史の先生に感謝しなければなりません。 次の方法で8か国連合軍について改めて復習しましょう!俄(ロシア)、德(ドイツ)、法(フランス)、美(アメリカ)、日(日本)、奧(オーストリア)、義(イタリア)、英(イギリス)餓(『俄』と似た発音)、的(『徳』と似た発音)、話(『法』と似た発音)、每(『美』と)、日(『日』)、熬(『奥』と似た発音)、一(『義』と似た発音)、鷹(『英』と似た発音) 「お腹が空いたら毎日鷹を一羽煮る(餓的話每日熬一鷹)」としたら、だいぶ分かりやすくなるのではないでしょうか。 実は情報を組織することの重要性は、全く関係が無いように見える情報を論理的な方法で整理し、構築することによって大脳に情報をより容易に受け入れさせ、吸収させやすくすることができるのです。 ファイブ・ハット・ラック Five Hat Racks ファイブ・ハット・ラックという言葉はTED主席/執行ディレクターWurmanが1989年に提案したものです。「帽子」は情報を表し、「ラック」は組織方法を示します。これは情報の対象が何であるかを問わず、地点、アルファベット、時間、種類、または階層という5種類の方法で全て情報の組織化ができるというものです。 アルファベット(Alphabet)  字典や百科事典などのようにアルファベットの順序をもとに情報を組織することを指します。 アルファベットで組織化された情報は強烈な指示性を持っており、非線形の情報に適用します。通常私たちがカラオケに行くと、アイウエオ順に歌手を探します。電話帳の氏名分類もアルファベットを使った組織法です。 時間(Time) ある一定の時間内の物事を表現・対照するとき、時間の前後で情報を組織することができます。HBOの放映映画のタイムテーブルや銀行の取引記録検索などはいずれもこの種の分類法に属します。 地点(Location) 情報の方角が重要である時は、その地理的位置と空間によって情報を組織します。例えばMRTの地図は自分の所在地と出口の方向を示してくれるのに役立ちますし、旅行書は近くにある観光地を地図に描いて、観光客に参考として提供します。これらはいずれも地図分類法に属します。 種類(Category)  相似性または関連性に従って情報を組織します。例えば、人材バンクの職業分類またはオークションサイトの商品カテゴリはこの方式で情報を表現しています。 階層(Hierarchy) 情報間の互いの関係を明確にする必要がある時は、階層組織法(例:最大から最小、最高から最低、最も高価から最も廉価)を使います。オンライン書店の売上ランキングや検索エンジンのランキングなどは全てこの階層法で情報を組織しています。 ファイブ・ハット・ラックの応用 ここでファイブ・ハット・ラックの法則をbeanfun!オフィシャルサイトに応用します。 アルファベット(Alphabet)フレンドリストはアルファベットまたは中国語の画数で配列を進めています。時間(Time) ステップ型のページ(例:登録ページ)には、手順の順序を明確に示すことが必要です。地点(Location) GASH+代理店の位置を地図に表示します。種類(Category) ゲームのメニューを分類します(例:RPGゲームまたはアクションゲーム)。階層(Hierarchy) ゲームリストを時間もしくは人気度によって排列します。 終わりに ウェブサイト、ガイドマニュアル、もしくは売場の整備のいずれにしても、ほとんどがファイブ・ハット・ラックの法則を使って組織されています。ユーザーの情報に対する見方は組織方法によって影響されます。 ファイブ・ハット・ラックは多くある組織化方法の理論の一つにすぎません。最も重要なことは情報に対する設計者の分析能力です。情報を得た時、その情報が強調したいポイントは何かをまず思考しなければコンテンツとユーザーの最も効果的なコミュニケーションと交流はできません。

2015年のウェブデザインの5大トレンド

活字、Web、インタラクティブ、或いは製品のデザイナーであれ、2014年のデザイントレンドは多様でバラエティに富み、スキューモーフィズム(Skeuomorphism)がフラットデザイン(Flat Design)に取って代わり始め、シンプルなスタイルがますます流行し、インフォグラフィック(Infographic)も単純な文字よりもさらに注目を集めたと感じませんでしたか。さらに、モバイルデバイスの普及で、レスポンシブWebデザイン(Responsive Web Design)が次第に広がり、スタティックな味気なさよりも、動きとインタラクションがWebにさらなるサプライズをもたらしました!これらすべての変化が生活にデザインをもたらし、より素晴らしい体験が生まれ、生活を豊かにしています。 2015が始まり、古いテクノロジーは次第に凋落し、新たに生まれたモバイルデバイスのトレンドとWebビジネスチャンスには無限の可能性があります。そこで、本章にて2015年のWebデザインの大まかな方向とトレンドを予測してみましょう! レスポンシブWebデザインは必然 レスポンシブWebデザインとは一体何か?簡単に言うと、異なる解析度の状況下でWebの植字とレイアウトを変え、異なる機器でも同じWebを正常に閲覧できるようにし、また、最適なビジュアル体験を提供するもので、モバイルデバイスの多様化によって考え出された対応方法です。レスポンシブWebデザインはすでにWebデザインの新スタンダードとなっており、より多くのWebビジネスチャンスやユーザーを失うまいと、ますます多くの企業や団体がこれを採用し、Webの最適化を進めています。つまり、これはすでに新たなデザインのブーム、トレンドなのです。 ぐっと注目を集めるカルーセルと動く背景 きっと1枚の絵が千の言葉に勝るという言葉をよく耳にすることでしょう。そうです!この格言はまさにWebにぴったりの言葉で、映像はメッセージを伝えやすく、また強く印象づけることができます。現在ますます多くのWebサイトのトップページで大きな写真が背景として使用され、動くもの、或いはスライドの映像を使用しているものまであり、Webを観賞し、内容を読んでもらうよう興味を引いています。エネルギッシュなすばらしい画像の視覚効果で、完全に視線をとらえ、さらにピンボケ、ぼかし、或いはフィルターで加工した写真に個性的な書体を合わせるスタイルが今年の主流のひとつとなることは間違いないでしょう。 ▲http://magazine.rolexawards.com/laureate/francesco-sauro ▲ http://ricardodelablanca.com/site/ パララックスとスクロールでより面白い効果が生まれる ここ数年で広がり始めたとても人気のあるスタイル、それはスクロール式タイムラインのWebデザインです。一般的に製品紹介、ストーリーの叙述、或いは歴史の変遷等に使用され、スクロールとともに画面に動きのあるパララックス効果が現れ、Webをさらに面白みのあるものにしています。ますます多くの人々がモバイルデバイスでWebを閲覧するにつれ、Web上のクリックがさらに減り、スクロール効果がより突出し、視覚体験をより豊かにします。 ▲ http://www.ok-studios.de/home/ 文字と植字のフレキシブル度が非常に重要 過ぎたるは猶及ばざるが如し。Webデザインで内容を伝えたいと考えるのは当然ですが、文字が多すぎると、嫌悪感や読みにくさを感じさせてしまいます。そのため、限られたスペースの中で効果的に情報を伝える場合、書体の選択と植字デザインはデザイナーにとって重要な課題のひとつとなることは間違いありません。今年のWebデザインは、シンプルでエレガントなビジュアルスタイルに依然として需要があり、同時にフラットデザインの要素、例えばシンプルな配色、個性的な書体或いは内容のグラフィック化もまた大いに好まれる表現手法となるでしょう。 ▲ http://www.bevisionare.com/ ▲ http://www.econocom.com/en 非常にやりがいのあるピンタレストスタイルデザインの双方向性 Pinterestが大ブームとなり、ピンタレストスタイルのWebデザインが一時SNSやニュースメディアのWebサイトに王道であるとみなされましたが、多くのeコマースや共同購入サイトにも集中的に採用されたため、一時期のWebはどれも似たり寄ったりになってしまいました。もしあなたのWebサイトが写真中心で、内容を補足するタイプであれば、ピンタレストスタイルのデザインを利用することで、Webが豊富ですっきりとしたものになり、また同時に多機能性も備え、これはまさに現在のインターネットのニーズであると言えるでしょう。 2015年は必ずやデザイナーがデザイン能力を発揮する1年になるでしょう。様々なタイプの製品が古いものから新しいものへ取って代わり、各デザイナーもまた、デザインの上で革新と面白さを求められるだけでなく、新旧のトレンドを融合させ、最高のデザインを発揮し、そして最も重要なこととして、誰もがより素晴らしい生活を送れるよう、より優れたユーザー体験を創造するということを忘れてはいけません。

iOSとAndroidのクロスプラットフォーム体験設計

このごろ多くの人が、iOSやAndroidプラットフォームのアプリを開発後、別のプラットフォーム上でも使えて、Appleファン、Androidファンが一緒に使うことのできるアプリを望んでいます。しかし、クロスプラットフォームを開発設計中、開発チームはハードウエア/ソフトウェアの違い、スクリーンの解像度やユーザーインターフェースの違いなど、とても大きな課題に直面することがあります。私達はiOSとAndroidソフト/ハードウエアの規格を変えることはできませんが、「インターフェースと操作体験」のテクニックで、AppleファンもAndroidファンにもすばらしい操作性を体験してもらうことができます。 続いていくつかのクロスプラットフォームアプリの設計実例を通して、これらのアプリでどのようにAppleファン、Androidファンが操作体験に満足するか、見てみましょう。 製作前に異なるプラットフォームの設計規準を理解していると、アプリの使用性を向上することができます。 アプリを設計する際に多くのユーザーの操作慣れを考えると、ユーザーが簡単に早く慣れ、このアプリを長く使ってもらえるようにすることが必要です。それぞれのプラットフォームの操作と設計規準がすべて異なる場合、もし時間もコストもなく、ユーザーの操作研究ができないなら、各プラットフォームのサイトから設計規準をチェックすることから始めると良いでしょう。 「戻る」を例にすると、iOSのインターフェース上のガイドの左上にはっきりと「戻る」ボタンがあり、これはアプリにおいて「戻る」の操作を行う際に用います。 しかしAndroidプラットフォームでは「戻る」の操作方法は2つあります。(1) インターフェース左上の「戻る」ボタン(2)ナビゲーションキー上にも「戻る」の機能があり、ホームに戻ることができます。 Andriod上の機能操作は非常にフレキシブルで、どんな状況でも「戻る」ボタンが押せるのですが、うっかりホームに戻ってしまうことがよく起こります。そのためAndroidのアプリはインターフェース設計上でナビゲーションバーを表示し、ホームに戻ってしまう回数を減らします。 操作の流れを統一し、ユーザーが何度もやり直すことを減らします。 ユーザーが同じ製品に対して2パターンの操作方法に悪戦苦闘しており、精一杯学んでも、首をかしげてばかりいたら、アプリを削除してしまうかもしれません。 Pocketを例にすると、iOSとAndroidクロスプラットフォーム設計において、視覚、操作の流れや動きなどが最も一致しているアプリです。記事をPocketに保存するには、iOS/Androidともに、たった3ステップで完了です!(1)ホームページを開く(2)シェア機能をスタート(3)Pocketにシェアを選択 iOS – 記事を保存するプロセス Android – 記事を保存するプロセス 良い操作機能があればそれを他のプラットフォームへ応用しましょう! 異なるプラットフォーム上ではもともと開発ツール、プログラム言語、フレームワークも異なるため、機能の操作方法も違います。「リフレッシュ」(Refresh)の機能を例にすると、引っ張って更新(Pull down to refresh)は、iOSの比較的新しいバージョンに内蔵されている機能です。しかし、Androidからしてみると、引っ張って更新機能はプログラムを書き直す時間がかかり、またコストもかかるため、通常はリフレッシュ機能ボタンをつけることで代用しています。 もしも良い操作方法でユーザーの満足度をアップすることができるなら、何故異なるプラットフォーム上での使用制限をなくさないのですか? FacebookはAndroidのみに手動リフレッシュ機能がありましたが、プルリフレッシュ機能をiOSとAndriodに応用していますます。2つのプラットフォームのユーザーは同じ操作で、ユーザーは便利に状態をリフレッシュできます。 クロスプラットフォーム設計の開発は大きな作業です。異なるシステムのユーザーの操作慣れをよく理解することが必要で、異なるプラットフォーム操作の特性を有効に使って、クロスプラットフォームのインターフェース上の制限を取り払うことにより、異なるプラットフォームのユーザーにスムーズに操作してもらうことができるのです。 作者紹介エルゴノミックデザインセンター /

インタラクティブインターフェースデザインはとっても簡単?

まずは、このようなイメージを頭の外に置いて下さい。インターフェースデザインで画面の美しさは確かにとても重要ですが、操作しやすいかの優先度は、実は美しい画面よりも高いのです。純粋なグラフィックデザインでは人との「相互のコミュニケーション」については考慮する必要がありませんが、インターフェースデザインにおいては、「相互のコミュニケーション」の概念を取り入れなければなりません。これはユーザーのあらゆる操作に対する反応とフィードバックが必要で、限られたハードの制限内で、ソフトの利便性に対し最大の合理化が必要です。そのため、ビジュアルと機能の間でいかにして最高のバランスを獲得するか。これこそインターフェースデザイナーが頭を悩ませる問題点です。 では、優れたインタラクティブインターフェースデザインとは何でしょうか? Designing for interaction一この本の中で、優れたインタラクティブインターフェースの7大ポイントについて述べられています。 1. 信頼できる Google MapとApple Mapを例にとると、IOS7でApple は自身でデザイン、開発した地図を採用しました。比較すると、Apple Mapの画面デザインは美しいですが、しばしばユーザーをミスリードし、自分も知らないような場所へ連れて行ってしまうという事が起きており、たとえもっと美しくできても、不信感が生まれてしまいます。そのため、選択肢としては多くの人が昔からなじみがあり、精度の高いGoogle Mapを選ぶでしょう。 ▲ 左はGoogle Map、右はApple Map 2. 親切 CNNのウェブサイトを例に挙げると、これは各国の文化、社会情勢、政治等…異なる要素に対応しています。サイトの操作とデザインレイアウトに違いが見られ、異なるバックグラウンドのユーザーに対し、適応する上での負担を与えません ( 英語系の国では文字を読む方向が左から右、アラビア語系の国では右から左というように、文字の書き方や読む方向が全く違う二つの国家に対応しており、ウェブデザインのレイアウトにおいて違いが見られます) ▲ 左はCNNの英語版、右はCNNのアラビア語系版 3.

まぶしく魅了されるMotion Graphics (モーショングラフィックス)

あなたは映画またはテレビゲームのオープニング映像で衝撃を受けたことはありますか? あなたは広告のビジュアル効果またはMVの中のオーディオビジュアルを融合させたストーリーに引き込まれたことはありますか? これらのまぶしく魅了される、そして人の目を釘付けにする重要な担い手が–Motion Graphics(モーショングラフィックス)なのです。 Motion Graphics(モーショングラフィックス)とはなにか? 動画には2種類あって、一つはアニメーションで、映画またはドキュメンタリーが主軸で、直接モーショングラフィックスを商品として販売します。このようなムービーを私たちは動画映画と呼び、有名な《モンスターズ・インク》または《カーズ》はこのカテゴリーの動画になります。 もう一種類とはMotion Graphics(モーショングラフィックス)で、ウィキペディア百科の定義によれば:「Motion Graphicsはムービー素材と動画テクノロジーを利用して動態のフィーリングを創造し、映像と音声のリズムを組み合わを重視し、いつでもビジュアルが動いている状態…」としています。簡単に言えばMotion Graphicは実は平面のGraphic Designを動態化して表現したもので、すべての画面が平面デザインの基本要素に符合するほか、さらに時間の概念を加味し、ひいては動態の感知を創造し、さらには人と機器のインタラクティブテクノロジーの融合を応用して、さらに多元的な表現形式をもたらすものです。これとGraphic Designは同じようにメッセージを伝達して人のコミュニケーションの表現方式ですが、ただ、さらに強烈になったものです。 日常生活でいつも触れるMotion Graphics 最もよく目にするのがMotion Graphicsを広告、映画、MV、ウェブサイトをインターフェイスとしてチャンネル番組をパッケージするのが主軸です。特に米国等欧米ではMotion Graphicsを広告とテレビ局のイメージ製作によく利用されています。ここ数年、 Motion Graphicsはこのビジュアル伝達効果を強め、製作時間を短くし多元的なクリエーティビティを表現する手法はすでに米国の広告の実態を変え、小規模のデザイン会社でも独特のクリエーティビティと美学で大企業のために広告が作れるようになったのです。 数多くの映画、テレビ、ゲームまたはウェブサイトではよくとてもクールな動画を目にします。オープニングムービーから休憩前のムービーにもMotion Graphicsが利用されて表現されています。これらのとビジュアルに関連する応用メディアはこれによってメッセージ伝達並びにマーケティングとエンターテイメント等の効果を発揮します。基本的に、モニターがある場所であればMotion Graphicsが存在できるのです。この他、現在Motion Graphicsがカバーできる範囲は非常に広く、VFX(特殊効果)からStop Motion(ストップモーション)さらの3D動画までと、これら大量の応用はまさにMotion

UI、その関わりとは?

高度情報化の新たなモバイル時代において、人々は情報の利便性を追求するだけでなく、そのニーズはますます高まっています。例えばスマートフォンを利用してどこでもアプリをダウンロードしたり、面白い出来事を撮影してはFacebookで友達と共有し合ったりしています。どんなデバイス(device)でハイテクのもたらす便利さや情報の恩恵にあずかるにしろ、それはすべてUIを通して実現することなのです。 UI(User Interface)とは? UIは我々の生活にあふれています。人と物、人と人のやり取りをつなぐものであればそれはUIです。イラストやマーク、音声やジェスチャーなどが含まれます。例えば運転中に赤信号だと止まります。バスでカードを使うとカード機が音声で反応して、感知の状態や残高の有無を知らせてくれます。 ▲UIは我々の生活にあふれている! UIデザインの重要性とは? 普段の生活で目にする日用品の多くに優れた直感式のUIデザインが採用されています。使い方を覚えなくても自然に使えるようにできています。例えばハサミの持つ部分は大小二つの輪になっています。それで小さい方には指を一本、大きい方には残りの指を入れるということがわかって、ハサミをうまく使えるようにしています。 ハイテクの進歩によって5年後、10年後には情報がどれほど複雑になるか想像もつきません。情報を得るのにデバイスは必要なくなるかもしれません。例えば指で窓に触れるだけで現在の気温と降水確率が窓に表示されるとか。生活に密着した情報は今後ますます増えていくでしょう。あらゆることが生活に結びつき、ユーザーはハサミと同じようにUIを楽に使いこなせる未来がやってくるはずです。UIとは有用性(Usability)と相互性(Interaction)でもあり、情報をすばやく手に入れ理解するための重要なカギを握ります。 ▲東京に次いで世界2位の使用率を誇るモスクワの地下鉄システム。上は改善前の路線図。地上の路線まで複雑に入り組んで、見ていると目が回りそう! ロシアのデザイン会社Art. Lebedev Studioによる新しいデザインの「モスクワ地下鉄路線図」 1.  路線はすべて直線デザインに。 2.  環状線とカーブは滑らかにしてソフトなビジュアルに。 3. 不規則な環状線は円形にしてよりシンプルに。 4.  図には区別しやすいように罫線を入れ、縦と横のマスにはそれぞれ番号を振って駅の位置の把握が便利に。 改善後の地下鉄路線図はずいぶん人に優しくなっていませんか? ▲信号には残り秒数の表示のほか、音声機能も追加され、視覚障害者の歩行も便利に。 ▲ICカードの感知機。感知の状態や残高の有無を音声で! 景観の美化のため、バス停のポールを減らして路線図の見づらさを改善。台北市公共運輸処と聯営バス管理委員会が共同で新しいバス標識をデザイン。 従来のバス標識 バス路線図には線や文字がびっしり書き込まれている上、高い位置にあって視力の弱い人や身長の低い子供には見えにくいものでした。また1枚の標識には最大3つのバス路線しかなく、バス停に多くの路線のバスが止まる場合は上図のように従来の標識ではあちこちに分かれて不便な上、道路の空間を狭くするものでした。

GDCでのUI Team

今年のGDC (Game Developer Conference)は2月末から3月初めにかけてSan Francisco Moscone Centerで開かれました。幸いエルゴノミックデザインセンターもこの世界中のゲームデザイナーたちが集まる催しに参加できました。盛大な催しではすばらしい経験を分かち合うことができ、カジュアルからハードコア、モバイルやコンソールからオンライン、プログラム、美術、サウンドからマーケティングまでと、いずれもゲーム業界の各方面での専門知識を共有できました。 しかし、今回お伝えしたいのは1週間にわたるGDCで学んだカリキュラムではありません。(そう言うと失望するかもしれませんか?)カリキュラムについては今後グループでまとめて勉強会を開く予定です。(乞うご期待!)今回はもっとリラックスできる内容にしたいと思います。 Design In SF, design in life (下を向けばデザインが落ちている) 西海岸のSan FranciscoにはNew YorkやBostonのような東海岸の都市が持つ多様化したクラシックとモダンの芸術的な雰囲気はありません。またParisやRomeのようなヨーロッパ都市の深い歴史と文化の洗礼も受けてはいません。しかしSan Franciscoは初期の西洋列強の殖民、ゴールドラッシュ、戦後のヒッピー文化、そして最近ではDot Com産業の発展を経てきました。それはオリジナリティ、多民族の融合、メインストリームとサブカルチャー、伝統と反伝統、アートとデザインを併せ持つスタイルへとつながりました。芸術は人々が崇め奉る高尚なものではありません。SFでは美術館だけでなく、街角のいたるところで下を見ればアイデアやインスピレーションが転がっているのです。 サンフランシスコに来るなら花を忘れずに。 GDCに来るならIndependent Games Festivalを忘れずに。Independent Games Festival (独立系ゲームフェスティバル)

機械と話すのはイヤ—ユーザーを喜ばせるダイアログ

    機械と話すのはイヤ—ユーザーを喜ばせるダイアログ   インターネットで起こる突発事態のうち、回線の中断やPCのフリーズを除けば、よくあるのは「システムメッセージ」でしょう!システムメッセージは様々なものがあって、「CapsLockキーを押したよ」と注意してくれるものや、「今、回線が切れて接続できないぜ」、「このアカウントは誰かが使っているぞ」と教えてくれるものがあります。そのほとんどは温もりのない冷たいメッセージになります。しかし、以下のメッセージにはニヤリとさせられるでしょう。 「念のため、あなたが人間なのかどうか確かめなければなりません。」 これは、twitterにログインする時に、IDとパスワードを3回間違えると現れるメッセージです。 とてもユーモアを感じませんか?こんなにユーモアあふれるメッセージを読めば、たとえ相手のシステムにエラーがあっても、何か許せるように感じることでしょう!   微笑ましいメッセージを読んだあと、今度は思わず眉間にシワが寄るメッセージを見てみましょう! うっかりIDとパスワードを間違ってしまいました。そして、表示されるエラーメッセージは、このように細々したものが現れてきます。パスワードを思い出すだけで頭が痛いのに、こんな文字の塊を読み終えたら、ログインしようなんて思わないことでしょう…必死でそのメッセージをじっくり読むと、そこに述べられている手順が非常に多いことに気がつきます。メッセージウィンドウを閉じれば、それらの手順を覚えているはずがなく、ユーザーには大した助けにもなりません。   そのほか、もっとも知られているシステムメッセージは、会員申請する時の申込書を記入する際に現れるシステムチェックメッセージを置いてほかにないでしょう。システムは入力されたアカウント名が使えるかどうか、パスワードの安全性が十分かどうかをチェックし、認証メールの確認を通知する・・・など様々なことをします。 文字に溢れた申請ページは、入力バーの下に多すぎるほどの注意書きがあります。入力を終えても自分で右側にある「チェック」ボタンを押さなければなりません。それは少し疲れませんか?そのうえ、まずいことにほとんどのユーザーはそれらのメッセージを最後まで読みません!実は、私たちはよりよい方法でユーザーに近づくことができるのです。もう規格化されたテキストフレームだけでユーザーに今の状況を知らせるのではなく、より生き生きとした言葉を使うことができるのです。 「このアカウント名は使えます。」を「いい名前ですね」に変えます。 「パスワードの安全性:弱・中・強」を「完璧なパスワード」にします。 メッセージの内容は必ずユーザーの分かる言葉でなければなりません!そのほか、ユーザーフレンドリーな言葉遣いは、ユーザーのエクスペリエンスをよりよいものにでき、その結果、そのサイトとより身近になろうとする考えが生まれ、温もりと気持ちをより感じることができ、そのサイトに対する印象もさらに深まります。   温もりもない冷たい機械と会話することを好む人はいません。一部のサイトはそのようなクールなスタイルが合っているかもしれません。しかし、今、インターネットを使っている年齢層はすでにどんどん広がっており、小学生からお年寄りまで、さらには飼っているペットまでインターネットをするという人も現れています!私たちはどのようにユーザー達(ペットを含まない!)に寄り添い、ユーザーのインターネット世界におけるトラベルをより快適なものにして、これほど多くの理解不能なシステムメッセージを恐れさせずに、私たちの気持ちを届けるべきなのでしょうか?   メッセージ送信における基本要素を以下にまとめました。   1. シンプル:30文字以内で完全な意味をすべて表現します。必要でない限り余計な文字を使いません。 2.

知っておきたいユニバーサルデザイン

  良いデザインは人々に快適な生活をもたらしてくれます。今回の2011年台北世界デザイン展南港展覧館内で活気に溢れる「ユニバーサルデザイン館」を見つけましたか?展示されている製品は、小さいものは日用品から、掲示板や家具といった大きなものまで多種多様で「人を以って出発点とする」をコンセプトに健康状態やお年寄り、身体障害者を問わず誰でも快適に利用できるデザインとなっています。   この「複合式多機能栓抜き」は、「テコの原理」を用いて、力の弱い女性や年配の方でも簡単に飲み物のフタを開けることができます。その他にもネイルアートをした女性の場合、缶ジュースのフタを開ける際、爪に傷がつくんじゃないかと心配になりますが、これには三角に尖った部位が付いていて、これを使えばいくら缶ジュースを開けても、もう怖くありません。     その他に面白い商品として「U型スポンジ」があります。この商品はユニバーサルデザインの特賞を獲得しています。デザイナーは濡れたスポンジが陰干しでは乾きにくく、また細菌も繁殖しやすいことを考慮し、スポンジには一センチ幅の切れ目を入れています。またユーザーはスポンジの窪みを使い一度に皿や鍋の淵を無駄なく洗うことができ、洗い終わった後は立てておくかキッチンの棚に干しておけばOKです。     大勢でパーティーをする時、いつもどれが誰のコップか分からなくなってしまいます。これは紙の折り曲げれる性質を利用した「Who's Cup」で、カップの淵に数字が印刷されており、パーティーの際は自分の数字を決めて折り曲げれば大人数でも誰のコップかがわかり無駄をなくしてくれます。     買い物をして紙幣と硬貨でお釣りをもらうことがよくあると思います。そんな時、この「分」があればお釣りを財布に入れるだけで、硬貨だけが小銭入れに自動で落下し、次に小銭を使う際は反対側を開けるだけでOKです。これで小銭と紙幣を分ける手間が省けます、便利だと思いませんか。     ユニバーサルデザインには七項目の原則があり、三項目以上が当てはまっていればその作品はユニバーサルデザインといえます。     ユニバーサルデザインの基本原則   1. 公平な使用への配慮:どのような使用者にも適した設計を心がけ、可能な限り使用者を選ぶような設計を避け、一目瞭然の設計が望ましい。   2.

プレイヤーの心理を探る-心理生理学

  はじめに プレイヤーのゲームに対する気持ちと考えを如何にして読み解くのかは、ずっと各ゲームメーカーの議論の的になっています。現在使われている方法は、概ねアンケート調査・インタビューあるいはパネルディスカッションなど定量化した市場調査法で進められています。プレイヤーがゲームをした後のゲームに対する評価や満足度はわかりますが、プレイヤーがゲームをしているときの反応については、より直感性のあるツールで測定することが比較的欠けています。しかし、そのほかの産学分野で従来使われている心理生理学(Psychophysiology)なら、あるいは私たちにプレイヤーの考えを読み解くのに適した方法を与えてくれるかもしれません。そこからさらにプレイヤーのユーザーエクスペリエンスを向上することになります。     心理生理学とは   心理生理学は1960年から1970年の間に起こった心理学の一分野です。その理論の基は主に人体から生まれる生理反応シグナルを用いて、メンタルモデルを読み解く手助けとすることです。すなわち、人の体を使って、その人の感情及び心理状態を評価することです。ゲームのテスト及び研究をする担当者に言わせれば、心理生理学は直接プレイヤーの反応からデータを取得する研究の方法であり、アンケートあるいはインタビューなどを通した主観的な方法ではありません。このほか、心理生理学のもう一つの優れた点は、ユーザーの生理シグナルを測定することで、ユーザー自身も感じていない感情や反応を発見でき、尚且つ測定のプロセスを中断しなくてもいい点です。   心理生理学の測定装置 心理生理学の測定装置を紹介する前に、感情と感覚の違いを明らかにする必要があります。現在、多くの研究において、感情と感覚は二つの異なる概念であることが指摘されています。感情は主に身体の心理状態を指し、生理のシグナルを通じて測定できるものです。例えば、心拍数の上昇は身体が興奮状態にあると読み解くことができます。そして、感覚は人体が感知した感情の状態を指しています。言い方を変えれば、人体はある種の感情の状態を生む可能性があるものの、自分がその感情の状態にある事を意識できずにいるのです。心理生理学が測るのは主にこの人体の感情です。 現在、心理生理学で主要な評価ツールの幾つかを以下に紹介します。: 1.脳波図装置(Electroencephalogram 略称:EEG) 脳波図は現在、人体の中枢神経を評価するときに最も簡単に使える測定ツールです。これまで使用されてきた機能的磁気共鳴映像装置(略称FMRI)のように被験者を高価な機器に寝かせてから測定が始まるのとは異なり、被験者の頭に電極を装着することで、脳が発する電波を測定します。主要なものはα波(比較的覚醒状態にある事を示す)、β波(比較的緊張状態にある事を示す)、δ波(睡眠状態にある事を示す)及びθ波(α波よりさらにリラックスした状態にある事を示す)などです。   2. 筋電図装置(Electromyography 略称:EMG) 脳波図と同じく、筋電図も電極を通して人体の筋肉の活動を測定します。例えば、筋肉の緊張やリラックス状態です。中でも顔部筋電図は、被験者の測定プロセスにおける顔部の状態を測るのに役立ち、それが表す感情反応を推測することができます。通常、顔部筋電図が測定する箇所は、1.眉部:皺寄せを測定します。ネガティブな感情を表します。2.頬:主に頬骨の部分です。大笑いあるいは驚きを主に表します。3.目の付近:主に嬉しいあるいは楽しい感情を測定します。 3. 皮膚電位計(Electrodermal Activity 略称:EDA) 皮膚電位計は主に皮膚の電流変化を測定します。それは感情反応の指標でもあります。緊張しているときは、交感神経の活動が強くなり、汗腺の分泌も増えるため、皮膚の導電量の増加を測定できます。通常、皮膚電位計は被験者の二本の指に装着されます。心理生理学測定ツールの中で装着が簡単な上にコストが比較的低い測定ツールでもあり、現在ではうそ発見器への応用がよく知られています。   4. 心拍変動測定(Heart

スマートフォンUI設計の原則

今日の携帯電話開発ベンダーは、通常そのウェイトをハードウェアの向上に置き、機能の実践に過度に焦点を置いています。例えばより高速なCPU、より多くのフラッシュメモリなどを追加しますが、ハードウェア自体の操作体験こそそれらのハードウェア機能が実用的か否かの鍵となる、ということは疎かにされがちです。 Iphoneは現在のスマートフォンの中で大きな人気を誇っています。IOSを除く、そのハードウェア機能はどのスマートフォンベンダーでも製造できますが、オペレーティングシステムの親切で直観的なデザインは一般のモバイルデバイスベンダーには真似ができないものです。 ソフトウェア設計の過程で、UIデザインは常に最も疎かにされやすい部分です。しかし、最近ではスマートフォンが雨後の竹の子のように続々と出現しており、設計不良のUIはユーザーに迷惑と抵抗感をもたらし、小さなスクリーンの中でより拡大されて見られてしまいます。 Iphoneの使用経験では、開発者はユーザーの多くがすでにIPhoneが提供するジェスチャーとコンポーネントの定義に慣れていることを知っていなければなりません。反対に携帯電話のソフトウェアへの要求もそれに伴って高くなっています。もしIPhoneで指をスライドさせてページをめくったり、拡大・縮小を行うことができなければ、そのソフトウェアが淘汰される確率は自然と増加します。そのため、開発者は必ずユーザーの角度からユーザーのニーズを理解することが必要となります。ユーザビリティとユーザーのニーズを一つにすることで最高のユーザーエクスペリエンスが創り出せるのです。しかし、ユーザーにマッチするUIはどうやって定義すればよいのでしょうか。ユーザビリティとインタラクティブ性を重視したデザインは、スマートフォンがスムーズにマーケットに進むことができるか否かの重要な鍵となっています。これら設計の細部は具体的に実現することは難しいのですが、必要な作業でもあります。業界の開発者によって開発された製品が、同じエリート分野において潜在ユーザーの使用時に発生する使いやすさの問題が見つからないということを避けるために、実用的なインタラクティブアクションとユーザビリティ設計の製品のUI開発は開発者の大きな学びと疑問として厳然と存在しているのです。 良いUIが注意すべきいくつかの事項 1.ユーザーの操作に対するモチベーションを高める 良いUIはユーザーに適切な刺激を与え、操作してみようというモチベーションを高め、ユーザーが継続して操作する動力となります。訓練されないユーザーはいません。そのため、スマートフォン使用時、ユーザーのほとんどはその頭の中に既定の操作モデルが存在しています。もしユーザーの習慣に従って設計し、ユーザーを刺激できなかった場合、ユーザーはそのソフトウェアを操作しようとする気持ちを失くし、その他の代替製品を探すでしょう。     画面ICONの振動により、自然とユーザーに継続操作のモチベーションを与える。 2.ユーザーの操作簡易性の提供 シンプルなデザインのインターフェースによって、ユーザーが便利に操作できるようにし、直観的な理解を加えることで、ユーザーの操作ミスの可能性を低減します。 3.全体の統一されたインターフェースのデザイン 優れたデザインのユーザーインターフェースは全体性と一致性のメリットが具わっているべきです。インターフェースのデザインアーキテクチャは必ず明確で統一性を具えていなければなりません。スタイルのデザインにおいてもソフトウェアコンテンツとの一致性が必要です。 4.ビジュアルデザインでユーザーに直観的な理解と操作を提供 開発者は一部のユーザーインターフェースにおいて美しいデザインを施しますが、デザインはユーザーの立場を出発点にして考えられなければならないことを疎かにしがちです。そのため、ユーザーにはっきりと分かりやすく、正しく使用してもらうことを最も基本とし、また最も注意すべきこととするべきです。 5.秩序あるインターフェースの配列 インターフェースのデザインは秩序立っているべきです。整ったインターフェースはユーザーがより気軽に使用することができます。 秩序のある配列はユーザーの操作をより気軽なものにする。 6.安全性 ユーザーの選択は単一ではなく自由です。しかもどの選択も可逆性を具えています。これ以外にも、ユーザーが危険な選択をした時には、警告を行うシステムメッセージを提供します。 7.ヒューマナイズされたオプションの提供 ユーザーインターフェースはユーザーが個人の習慣に基づいてインターフェースを設定できることが必要であり、プロフェッショナルなレベルのものと入門クラスの使用システムを具えているべきです。効率の良さとユーザーの満足度はヒューマナイズの程度の高低を示すものです。 以上いくつかのポイントを議論すると、デザインの優れたUIはユーザーに直観性と明確で高度な理解をもたらすだけではなく、更にユーザーをハードウェア自身のシステムの制限を飛び越えさせ、またユーザーにハードウェアのメリットを体験させながら、いささかのマイナスの影響も感じさせません。  

ユーザーと企業を結ぶ-UXデザイン

近年、ユーザーエクスペリエンスデザイン(User Experience design、略称UXデザイン)というキーワードが世界を席巻しています。それと同時に、私たちはユーザーの消費現象が次第に変化し、消費はすでに生理的な要求から心理的な満足に転換していることを発見しました。製品の開発とデザインはもう「機能と外観」を強調するのではなく、ユーザーの体験を強化し、そのうえ企業のDNAとユーザーを繋ぎ合わせなければなりません。     製品の開発とデザイン=企業ニーズ+ユーザーニーズ   1つの優れた製品は企業ニーズとユーザーニーズを結びつけなければなりません。脳科学の角度から見ると、ヒトの脳は2つに分けることができ、左脳(赤い部位)は論理力、右脳(青い部位)は直覚・感受力を代表しています。企業は非常に優れた左脳を持ち、思考・論理・判断力で以て様々なプロジェクトおよびミッションを処理して、企業の利益獲得をサポートします。そして、ユーザーは強烈な右脳を持っており、単純に使いやすく快適を感じることを求め、満足感を得ます。   どんな企業も製品を開発あるいはデザインするときに、よく企業目標とユーザーニーズの間に些細な衝突及びギャップが生じます。それはまさに左脳の理性と右脳の感性が衝突した結果です。如何にその間のギャップを減らし、最良のバランスを見つけるかは、すべての企業がぶつかる問題です。   UXデザインの過程から企業のニーズとユーザーのニーズを知る   IDEOがスペインのBBVA銀行のためにデザインしたATMのケースから、IDEOがどのように企業ニーズとユーザーニーズを結びつけたのかについて分析してみましょう。一味違ったATMのエクスペリエンスを示し、ユーザーがATMを使用するときの「プライバシー、シンプル、カスタマイズ、お金の取り出し、喜び」の全く新しい体験と気分を十分に満足させた上、BBVA銀行の企業経営理念も伝えました。   (1(1)企業の経営理念とサービスについて理解する 「理解」は製品を開発する前の課題です。プロジェクトチームはBusiness Requirementを理解しなければならず、技術・市場の区分・ターゲットの選定などを用いることができます。その後に構造の構築を行い、進捗を計る基準を定めます。 実際にBBVA銀行のもともとのATMデザインを観察し、ATMが提供する機能をまとめた。こんなにたくさんのボタンと注意メッセージを見ると、どう手をつければいいのか分からなくなる。   (2(2)実際にユーザーの使用習慣を観察する 1つの優れた製品はデスクの前に座っているだけで作り出せるものではありません。革新または製品を改善する過程において、エンドユーザーがだれであるかを考え、実際に彼らの使用目的・過程・表情それと気分を観察しなければなりません。私たちはだた「ユーザーの製品機能及び特色に対する満足度」を発掘するのではなく、さらに「ユーザーの製品を使用する本質とエクスペリエンス」をより深く発掘するのです。 デザインチームはスペイン・メキシコ・アメリカのBBVAユーザーがATMを使用する過程を取材した。同時にガソリンスタンドの自動支払装置、スーパーの自動レジ、電車の自動券売システムなどの類似設備を観察した。それは、ユーザーに最も便利で日常経験に適した操作方法を探り出すためだった。   (3(3)デザインのアイデアを出し、絶えず問題を収集・整合する

エモーションからデザインを見る

  ショッピングサイトではどうすれば店に「リピーター」が訪れるのか?YahooショッピングサイトとPChomeショッピングサイトを見ると、Yahooの店舗数が多いのはなぜか?実は、それは感情におけるある種の複雑な関係なのです。人間は感情で物事を考える動物です。この感情が製品とお客さんの関係も繋ぎとめており、店を利用した事のない客でも、商品に帰属意識を持たせることができます。そして、ユーザーのサイトに対する熱中度にも同じような感情のつながりがなければなりません。     エモーション-アクションの反応関係 心理学の点からすれば、感情は身体が外的刺激を受けた際に起きる反応です。逆に言えば、内在の感情が外的刺激を受けて、内在する気持ちが引き起こす生理及び行為における反応です。では、なぜアクション反応というのか。ユーザーのアクション反応において、私たちはユーザーの表情または身振りにより他人に対する感情反応を読み取ることができます。例えば、バットを振り回している選手は、怒り狂ったように殴りかかろうとしているのか、あるいはバッティングしようとしているのかなどです。   刺激 > 認知反応 > 感情反応 > 行為反応 > 反応の結果   Example: 敵に遭遇する > 危険を察知する> 恐怖を感じる> 逃げる > 別の獲物を探す

なにっ!!404エラーページが。さてどうする?

ウェブページやブラウザゲームを表示する際、「ページが見つかりません」(略称404ページ)に悩まされた経験は誰しもあるでしょう。404 Labの統計では、「404ページが表示されたら、どんな気持ちになりますか?」との問いに、39.88%の人が悲しくて声も出ないと答え、36.92%の人は前のページに戻って404ページの存在を忘れると回答しています。この統計データは興味深いものですが、誰もが404ページに悩まされた経験があることを示唆しています。 404エラーページが表示されるのは、ユーザーにページのリンクが無効であること、ページが削除されていること、ユーザーが入力したアドレスが正しくないことを知らせるためです。ウェブデザインのプロセスにおいて、大多数のウェブサイトがデフォルトの404ページを採用しており、404ページをデザインし直すことはありません。デフォルトの404ページのグラフィックやコンテンツでは、ユーザーが次に行う操作がわかりにくくなっています。 実は、404ページのデザインを改善し、直感的で工夫を凝らした方法でユーザーに次のステップを提示することができます。優れた404ページなら、ユーザーが探している情報が手に入りやすくなります。あるいは、その他の便利なソリューションやオプションを提供して、ページが見つからないことによるユーザーの失望や不信を抑えることができます。さらに、ユーザーが自分でサイトのコンテンツを探し出せるよう後押しします。 ここに分類した404ページデザインは、主に「ユーザー同士のやり取りをリンクし、ユーザー情報を正確に提供して、次のステップを提示する」ことをアピールしています。では、デザインの方向性のポイントを簡単に紹介していきましょう。 1.     ユーザーの親近感をキープ サイトの構成では、すべてのページで共通のグラフィックやサイトロゴなどの情報を表示します。これによりユーザーは同一サイトのページを表示していることが簡単にわかります。また、404ページにもそのサイトのグラフィックやサイトロゴなどの情報を取り入れます。なぜなら、ユーザーはサイト内外のいずれから404ページに飛ばされたのか、はっきりしないからです。ユーザーが見慣れたカラーやグラフィック、ロゴであれば、安心感が生まれ、ページを閉じられる恐れがなくなります。 – larknews:このページが表示された理由を面白おかしく説明し、怒りを静める。ただし、larknewsの404ページにはサイトのカラーやグラフィック、ロゴがなく、面白ページを開いたと思われる。 – Spore:sporeゲームの独創性を余すことなくアピール。オリジナルの404モンスターが404エリアに入ったことを知らせてくれる。早く立ち去らねば! 2.     エラー情報をはっきり表示 ユーザーが404ページにジャンプした場合、エラー情報がはっきりと表示されなければなりません。はっきりと表示されるエラー情報は、ユーザーを脅かすものではありません。現在のトラブルを明確に伝え、ユーザー自身に過失があると思わせないようにして、次のステップの実行をサポートします。 – Rockettheme:強烈な色彩と特大サイズの文字で、ユーザーは404ページであることが一目瞭然。また、エラーメッセージで現在の状態を簡単に説明している。 – abduzeedo:宇宙空間の漂流がテーマ。わかりやすいテーマと画像のグラフィック効果に、ユニークなセリフを組み合わせている。「ヒューストン基地、トラブルが発生した!!我々は目的のページにたどり着けない:(」。 – 31three:様々なチョウのグラフィックデザインで、ユーザーの視覚が混乱する。現在の状態について詳しい説明がなく、404ページであることがわかりにくい。 3.     代案をはっきり提示 代案をきちんと提示することは、404ページの設計に大切な要素の一つです。ユーザーが適切に次のステップやリンク先を選べるようにし、「迷子」にならないようにします。代案は数多くの要素で計画と設計ができますが、よく用いられる方法には次のようなものがあります。  ●  メインメニューや検索機能を提供:ユーザーが早く正確に別のページにジャンプできるようにする。  ●

ヒューマン設計センターUX LAB(User Experience Laboratory)新落成

  人の設計によってより良きものに変える便利機器―UX LAB起動! ヒューマン設計センターUX LABが正式に起動したぞ!ユーザーの経験を検討することは、今後、グループ各部署にとって、必ずや助けとなるだろう。ユーザーがセンターのUIデザインコンセプトに溶け込み、グループが作り出す色々なものへの助力となるよう願ってやまない。UX LABとは、どのようなサービスを提供するのか、どのような特色があるのか、ラボの環境はどうなのか、全てみんなのために一つ一つお答えしよう。   UX LABの検討範囲 UX LAB(ユーザー経験ラボ;User Experience Laboratory)はユーザーの体験したことを各検討の起点として、「プロの評価」(Expert Review)、「フォーカスグループディスカッション(ある特定の共通点を持つグループへの取材)」(Focus Group Discussion)や「ユーザーテスト」(Usability test)などを含み、それによりラボを設置したりする。 ゲーム開発から言えば、開発段階にプロ(Expert)がユーザーの観点から、そのゲームのUI設計プロセスの完成度やその内容度を評価するが、プロが開発したものを量産する段階に入る際(内容が完成した時)、プレイヤーを募集して遊んでもらい、各UI設計に対するプレイヤーの反応を収集したりする。   UX LABのサービスはどこが違うのか。 専門的実行と科学的分析、これがUX LABが己に課す約束である。   専門的実行―プロの研究チームによる企画と実行研究

元気を与えるフッターの作り方!!

この文章を語る前に、NOKIAの広告にあった「テクノロジーは常にヒューマニズムから」というフレーズを思い出しました。生命をもたない製品が人と製品の間の感情により設計され、製品にフレンドリーな感覚が瞬時に生み出され、製品やサイトが冷たくなくなります。実際、我々は設計過程において常に斬新な概念、または古臭い手法を用いているわけではありません。そうではなく、一人ひとりの潜在意識に深く入り込んでいるのです。恐らく誰も熱心にフッターを見たことはないと思います。このフッター設計は、よく見逃されたり、重視されない設計項目です。サイトのヘッダーこそがサイト設計における焦点と考えられています。人を惹きつけるヘッダーやコンテンツを製作するために全力を注ぎ込み、従来の版権声明と免責声明のフッターを設計すればいいだろうという考えであれば、このように終わるかもしれません。しかし、ユーザーが最後のフッターまで見たときの事を考えたことがありますか?   フッターはコンテンツを書けるような大きな空間ではありませんが、サイトデザインにおいて、GPS、ツイッター、最新情報といった面白い方法を用いて設計することができます。次に、フッターにおける新しいデザイン例をご紹介します。 VIMEO: Vimeoではとてもクールなフッターを目にすることができます。表示されている情報は少なく、ユーザーがVimeoに参加してくれることを望んでいるだけです。しかし、基本的に主要フッターが存在し、綺麗な挿絵風に表示されています。 Putzengel:美しいライン、各種スタイル、そしてマウスを滑らした時のビジュアル効果により、最後に会社の地図、企業情報と問い合わせ先情報がレイアウトされています。全てがモニターに表示されることにより、全体的に統一感がもたらされています。 Jan Ploch:とてもクールな個人サイトです。フッター設計がサイト全体まで延長され、アルコールのボトルデザインになっており、フッターではラベルで問い合わせ先を表示し、飲み干す効果が加えられ、非常にユニークで、ヘッダーからフッターまでのデザインがはっきりと続いています。 Ok Studios:サイト全体が上下層交差の動画となっており、マウスの動きと連結したビジュアル効果をもつサイトです。ユニークなイラストスタイルを採用しており、フッターには白黒の動物イラストが表示されています。 Adventure World:わくわくする冒険世界の体験で、まず地球からスタートとするシーンをフッターとしており、ボタンをクリックすると画面の上方向にシーンが延長されます。フッターをトップページのコンテンツに使用した非常に特別なサイトで、巧みにフッターを活用してシーンを作り上げています。 Atlantis:1962年に消滅したアトランティス大陸を探索。海洋プレートからカプセルに乗り込み、フッターまで探索します。 The Pixel:もう一つの興味深いブログフッターで、樹木の頭部が下に延び続けます。下に伸び続けると元々は樹木と村落であったことが判明します。 まとめ どのようなフッターデザインであれ、サイトデザイナーの優れたテクニックが強調され、デザイナーの巧みなテクニックを用いてサイトのビジュアルデザインとドッキングされることが望まれています。この文章内で、各種フッターデザインに彼らの創意が表わされています。またフッターはユーザーフレンドリーで、簡単に見つけられるものであるべきです。これらの目的は、驚くべき体験を提供し、ユーザー体験が改善されることだけを願うものです。 サイト上のフッターはすでにシンプルな一部分から、版権情報の承認と付加リンク以外にも、多機能エリアとして広がっています。ここでは、ツイッターの更新といった各種サイトの豊富な機能を確認することができます。         参考データ: http://www.flashuser.net/inspiration/ http://www.flashuser.net/web-design/

インタラクティブデザインで素晴らしい生活を作ろう

休日の午後に、あなたは心地良くカフェのオフホワイトソファにすわっています。優しい日射しがあなたの背中を包み込み、外の緑の蔓を眺め、周りの人々の囁きと笑い声を聞きながら、キュートなジャズ音楽が流れています。そして手に持っている呼び出しの受信機が軽く振動し、あなたは受信機を持ち、カウンターへ向かい、香りで満たされたコーヒーを持って戻ってきます。「お客様、コーヒーができました。」といった店員の叫ぶ声もなく、他の客の注文と間違ったりすることなどの混乱はありませんでした。 手に持っている小さく、そしてあなたをビックリさせた受信機はインタラクティブデザインの一つでした。   インタラクティブデザインとは? 更に簡単な言葉で説明すると、直感、面白さ、イノベーションと有用な方法を使い、人と人、物事、もの、空間の相互作用をデザインし、さらに効果的に使用できるように作るのが、インタラクティブデザインです。 食事をしに行くだけでも、注文を待ち、並び、順番の呼び出し、受付番号札、上述な振動受信機などは全部インタラクティブデザインからの発想で、更により素晴らしいアイデアが見つかるかもしれません。   新しい体験を生み出そう! 実に私達とインタラクティブは最も身近で、最も分かりやすいのは現在一番流行っているモバイルデバイスです:   –キーロックを解除する: 皆が「キーロックを解除する」機能を使ったことがあるだろう!この画面を見て、懐かしいと思いましたか?スマートフォンの時代に入って以来、このようなロックを解除する方法は段々少なくなりました。よく知られている方法ですが、惜しいことに直感ではわからず、使用するには学ばなければならないので、どうやって進化してきたのか見てみましょう。   –スライドしてロック解除: これはロック解除界の一大進歩であったのです。単にキーを押したり、パスワードを入れたりすることなく、スライドだけでロックを解除し、子供でも簡単に使える機能です。   –図形を描くことでロック解除: 人の脳が図形に対する記憶は数字より強いため、図形の記憶は数字より直感的と言えます。これはキーロックとスライドロックを融合した機能で、更に便利になりました。 –図形を描いてロック解除+ビジネスモデル: 図形に沿って描いたらロックの解除ができます!しかも図形認識にビジネスモデルを加えています!     インタラクティブなビジネスのチャンスは無限 我々の生活には、どこにでもインタラクティブなところがあります。バスに乗ること、駐車代を払うこと、朝食を買うこと、ミーティングなどの小さなことから、イベントへの参加、綺麗な街に出ることなどの大きなことまで、世界と相互作用しています。そのままの形に拘らなく、更に試しに素晴らしく面白くしたりして、一緒に今あるものを変化させましょう! –インタラクティブな自動販売機:

「デザインシンキング」 – ユニークなアプリの作り方

  クリスマスが近づき、店にどんな特別な贈り物が並んでいるかと誰もがわくわくする季節です。 クリスマスプレゼントを自分で作れたら、これほど特別な贈り物はないでしょう。 2011年11月にユーザーエクスペリエンスセンターは、参加者がクリスマスを題材にしたアプリを自分でデザインできるイベント《クリスマス・デザインシンキング》を開催しました。 「デザインシンキング」のコンセプトを盛り込んだプレイ方法を次に実例を挙げてご紹介します。     1. デザイナーと受け手になって ロールプレイをしよう!   ロールプレイング(役割演技)は、効率的に対話を生み出し問題を発見するための近道です。2 2人一組でペアを作り、1人がデザイナー、もう1人が受け手になります。     2. デザイナーは耳を傾ける – 日々の暮らしから必需品を見つけ出す 耳を傾けるとは、着手している製品の機能性や外観、色を考え出すということではありません。デザイナーは自分の考えを排除して、相手の言うべきことを真剣に聞かなければならないのです。聞くという行為は常に最も難しいことですが、的確な質問をし、限られた時間で正しい解決法を見つけ出すことにつながっていきます。必要なことをできる限りはっきりと浮き彫りにすることです。私達は「なぜ」と理由を聞く方法により、受け手が期待するものについてインタビューを行いました。そして、彼らのアプリの利用をさらに大きなユーザーコミュニティを映す鏡として捉え、理解を深めていきました。ユーザーの個人的習慣を考慮することも重要なことなのです。 3. デザイナーは整理する – 優先事項をふるい分ける  

図形と記号―インターフェースによる意思伝達と機能の要素

生活のいたる所に様々な記号はあふれており、人種、言語、国を問わず、記号と図案の設計を通じ、人、事物を象徴することによって、容易に迅速かつ有効な認識と意思疎通ができます。インターフェース設計において、記号は機能、ガイド、説明を表し、さらにインターフェースの雰囲気を伝えるのに用いられます。私たちの感覚器官での認識を経て、それが伝えるべき情報をユーザーに即座に認識させます。 記号学(Semiotics)とは、簡単に言えば、記号と記号のシステムとその意義についての研究領域で、主にいかにして記号がより人類に容易に理解されるかを研究するものです。 UIにおいてなぜ図案が記号として簡素化されなければならないのか。 左端の図はそのままを描写した人の顔で、右端は図形化した概念の顔です。UI設計時、通常私たちが一つの機能の考えや概念のポイントを伝える場合、左端の顔は情報が過剰で、私たちが伝えたい機能がブレやすくなってしまいます。 反対に、もし顔のディテールが簡素化されすぎてしまうと円だけになり、正確な情報を伝えることができなくなってしまい、同様にユーザーの困惑を招きます。 Cognition 認知/理解 Confusion困惑 Detail ディテール 記号を設計する際、通常ユーザーを困惑させる図案には、すべてディテールが荒いかもしくは細かすぎる点が見られます。つまり、設計の際にはどのようなディテールの表現がユーザー認識に有効なのかを理解し、そうした図形の記号化を考えることで、正確な情報伝達を実現する必要があります。 記号はいかにして設計されるのか― 記号は、1.代表項(図形デザインのデザイナー)、2.対象(物体そのもの)、3.解釈項(物体の抽象的概念)の3つから構成されます。デザイナーの思考転換を経て、記号が生み出されます。電池の例(以下の図)で見ると、電池はこの3つによって構成され、物体の形を記号に簡素化した後、デザイナーは私たちがよく目にする電池記号を創り出します。 記号学者が考える記号の3分類とは… Icon : 類似した物体を表現した記号。 Index : 記号が物体そのものであるか、物体と実質的に関連するもの。 Symbol : 物体と慣例や規定によって結び付けられている記号。 図形デザインに含まれる重要なポイントとは。 UIの世界で、効果的な図案には一目で認識できるという特質を備えていることが必須ですが、全てのものが必ずしも容易に図示化できるわけではなく、デザイナーによるディテールの調整と抽象化を経る必要があります。また、多くの画像を同一のUIで応用させるという一致性についても考慮しなければなりません。UIの図形を設計する際、以下のいくつかの原則に注意する必要があります…… 即時認識(Immediacy)―効果的な図案は一目で認識できなければならない。 普遍性(generality)─あるものについて普遍的に象徴する、もしくは通俗的に理解される図案である。       一致性(cohesiveness)─図案は通常単独で存在することはまれで、システム全体の視覚的効果を

ユーザーを理解し、スマートな建築家になる

情報があふれるこのインターネット時代に、情報を検索しなければならない場合、まず思いつく手段がインターネットであることは意外ではないでしょう。競争相手がこんなにも多いインターネットの世界で、あなたの提供するサービスに対しユーザーが不満を抱くとすれば、きっとユーザーの忍耐度は1分間にも満たないでしょう。 そのため、どうすればこの情報の大海原の中から、ユーザーにとって直感的かつ効果的な検索方法を提供することができるか、これは非常に重要な課題です! 特にインターネットサイトは大量の情報を提供するサービスなので、スマートな建築家になり、ユーザーの情報検索パターンを理解してインターネットサイトの情報規画に取り組まなければならないのです。   ユーザーの情報検索行動パターン ユーザーがどのような方法で情報検索を行うか理解していますか? 通常ユーザーの行動は閲覧、キーワードを入力して調べる、関連する情報をたどって探す、他の人に質問して回答を得る等のいくつかの手段に限られます。では、検索行動のパターンはどうでしょうか? Step 1 凱さんはbooksを通じてダンテの著書神曲を購入したいと思い、検索エンジンでキーワード「神曲」を入力 Step 2 検索結果一覧から項目に目を通し、その中の著書推薦を調べましたが、まだ目的の本は見つかりません Step 3 もう一度キーワードを「ダンテ神曲」と入力しなおして検索 Step 4 購入したい本が見つかりましたが、その本は売り切れだったので、カスタマーサービスにメールを送信しました ユーザーは繰り返しこの3つの方法で情報検索を行います。これらの方法を通じて複雑多様な行動パターンが形成されます。このような変化に富む情報検索パターンについて、Marcia Bates博士がまとめ、発展させたのが-情報探索理論-いちご摘み理論(Berry-picking Model)です。 上の図が示しているのは、ユーザーが情報を検索する際にまず検索するターゲットとなるもの(Q)があり、次に自らの考え(T)で検索を進め、求めていた内容(documents, information)を見つけ、それから次のターゲットの検索を進めます。Batesはテキストの位置がまるで果樹園のいちごのようであることを発見し、ユーザーが認知する位置において情報が適切に配置されていれば、ユーザーは検索と閲覧の2パターンの動作を繰り返し、情報を十分に得た後離れていきます(E)。  

選択肢が多ければ多いほど良いだろうか?

    画像引用元:http://www.hidabroot.org 現代のウェブサイトはホームページをますます簡素化していく傾向にあるが、豊富な内容を要求され、それぞれウェブサイトの目立つところに自分が推薦する製品や情報を置き、閲覧率を増やし、すべての商品をユーザーに見てもらうことができるが、掲載した物が多ければ多いほど、ユーザーはほしい物をみつけることができず、かえってすぐにウェブサイトを離れる可能性があることに気がつきました。シーナ・アイアンガーが提唱した「ジャム理論」の研究に基づき、テスト結果で多くの選択肢があると、人は最後に何も選ばないと証明されました。(ジャム理論の研究内容)   いかにしてユーザーの必要な物を探しだす手助けをするかは、ウェブサイトにとって重要なことであるが、ユーザーは多くの時間を費やしてホームページを閲覧することはなく、はっきりと目的を持っているユーザーは検索や分類から探し出します。しかし実際には多くのユーザーは目的が曖昧で、ウェブサイトが推薦した商品が、ユーザーの需要に当てはまれば、ユーザーは大海原から針を探し出すような苦労をしなくてよくなります。さらにユーザーが商品を良く知るこができるだけでなく、ウェブサイトへの好感、信頼度が増すことになる。   以下、3つの事例を挙げてみます。いかにして製品を推薦し、ユーザーに選択させるか。     実例一:同じ人気商品を、どのような方法で簡単に選択させることができるだろうか。   A.人気商品  B.  人気商品 数からみると、Bの人気商品の項目は更に多く、ユーザーに選択肢の幅を広げています。もしユーザーのそれぞれの商品対する注目度が同じであれば、選択コストから考えてみると、10から1の選択コストは、3から1の選択のコストよりも更にかかります。多くのユーザーが初めて商品を見たとき、商品をあまりよく理解しておらず、商品のパッケージと名前で評価します。そのため、推薦する時、推薦商品を少なくし、ユーザーが躊躇する時間を短縮し、コストを減らすよう、検討したほうがよいです。     実例ニ:同じようにジャンル別にして推薦する場合、どのような推薦方法がより良いか?   A.ジャンル別推薦 B.ジャンル別推薦 Aのジャンルのテーマははっきりしているが、視覚的に突出したキーポイントがなく、選択肢が多くて、クリックしたいと思わないです。Bの推薦方法は元々のジャンル別テーマを残しているが、階層に分けて一部分を強調し、ページ上で上下層で差別化し、視覚的にはっきりとさせています。このため、ユーザーは簡単に選択することができます。    

情報はこうやって組織する!

もし誰かに突然「8か国連合軍ってどの8か国?」と尋ねられたら、 卒業してから長い年月が流れているあなたはどれだけのことを覚えていますか? 学生時代から遠く離れてしまっていても、多くの人はすぐに答えられると思います。その答えは、 ロシア、ドイツ、フランス、アメリカ、日本、オーストリア、イタリア、イギリスです。 かつて「語呂合わせ」で私たちの「資料の組織」を手助けしてくれた偉大な歴史の先生に感謝しなければなりません。   次の方法で8か国連合軍について改めて復習しましょう! 俄(ロシア)、德(ドイツ)、法(フランス)、美(アメリカ)、日(日本)、奧(オーストリア)、義(イタリア)、英(イギリス) 餓(『俄』と似た発音)、的(『徳』と似た発音)、話(『法』と似た発音)、每(『美』と)、日(『日』)、熬(『奥』と似た発音)、一(『義』と似た発音)、鷹(『英』と似た発音)   「お腹が空いたら毎日鷹を一羽煮る(餓的話每日熬一鷹)」としたら、だいぶ分かりやすくなるのではないでしょうか。  実は情報を組織することの重要性は、全く関係が無いように見える情報を論理的な方法で整理し、構築することによって大脳に情報をより容易に受け入れさせ、吸収させやすくすることができるのです。     ファイブ・ハット・ラック Five Hat Racks ファイブ・ハット・ラックという言葉はTED主席/執行ディレクターWurmanが1989年に提案したものです。「帽子」は情報を表し、「ラック」は組織方法を示します。これは情報の対象が何であるかを問わず、地点、アルファベット、時間、種類、または階層という5種類の方法で全て情報の組織化ができるというものです。     アルファベット(Alphabet) 字典や百科事典などのようにアルファベットの順序をもとに情報を組織することを指します。 アルファベットで組織化された情報は強烈な指示性を持っており、非線形の情報に適用します。通常私たちがカラオケに行くと、アイウエオ順に歌手を探します。電話帳の氏名分類もアルファベットを使った組織法です。 時間(Time) 

顧客を透視する:ユーザーシナリオ法

今日における資本市場の競争は非常に激しく、企業のリーダーたちは自らの店舗が永遠に多くの客を集め、注文商品は早くも消費者から予約完売し、次々と注文を受けることを望んでいます。頭の良い営業担当者は顧客の考えを一目で見抜いて商品の販売に成功し、多くのマージンを稼ぎたいと心から願っています。この時代にビジネスに携わる人なら、顧客が何を考え、何を必要とし、どうすれば顧客に財布の中からお金を出してもらえるかを知りたいと誰もが考えています。今回皆さんにご紹介するのは、顧客の真のニーズを洞察するユーザー研究の方法-ユーザーシナリオ法(Contextual Inquiry)です。   ユーザーシナリオ法はBeyerとHoltzblattが人類学(Anthropology)と民族誌(Ethnography)の方法論に基づいて研究対象の生活の場に対して深く観察し、体験するように発展した研究方法です。今日ではユーザー中心設計UCD(User- Centered Design)において人気があり、また欠かせない技術の一つとなっています。     ユーザーシナリオ法-誰の心の中にも名探偵が一人いる ユーザーシナリオ法は簡単に言うと、自ら優秀な探偵となって目標の人、物、事に対して事細かに観察し、問題のありかを探り、合理的に問題の経緯を推理するというものです。 研究を始める前に、解決しようとする問題が何かを確定しておく必要があります。例えば、革新的なコンシューマーエレクトロニクス商品を設計したいのでしょうか、または全く新しい食べ放題のビジネスモデルを発表したいのでしょうか、それともシルバー世代のための24時間体制電子看護サービスをカスタマイズすることでしょうか?研究するテーマを決めなければ研究対象を選択することができません。そのため、先に設定した主題に基づけば、その研究対象はコンシューマーエレクトロニクス商品マニアのエンジニアであるかもしれないし、食べ放題が好きで美味しいものを食べることを楽しんでいる妙齢の熟女かもしれないし、慢性疾患の処方箋を受取っているおじいちゃんおばあちゃんたちかもしれないのです。その後は思い切りお金をばらまいて研究に参加してくれる取材対象者を各地から幅広く集めるのです。   研究サンプルの募集が終わったら、取材対象者とアポイントをとり、フル装備で研究対象の生活環境に飛び込んで彼らの行動を観察します。ユーザーシナリオ法の目的はユーザーの完全な行為と交流の情報を収集することであり、単に彼らに対する意見や考え方に対して要約的な記録を行うことではありません。そのため、研究者は必ず手元にカメラや録画器具、またはノートなどのツールを用意して、観察したポイントを詳細に記録します。取材対象者が携帯する身の回りの品や環境の中における物品の配置、そして取材対象者のスペース内における行動ルートなどの情報も詳細に観察することを推奨します。   集めたユーザーのデータは非常に膨大であり、雑多です。データを整理する際は洞察した問題を平叙文(statement)の方法で付箋の上に速記して簡略化した後にまとめ作業を行うことを推奨します。もしくは、各ユーザーのデータを読みやすく、流通性の高い行動モデルにグラフィック化(Beyer & Holzblatt, 1998)すれば、開発チームの研究員、デザイナー、エンジニアやPMなどにこれらの豊富で詳細な概要情報が素早く取得並びに消化してもらうことができます。最後に開発チームは数度にわたるブレーンストーミング(Brainstorming)会議を実施して、洞察した現象と問題点についてユーザーの潜在的なニーズと将来における製品、またはサービスのイノベーションの可能性を発掘し、さらに新商品や新たなサービスモデルのプロトタイプに発展させていきます。     ケースのシェア   バンク・オブ・アメリカ(BOA, Bank of

GDC台北サミットでガマニアUXのエネルギーが爆発

Gamania UX Design Center Inspires Game Vision 台湾のゲーム開発者に言わせれば、6月の台北はいつもと違う!ようです。 1988年から開催されている、ゲーム業界最大規模のゲーム技術交流会であるゲーム開発者会議GDC(Game Developer Conference) は26年の歳月を経ました。そして大きな期待のもとついに第1回GDC TAIPIEI SUMMITが開催されたのです! 台北では初の試みとして、アメリカ、ブラジル、オーストラリア、日本、シンガポール、香港、マカオ、中国等12の国と地域から約660名のゲーム開発のプロが集まり、また20名の国内外の講演者が参加し、相互交流が行われました。 以前は出席者としての身分でこの国際サミットに参加していましたが、今年は光栄にもエルゴノミックデザインセンター監督のMichelle がUX Designer莛莛(Ting Ting)及びUI Engineer敏哲(Shawn)を引き連れて、ガマニアの代表としてGDC国際サミットにおいて、ガマニアがいかにしてユーザー中心のデザイン理念をゲームデザインに導入したのかを皆様にお伝えしました。 ユーザーをゲーム産業の中心に取り組み、ゲームの新しい視野を広げる サミットが始まると、Michelleはユーザーを中心にデザインすること、「新世代のユーザーに対話型インターフェースを提供するためのデザインのソリューションとして、ユーザーを中心にしたデザインを取り込んだガマニア製品について」提示しました。 「ユーザーを中心にデザインすること(User-Centered Design)」はソフトウェア産業ではすでに何年も言われていることですが、ゲーム産業ではまだ初歩段階であります。特にこの観念(User-Centered Design)は台湾ゲーム産業においては未知の領域です。しかしガマニアは初めてユーザーを中心にした製品(サービス、インターフェース等を含む)を導入し、ユーザーの全面的な体験(Total

図表やデータはもはや味気ないものではありません 超目を引くInfographics

▲図表化されたアメリカ:各州の特色を各種カラーの組み合わせとイラストで表現し、非常に豊かなビジュアルをもたらしている。     Infographicsとは?   Infographicsとは、Information(情報)とGraphic(グラフィック)が合成された複合語です。簡単に言うと、Infographicsは特定の資料、情報、知識を図で表現したものです。例えば、日常でよく目にする地図、MRTやバスの路線図、新聞上のデータ図、更にはExcel上の各種図表も全てInfographicsです。   元々、Infographicsは雑誌の記事やニュースで多く使用されており、主に事件の成り立ちや発生経過を明確に説明するための一種の手法でした。1970~90年代、英国の雑誌『The Sunday Times』で美術編集を担当していたPeter Sullivanが大量にInfographicsを用いて原稿を編集し、この手法がトレンドとなりました。2000年以降、Infographicsは動画やモーショングラフィックを用いた表現方法に進化し、人々から注目を集めるようになりました。そのため現在、教育においても、技術説明においても、マーケティング戦略やニュース報道においても、Infographicsが深く浸透している方法を目にすることができます。元々は味気ない資料を精彩なものへと整理し、実用的で新鮮且つ面白い図表に解析し、必要とする人に明確に伝達します。   The World of Social Media(ソーシャルメディアの世界)     Mobile Technology(モバイルテクノロジー)       Infographicsの作成方法とは?

FLAT UI DESIGN-平面化インタフェースのデザイン美学

最近、携帯端末の普及により、電車でも、会議中でも、食事中でもテレビを見ていても、スマホやタブレットでネットやゲームをして端末を手放せなくて、我々の生活はもはやこのような携帯端末から離れなくなってきました。それによって、アプリが増え、本物に見せかけたものやシンプルなもの、色んなインタフェーススタイルが現れてきました。その中で、あるデザインスタイルが流行り始め、大量にアプリのインタフェースに使われてきました。それは極シンプルですっきりした単純なデザインで、平面化デザイン(Flat Design)といいます。 平面化デザインとは 簡単に言うと、長年流行っていた斜め、グラデーション、影、艶出しなど、本物に見せかけるビジュアル効果をやめ、もっと平たく見えるインタフェースをデザインすることです。20世紀、建築界がシンプリズムを始めて、平面化デザインスタイルを始めました。「Form follows Funtion」や「Less is More」など当時から有名なスローガンは今でもよく聞きます。ミケランジェロがどうやってダヴィデ像を作ったかを聞かれたときが、「簡単さ。余分な石を削り、必要な部分だけ残したのさ」と答えたように、インタフェースデザインも同じ原理です。 有名な自動温度調節機NESTは、元Apple社、iPodの生み親が作った製品です。そのウェブサイトから製品とそれに関わる応用環境など現実の要素は、平面化デザインのサイトに取り込んでいることが分かります。虚構と現実を融合させることによって、ユーザーがほかのビジュアル要素に邪魔されず、製品に注目することができます。 ▲Metro UI   Metro UIはマイクロソフト社のWindows 8のデザインスタイルで、スイスの平面デザイン原則に基づいたものです。その鮮やかな色使いとすっきりしたレイアウトのインタフェースは平面化デザインに似ていて、インタフェースの材質ではなく、文字などの情報の内容に力を入れています。このシンプルなスタイルでより質感のあるビジュアルを提供できます。 平面化デザインVSスキュアモーフィズム アップル社のインタフェースデザインには、よくスキュアモーフィズムスタイルが使われています。メモ帳からリマインダー、iBookの本棚まで華やかでリアルにみえて、実物にリンクされやすくしていて、ジョブズ氏もこういうスタイルを推進していました。 しかしアップル社の中で別の一派のデザイナーは過度のスキュアモーフィズムが華麗なだけで、機能性がない上、ユーザーを惑わせるだけであり、すべてのインタフェースは機能的に作るべきだと考えています。ジョナサン・アイブ氏もその1人です。最新のiTunesもその方針でよりシンプルに作られています。 デザインの良し悪しを決めるのは美学だけではない 平面化でも、スキュアモーフィズムでも、デザインスタイルを最終的に決めるのは、製品の具体的な働きや、プロセスが完全かどうかや、使用体験などであり、ビジュアルだけの問題ではありません。どのようなスタイルを採用しても、最適なインタフェースデザインになるにはいくつか共通の原則があります: 一致性:一致するデザインモードとビジュアルスタイルがあること。配色やアイコンの大きさ、レイアウトなどを合わせることで、ユーザーがより関連性を作りやすくなり、製品が使いやすくなります。段階化:インタフェースデザインでは、コアな機能を重視し、ほかの操作要素を二次的な位置に置き、インタフェースをシンプルで効率よくすることです。ユーザーにすばやく機能と情報の関係を認識させ、次のステップで何をするのかはっきり認識させることが一番大事なことです。 フィードバック:クリックしたとき、ユーザーにすばやくはっきりとしたビジュアルやアニメや通知音でフィードバックすることで、ユーザーが戸惑うことなくタスクを完了でき、操作後の満足度もあがります。 障害を減らす:どんなビジュアルスタイルでも、インタフェースを簡略化し、目的タスクを完了するのにかかるステップを減らし、操作をスムーズにする必要があります。操作上の障害や余計なステップは複雑さを増し、ユーザーがインタフェースで戸惑うだけです。    

デジタルバーコードが携帯電話をより便利にさせる

最近生活の中でよく見かけるQRコードの応用、今最も流行しているLINEでさえも、QRコードを使っての読み取りが可能です。実際の生活で、私達はQRコードのアイデアに関連したものをすでによく目にしています。QRコードのマーケティングモデルは、私たちの生活やインターネット上にだんだんと浸透してきているのです。QRコードの応用を簡単にお伝えします: QRコードとは? QRコード(Quick Response Code)とは、バーコードの一種で、撮影機能やバーコード解読機能のついたソフトウェアを使うだけで、バーコードの中に保存されているデータを得ることができます。主に、携帯電話の撮影機能と共に使用され、文字情報を提供することによって、キーワードの入力という動作の手間を省きます。現在、QRコードが応用されているのは、観光ガイド、映画チケットの購入、製品情報や名刺などです。 携帯電話の進歩によって、ネットワークサービスの利用も比較的整ってきたため、QRコードの用途はたくさんあります。続いて、QRコードのいくつかの応用例を皆さんに紹介します:   1.LEXUS ALL NEW GS QR CODEインタラクティブ技術の革新 製品が載っている広告上のQRコードを携帯電話でスキャンすると、本物そっくりな3Dのモデルをウェブサイト上で見ることができます。   2.韓国eMart Sunny Sale 一般的なQRコードは、恐らくただスキャンするだけでしょう。韓国eMartは、昼時の売上げを増加させるため、日光を利用して、3Dの太陽照射角度が昼の12:00~1:00の間にしかQRコードをスキャンできないようにしています。このようにして、巧みにネットワークサービスを利用して売上を伸ばしています。     3.ドイツNerdindustries動態のQRコード広告 このドイツの会社では、QRコードの15%の誤り訂正能力を利用して、静態写真を復元させるだけでなく、スキャンによってQRコードを動画に伴って変化させています。    

一つの問題からの始まり

よく人から聞かれるのが「UX Designとは何ですか。」ということです。 この問いに答える前にちょっと説明する必要があります。User Experienceとは、ソフト・ハードウェア、ビジュアルアート、インタラクティブセンサー、行動認知、社交心理、カスタマーサービス等々(まだまだあります)多くの異なる領域に関係する学問なのです。人に関係する活動、デザイン、ビジネス行動、教育、サービスでありさえすればいわゆる「User Experienceユーザー体験」から離れることはできないのです。 ですから私たちはUX Design(ユーザーエクスペリエンスデザイン)はもはや単純な一つの専門分野と定義することはできません。これは提供する当該製品またはサービスに関係する人々(エンジニア、美術スタッフ、企画者、研究者、カスタマーサービス、広報担当者、イベントマーケティングスタッフ、等々)がそれぞれの専門分野で「ユーザーを中心」にした態度で行うそれぞれの仕事の一部なのです。 こう尋ねる人もいるはずです。では、何が「ユーザーを中心とする」ということなのでしょうか。 一番簡単な言い方をすれば、それは「ユーザーの角度から考える」ということになります。 それはどういうことでしょうか。 デザイナーやサービスの提供者として、自分のロジックや便利さで構想したり製品やサービスを提供することは避けられません。私はこれを「自分勝手」なデザインと形容しています。「ユーザーの角度から考える」デザインではないのです。例えばプログラミング作業は、プログラミングのロジックが合理的でわかりやすい使用のフローを犠牲にしてしまっています。または既定のフローの分業(SOP)を順守し、コストを抑えるためにカスタマーサービスはよりヒューマニスティックでオーダーメードしてユーザーの問題を迅速に解決することができなくなっています。 ですから、多くの専門性を持つチームの中では誰もがユーザーエクスペリエンスデザイン(UX Design)の能力をもっていなければ、製品やサービス全体の細部でユーザーの満足度を最大限まで高めることはできません。 ユーザーエクスペリエンスがたいへん多くの異なる分野に展開できるのならば、私たちはどのようにして自らのユーザーエクスペリエンスデザインにおけるKnowHowを育成することができるでしょうか。以下は私が参考に提供するいくつかの方法です。   1. すべては観察から(観察->振り返り->学習) 観察?何を観察するのか? 初めに、他人を観察します。 人があることをどのようにしているかを観察してから(どんなものを使っているか、関係する人や物事、環境とのやり取り)、人の反応がどのようなものかを観察します(喜怒哀楽や困惑、驚き、失望、期待など…)。 生活は大きな実験室です。他人の行動と反応を観察することによって、私たちはあることについて人々がどのようにするか(How they do it)をいうことを理解することができます。どのような環境の下でどのような特別な時間(Where and

新たなiOS 7を語ろう!

先日WWDC 2013で、誰もが期待するAppleのiOS 7がそのベールを脱ぎました。かつての木の材質のフレーム、皮のメモ或いはGame Center内の緑のテーブルなど全てが無くなり、以前常用されていたスキュアモーフィックデザイン(Skeuomorphism)が大幅に減少し、それに取って代わったのが、この二年で次第に主流となってきたフラットデザイン(Flat Design)です。全体の形状、色、アイコンから文字まで、iPhoneの誕生以来最大の変化と言えます。 このような大きな変化には当然二極化の評価が存在し、ある人は、新しいUIはよりシンプルでスタイリッシュ、躍動感があると述べ、またある人は新しいスタイルは女子の憧れのようなスタイルの「乙女心」だと評価しています。どのような評価であれ、人それぞれの美的感覚と持ち味に対する観点は異なり、むしろこの大きな変更の背景にある決定や勇気こそ今回私たちが探る価値のある方向ではないでしょうか。   Why Flat Design? 今回Appleは新しいiOS 7でかつて愛用したスキュアモーフィックデザインを取り去り、フラットデザインスタイルに一新しました。そのバックの魂的人物こそデザイン部門のベテラン副社長Jonathan Iveです。Iveはモダニズムデザインをバックグラウンドとし、シンプルなデザインを好み、Steve Jobsの重用を受け、さらにAppleの大多数の製品に参与し、無数の賞を獲得しました。彼は余計な装飾を取り除き、複雑な機能に秩序を持たせることを主張し、フラットデザインのUIを用いてより内容を明確にし、機能を重視しました。 AppleのiPhoneが発売されたばかりの当時、スマートフォンはまだ普及していませんでした。そのため、UIのデザイン上、Appleはスキュアモーフィックデザインのスタイルを多く採用し、ユーザーにどのようにして触れ、操作するかを教えることを目的とし、人と機械の心の交流を重視しました。現在周囲を見渡せば、みなスマートフォンを使い、ユーザーはUIが人間的かどうか、機能がより多くの問題を解決できるか等…により注目しています。つまり、AppleももうこれらのスキュアモーフィックのUIによる操作や触れ方を示す必要は無く、スマートフォンがあれば、パソコンはいらないということを伝えなければならないのです。 その他、フラットデザインのスタイルが広がるにつれ、Google、Facebook、Pinterest等のブランドも続々とこのタイプのデザインのトレンドに加わり、Appleはモダニズムデザインをリードする先駆けとなり、必然的にこのトレンドに続き、より大きな波を創造し、フラットデザインを現代の主流へと導いています。もちろん、フラットデザインのポイントはやはり無駄を除き、デザインをシンプルに、内容と機能を際立たせ、さらに有意義な点を重視することにあります。Iveの発言のように「デザインの含みは外観だけにとどまらない」のです。 What’s New in iOS 7?   今回全体を大胆にフラットデザインに変更した他、より豊富なバリエーションと鮮やかな配色方式を使用し、天気の動画と効果等の要素を追加。またより精細なHelvetica Ultra Lightのフォントを用いてRetina