デザインシステムを中心とした AI 開発支援と Generative UI の取り組み ©giftee Inc. all rights reserved 2026/02/28 React Tokyo egurinko 

江口 徹 (@egurinko) ● 株式会社ギフティ EM ○ デザインシステム ○ AI 事業活用推進 ● React の未来を見せてくれる Next.js が好き 自己紹介 

ギフティの目指すこと e ギフトを軸として、人、企業、街の間に、 さまざまな縁を育むサービスを提供する キモチの循環を促進することで、 よりよい関係でつながった社会をつくる Vision Mission 

e ギフトの流通 DP eギフト プラットフォーム 個人 法人 自治体 e ギフトの発行 CP 飲食 小売 体験 流通 eGift API 発券•消込 eGift System 利用者が増えるとe ギフトも増加 eギフトが増えると利用者が増加 ギフティの事業の核であり、e ギフトの発行から流通まで一気通貫で提供しています。 e ギフトプラットフォーム DP = Distribution Partner eギフト流通パートナー CP = Content Partner eギフト発行企業 

デザインシステムを中心とした AI の取り組みを 2 つ紹介します 

デザインシステム: Abukuma 

デザインシステムを軸とした AI の取り組み AI 開発支援 Generative UI 

{ “definition”: “”, “storybooks”: “”, “guidelines”: { “name”:”Button”, “purpose”:”アクションするコンポーネント。”, “props”: {}, “rules”: [], “antiPatterns”: [], “accessibility”: [] } } ● list_react_components ● get_react_component ● validate_react_usage guideline と validation で より正確なコード生成 AI 開発支援: MCP サーバ 

ブランド価値を守ったUI 構築を 誰もが素早く正確に行える ● UI 構築時の MCP 利用推奨 ● Search => Validate のフロー強制 AI 開発支援: Skill 

デザインシステムを軸とした AI の取り組み AI 開発支援 Generative UI 

ギフティには 2,000 種類以上のギフトがある 皆が知っている便利なギフトは見つけやすい しかし、相手があっと驚くようなギフトを見つけにくい 

ギフティには 2,000 種類以上のギフトがある 皆が知っている便利なギフトは見つけやすい しかし、相手があっと驚くようなギフトを見つけにくい ギフト提案の AI エージェント 

ヒアリング 提案 ギフト提案フロー 

No content

完全な自由テキストは ユーザには難しい 

もう少し動的だけど、制限のある UI が良い 予算 3,000 円 取引先のお歳暮 赤ちゃんが 生まれた ？ ？ ヒアリングには無限のパターンがある 

よーし、Generative UI だ 

Generative UI の技術コンポーネント ● A2UI ○ Agent が UI を生成するための UI プロトコル ○ やり取りするデータフォーマットのようなもの ● AG-UI ○ Agent とフロントを繋ぐ通信プロトコル ● (MCP Apps) ○ Agent が生成するミニアプリを iframe で埋め込む 

Agent [ { "id":"root", "component":"Column", "children":["text1","card1"] }, { "id":"text1", "component":"Text", "text":"ご予算は？", "variant":"headline" }, {"id":"card1","component":"Card", "children":["btn1","btn2"]}, … ] React データ生成 パース 

● A2UI にカスタムカタログを定義できる ● そこにデザインシステムを定義 生成される UI はデザインシステムに統一したい 

● A2UI にカスタムカタログを定義できる ● そこにデザインシステムを定義 生成される UI はデザインシステムに統一したい Generative UI もデザインシステムで作れる 

結論 デザインシステムがあれば、 ● 足元の開発も品質高くスピードアップできる ● Generative UI の品質も高くすることができる 

新しい文化をつくっていく仲間たちを募集しています。 WE ARE HIRING giftee 採用ページ