最近、SNSやネットニュースで「ダークパターン」という言葉をよく見るようになりました。ダークパターンは、消費者が気付かないうちに不利な判断や意思決定をしてしまうように誘導するデザインのこと。Webサイトやアプリなどにみられます。 ユーザーをだますWebデザインは、20年以上前からありました。例えばリンクを1回クリックしただけで入会処理が完了し、高額な料金を請求される「ワンクリック詐欺」の手口などが有名です。 また2000年代は多くのWebサイトやサービスが登場する時代でした。そんな中、事業者が意図して、あるいは意図せずとも消費者に不利益をもたらすデザインが大量に生まれます。それらを類型化し「ダークパターン」という概念で世の中に警鐘を鳴らしたのが、英国のUXデザイナー、ハリー・ブリヌル氏でした。2010年のことです。 ブリヌル氏は、ダークパターンを「偽装広告」や「比較防止」など16に類型化し
"Reading Gravity（読書重力）は、ユーザーの視線が左上から右下へと自然に引きずり落とされる力学である。インターフェースの設計者は、この重力に抗うのではなく、重力が最も溜まる『底』に何を置くべきかを思考しなければならない。" — Edward C. Arnold (Gutenberg Diagramの提唱において)人間（特に西洋的なテキスト文化圏のユーザー）の視線は、Gutenberg Diagram（グーテンベルク・ダイアグラム）やNielsen Norman GroupのF-Shaped Patternが示す通り、左上から始まり、右下へと向かって流れるそうです。 その視線の動きに合わせて、UIのレイアウト・配置をデザインするにあたって、より助けになるような考え方を自分の言葉で表現しようと思いました。表題のとおり、風と重力で例えます。 左から右への「風」は、時間の経過や、コン
初めに 今回は、特定の技術に関する内容ではなく、行動経済学から得られる知見をどのようにプロダクトやアプリケーションに活かせるかを考えていきます。 したがって、今回は「Tech」カテゴリとしてではなく、「Idea」カテゴリとして公開しています。 目的 この記事で行動経済学について少しでも知ってもらい、プロダクト開発に活かしたり、現行のサービスを別の視点から見たりするきっかけになれば嬉しいです。 「実際のプロダクトではこの実装の方がいい」といったような意見も是非寄せていただけると嬉しいです。 行動経済学とは まず初めに「行動経済学」について引用を用いながら述べます。 コトバンクから以下を引用します。 行動経済学は，経済学と心理学が融合した経済学の新領域であり，2002年にノーベル経済学賞を受賞した心理学者のカーネマンKahneman,D.，同じく心理学者のトベルスキーTversky,A.，そし
うそのカウントダウンタイマーや、在庫が少ない、需要が高いなどの表示。 画像では、カウントダウンタイマーや「今だけ」の表示で焦らせて「今買わなければ」という気持ちに追い込んでいます。 今回私たちは、企業の間ではダークパターンがどのように認識されていて、どのような対策を取っているのか、現状を把握するために独自にアンケート調査を行いました。 調査は、武蔵野美術大学の長谷川敦士教授の監修のもとで行い、ダークパターンが使用されることの多い6つのジャンル（ネットショッピング、旅行予約サービス、飲食店予約サービス、動画配信サービス、音楽配信サービス、電子コミック配信サービス）について、利用者の多い5つのサービス、あわせて30のサービスを対象にしました（利用者数については、ニールセンとICT総研の調査を元にしています）。このうち、16のサービスの運営企業から回答がありました（回答率は53％）。 回答した企
特に第4回が面白い！ 続きも楽しみです。 プロトタイピングとユーザビリティテストで「UXデザイン」を練りあげよう！ | UXデザイン基礎セミナー 第4回 from Yoshiki Hayama www.slideshare.net 親しみやすいネタをちりばめつつも極めて実践的な内容になってます。 figmaを使ってユーザーインタビューからテストまでを組み立てる過程を教えてくれています。 この際に、コミュニケーションにおいて陥りがちな落とし穴も」しっかり見せてくれます。 ですよねー。 そうか、figmaってこういう感じで使えるのか…… そして、いくつかのステップを経て、このようにサービスの「強み」を作りこんでいき さらにユーザーテストで問題点を見出していく過程も説明してくれています。 途中胃が痛くなりそうな描写もありますが、すっごい楽しそう！ っていうかこのスライドで紹介されてるLangak
ダークパターンとは、WebサイトやスマホアプリのUIをユーザーに惑わせるデザインにし、ユーザーの個人情報や時間やお金をかすめ取る手法です。 たとえば、知らない間にメール配信が登録されていたり、料金に手数料が加えられていたり、登録は簡単なのに退会が難しかったり、キャンセルがクリックしにくいようにデザインされてたり、さまざまなダークパターンが存在します。 最近のダークパターンをはじめ、さまざまなダークパターンを反面教師として学び、制作側として気をつけたいポイントが解説されたデザイン書を紹介します。 ユーザーとして騙されないように知識を増やしておくのにも有用です。 著者は「UXライティングの教科書（紹介記事）」や「ザ・マイクロコピー（紹介記事」などでお馴染みの仲野 佑希氏。これまではライティング主体の解説書を紹介してきましたが、本書はダークパターンの解説書です。デザインによるダークパターンだけで
社内メンバー全員が、ユーザーエクスペリエンスをざっくり理解するための資料。（注: 以下は、ざっくり最速で基礎知識を説明するものです。厳密な定義は、ちゃんとした資料をご覧ください）。 5秒でわかる雑なUXモデルまず「だいたいあってる、ざっくりした概念図」を出します。 美味しいすき焼きを、お箸で食べて、ニッコリ「すき焼き（コンテンツ）を、お箸（インターフェース）で、食べたら美味しかった（エクスペリエンス）！」 シンプルに示せば、UXとはこれだけです。（注）ここのコンテンツはモノ、サービス、概念なども含みます。 そして「よいエクスペリエンス（雑）」とは、「ユーザーの精神活動をポジティヴにしていくこと」の積み重ねです。 ユーザーの精神が、左から右にシフトしたら、だいたいよいエクスペリエンスもうちょっと広げると、生活や人生をいい感じにすることも含みます。肉体的な変化とか、スキルアップとか…専門家に細
挨拶内海「どうもお願いします。ありがとうございます。今、NFTアートをいただきましたけどもね。ありがとうございます。こんなんなんぼあってもいいですからね」 駒場「いきなりなんですけどね、うちのおかんがね、好きなIT用語があるらしいんやけど」 内海「そうなんや」 駒場「その名前を忘れたらしいねん」 内海「IT用語の名前忘れてまうってどうなってんねん。あれやろ、IT用語ゆうたらどうせ、デザイン思考か、アジャイル開発か、リーンスタートアップやろ！」 駒場「俺もそう思ったんやけどちゃうらしくてな、いろいろ聞くんやけど、全然わからへんねん」 内海「そうなん？」 駒場「うん」 内海「ほんだら俺がね、おかんの好きなIT用語、一緒に考えてあげるから、どんな特徴言うてたかとか教えてみてよ」 定義駒場「おかんが言うには、製品やサービスとの関わりを通じて利用者が得る体験及びその印象の総体やって言うてた」 内海「
iOS 15ベータ版で大不評のSafariのアレ、Appleが修正へ2021.08.20 07:0043,324 Victoria Song - Gizmodo US ［原文］ （ そうこ ） ナイスフィードバック！ ソフト正式版リリース前にやってくるベータ版。いろんな人に使ってもらって、意見を募るという大切な役割をもつベータ版。AppleのiOS 15のメインアップデートの1つにブラウザSafariの新デザインがあります。が、これがどうにも微妙でして。ハッキリいっちゃうと不評でして…。iOS 15のベータ版へ寄せられたフィードバックを元に、Appleは、Safariを前のデザインに戻せるというオプションをiOS 15に追加しました。 iOS 15で大きく変ったSafariデザイン。個人的にはアドレスバーが画面下にあるのがどうにも慣れません。長年の習性からとても違和感を覚えてしまいます。し
フロントエンドの開発が初めての人が意外と抜けがちな観点をまとめてみました。 初めにざっくりと概要を話すと「デザイナーが作るデザインでは表現しづらいもの」をまとめたものになります。 デザイナーが作るデザインは静的なものなので(たまにがっつりプロトタイプを作ったりもありますが)、いわゆる"状態"を表現するのが難しかったり抜けたりしがちです。 具体的に言うとローディング、Empty、エラーなどです。これらをよしなに補完できるフロントエンドエンジニアはデザイナーからもきっと「頼りになるぅ！」と思われること間違いないでしょう。 と言うわけでそんな例を紹介していきます。 今後も思いついたら追加する可能性が無きにしも非ず。 ローディングを出そう こう言うクルクルするやつとか こんな感じでシュインシュインするやつがあります。 基本的にユーザがアクションを起こした時に待たせる場合は必ず表示させましょう。 ロ
デザインはちょっとした一手間を加えるだけで、ぐっとよくなります。 プロのUIデザイナーによるWebページやスマホアプリのUIとUXを改善するデザインの知識とテクニックを紹介します。 第5弾は、ユーザーエクスペリンスやインタラクションに関するテクニックです。 UI & UX Micro-Tips: Volume Five. by Marc Andrew 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 1. フォントサイズやグリッドは時にはルールを曲げてもよい 2. エラーメッセージは親切で分かりやすいものにする 3. ロード中は何が起きているのか分かるようにする 4. アクションを実行した際に何が起きるのか分かるようにする 5. タブバーには重要なアイテムだけを表示する 6. ドロップダウンに重要なアクションを隠さない
Webサイトやアプリは、もはや現代人の生活に不可欠です。Webサイトやアプリにおける「UIデザイン」は極めて重要で、玉石混交の「UI原則」や「UIテクニック」が数多く公開されています。しかし、UIデザインに関する膨大な情報を得ても、いざ自分のWebサイトやアプリ開発となると、「良いUIデザインは結局どうすれば作れるの？」と迷うことも多いのではないでしょうか。 本記事では、UIデザインとは何か、優れたUIデザインの原則・設計方法、成功事例などをわかりやすくご紹介します。無料でダウンロード可能なUIデザインに関する資料もご用意しておりますので、ぜひご活用ください。 【無料ダウンロード】UI改善の基礎 4つのデザイン構成要素を操り、優先順位をつけるための「レイアウト / 配置」「形」「色」「動き」について図付きで解説します（全45ページ）。ぜひUIの改善にご活用ください。 UI改善の基礎を見てみ
情報設計やコミュニケーションに役立ちそうな、人の無意識な行動心理のキーワードをイラスト付きでまとめてみました。 視線解析 目は脳とつながっていて、視線と心理状態は結びつきやすい。記憶に関することは左に、未来に関すること右に視線が向く傾向がある。視覚に意識を集中すると上、聴覚に意識を集中すると真ん中、体全体で感じようとするときは下らしい。なので、嘘をつくときは右上をみてしまう傾向がある。ユーザーインターフェイスにおいても「戻る」ボタンが左、「進む」ボタンは右に配置されている。 アフォーダンス アフォーダンスとは、環境や形状が与える意味のこと。例えば、ドアの取っ手は前後に開けるものと認識するし、ドアにくぼみがあればスライドして開けると認識する。そういえば、線香花火はヒラヒラに火をつけたくなるので 反対かもと思い調べてみると、ひらひらを持つことで揺れを吸収し火球が落ちにくくなるらしい。線香花火の
読み放題をやめたらアプリの収益性3倍に。チャット小説の「peep」が語る、サブスクの読み放題から「強いIP」が育たない理由と、ボタン文言変更で収益性1.2倍になった話 300万ダウンロードのチャット小説アプリ「peep」さんにお話を伺いました ※ taskey株式会社 CEO 大石 ロミーさん、CTO 深見 将一さん、peep事業推進部 部長 相澤 一樹さん「peep」について教えていただけますか？相澤： peepという、e-Storyアプリ（チャット小説）を運営しています。ダウンロード数は300万を超えていて、2,000作品が掲載されています。 ユーザー層は「22歳まで」が60％と若くて、iOSが80％くらいを占めます。現在は40名ほどで運営しています（インターンや業務委託を含む） どのような経緯で「peep」が生まれたのですか？大石： もともとは「世界でヒットする作品」を生み出すことを
UXの全部入り感がもたらす不安UX について勉強を始めると、一度くらい「The Disciplines of User Experience Design」のような概念図を目にすると思います。 UX には UI デザインやモーションデザインといった視覚的な部分だけでなく、心理学や社会学といった人の認知や行動の理解も必要ということが見て分かります。 Dan Saffer が考案したベン図を Thomas Gläser がリファインしたものこの図だけでなく、UX をテーマにしたインフォグラフィックは他にもたくさんあります。図によって切り口や詳細度が異なりますが、ひとつ共通点があるとすれば、UX には多分野の知識が欠かせないことを表している点。様々な分野を包括した何かが UX であると表現しています。 体験ですから見た目だけに止まらないのは納得です。また、UX デザイナーとして仕事をしていれば、
メールマガジン登録資料ダウンロードお問い合わせ
コンテンツデザインに欠けがちな要素として、検索意図（Search Intent）というものがあります。 SEOの話題に少しでも触れると、不快に感じる方もいるかもしれません。SEOばかり指摘するのは、自分のアジェンダを押し通し、うぬぼれた指標を追い、ユーザーニーズをまったく考慮しないスパムのようなものです。最悪の場合、SEOが優れたユーザー体験と完全に対立してしまうことさえあります。 しかし、必ずしもそうなるとは限りません。優れたUXは検索エンジンの段階から始まっていることも、また事実です。最近の調査によると、Webサイトトラフィックの半数以上がオーガニック検索から生まれているといいます。つまり、良いかどうかにかかわらず、SEOは体験全体の一部に過ぎません。 ユーザー重視のSEOは、優れたデザイン、コンテンツ、コード選択というそれぞれの要素が、重要な場面で相乗効果をもたらすように適切に組み合
UX Movementの著者および設立者です。ユーザー体験のデザインスキルの開発を手助けしてよりユーザーフレンドリーな世界のために、このブログを創設しました。 フォームのどこにエラーメッセージを配置していますか？ ユーザーの期待する場所にエラーメッセージが置かれていないと、ユーザーはフォーム入力を完了できなくなってしまうかもしれません。 フォーム入力を間違えたら、ユーザーはそれを修正して送信し直すために、なにが間違っていたのかを理解する必要があります。フォームを完了しようと思っていたとしても、それがあまりにも大変であればユーザーは心変わりしてしまうでしょう。 フォームの上か、フィールドのインラインか エラーメッセージの配置場所でもっとも一般的なのは、「フォームの上」と、「エラーのあるフィールドのインライン」という２箇所です。どちらの配置場所が、ユーザーにとってより直感的でしょうか？ 調査に
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
