UIXHERO
  • 記事
  • UXリファレンス
  • リソース
  • 学習ルート
  • About
お問い合わせ
  1. ホーム
  2. 記事

記事一覧

UX心理、UIデザイン原則、UIコンポーネント、リサーチ記事を横断して探せるUIXHEROのナレッジ一覧です。目的に合わせて絞り込みながら、設計や実装の判断材料を見つけられます。

UIデザイン完全ガイド

UX心理・UI原則・コンポーネントの3レイヤーを一本化した総合ガイド

見る

UX心理(119)

UIデザインの「なぜ」を説明する心理・認知の法則

見る

UI原則(65)

心理法則をUI設計のルールに翻訳した原則

見る

UIコンポーネント(72)

ボタン・フォーム・モーダルなど実装可能なUI部品

見る

用語集(537)

UX/UIデザインの重要キーワードを網羅した辞書

見る

UIデザイン完全ガイド

UX心理・UI原則・コンポーネントの3レイヤーを一本化した総合ガイド

見る

UX心理(119)

UIデザインの「なぜ」を説明する心理・認知の法則

見る

UI原則(65)

心理法則をUI設計のルールに翻訳した原則

見る

UIコンポーネント(72)

ボタン・フォーム・モーダルなど実装可能なUI部品

見る

用語集(537)

UX/UIデザインの重要キーワードを網羅した辞書

見る
すべて(414)UX心理(119)UI原則(65)コンポーネント(72)アクセシビリティ(11)エンジニアリング(15)インタビュー(22)リサーチ(29)記事(70)依頼先の選び方(4)UI検品の6観点(6)UI裁判(1)

UIXHEROの本

あなたがAIにUIを作らせると、何が起きるか

AIが「できました」と言うとき、何が省かれているのか。予備知識ゼロのAIに、実在する業種の業務UIを175枚作らせ続けた記録です。何が組めて、何が組めなかったか。読んだあとは、AIが渡してあったコンポーネントを組み合わせただけなのか、その場でHTMLとCSSを書き起こしたのかを見分けられるようになります。

電子書籍・2026年8月刊。中身はどこで買っても同じで、買った店のアプリかブラウザで読めます。

Zennで買う(¥1,500)(新しいタブで開く)Amazonで買う(¥1,500)(新しいタブで開く)
UIXHERO

UIXHERO

UXデザインの法則や心理学効果を、実例を交えて解説するリファレンスサイト

ナビゲーション

  • ホーム
  • 記事
  • UXリファレンス
  • About
  • お問い合わせ

その他

  • カテゴリー
  • タグ
  • 検索
  • アーカイブ
  • GUNJO(デザインシステム)

プライバシーポリシー

© 2026 UIXHERO. All rights reserved.

70件の記事が見つかりました

デザインQAの確認項目|画面を出す前に見る8分野のチェックリスト

38分で読める

画面を公開する前に見るデザインQAの確認項目を、8分野のチェックリストにして、合格ラインの数字の出典つきで示します。分野は余白・文字・押せるもの・色とコントラスト・配置と揃え・状態の表示・入力・画像です。デザインQA(Design QA)は、実装された画面が設計どおりに見えるか、使う人が迷わず操作できるかを公開前に確かめる工程で、動くかを見るQAテストとは別に行います。

記事タグ: デザインQA / Design QA / UI検品 / デザインレビュー / チェックリスト

AIにUIを作らせると、既存のコンポーネントが作り直される

23分で読める

AIに画面を作らせると、すでに手元にあるものが見つけてもらえず、作り直されることがあります。予備知識ゼロのAIに175画面を組ませた記録では、それが起きるかどうかは、AIの能力よりも「説明がどこに書いてあるか」に強く出ていました。同じコンポーネントの説明文を直す前と後を、実際の文面と語数で並べます。自分のコードベースで確かめる手順も付けました。

記事タグ: AI生成UI / デザインシステム / UIコンポーネント / ドキュメント

ダークパターン規制と消費者庁の案|気づかずにやっていませんか

18分で読める

2026年9月2日、消費者庁の検討会に、ダークパターンを「表示・UI」の問題として扱う中間取りまとめ案が出ました。まだ案の段階です。悪意なく作った画面のどこが見られるのかを、一次資料に沿って整理します。

記事タグ: ダークパターン / 特定商取引法 / 消費者庁 / エシカルデザイン / UI設計

AIを使いこなすとは、プロンプトの話ではなかった|1つの会話に全部やらせるのをやめて、5つの役に分ける

17分で読める

AIに仕事を頼むとき、指示も生成も確認も直しも、1つの会話の中でやっていませんか。私たちは記事や翻訳や図を作る13種類の仕事の流れを、人・司令AI・生成AI・照合プログラム・文脈ゼロのAI(事情を何も知らないAI)の5つの役に分けて回しています。いちばん効いているのは、その文脈ゼロのAIに検品させる段でした。この記事自身を例に、5役の流れと、明日から1つの会話を分ける手順をまとめます。

記事タグ: AI活用 / UI検品 / デザインレビュー

予備知識ゼロのAIに170画面組ませたら、デザインシステムに26個のコンポーネントが加わった

10分で読める

群青を一度も見たことのない予備知識ゼロのAIに、公開ドキュメントとnpmだけを渡して実業種の画面を170枚組ませた記録の総集編です。3回手組みされたものだけを作るという運用で26のコンポーネントが加わるまでと、その過程で見えた5つの法則をまとめます。

記事タグ: デザインシステム / UIコンポーネント / AI生成UI

AIを「忖度しない検査役」にする方法論 — 手組みの跡は、足りないコンポーネントの地図

10分で読める

AIにUIを作らせるのではなく、AIに「何が作れなかったか」を書かせる方法論です。予備知識ゼロのAIの「無い」が強い証拠になる理由、手組みの跡を次に作るコンポーネントの仕様として読む手順、AIが正直に書ける環境の作り方をまとめます。

記事タグ: デザインシステム / AI生成UI / UI検品 / デザインレビュー

「作るべき理由」には強さの段階がある — なぜ『HTML構造上つくれない』が最強か

10分で読める

そのコンポーネントを作るべきかの判断根拠は、弱・中・強の3段に分かれます。最も強いのは「既存のコンポーネントではHTML構造上つくれない」です。書類ダウンロード行を例に、拡張で足りる場合と新設しかない場合の線を引きます。

記事タグ: デザインシステム / UIコンポーネント / AI生成UI / アクセシビリティ

「ユースケース別の対応表」の落とし穴 — 予備知識ゼロのAIが誤誘導された6パターン

12分で読める

やりたいことからコンポーネントを引く一覧は、間違った先へ誘導すると、載せないより危険です。予備知識ゼロのAIに170画面を組ませて見つかった誤誘導を6つのパターンに整理し、対応表の質を測る4つの軸(型・アクセシビリティ・形・扱う対象)を示します。

記事タグ: デザインシステム / UIコンポーネント / AI生成UI / 情報設計

3回確認で生まれたコンポーネントたち — 26の新コンポーネントはどう群青に加わったか

15分で読める

3つの別々の画面で独立に手組みされたら初めて作る、という運用を170画面続けて群青に加わった26のコンポーネントを、8つのグループに束ねて紹介します。どの3画面が根拠になったかを、画面の番号つきで辿れます。

記事タグ: デザインシステム / UIコンポーネント / AI生成UI

作ってから再発見までの距離が縮む — コンポーネントの蓄積が育つとはこういうことだった

11分で読める

デザインシステムが育ったかどうかは、作ったコンポーネントが次に自力で見つかるまでのラウンド数で測れます。170画面のコールドテストで、この距離は初期の17から終盤の1〜2まで縮みました。距離を縮める3つの仕組みも並べます。

記事タグ: デザインシステム / UIコンポーネント / AI生成UI

「完走」の定義が変わった — 運輸5モードを、事業者向けと利用者向けの両面で走り切った記録

12分で読める

鉄道・航空・バス・タクシー・トラックの5モードを、事業者向けと利用者向けの両面で60画面以上走り切った記録です。利用者向けを1枚で締めかけた失敗から、完走の定義を「両面が同じ厚みになったとき」に引き直すまでを書きます。

記事タグ: デザインシステム / UIコンポーネント / AI生成UI

AIが作った画面で、実際に起きた29の失敗

42分で読める

自分たちがAIに作らせた業務画面175枚を検品し、実際に起きた失敗を29個並べました。すべて画面の番号つきです。動く画面が出てくることと、出してよいことは別です。各項目に、手元の画面で確かめるための目安を1行添えています。

記事タグ: AI生成UI / UI検品 / デザインレビュー / デザインシステム / アクセシビリティ
23
6
次へ