説得力がグンと上がる！UIデザインの心理学
オライリーから出ている「ユーザーインターフェースデザインの心理学」から使えそうなものを実例を踏まえピックアップ！これでUIデザイン説明の説得力をあげよう！ 情報は一度にすべて見せるのではなく、そのとき必要なものを段階的に開示させた方がよい。 デザイナーが犯しがちな失敗は一度に大量の情報をユーザーに与えてしまうことです。 情報は一度に大量に与えるのではなく、その時点で必要としている情報だけを与えるほうが様々なニーズに対応することができます。 ユーザーの中には大まかな説明でよい人もいれば、詳細を知りたがっている人もいます。 つまりどういう事？ 情報は一度に見せるのではなく段階的に見せる 重要なのはクリック回数ではない。クリックのたびに必要な情報が手に入るのであればユーザーは喜んでクリックする 誰がいつ何を必要としているかを理解する。各段階で何を必要としているか的確に把握していないと、この手法は
「深津貴之氏に学ぶ、スマホUI/UX講座 〜iOS7についての考察とfladdictデザイン論〜」に参加してきました。 | DevelopersIO
「デザイン = かっこ良くすること」だとは限らない。 デザインとは? 設計 複雑な問題を整理して解決すること わりとエンジニアリングに近い 文章を書く練習をすれば読みやすい文章を掛けるようになるのと同様に、勉強すれば人を困惑させないデザインは作れる。 ヒューマンインターフェースの原則 インターフェース = 接点、境界面、接触面、接合面、仲立ち、橋渡し ヒューマンインターフェース = 人とモノをつなぐもの ヒューマンインターフェースの原則 = アプリがユーザーとコミュニケーションをする時の原則 1.必然性のあるビジュアル 機能と外見が調和しているか？ TPOにあわせた格好をさせる ユーザーとコミュニケーションを取る ドレスコードみたいなもの(例:ゲーム:楽しく、ツール:信頼性ありそうな) 機能に最適な外見を与えることで... 使い方がつたわる。 とっつきやすくなる 2.一貫性 アプリ全体でル
UX/UI
ユーザの主体的経験を指すUXと、ユーザが製品やシステムとインタラクションする場であるUIは、言葉の次元が異なり、同列に議論できるものではない。この併記には、UIデザイナの多くがUXデザイナに変身したということと、UXというキーワードが「流行語」であったということが関係しているというべきだろう。 黒須教授 2014年5月7日 タイトルのようにUX/UIと二つの概念を併記することが流行しているようだ。Googleで検索したところ、なんと719,000件もヒットした。ちょっとそういう流行に疎かった僕は、先日UXに関する講演を行ったときの質疑で、UX/UIについてどう思うかと聞かれ、ん、何のことを聞きたいのだ、と戸惑ってしまった。こうした背景のあることに思い至らなかったのである。 なぜなら、UIはユーザが製品やシステムと相互作用(インタラクション)する場のことであり、UXはユーザの主体的経験のこと
UXの本質について | underconcept
ユーザー体験（ユーザーエクスペリエンス／User Experience: UX）という言葉が広く聞かれるようになってきた。半ばバズワードのように、特にウェブデザインやマーケティングの記事などの中では、この言葉を見ない日はない。しかしながら、多くの場合、UXという言葉の真意や可能性を取り違えてしまっている。本稿では、いくつかの観点からUXの本質を考えてみる。 １．UI/UXという誤用 1.1. UIとUX まず、多くの記事や講演などで見られる「UI/UX」という表現からとりあげてみたい。 UI/UXとは、もちろん、User Interface / User Experience（ユーザーインターフェイス／ユーザーエクスペリエンス）の省略形であるが、多くの記事などで「すぐれたUI/UXデザイン事例」、「UI/UX講座」などの表現が用いられている。 「ユーザー」という共通項があるため、共通でくく
ユーザーインターフェースの質を高める手法「ユーザーはヨッパライ法」とは
PCを操作するキーボードやタッチパネル、自動車を運転する時のハンドルやペダル類、あるいはウェブページの操作画面など、ユーザーが何かを操作したり情報をやりとりする際に触れる部分は総称してユーザインタフェース(UI)と呼ばれており、その仕上がり具合によっては製品の評価が大きく左右されることもあります。製品企画をおこなう際には重要な項目の1つとなっているUI設計ですが、特にウェブサイトにおけるUI品質を高めるための手法がYouTubeで公開されています。 The User is Drunk - YouTube 優れたユーザーインターフェースデザインの手法について語るのはウィル・デイブルさん。オーストラリア・メルボルンのウェブコンサルタント企業であるSquareweaveを率いる1人です。 デイブルさんが唱える手法とは、「ユーザーはお酒に酔っ払っている」と仮定してインターフェースを設計する「The
Shunter.jp - フィッツの法則を携帯のインターフェースデザインに適応する
フィッツの法則を携帯のインターフェースデザインに適応する: Fitts’ Law is an essential principle of Human-Computer Interaction theory that was formulated almost 60 years ago. It’s critical to UX design for the desktop and laptop, but with interaction techniques being vastly different on mobile devices can we still use it the same way? We’ll look at what Fitts’ Law consists of and how it is applied to design on mobile devices.
facebookの"Building Paper"はすべてのiOSエンジニアが見るべき
huin Job : Software Engineer(iOS, Android) Use : Objective-C, Swift, Java Like : Gadget, Apple, Photography, Art, Design, UI, UX More posts by huin. 日本のAppStoreでは未だ公開されていないfacebookの「Paper」ですが、 そのUIは実験的ながらも非常に高い完成度で個人的にはすごく好きなアプリです。 良いアプリがあれば "どうやって作っているのか" が気になるのがイチiOSエンジニアの性なんですが、facebook自体がPaperの裏側について説明した動画をしていて、非常に良い内容だったので紹介します。 なんのイベントなのかはよくわかってないのですが、 公開日は4/18なので比較的最近だと思います。 当然英語なので理解は浅いのです
おかんでもわかるわかるUXデザイン Version 0.2 CSS Nite Edition - ネコメシCEOブログ
2014年4月26日開催のCSS Nite LP33の再演版で登壇して参りました。僕はLP33に出てませんので、再演版なのに再演ではないという按配。それと、再演でもないのになんで出てんのっていうと、ネットイヤー坂本くんが急きょ登壇中止となったので代わりに出てくれないかという打診がありまして、準備期間が短いけれども、本ブログでもすでに公開済みの「おかんでもわかるUXデザイン」であればいけるだろうと快諾した次第でありました。 先日公開しました「おかんでもわかるUXデザイン Ver.0.1」は、スライドシェアにて15,000viewsを超える参照数を頂いておりまして、正直、CSS Nite来る人とかもう全員見てんだろう、と思っておりました。なのでただでさえ再演じゃないのに、内容もみんな知ってるみたいな前提を思っていて、本当に心折れそうな按配だったのですが……、アンケート的には「ま、いんじゃねえの
縦持ちと横持ちで変わる操作感＆本格3Dゲームもこなす新型UIを搭載。アエリアのスマートフォン向け新作タイトル「Klee〜月ノ雫舞う街より〜」プレイレポート
縦持ちと横持ちで変わる操作感＆本格3Dゲームもこなす新型UIを搭載。アエリアのスマートフォン向け新作タイトル「Klee〜月ノ雫舞う街より〜」プレイレポート ライター：丹治正行 アエリアは，スマートフォン向け新作タイトル「Klee〜月ノ雫舞う街より〜」（以下，Klee）を，2014年4月15日に正式リリースした。 本作は，スマートフォン向けタイトルとしては出色の出来のグラフィックスでリリース前から話題になっていたオンラインRPGで，アエリアとネイロの共同開発となっている。なお，プロデューサーは「シェンムー」や「スペースチャンネル5 パート2」「メテオス」といった名作タイトルの開発に携わったことで知られるネイロ平井武史氏だ。 PC向けオンラインゲームだけでなく，多数のスマートフォン向けタイトルの企画開発や販売を行っているアエリアと，「orgarhythm（オルガリズム）」をはじめとする個性的な
iOS&Androidアプリのデザインをする人に知っておいてもらいたいこと - Qiita
知り合いのデザイナーさんから「iOS&Androidアプリをデザインする時に何か知っておくべき事ってありますか？」と質問を受けたので、思い浮かんだ事をずらっと書いてみました。他にも何かありましたらコメントお願いします！ツッコミも歓迎(´ﾛ｀) モバイルアプリデザインの原則とiOS 量が少し多いが、公式のiOSヒューマンインターフェイス ガイドラインは必読。(※ダウンロードに時間かかるので注意) iOSだけに限らず、モバイルアプリのデザインをするにあたって重要な事がまとまっている。 載っていること ヒューマンインターフェイスの原則 アプリケーション設計戦略 iOSテクノロジーの使用に関するガイドライン 標準で用意されている各UI要素(タブやツールバー等)の使い方 マルチスクリーン対応 どのような違いがあるのかを把握する 画面密度(ppi)や画面サイズなど 参考：iPhone, iPod to
ソシオメディア | あるとよい機能はない方がよい
UXデザインのコンサルティングではよく品質優先度マッピングというものを行います。これは開発プロジェクトの上流工程において、実装を検討している機能をリストアップし、そのひとつひとつについて想定する利用者の割合や利用頻度の観点からグルーピングし、実装の優先度を決める作業です。 これを行う目的は、UIをできるだけシンプルに保つことにあります。ユーザーが求める機能をすべて盛り込むと、当然UIは複雑になり、誰にとっても使いにくいものになります。また蓋然性のバランスが取れていない要件はプログラムを複雑にし、バグが増える原因になります。 UIデザインにおけるパレートの法則（結果の大部分は全体の一部によって生み出される）は、「ユーザーの80%は全機能の20%しか使わない」というものです。その20%に注力し他の優先度を下げることで、製品の利便性は向上するはずです。 Core, Important, Nice
レスポンシブWebデザインで成功するUI／UXのポイント5つ - ECサイト構築運営に役立つ情報発信｜モバイルファーストマーケティングラボ
レスポンシブWebデザインでサイト構築をする際に、今までのWeb構築で「当たり前」や「こうすべき」と思っていた感覚とは少し異なった設計でサイトを構築しなければなりません。 これまでのWebにおけるUI／UX これまで、PCのブラウザをメインにネットをする層が中心だった時代では、マウス操作が基本になっていました。 当たり前ですが画面上のマウスを操作して、クリックをしたり、ドラッグ・アンド・ドロップで対象を動かしたりする動作がメインになります。 UI／UXで言えば、ボタンをクリックするにしても、マウスでカーソルを移動させればボタンの色が変わったり、カーソルの矢印が人の指に変わったりするマウスオーバーアクションと言われるものです。 テキストリンクであれば、カーソルを対象に持って行くと、テキスト下線が消え、カラーが変わるなどの変化が当たり前になっていました。すべてはマウスでの移動させることが中心に
早すぎたHyperCardの上昇と下降、そしてモバイルから来たカードの群 - WirelessWire News（ワイヤレスワイヤーニュース）
先週は World Wide Web が誕生して25年というのが話題になりましたが、今回はその話ではなく、2年前に誕生25周年を迎えている HyperCard というソフトウェアについて書きたいと思います。 HyperCard は、初代 Macintosh の開発者の一人にして、かのドナルド・クヌースに「この世で書かれた最高のプログラム」と言わしめた MacPaint の作者であるビル・アトキンソンが作り上げたマルチメディアオーサリングソフトウェアです。 HyperCard は内蔵する HyperTalk というスクリプト言語を利用することで、カードを積み重ねる形で簡単にアプリケーション（スタックと呼ばれた）を作ることができました。名作アドベンチャーゲーム『MYSY』も最初は HyperCard を使って制作されたことが知られています。当初 Macintosh に標準添付されたこともあり、
ECサイトのUXデザイントレンド： 追随すべきもの3つと敬遠すべきもの3つ
最新のeコマース調査で明らかになったのは、商品画像が大きくなり、レビューが充実して、割引が使いやすくなるなど、ショッピングサイトのユーザーエクスペリエンスが改善したということである。しかし、新しいデザインは、商品情報の非表示、サイトからの貧弱なフィードバック、カスタマーサービスエリアの情報過密といった問題も抱えている。 Ecommerce UX: 3 Design Trends to Follow and 3 to Avoid by Amy Schade on January 26, 2014 日本語版2014年3月11日公開 最近、eコマースユーザーエクスペリエンスレポートのシリーズをアップデートしているのだが、デザインの改善が見られることに我々は勇気づけられている。その一方、従来からの問題がまだ残っていることや、新たな問題も出てきていることにはがっかりした。 前回のeコマース調査の結果
UIにおける無限と有限
ソフトウェアデザインの世界に「Zero One Infinity」という言葉がある。プログラマーにとっては三つの数字しか存在しない。0か1か無限だ。これはソフトウェアを設計する際の基本的なルールであり、美学である。 あるエンティティのインスタンスが存在しうる数は、0か1か無限であるべきである。 例えばファイルディレクトリーを設計する場合、ルートディレクトリーは0個の親ディレクトリーを持つ。各サブディレクトリーは必ず1つの親ディレクトリーを持つ。そして各ディレクトリーは無限個の子ディレクトリーを持てる。（http://en.wikipedia.org/wiki/Zero_one_infinity_rule） アランクーパーの本にはこういうことも書いてある。コインを100万回投げて、99万9999回は表が出て、1回だけしか裏が出ない場合、普通の人にとってこのコインは「いつも表が出る」と言えるが
webデザインの賞味期限(もしくは技術的負債の話)
「技術的負債」という話が、はてな村大字テクノロジー周辺を賑わせている。 技術的負債という(非エンジニアにとっての)隠しパラメータが生産性100倍を起こす- mizchi’s blog 出来る人からみたら超絶無駄なレビューとテストの存在意義 – novtan別館 プログラマの生産性と報酬 – アスペ日記 あたりがにぎわっているエリアだろうか。 私はエンジニアではないから全ての話の理解はできないんだけど。『見えづらい技術的負債が発生し積み重なった結果、誰かが尻ぬぐいをしている』という状況はwebデザイン、特にUIデザインの現場でも同じだなーと思ってる。 糞コードならぬ糞UIデザイン。webディレクター、webデザイナー、コーダー、フロントエンジニア皆が想定しえない余計な工数をとられてしまうUIデザイン。そしてえてして「なんでそんなに工数かかるの？」と言われ、挙句ちゃんと状況説明を上司に怠ると「
The Dribbblisation of Design | en.ja Article
CreditThis article is translated with permission of Paul Adams. You can find original article at The Dribbblisation of Design.本記事はPaul Adams氏の了承を得て翻訳された記事です。 原文はThe Dribbblisation of Designにて掲載されています。 これらの天気アプリのうち1つだけが本質的な問題の解決をしようとしている。 プロダクト/インタラクションデザインコミュニティでは分岐が起ころうとしている。Ryan Singer氏やJulie Zhuo氏が書くような素晴らしい記事達が我々の生み出すものをよりよくし続けている一方で、多くの人がDribbbleに自身の作品を投稿し、議論をしている。それらを集約した結果は我々の生み出すものを後退させて
モバイルサイトのナビゲーションメニューは画面下に置くべき
2014年2月19日 スマートフォン, ユーザビリティ スマートフォンを使ってWebサイトを閲覧する人、どんどん増えてきています。モバイルブラウザーのシェアを見ても、そのユーザー数は無視できないものとなっています。サイトによってはデスクトップで閲覧する層より多いところもあるかもしれませんね。私がWebサイトの制作依頼を受けた際、モバイル対応は必須としてきましたが、モバイルユーザビリティについて再考してみたので、今回はナビゲーションメニューについて簡単に記事にしてみます。 ↑私が10年以上利用している会計ソフト！ よく見かけるWebサイトのナビゲーションメニュー 人気Webサイトギャラリー「The Best Designs」に掲載されている多くのWebサイトはメニューアイコンをロゴとともに画面上部に掲載しているのをよく見かけます。よく見かけるからと言ってこの場所に設置するのが本当に使いやすい
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ggsoku.com
Android Pattern Cookbook で見るトレンドの変遷
