概要
https://note.com/chankar_e_/n/n2557449b5a5b
詳細内容
## 【Cursor✖️Figma】非エンジニアでも出来た!金融系UIデザインをAIで効率化する方法
https://note.com/chankar_e_/n/n2557449b5a5b
AIコードエディタCursorとFigma MCPを連携させ、金融ドメイン特有の厳格なUIレビューとライティング確認を自動化するワークフローを構築する。
**Content Type**: ⚙️ Tools
**Language**: ja
**Scores**: Signal:4/5 | Depth:3/5 | Unique:4/5 | Practical:5/5 | Anti-Hype:4/5
**Main Journal**: 81/100 | **Annex Potential**: 80/100 | **Overall**: 80/100
**Topics**: [[Cursor, Figma MCP, デザインレビュー, フィンテック, Model Context Protocol]]
FinTechスタートアップ「Kyash」のデザイナーが、非エンジニアの立場からCursorとFigmaを連携させ、プロダクトデザインの品質管理と業務効率化を実現した実践記録。金融系プロダクトにおいて不可欠な「言葉の正確さ」や「法的・社内規範の遵守」を、AIを活用してセルフチェックできる体制を構築している。
著者は、ドメイン知識の属人化や、デザインレビューがPM(プロダクトマネージャー)の確認工数に依存している現状を課題として挙げている。これに対し、Cursorを「コードを書くため」ではなく「AIエージェントによるデザインレビューツール」として再定義し、Figma MCP(Model Context Protocol)を介してデザインデータと社内ガイドラインをAIに参照させる手法を提案している。
具体的な構成として、FigmaのDev ModeでMCPサーバーを起動し、Cursor側からローカルホスト(`http://127.0.0.1:3845/mcp`)経由で接続。さらに、PDFやドキュメント形式の社内ガイドラインをCursorのインデックス機能(@Symbols / @Files)で読み込ませることで、「社内のルールを熟知したシニアデザイナーやPM」のような振る舞いをAIに学習させている。
この仕組みの導入により、Figma上で選択したフレームに対して「法律や社内規範に抵触するテキストがないか」「ガイドラインに沿っているか」をCursor上のチャットで即座に検証可能となった。結果として、従来Slackで行われていたPMとのレビュー往復回数が約3分の1(6回から2回程度)に激減し、デザイナー自身がより上流のUX検討やビジョン策定に時間を割けるようになったと報告している。
著者は、専門知識が必要で慎重な表現が求められる金融や行政などの領域こそ、この「AIによるドメイン知識の補完」が大きな価値を生むと主張している。エンジニア向けツールであるCursorを、プロンプトエンジニアリングと外部コンテキスト接続によって「非エンジニアの専門業務を支援する知能」へと転換させた、具体的かつ再現性の高い事例である。