[フレーム]
はてなブックマークアプリ

サクサク読めて、
アプリ限定の機能も多数!

アプリで開く

気に入った記事をブックマーク

  • 気に入った記事を保存できます
    保存した記事の一覧は、はてなブックマークで確認・編集ができます
  • 記事を読んだ感想やメモを書き残せます
  • 非公開でブックマークすることもできます
適切な情報に変更

エントリーの編集

loading...

エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。

タイトルガイドライン

このページのオーナーなので以下のアクションを実行できます

タイトル、本文などの情報を
再取得することができます
コメントを非表示にできます コメント表示の設定

ブックマークしました

ここにツイート内容が記載されます https://b.hatena.ne.jp/URLはspanで囲んでください

Twitterで共有

ONにすると、次回以降このダイアログを飛ばしてTwitterに遷移します

517users がブックマーク コメント 73

ガイドラインをご確認の上、良識あるコメントにご協力ください

0 / 0
入力したタグを追加

現在プライベートモードです 設定を変更する

おすすめタグタグについて

よく使うタグ

【閲覧注意】イライラ不可避なUIデザイン10選 - Qiita

517 users qiita.com/9re-pe

ガイドラインをご確認の上、良識あるコメントにご協力ください

0 / 0
入力したタグを追加

現在プライベートモードです 設定を変更する

おすすめタグタグについて

よく使うタグ

はてなブックマーク

はてなブックマークで
関心をシェアしよう

みんなの興味と感想が集まることで
新しい発見や、深堀りがもっと楽しく

ユーザー登録

アカウントをお持ちの方はログインページへ

記事へのコメント73件

  • 注目コメント
  • 新着コメント
H_He_Li_Be
「パスワードの条件は先に説明しましょう」入力後に条件を出してくるのがほんとに腹立つ。サイト作成者も同じく腹立ったことあるだろうに、なぜ先に書かないのか。

その他
strawberryhunter
申し込みフォーム、下にラベルを付けるとか斬新。

その他
OkadaHiroshi
物件の一覧はアイコンとかにしなくていいので、初めから表にしてほしい。たしかに Amazon の方が楽天より見やすいが、本当に欲しいのは kakaku.com のような表だ。

その他
rizenback000
冒頭のデザイン2つって「悪くないデザイン」の例だよね...?右側のデザインが角ゴシックなのに拡大しても読みづらいレベルの細さと色合いで目の悪い人だと読めねえ気がする。

その他
hikoyuki
冒頭の悪くないデザインの例、スマホからだからかも知れないけど文字が小さくなった上に色が見づらい右の方が残念に見えてしまう。気のせい?

その他
makou
鬱陶しい閲覧者を足切りするスレッショルドデザインってのを最近考える。

その他
secseek
とりあえずやたらと画像とかで説明しようとしないで日本語で説明してほしいと思います。どうせスクリーンショットなんてすぐ仕様変更で実態とズレるんですし

その他
anonruru
1枚目の右が見づらいのはまず文字色と背景のコントラスト比が悪いと思う。デザインの話をするなら文字色の話にも触れてほしかった。

その他
sds-page
一個目から老眼に厳しい極小フォントに改悪されて早速イライラしてしまった。もっとユーザー目線になれ

その他
tikuwa_ore
文字を捨てて図(アイコンorピクトグラフ)に置換するユニバーサルorグローバルデザインは、その図を解しない全ての人にとってクソなのよな。図だけだと言葉で説明するのも難しい場合があるし、文字併記は大事。

その他
kazuph1986
長すぎるプルダウンを追加してほしい。

その他
misshiki
"さまざまなデザインを見て、それのどこが良いのか、何が良いのか(悪い場合も同様)を言葉で説明することは、皆さんのデザイン力を大きく向上させるでしょう。"

その他
kojiono
トップコメにあるような揚げ足取りのコメントを叶えようとするからダメなデザインが生まれることが良くある。 情報の整理・取捨選択することがデザインなので。全部テキストで書けとか言ってコメントはどうかと思う

その他
buhoho
良い記事だと思う。

その他
Bookmarker
Windows 11でMicrosoft製アプリだけアクティブウィンドウに色が付かなくてイライラする。手前が長年維持してきたUIを手前で壊すんじゃねーよ!

その他
masa8aurum
読んでみたら、良いまとめ。タイトルで損してるかも

その他
tmayuko312
これ書いたのUIデザイナー1年生やろうなとうっすら思っていたら学生アルバイトさんだったのでよく勉強しているなと感心した(上司は監督してあげて)

その他
tk_musik
こういったUIのべき論は読むたびに「知ってるよ」となるが実践はし難いのでやらんとな。/一部の人気ブコメがよく分からんのだが、セブンが陥った罠は記事で言及済みだし価格.comの表は絞り込んたあとに見たくね?

その他
sds-page
sds-page 一個目から老眼に厳しい極小フォントに改悪されて早速イライラしてしまった。もっとユーザー目線になれ

2023年12月10日 リンク

その他
gologius
業務システムならギッチリ詰めろ、1画面で全部見せろ、とか言われるんで、デザイン原則を頭に入れつつ目的に合わせたUI作成するしかない気がする。正解のない問題・・・

その他
miwa84
ここ最近のGmailは選択したいメールが勝手に動いてゴミ箱行きにしようとしたスパムメールを誤って選択して開封してしまうのがしょっちゅうなので本っ当に苛ついている。Googleが嫌いになった。

その他
fa11enprince
申し込みフォームの例も比較の例も前者の方がマシ。申し込みフォームは絶望的に何の入力欄か視認性が落ちている。比較は例が悪いせいかもだけど間取り、最寄駅からの時間、築年数は一覧から削ったらダメでしょう。

その他
estragon
これに尽きる。簡単そうに見えることを優先して、一覧性が悪くて比較できない、クリック・戻るの繰り返しを強いられてイライラするとか / "たった一つの方法は、 ユーザを巻き込んでデザインしていく ということです

その他
abeeei
単にデザインの四代原則使いましょうっていう話かと。それよりもアフターのデザインもデザインとして完成度低いので色々語る前にデザインの精度上げる方がいいと思う

その他
omega314
情報の整理・構造化は良いと思うけど、そうでなく情報量を落としまくることで「分かり易くなった」とか言うたぐいの奴は基本信用してない。

その他
sametashark
パスワードの条件、書いておいて良い場合、入力中に動的に判定して出す場合、文字種等あらかじめ条件を見せない方が良い場合もあって使い分けてる/サイズ別商品ページなのにタイトルにサイズ入ってないEC撲滅したい

その他
ticokuma
Webあるいはそれに準ずるものに20年以上携わっている者は、この類のエントリに反応しない方がお互いのためだよ。

その他
tikuwa_ore
tikuwa_ore 文字を捨てて図(アイコンorピクトグラフ)に置換するユニバーサルorグローバルデザインは、その図を解しない全ての人にとってクソなのよな。図だけだと言葉で説明するのも難しい場合があるし、文字併記は大事。

2023年12月10日 リンク

その他
abababababababa
デザインのあーじゃねーコージャーネーを唱えてるコメントが多いですが、非デザイナーはここに描いてあるのを守るかだって怪しい。心配すべきは、そもそもこれ見てやるか?デザインのヤバさ見えてないのでやらんの...

その他
psne
何でもアイコンで「察して」はダメなソリューション。すっきり見える気分になるだけ。

その他
RATCHO
トップコメは間違ってる。一覧ページにおいてアイコン化しているだけで詳細は詳細ページに遷移して見てもらえれば良いんだよ/フロント興味ないエンジニア達は必読

その他
lb501
一瞬よく見えるが、なんか惜しい。都道府県はプルダウンにするとか。郵便番号から住所を指定させるとか。生年月日も...分けないで19800101とかもしくはタップすると年と月と日のプルダウンとか

その他
imaginaration
最初のフォームはラベルが下で新規登録のラベルがフォームの上になっていて、揃えようよ...という気持ちに...。

その他
shields-pikes
アイコンには下に小さな文字で意味を書くべき。そうすれば、アイコンだけでは意味不明な時の補助になるし、ナビメニューのように目立つところに置いておけば、見る度にユーザーはアイコンの凡例を学習してくれる。

その他
chokovi
この手の記事はハテブでやたら叩かれる

その他
transceiver101
気にした方が良いことなのは間違いないし、こうやってみんなが認識すると良い

その他
snipesnaps
自分がマスじゃないのは承知した上で言うけど、こういう、相手が必要な情報を伝える側が勝手にまとめるの苦手。情報や文字量は一度にどんと飛び込んできてくれて、自分で必要か層で無いかを情報を精査したいタイプ。

その他
kamayan1980
個人的なイライラMAXは、サイズ指定してない広告表示。一番最後に読み込むからレイアウトがガクンガクンと落ち着かなくて誤クリックを誘発する。

その他
take-it
スマホで見た時のQiitaのポップアップ、イライラ不可避なんです。。。

その他
takuver4
この手の解説を見るたびに思うんだけど何で「他を下げる」ような書き方をするんだろう。「視認性を向上させるUI改善テクニック10選」みたいなタイトルにすればいいのに・・・

その他

注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

リンクを埋め込む

以下のコードをコピーしてサイトに埋め込むことができます

プレビュー
アプリのスクリーンショット
いまの話題をアプリでチェック!
  • バナー広告なし
  • ミュート機能あり
  • ダークモード搭載
アプリをダウンロード

関連記事

usersに達しました!

さんが1番目にブックマークした記事「【閲覧注意】イラ...」が注目されています。

気持ちをシェアしよう

ツイートする

【閲覧注意】イライラ不可避なUIデザイン10選 - Qiita

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure y... Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 人は見た目が9割 皆さん一度はこの言葉を耳にしたことがあるのでしょう。内面がどれほど素晴らしくても、外見がそれに見合わないと、なかなか本当の価値を認めてもらえないものです。 この話は人間だけでなく、アプリケーションにも当てはまります。どれだけ内容が素晴らしくても、見た目がイマイチだったり使い勝手が悪かったりすると、ユーザーに敬遠されてしまいます。(私は以前ネ⚪︎フリからア⚪︎プラに切り替えたのですが、使いにくく感じたため、すぐに元のサービスに戻しました) エンジニアの皆さん、優れた技術力を持ちながら、デザインが原因でユーザー離

ブックマークしたユーザー

  • nxvosdjfs52vmkd2025年04月12日 nxvosdjfs52vmkd
  • suitedJK2024年12月04日 suitedJK
  • ttten2024年11月25日 ttten
  • techtech05212024年06月22日 techtech0521
  • hirokibeard2024年05月14日 hirokibeard
  • akazus2024年02月14日 akazus
  • mgl2024年01月22日 mgl
  • pink_revenge2023年12月21日 pink_revenge
  • J1382023年12月20日 J138
  • lugecy2023年12月17日 lugecy
  • field_combat2023年12月15日 field_combat
  • mega102023年12月14日 mega10
  • istj2023年12月14日 istj
  • igrep2023年12月13日 igrep
  • tatatayou2023年12月12日 tatatayou
  • nassy3102023年12月11日 nassy310
  • aki-akatsuki2023年12月11日 aki-akatsuki
  • kazuph19862023年12月11日 kazuph1986
すべてのユーザーの
詳細を表示します

ブックマークしたすべてのユーザー

いま人気の記事

いま人気の記事をもっと読む

いま人気の記事 - テクノロジー

いま人気の記事 - テクノロジーをもっと読む

新着記事 - テクノロジー

新着記事 - テクノロジーをもっと読む

同時期にブックマークされた記事

いま人気の記事 - 企業メディア

企業メディアをもっと読む

はてなブックマーク

公式Twitter

はてなのサービス

Copyright © 2005-2025 Hatena. All Rights Reserved.
設定を変更しましたx

AltStyle によって変換されたページ (->オリジナル) /