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

記事一覧

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

UIデザイン完全ガイド

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

見る

UX心理(119)

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

見る

UI原則(65)

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

見る

UIコンポーネント(69)

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

見る

用語集(536)

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

見る

UIデザイン完全ガイド

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

見る

UX心理(119)

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

見る

UI原則(65)

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

見る

UIコンポーネント(69)

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

見る

用語集(536)

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

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

UIXHERO

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

ナビゲーション

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

その他

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

プライバシーポリシー

© 2026 UIXHERO. All rights reserved.

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

Bar Chart(棒グラフ)

18分で読める

カテゴリごとの量を棒の長さで比べるチャート。ゼロ基線の扱い、並び順、縦横の選び方、しきい値の見せ方という設計判断と、色だけに頼らないアクセシビリティ要件を解説する。

コンポーネントタグ: ui-components / bar-chart / data-visualization

Donut Chart(ドーナツチャート)

17分で読める

中央をくり抜いた円で構成比を示すチャート。中央に置く値の選び方、円グラフとの使い分け、リングの太さ、凡例の作りという設計判断と、色だけに頼らないアクセシビリティ要件を解説する。

コンポーネントタグ: ui-components / donut-chart / data-visualization

Gauge Chart(ゲージチャート)

16分で読める

1つの値を範囲の中に置いて示す半円のチャート。範囲の両端に意味があるかという条件、しきい値の帯の設計、色だけで良否を伝えない書き方という設計判断とアクセシビリティ要件を解説する。

コンポーネントタグ: ui-components / gauge-chart / data-visualization

Heatmap Chart(ヒートマップ)

17分で読める

行と列の交点をセルの濃淡で示すチャート。濃淡で読めるものと読めないもの、色の段階の切り方、行列の並び順、値を数字でも出す判断とアクセシビリティ要件を解説する。

コンポーネントタグ: ui-components / heatmap-chart / data-visualization

Line Chart(折れ線グラフ)

17分で読める

時間に沿った値の動きを線で示すチャート。点をつないでよいデータの条件、縦軸を切るときの書き方、系列数の上限、直接ラベルという設計判断と、色だけに頼らないアクセシビリティ要件を解説する。

コンポーネントタグ: ui-components / line-chart / data-visualization

Pie Chart(円グラフ)

18分で読める

全体に対する構成比を扇形で示すチャート。合計が意味を持つ条件、区分数の上限、並び順、値をどこに書くかという設計判断と、色だけに頼らないアクセシビリティ要件を解説する。

コンポーネントタグ: ui-components / pie-chart / data-visualization

Radar Chart(レーダーチャート)

17分で読める

複数の軸のスコアを多角形で示すチャート。軸の順序で形が変わるという性質、正規化の根拠、重ねられる系列数、面積を読ませない書き方という設計判断とアクセシビリティ要件を解説する。

コンポーネントタグ: ui-components / radar-chart / data-visualization

Sparkline Chart(スパークライン)

17分で読める

軸も目盛りも持たない小さな傾向線。数字と並べて置く理由、複数を並べるときに縦軸をそろえる必要、期間の明示という設計判断とアクセシビリティ要件を解説する。

コンポーネントタグ: ui-components / sparkline-chart / data-visualization

Stacked Bar Chart(積み上げ棒グラフ)

17分で読める

グループごとの内訳を積み上げて比べるチャート。正確に読めるのは最下段と合計だけという制約、系列の順序、100パーセント正規化の使いどころという設計判断と、色だけに頼らないアクセシビリティ要件を解説する。

コンポーネントタグ: ui-components / stacked-bar-chart / data-visualization

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検品 / デザインレビュー
23
34
次へ