AIに伝わるUI語彙、全103個。名前を知るだけで、指示精度が劇的に変わる。
15件のコンポーネント
データ読み込み中の仮置き表示。灰色のブロックがアニメーションする
スケルトンがあるだけで『ちゃんとしたサービスだな』と思われる。無いとアマチュア。
月表示のカレンダーUI。予定や予約の表示・選択に使う
カレンダーUIがあると『業務アプリレベル』の印象になる。個人開発の域を超える。
横スワイプ/スライドで画像やカードを送るUI
画像が多いサービスで必須。スムーズなカルーセルは洗練の象徴。
出来事を時系列で縦に並べるUI
履歴表示がタイムラインだと『UXわかってる人だ』感が出る。リスト表示とは格が違う。
売上・ユーザー数などの大きな数字 + ラベル表示
ダッシュボードに統計カードがあると一発で『本格的』な印象。
進捗をバーで可視化するUI
数字だけより視覚的に進捗がわかる。ダッシュボードの定番パーツ。
カテゴリやステータスを小さいラベルで表示
タグで情報を分類できると一気にプロっぽくなる。色分けで効果倍増。
★★★★★ で評価を表示
レビュー系UIには必須。星があると口コミの信頼感が段違い。
データが無い時の表示。イラスト + メッセージ + アクションボタン
空状態をケアしてるアプリは少数派。これがあると『細部まで考えてる』と思われる。
クリックで拡大プレビュー・ギャラリー表示に対応した画像
画像がただ貼ってあるだけ vs プレビューできる、この差は大きい。
ラベルと値のペアを並べる(プロフィール詳細、注文明細等)
詳細画面の見やすさが一気に上がる。テーブルほど重くなくてちょうどいい。
✓付きの箇条書きで機能や特徴を列挙
料金カードの中の定番パーツ。✓と✗で比較できると購入判断が早くなる。
X、Instagram、YouTube等のSNSアイコン群
SNS連携してる感。ブランドの存在感が増す。
引用文を装飾付きで表示するUI
テスティモニアル内で使うと発言の重みが増す。
ベルアイコン等に付く未読件数の赤い丸
リアルタイム性のあるアプリ感が出る。通知がある = 動いてるサービス。