イヌコミ(inucomi)

デザインシステム

共通コンポーネント

ページ、カード、フォーム、ナビゲーションを再利用できる単位へ整理します。

UIをページ単位で作り切らず、用途と状態を持った部品として扱うことで、追加開発時の揺れとレビュー負荷を下げます。

更新日
2026-07-10
対象
固定ページ、カード、フォーム、ナビゲーション
01

固定ページテンプレート

法務、問い合わせ、イヌコミ紹介、看板犬、デザインシステムを用途別に分けます。

  • ページの種類ごとに表示内容を分ける
  • 自由記述の領域と定型表示の領域を分ける
  • 構造化データ、パンくず、メタ情報を共通化する
02

カード

店舗、記事、イベント、看板犬などの一覧を同じ読み方にします。

  • 画像比率、角丸、タイトル行数、メタ情報位置を揃える
  • カード全体リンクと内部リンクの競合を避ける
  • 空状態、読み込み中、画像欠落時の見え方を定義する
03

フォーム

入力、確認、送信、エラー、完了を同じ流れで扱います。

  • 必須、任意、エラー、補足説明の表示位置を固定する
  • 送信前確認と送信後の再編集導線を用意する
  • 異なる用途のフォームでも同じ入力部品を使う

コンポーネント一覧

目的に合う部品をすぐ見つける

入力、選択、ナビゲーション、フィードバックなど、イヌコミで使うUI部品を確認できます。

15 / 15