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

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

[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の表は絞り込んたあとに見たくね？

[gologius]

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

[miwa84]

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

[fa11enprince]

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

[estragon]

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

[abeeei]

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

[omega314]

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

[sametashark]

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

[ticokuma]

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

[abababababababa]

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

[psne]

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

[RATCHO]

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

[lb501]

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

[imaginaration]

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

[shields-pikes]

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

[chokovi]

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

[transceiver101]

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

[snipesnaps]

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

[kamayan1980]

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

[take-it]

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

[takuver4]

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