最悪なUX
User Experience
直した
テロメアが死んだけど気にしないことにする
/icons/iine.iconyosider.icon
鬱陶しい量のアニメーションyuta0801.icontakker.iconSummer498.icon
「やりたいこと」を実現するために毎回待たされる
画質が低い+拡大表示にページ遷移yuta0801.iconSummer498.icon
ニュースメディア系でありがち
中は同じシステムでデザインだけ変えてるのか?って思うほどシステムが似かよってる
無駄にページングもするし
これはPV数稼ぎSummer498.icon基素.icon
画像も
無駄にごちゃごちゃしたUIyuta0801.iconSummer498.icon
楽天市場やばすぎるyosider.iconMISONLN41.iconerniogi.icon 楽天は「ごちゃごちゃしてる(雑貨屋とかを眺めるのと一緒)」を「良い」と思う層がターゲットだからあれはあれで間違いではないと思っている45Nuyagawa.icon まあ独自性はあるな…yosider.iconU.icon
昔、楽天のえらい人に「楽天の通販ページはなんであんなにゴチャゴチャしてんの?」って聞いたら「ABテストを死ぬほど繰り返しても、結局ああいうスタイルの売上が一番高い」って言われたの思い出すな。
草Summer498.icon
徐々に変化はしそうだけどなあ基素.icon
Amazonもたぶん改善の余地がたくさんあるんだろうなあyosider.icon ニコニコ動画もこれのイメージ。。sk6cleine.icon 上にスクロールすると出てくるヘッダーyuta0801.icontakker.iconMISONLN41.iconSummer498.icon
ただ文章を読みたいだけなのにチカチカして鬱陶しい
常時表示するか固定するな
テキスト選択時のポップアップyuta0801.iconMISONLN41.iconSummer498.icon
SNSシェアするだけポップアップをいちいち出すな 鬱陶しい
コピペぐらい誰でもできる
楽にしたい人は大体拡張機能使ってる
テキスト選択、コピー、右クリック禁止yuta0801.icontakker.iconyosider.iconMISONLN41.iconsta.iconSummer498.icon
論外
選択可能であればdocument.getSelection().toString()がつかえる
選択すらできない場合は……開発ツールへGo!
たまに開発者ツールを開けると「開発者ツールを閉じて下さい」っていうページにリダイレクトされて終わるページがある45Nuyagawa.icon
どうやってやるんだそれ 綾坂こと.icon
/icons/まじかよ.icontakker.icon
+1Summer498.iconbsahd.icon*5
幸いにもそこまで極端なページには一度もあったことないけど
悪用されるのを防ぐためではないですか?なりすましとかが発生する確率を減らすとか
https://gyazo.com/57b8b1f424d9a474ba15d37f40917394
これで済む話なんだよなぁkuuote.icontakker.icon
ちなみにこれはGoogle翻訳です
Google Apps Scriptでも同じメッセージが出ますね
書くのなくなるなー
パスワードやメアドの入力欄の2つ目がコピー禁止のパターンSummer498.icon
コピペで打ってるのに全部手で打たないといけないのだるいsta.icon
まあこれは仕方ないtakker.icon
パスワード管理ツール使ってるのでコピペしたい(入力できないこともある)基素.iconkuuote.icon
32文字とかの乱数列を二度打ちするのはめんどくさすぎる!
そもそもパスワードがナンセンスなのでやめてほしいkuuote.iconSummer498.icontakker.iconbsahd.icon テキストをコピーできないWebページ 増井俊之.iconsta.iconyosider.iconkuuote.iconerniogi.iconSummer498.icon
これは地味にイラッとするやつですね……
分かる人はコピーできる(悪用する人は大体こちら)ので意味無いと思うkuuote.iconerniogi.iconSummer498.icon
/icons/それな.icontakker.icon
そーかー
機械的に作られた大量のリンクyuta0801.icon増井俊之.icon45Nuyagawa.iconerniogi.icon
ニコニコとか、はてなブログとか
行政の書類とかで、PDFのファイル名が解読不能な文字の羅列だったとき(それもめっちゃ長い)にすごい残念な気持ちになる
ニコ百は形態素が壊れることが多くてげんなりするSummer498.icon はてなブログはクリックするまでは気づかないのでそんな気にならない クリックした後の内容が薄い問題は、まだ解決できるポテンシャルがある
特にリンクだと分からないようなスタイルにされてるものを毎回踏んでしまってとてつもなく鬱陶しい
これは地雷でしかない
あいうえお配列、abce配列の(仮想)キーボードyuta0801.icontakker.iconMISONLN41.iconkuuote.iconSummer498.icon
(切り替えられないやつ)bsahd.icon*2
カラオケとか、コンビニのプリンターとかにありがち
セブンのプリンターはちゃんとPC配列対応してた!
えらいyuta0801.icon*3
ATMの送金これなのでつらいkuuote.icon
昔メール端末作ったことがあるのですが、あいうえお配列が高齢者に大好評でした 増井俊之.icon
よく考えたら、PC配列使っている人口の方が、日本全体で見たら少数派ですね。そっちの常識に全部合わせちゃったら逆に混乱するtakker.icon
あいうえお配列など、なるべく誰でも使えるようにしたinterfaceをdefaultにして、PC配列などは設定画面から選択できるようにすると、多数派・少数派の双方がストレスなく使えるようになりそうtakker.icon
PC使っていない人でもあいうえお配列なら読めるしわかる
ひらがな読めない人への対応は一旦置いておくとして
PC使っている人なら設定画面を探し出して操作するくらい普通にできるので、各自で設定を操作してPC配列を出してもらうようにしても問題ない
+1Summer498.icon
多少手間はかかるが
全くアプリである必要がないのにWebではなくアプリの形で(のみ)提供されてるサービスyuta0801.iconSummer498.icon
UIレベルで考えればスマホのUXはPCに勝てるはずがない
スマホというだけで操作がかなり制限される
スマホならではの操作も実際に使える機会はあまりないみたいだし
考えられる理由
Web siteではなくnative app形式でstoreに置いたほうが、スマホユーザにとっては使いやすい
PWAの存在を知らないとか
PWAも、初見だと「ん?」となった45Nuyagawa.icon
なにか違和感があるのですか?takker.icon
よく使うサイトへのリンクをデスクトップに置くのと同じだなって思ったくらいかなbsahd.icon
「アプリ」にはパソコン用のソフトウェアを含むかどうかbsahd.icon
アプリという形式への固執、本と同じ何かを感じるyuta0801.iconSummer498.icon
クリックすると全選択されるコードブロックyuta0801.iconSummer498.icon
ユーザーがドラックもできないと思ってるの?
そもそも全部コピーする機会まずないだろ
関数名を選択して検索したいときとかに全選択されて鬱陶しい
文字選択するとページ遷移するtakker.icon
takker.iconはもう慣れたけど、初見だと混乱するしイライラすると思う
単語選択してコピペしたいとき
等幅フォントじゃないコードブロックyuta0801.icon
絶対に止めてほしい
何だそれ存在自体が信じられないSummer498.iconbsahd.icon
シンタックスハイライトが付いていないコードブロックyuta0801.icon
ほとんどユーザーの問題なんだけど、表示するときに選択できるようになると嬉しい
無駄に空いた左右の余白yuta0801.iconSummer498.icon
メイン要素に十分な幅がない
アプリの初回説明dnin.iconSummer498.icon
手が出てくるやつ
自分の手以外の手がウヨウヨ動いてるの、気持ち悪くないか?
連打しないとチュートリアルが終わらない
+1Summer498.icon
大学の成績証明書発行サービスdnin.icon
コンビニで「簡単に」印刷出来るはず...なのに1時間かかって疲れた
まず説明がPDFだけ
本人確認があるので1日待たされる
1. パスワードを2つ設定する
2. ログインして証明書の種類を選ぶ
3. 予約番号が出る
4. コンビニ複合機で支払いの紙を出す
5. レジで手数料を支払う
6. メールで番号が届く
7. コンビニ複合機でその番号を入れ、印刷する
8. 印刷代を払う
手数料と印刷代を別々に払うのか……
事務が入っている棟の自動証明書発行機で完結するtakker.icon
事務が開いていないときは使えないけど、開いているときはいつでもその機械だけで発行できるので楽
そう、大学が近ければね!
あっ(察し)
卒業生かつ他県の人にとって、コンビニプリントはありがたいのよ
文字数制限のあるパスワード欄kuuote.iconyosider.icontakker.iconMISONLN41.icon増井俊之.iconsta.iconerniogi.iconSummer498.icon 平文保存してるのかワレと言いたくなる
文字種制限あるのも最悪yuta0801.icontakker.icon
記号を使わせろtakker.iconyosider.iconkuuote.icon
せめてパスワード生成ツールが自動的に判定してほしい基素.icon
標準化されていそう
JIS第4水準まで使わせろbsahd.icon
定期的にパスワードの再入力を求めてくるやつMijinko_SD.icon
認証情報の再入力は仕方ないtakker.iconbsahd.icon*3
これがしつこいのでRedditがあまり好きになれない MISONLN41.iconkuuote.icon
iPhoneで使うGoogleMAPもこれ、しかも確認ダイアログで
アプリ(強調色)、引き続きWeb版で(通常色)なのが追い打ちをかけてる
執拗に登録を求めてくるサイトkuuote.iconsta.iconyosider.iconerniogi.iconSummer498.icon
Qiitaは閉じれるからまだマシだけどQuoraは最悪
登録しろって画面が貼り付くのでまともに操作できない
求: UserScript化!MISONLN41.icon
いいぞ!kuuote.icon
実はTwitterも
登録する気が失せる
まあQiitaは垢持ってる(使ってないけどw)
これは最悪yuta0801.icon
プレミアムを利用していません dnin.icon
https://i.imgur.com/BoQKWrW.png
https://i.imgur.com/v0yYkKP.pngdnin.icon
ちょっと見たいだけなのに、いきなり何ですか
これ通知だけならまだよくある感じなのだけど絶対に連携しないと閉じれないのがヤバイ
最初からユーザIDとパスワード登録を求めてくるシステム増井俊之.icontakker.iconyosider.iconMISONLN41.iconSummer498.iconbsahd.icon
どういうシステムなのか理解してから 登録したいのに
試用する気すら失せるtakker.icon
「今すぐ使う」じゃなくて「今すぐ話を聞く」kuuote.icondnin.iconerniogi.iconsta.icontakker.icon
とりあえず使ってみる、ではなく「今すぐ話を聞く」なのでnot for meだなってなったkuuote.icondnin.iconerniogi.iconsta.icon ツールを使ってみたいだけなのでなんで人の話など聞かないとならんのだkuuote.iconerniogi.icon
テキストコミュニケーションのツールなのにZoomによる音声会話から始まるんかいdnin.iconkuuote.icon
ツールの使用感や雰囲気を気軽に試せない
Twitterやscrapboxなんかはlogin せずとも閲覧できるので雰囲気をつかめる
最近のX.iconはそうでもない(プロフィールページ閲覧時にログイン要求される)bsahd.icon
デモサイトがあれば良い?
状態により要素が移動するUIkuuote.icon
誤操作を誘発するだめ設計
リソースのサイズを適切に指定していないだめなウェブサイトとかAndroid版Slackアプリとかが該当します
Slackとか、未読が上に勝手に移動するインターフェースじゃなくて全未読が欲しい
表示してから読み込みを始めるメニューとかMijinko_SD.icon
といってもじゃあ具体的にどう表示すればいいか、と聞かれても難しいところだが……
なにもない所をクリックしたら遷移してしまうやつyosider.iconSummer498.icon
何そのトラップtakker.icon
タップしようとした瞬間に文書の構造が変わって広告を押してしまうやつkuuote.iconyosider.iconSummer498.icon 最悪MISONLN41.icon*3takker.icon
広告のせいで読み込みが遅くなったり動作が重くなるのって本当にクソだと思う
もっと良い広告の仕組みはないのかな
読み込み時に文章の構造が変るのが本当に最悪yuta0801.icon
Cumulative Layout Shiftとして検索順位に影響するはずなのに結構多く感じるのはなぜだろうか
Adblockで広告とは無縁takker.iconbsahd.icon 世の中のインターネットの帯域を無駄に使っていると思うと全員が使ってほしい。。
サイト運営者に収益が入らなくなるから逆に迷惑になのかな
実際にサイトを運営している人がそう言ってたから、なんとなく無効化したらなんだかんだで慣れたyuta0801.icon むむむ。無効化したほうが迷惑にならないのでしょうか……takker.icon なぜ?
ただ広告があるかないかだけで認知にバイアスがかかってしまうから、そういうのを取り除きたいという思いがある。 もちろんそうしたければプレミア会員になれというのがサイトの主張なんだろうけど
あ、ためになるサイトで広告ブロック解除を要請してくるサイトの場合は、素直に解除します
テキスト入力中なのにポップアップウィンドウが出てフォーカスを奪われるやつ増井俊之.icon
Macでよくあるのだけど
リストビューで、ページ番号がなくて末尾までスクロールすると続きを勝手に読むインターフェースkuuote.icon
何らかの理由で再読み込みが走ると先頭に戻されるのですごくつらい
SoundCloudは頑張って辿ってくれるのでよい
Youtubeは戻るときは自動で元居た場所まで戻してくれるwho.icon
Scrapboxもこれだけどあまりページリスト辿らないので気にならない
最近流行ってるけど、確かに考えてみればTwitterとかでよくツイートを見逃がしてしまって探してる
/icons/わかる.iconyosider.icon
そもそもページングしるときでも、リロード時にズレないようにするためにするのもかなり難しそう
破壊的な動作なのに一切確認を出さないやつkuuote.icontakker.icon増井俊之.iconSummer498.icon
操作が簡単だとなお最悪
Twitterで誤ブロックとかしてしまった人いるのでは
迂闊に操作すると事故が起きるUIは悪だと強く思っていますkuuote.icon
設定しただけで凍結とかどう考えてもやりすぎ
人以外も普通に使ってるのに基準は人なの手を抜きすぎだと思う
+1Summer498.icon
これだけではないけどTwitterはUXに対するやる気が無さすぎる
+1Summer498.icon
一応最近は変更しようとすると注意メッセージが表示されるはずyuta0801.icon
それでも無視してしまうのか凍結される例が後を絶たないけど
ここまで来ると(自分は)Twitterに非はないように感じる
そもそもこの仕様自体がCOPPAあたりのせいなのでは? 責めるべきはTwitterではなくCOPPAでは?
あ、そうなんですね、普段Twitterやってないので知らなかったですkuuote.icon
EmacsでCtrl-wを押すと選択範囲が全部消える
選択範囲は目に見えないこともあるので、突然全部消える! 増井俊之.icon
/icons/hiee.icontakker.icon
選択範囲が見えないtakker.icon
そんなことあるの……?
めっちゃ難しい選択肢が出た
https://gyazo.com/3157fbfcbeee22206f4d7f2e3433055d
どっちだよ
正確には、キャンセルしないときはキャンセルをキャンセルする。二重否定の一種 スクロールできる・文章が表示される領域がクソ小さいやつがある https://gyazo.com/357c9d25bea535ea0adb584468d4bb4d
真ん中の1cmくらいのところをちまちまスクロールして読ませる
別画面で自分で探して開けばいいじゃんbsahd.icon
変更部分の要約を書いてくれているのは良い
どこが更新されたのかわからない
甲とか乙とか
そもそも読ませる気がないだろ…yuta0801.icon
というか読まない前提でまわってないか?
利用者が一方的に不利になるようなものは無効になるようなのとか
サービス提供者側も読んでもらったほうが対応コストが減りそうなのになぜ読まれやすいような形にしないんだろう
要約版も作成しているところも稀にあるみたいですねMijinko_SD.icon
そもそもなぜ今の複雑な形式が普及している?
書いてないとトラブルが発生した時に困るから?
書かないのは法的リスクが高すぎますね基素.icon
書いておかないといけないことが多すぎて、長文にならざるを得ない?yosider.icon
ので複雑に見える?
長文でもわかりやすくする方法はありそうだが
普段読まない形式なのは法的な文章(法務がチェックしてる)だから
他の例:特許の文章。普段読むような文章ではない
最適化する対象が裁判所なのか一般ユーザーなのか。たいていの規約は前者を選んでいる
読んでて楽しい・わかりやすい訳が付いた規約
これ最高じゃんtakker.icon
これ思ったより面白かった笑sk6cleine.icon
マインクラフトの利用規約は読みやすかった記憶Summer498.icon Microsoftに買収される前の話なので今は知らん
ユーザーをブロックするチュートリアルkuuote.iconyosider.icontakker.iconsta.iconerniogi.icondnin.iconhata6502.icon とっとと操作したいのに機能案内で待たされると苛々する
Scrapbox likeなツールないかなと思ってたまにNote taking toolとか試してみてるけどこれが出てくる率が高い
複雑である自覚があるんでしょうね
ログイン時のエラーメッセージが嘘をつくor明らかにヒント足りないsta.iconkuuote.iconyosider.iconerniogi.iconimo.icon
LINE PCアプリで「メアドが違う」言われたけど、違うの電話番号だった
本当のことを教えると、それを手がかりに悪いことする人もいるので...(これはやりすぎかもですけど)tetsuya-k.icon
解約しづらいやつ全般sta.iconkuuote.iconyosider.iconerniogi.icon増井俊之.iconSummer498.icon 解約した時に引き止めようとしてくるのもこれの変種でいいんだろうかkuuote.icon
解除しようとする時に妙に棘のある言葉を使ってくる Microsoft 関連製品Summer498.icon
罪悪感を植え付けようとするな
というか感情を利用するな
例
WSJ(今は改善された)
文字数制限のある住所入力asaka_s.iconSummer498.icon
マンション名とか入らない…
全角onlyasaka_s.iconyosider.icontetsuya-k.iconU.icontakker.iconSummer498.icon
なぜこっちに強制させるんだろう?
勝手に変換することを嫌がっているのか?
そもそも全角しか受け付けない意味がわからない
新聞社やテレビ局のWebニュースにありがちなやつだ...
新聞の縦組みが全部全角で、そのテキストをそのままネットニュースに流したから全角のまま、というのはありそうですね45Nuyagawa.icon
じゃあなんでテレビ局のWebニュースは全角なんだろうか……
一時期SQLインジェクションやXSS対策で全角文字Onlyにしていたサイトがあったらしい
一覧が長すぎる45Nuyagawa.icon
時間経過でログアウトするシステムtakker.iconSummer498.icon
ネットバンキングとかならまだしも、なんで大学の連絡システムがこうなってるんだろうyosider.icon
yosider.iconが知っているやつも全部これ
「5つの質問に答えてあなたにあった商品探そう!」→答え終わった後「答えを見るにはメールアドレスを登録」
P&G
理想
購読解除(Unsubscribe)をクリックしただけで解除できる
そもそも勝手に送ってこない
悪い例
リンク先のWebページでのログイン必須
自動的に解除するシステムがないのでメールで申し入れる
参照しやすくない企業広報
遡れない
クレジットカードのタッチ決済
https://gyazo.com/ee4ecfd2038f23732f0181881b6d0376
このマークを見てもタッチ決済できるかどうかは店員に聞かないとわからない
笑うSummer498.icon
店員が知らないケース
端末が対応していても契約で対応していないケースがあるっぽい?
支払いができるかどうかは支払ってみるまで分からない
サービスと銀行、両方が対応していても、銀行がPay-easyを使えるところを絞れるっぽい
https://gyazo.com/d1ba95b82c460b607ff8509e7cd2c0d4
クラッシュ
論外
https://gyazo.com/bf0e308ba22063cb100131f66a6f3e59bsahd.icon
なかった