カスタマージャーニーマップとは、ウェブサイトやサービスを利用する顧客がどのようなプロセスで、どのようなタッチポイントをもって、どのような感情と思考をもってどのような体験をするのかを1枚絵のように視覚化したものです。その名の通り、「顧客（カスタマー）の旅（ジャーニー）をしるした地図（マップ）」です。 メジャーな手法ですので、ここで詳細な説明は行いませんが、ユーザーの感情や行動が全体像として図解されていることや、図解ゆえに関係者が集まって議論しやすいなどの利点があるため、サービス企画やウェブサイト制作時によく使われる手法です。 私たちギルドワークスでもユーザーの動きを見立てる方法として、カスタマージャーニーマップを利用しています。 ユーザーストーリーマッピング、サービスブループリントなども利用していますが、カスタマージャーニーマップはユーザーの感情や思考やモチベーションも関連させられるところが
UIデザインを考えるうえで、その時々のトレンドを考慮することは不可欠です。しかし、ただ単に「トレンドだから」「今風になるから」という理由でトレンドを取り入れても、本当の意味で「良いデザイン」になることはありません。ここでは、UIデザインのトレンドの歴史から、技術的背景とUIデザインの関わり方を学びつつ、トレンドの正しい取り入れ方について解説していきます。 UIデザインの歴史 人がコンピューターを操作するためのユーザーインターフェース（以下、UI）は、テープやカードに打ち込まれた信号からコンピューターに出力させる、バッチインターフェースから始まりました。やがてより人が扱いやすいように、テキストを入力するコマンドラインインターフェースへと進化し、グラフィック性能の向上に伴い、1980年代以降はグラフィカルユーザーインターフェース（以下、GUI）が主流となっていきました。 1964年に登場したI
Original：HAS VISUAL DESIGN FALLEN FLAT? （2015-01-20）by Emmet Connolly 2013年から2014年の劇的なUIフラット化により無数のピクセルが流れ落ちていった それはビジュアルデザインにおいて非常に大きな変化だった。Microsoftの急進的でモダンなMetro UIはその前兆だった。iOS7のリリースよって大衆化し、UIのトレンドは2極化した。Google Material Designによって、おおかた完成した。 フラットデザイン（未完成であるけれど便利な表現）はスキューモーフィズム（同前）を駆逐するだけでなく、それの墓の上で踊り、すべてのべべル、影、墓石のテクスチャさえ消し去ってしまった。 上図のようなデザインである。 発展、変化、流行は避けられないものだ。このような最新スタイルもまた、いつの日か廃れていくだろう。未来
スマートフォンやタブレット端末といった、いわゆる「スマートデバイス」を意識したWebサイト制作はもはや常識となっている。各企業のWebサイトは、次のような方法でスマートデバイスに対応していることがほとんどだろう。 スマートフォン向け専用サイトを構築する レスポンシブWebデザインで Webサイトを構築する viewportを調整する Web Professionalでは、2011年2月、有名企業のWebサイトがスマートフォンにどのように対応しているかを紹介した。 これらのサイトは、2年経ってどのような変化を遂げたのか。本記事では、取り上げたサイトに再び訪れ、サイトデザインのトレンドがどう移り変わったのかを観察。日本のスマホサイトの「BEFORE & AFTER」を紹介しよう。 半数以上のサイトがリニューアル まず、調査したサイト数に対してリニューアルしたサイトと、大きくは変化していないサイ
アウトラインの役割 リンクなどにフォーカスした時、アウトライン(外郭線)が表示されるのですが、このアウトラインにはどんな役割があるかご存知ですか？ アウトラインの役割を知らずに「何？この点線！じゃま」とCSSでoutline: none;と設定しアウトラインを消されているかたがいらっしゃると思うのですが、アウトラインが表示されないとキーボードのみで操作しているかたが自分が今どの位置にいるのかわからなくなってしまうんです。 リンクフォーカス時アウトラインが表示されないサイト リンクフォーカス時にアウトラインが表示されないサイトがありましたので(ボタンフォーカス時にはアウトラインが表示されます)、アウトラインが表示されない状態で目的のページに辿り着けるか、また辿り着くのにどれだけ時間がかかり大変か体験してみましょう。私達はこのサイトの商品を購入したいとします。無事、目的の商品詳細ページまで辿り
twitter facebook hatena google pocket 先日デザインリニューアルをしましたが、これには下記のような目標がありました。 ・コンテンツを見やすくする ・余計な情報の削除 ・表示速度の向上 ・気分 要はシンプルにして、コンテンツをより見ていただけるようにしたということです。 ついでなので、Webサイトのリニューアルはどうあるべきか、考えてみました。 参照元：An Exploration of Website Redesigns: Tips and Examples sponsors 【目次】 1）なぜリニューアルをするのか 2）目標設定をする 3）実例 4）参考サイトリスト 5）まとめ （1）なぜリニューアルをするのか ウェブデザインを変更するためには費用と時間がかかります。 社長に言われたからや、担当が自分になったし好きなように変えたるぞ！などということは、
今まで気づかずにいたが、Appleはスマホ(スマートフォン)向けサイトを作っていない。それは何故か。 予算がないとか、(どこぞのメーカーと違って)ウェブデザインや自社製品についての理解度が低いとか、おそらくそういったネガティブな理由ではない。Appleのウェブサイトには、自社のプロダクトデザインに通じる主張が表現されている。 Mobile Safari のUIデザインの本質を垣間見るウェブデザイン 自社のプロダクト(ここでは特にMobile Safari)のUIデザインが、何を理想として、どう調整されてきたのか、このサイトのデザインから読み取ることができる。 Appleのウェブサイトの裏側をちょっとだけ覗いてみると、viewport に width=1024 が記述されている。これは、iPhoneの小さな画面でも1024px分の幅があるものと仮想してレンダリングされるようにする、呪文のよう
2011年 UI/UX トレンドという記事で、モバイルWebデザインのノウハウがデスクトップにも影響し始めているという指摘をしました。Mac OSX Lion や Windows 8 のような OS だけでなく、Web サイトにも変化が見られています。スクリーンの大きさを活用してモバイル環境では再現が難しいダイナミックで動きが多いレイアウトも出て来ている一方、モバイルアプリの血を受け継いだかのような目的にフォーカスしやすく、目的までのステップと選択肢が少ない Web サイト / アプリケーションも次々と出て来ています。 今後デスクトップOS がモバイルOSのようになり、利用者がシンプルな操作と体験を求めやすい環境になれば、Web サイトも次第にシンプルになる可能性がありますし、そうしなければならない状況も出てくるでしょう。デバイスが変わっても同じような体験を作ることが必要になれば、デスクト
タブレットやスマートフォンで積極的に導入されているマルチタッチテクノロジー。デジタルなオブジェクトに触れているような感覚が味わえるタッチインターフェイスは、抽象的なマウス操作に比べて直感的だと言われています。スクリーンに触れるだけの動作は直感的で簡単そうですが、これにジェスチャーが加わることで突然ややこしくなる場合があります。感覚的・直感的というよりかは、操作を覚えなくてはならない負荷がかかる可能性もあります。 未来のインターフェイスを語る上でよく出て来るのが映画『マイノリティ・リポート』。この映画に登場するマルチタッチ UI の技術は一般化されつつあるといっても過言ではありませんが、大きく腕を振りかざし、長時間立ち続けなければならないのであれば、すぐに疲れてしまいそうです。トム・クルーズ並みの強靭な身体でないと使えない・・・なんてことになると困りますね。 例えば Mac OSX とその上
シーネットネットワークスジャパンは9月29日、builderとしては2回目のイベントとなる「builder tech day」を開催した。今回は「User Interface & beyond」をテーマに、ソシオメディア、マイクロソフト、アドビシステムズ、カールのスピーカーが登壇し、ユーザーインタフェースの現在と未来について講演した。 本稿では、ソシオメディア取締役である上野学氏の基調講演「ユーザーにとってはUIがすべて」を紹介しよう。 トイレにひそむUIのヒント 講演の冒頭、上野氏は米国の著名なデザイン・コンサルティング・ファーム、Adaptive Pathに2008年まで在籍していたDan Saffer氏と対話した際のエピソードを披露。 Saffer氏が「トイレにはユーザー・インタフェース・デザインの様々なヒントがある」と話していたことを紹介し、下の画像を示した。 上野氏は赤色の注意書
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
