「のどが渇いた」というユーザーに何を出す? ユーザーの「欲しい」に惑わされない、本当のインサイトを見つけるUXデザイン・UXリサーチYoshiki Hayama
2013年10月02日 富士通らくらくホンに見る高齢者に使いやすいUIのあり方 Tweet 高齢者にも使いやすい携帯電話といえば、富士通のらくらくホンシリーズが有名だが、総務省のICT超高齢社会構想会議の第4回WGにて、富士通研究所の石垣一司氏が高齢者のICT活用について 富士通(研究所)の取組ご紹介と題し、同社の取り組みの紹介を行っている。 非常に示唆に富んだ良い資料であるので、本エントリでは同資料を引用して、高齢者に使いやすいUIの勘所について考えてみたい。本エントリ内の図表は同資料からの引用である。 加齢に伴う身体機能の低下 加齢に伴い身体能力が低下することは誰もが体感することだが、具体的には次のような形として現れる(高齢者にとってのユーザビリティ)。 視覚機能の低下 老眼による近視力の低下 暗順応の低下 視野の狭まり 短い波長の色(青、緑)の感度低下 聴覚機能の低下 高い周波数帯の
※本サイトは、アフィリエイト広告および広告による収益を得て運営しています。購入により売上の一部が本サイトに還元されることがあります。 2009年10月24日に京都精華大学にて開催された「Assembly hour:「なんのための仕事?」西村佳哲×西堀 晋」に参加してきました。 講師は、リビングワールド代表・働き方研究家の西村佳哲氏と、シンプロダクツ代表で、Appleインダストリアルデザイナーでもある西堀 晋氏の2名で、約3時間という長い時間のセミナーが開催されました。 なお、当日、Twitterで。#AssemblyHourでリアルタイム実況を林信行氏と一緒に行いました。 最初、西村佳哲が、自分の仕事をつくるという話題から入り、組織の中にいた頃を振り返ると、大きな会社の進め方しかしらないなと思ったと回想してました。 そして、柳工業の柳宗理氏に取材に行ったそうで、名作となる「バタフライ・スツ
ややうさんくさい感じのするタイトルですが、ホントの話なんです。 海外のサイトを見ていてたまたま見つけて試してみたところ「このプラグインを使えばデザイナー自身、そしてコーダーのお互いが幸せになれるっ!」と思ったので全力でご紹介したいと思います。 SPECCTRについてごく簡単に説明すると… フォント名やオブジェクトのサイズ、間隔、色などをボタン一つで建築の設計図のようにデザインの仕様を書き出せる というものです。 これまで、デザインからコーディングに取りかかる際に、ボタンのサイズやレイアウト間隔を正確に調べたりするには元データをいちいち開いたりしなければならず、地味ながら非常に手間のかかる作業が必要で、それらを一覧にできる良い方法が無いのが実情でした。 また、デザイナーからコーダーにデータを渡して、いざあがって来た時のレイアウトをみると、ところどころ変わっている部分があったりして、相互の無駄
近年「気持ちよいインタフェースをつくりたい」という要求や、「気持ちよいインターフェースとは何か?」その理由説明が求められてきている。ネット上では、ある製品が出ると、製品のインターフェースやさわり心地を、サクサク感とか、もっさり感、ヌルヌル感と表現する人たちがいる。これは、「気持ちよさ」への注目が高まっていることの表れであるが、実際それが何であるのか、その原理は解明されていない。 今回の記事では、そういった「気持ちよさ」がどこからやってくるのか、道具の透明性・身体性をキーワードに、ものづくりやデザインに必要なこれからの発想を探っていこう。 道具の透明性からはじまるヒューマンインタフェース研究 道具は「透明性」が重要であると言われている。人がある道具を利用しているときに、その道具自体をなるべく意識させず目的に集中できるようにするためだ。例えば、スコップやハンマー、身近なところでは、ハサミやペン
Pick "Illustration" or "Pencil" to create a new iPhone Mockup: Disclaimer: Any creation of a mockup through this website happens at your own risk. Note that your mockups are not protected in any way other than by a non-obvious URL. I can not be held responsible if you create a mockup and your competition figures out how to access it. Mockups can contain user-uploaded images and user-entered text.
無料で資料をダウンロード SEOサービスのご案内 専門のコンサルタントが貴社サイトのご要望・課題整理から施策の立案を行い、検索エンジンからの流入数向上を支援いたします。 無料ダウンロードする >> 世界的なスマホの急速な普及とそれに伴う様々なアプリの登場と共に、モバイルデバイス向けのUIデザインも様々な試行錯誤と進化を続けているようです。今回は、デザインにはこだわりのある人気ITメディアThe Next Webのスタッフが選んだ次世代のモバイルアプリを担う15のUIデザインを紹介します。 — SEO Japan コードを学ぶのと同じように、デザイナーとして上達する一番の方法は、習うより慣れることだ。それでもやはり、優れた作品を称賛して模倣すること(という名の練習)が驚くべき効果を発揮しないというわけではない。何よりも、他のデザイナーが過去にしたことを見ることは、相当な時間の節約になる。なぜ
機能豊富なアプリケーションの開発では、機能仕様の策定にもかなりの時間がかかる。特に、画面にたくさんのボタンが置かれていたり、いくつもの画面を並行して操作できるような、操作性の複雑なアプリケーションになると、ユーザインターフェースの機能仕様をまとめるだけでも、極めて大変な作業となる。 顧客からの要求仕様では、画面のレイアウトと、基本的な操作の手順が示される。開発者は更に、顧客が想定していなかった例外的な操作や、いくつかの機能を組み合わせた複合的な操作をした時の挙動についても、明確に洗い出して、機能仕様としてまとめなくてはならない。 考えうるユーザ操作の組み合わせは膨大な数に上るため、機能仕様の策定には時間がかかる上、思考も混乱しがちだ。たとえあらゆるケースを想定して挙動を定めたつもりでも、矛盾や洩れのある仕様になってしまうことも多い。このような不備は、テストになってから不可思議な動作をするこ
There's a certain amount of terminology used on this site that assumes a level of previous exposure to the roles of a user experience designer (UX designer) and Information Architect (IA). This can be presumptious as many people are getting acquainted with the field of UX design and are searching for simple answers to common, fundamental questions such as 'what is a UX designer?' and 'what are the
デスクトップ・スマートフォン・タブレットの主要なブラウザの古いバージョンから最新版までに対応した、クロスブラウザのチェックに使えるWindows用のソフトウェアを紹介します。 Cross browser testing -BrowseEmAll [ad#ad-2] BrowseEmAllのサポートブラウザ BrowseEmAllの主な特徴 BrowseEmAllの使い方 BrowseEmAllのダウンロード BrowseEmAllのサポートブラウザ デスクトップ 主要ブラウザの最新版に対応。 IE7-9 Firefox3.6-12 Chrome12, 16, 19 Safari4, 5, 5.1 Opera10, 11 スマートフォン・タブレット 横置き・縦置きに対応。 iPhone, iPhone4, iPad, iPad2, iPad3 シミュレーター Android2.2, 2.3,
不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 昨日の「人間中心設計プロセスでの具体的なデザインへの落とし込みの技術に関する理解不足について」の続きとして。 結局、インタラクティブな製品のデザインというのは、きわめてシステム設計的なものだと考えたほうがいいと思っています。製品、利用者を中心に、それが用いられる利用環境も含めた大きなシステムを想定した設計が必要だと捉えたほうがやるべきことが明確になってくるのではないかと思います。 各段階でのアウトプットから見たUIデザインのプロセスきわめて概念的にモデル化してしまえば、作業のステップは各段階で以下のようなアウトプットを作成しながら進むと考えればいいと思います。 コンテキストシナリオペルソナが製品を利用する際のコンテキスト、行動を物語として示したもの要件の定義コンテキストシナ
Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い!情報の正確性は自己責任で判断してください。 フォント指定や行間、約物といった、文字周りのノウハウです。デザインというより技術的なまとめ。SWFObjectとかsIFRといったFlashネタを除けば、Webの文字は全部CSSでできるんだから... コーダこそタイポグラフィを意識すべし。看板みて書体言い当てるとか変態的な域まで達せずとも、原則だけ覚えとけばプロトタイプが様になるんだし。 オールドスタイル数字 アンパサンド(“&”) スモールキャップ ハイフンとダーシ 各種スペース 合字 約物 約物はぶら下げる :beforeと:after 見出しのサイズ 初期フォントサイズ 行間の調整 余白の調節 各国の日付表記
TOP > 「Webサイト改善は図を描きなさい!」 〜 SiteCatalyst達人から教わった分析フレームワーク こんにちは。マーケティング担当の伊藤大地です。 先日、米AdobeでWeb解析ツール「SiteCatalyst」のプロダクトマネージャープログラムマネージャー(初出時、役職を誤って表記しておりました。お詫びし、訂正いたします)を務めていらっしゃる清水誠さんが、一時帰国された折に弊社に遊びに来てくださいました。たっぷり2時間、最新Webマーケティング事情やWeb解析についてお話を伺いした中から、WebのKPI測定・改善サイクルとそのノウハウについて、エッセンスをお伝えしたいと思います。 清水さんが提唱されているWeb改善のフレームワーク「コンセプトダイアグラム」という手法は、主に3つのプロセスから成り立っています。 ユーザー視点でサイトを図解し、コンセプトを明確にする サイトの
Startup Datingでインタビュー連載を始めてみることになりました。さて連載の初回は、2011年に新卒としてクックパッドに入社し、現在UIデザイナーとして活躍する片山育美さん(@monja415)。片山さんが現職に就くまでの道のりや、クックパッドのUIに関する考え方、片山さんが手がけた具体的なUI改善の事例やヒントなどをたっぷりお伝えします。 美術大学で勉強、もともと職人になりたかった もともと絵を描くのが好きだし得意、高校のときから職人になりたいと思っていたと話す片山さん。美術大学に進学し、ファイン系とデザイン系でデザイン系を学ぶことを選択。ファイン系とは、絵画や彫刻などいかにも“アート”というもの。ファイン系が芸術だから、どこか自分の中で完結してしまうところがある。でも、職人って誰かのために技術を使える人なんじゃないか、と。情報デザイン学科を専攻し、サービスデザインやUXと言わ
GUI デザインをする上で考えていることStocker.jp さんのところで [連載]Webデザイン入門(3:光とボタン) というWebデザイン初学者向けの連載が行われているのだけど,それに触発されて「自分だったら (こうする/こうしてる)」というのを実例を持って書いてみる. ここでいう UIデザインは GUI のスタイリングであって,実際にはデザインと呼ぶには領域が挟すぎるのだけど,おそらく多くの人が認識している"デザイン"と呼ぶものに合わせる.実際には DBモデル, API設計, URI設計, CallbackFunction まで実装して,はじめてデザインと呼べるものだと思う サマリー機能について把握すること 機能の記号化(ピクトグラム) ・ そのシルエットのデザイン 「押せそうな」アフォーダンス・「明暗」と「光沢」「質感」を切り離して考える 「押せそうな」アフォーダンス・「明暗」の
知って得する、Webブラウザ上で利用できるグラフィック関連技術。HTMLのような感覚で図形が描画できる「SVG」をハックしよう SVGドキュメントの書き方 本連載では、Webブラウザ上で利用できるグラフィック技術を分かりやすく紹介しています。第2回となる今回のテーマはSVGです。 ご存じの方も多いと思いますが、SVGはXMLをベースにしたベクトルグラフィックスの記述言語です。PNGのような画像フォーマットの1つでもありますが、実際にはXMLを記述したテキストファイルであり、HTMLと同様にJavaScript(DOM API)による制御も行えます。HTMLがタグによって文書の構造を記述するのと同様に、SVGはタグで図形を記述します。 ■ XMLでベクトルグラフィックスを記述するSVG 実はSVGの規格自体はかなり以前から存在したのですが、長らくInternet Explorer(以降IE)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く