Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
業務効率化だけじゃ物足りない AIと一緒にプロトタイプ開発
Search
Shingo Suzuki
April 08, 2025
Design
1
1.6k
業務効率化だけじゃ物足りない AIと一緒にプロトタイプ開発
2025年4月9日に、「
AIとデザインのセカンドステージ
」で発表した資料です。
Shingo Suzuki
April 08, 2025
Tweet
Share
More Decks by Shingo Suzuki
See All by Shingo Suzuki
実務のための マイクロ インタラクション入門
shingo2000
0
730
Figmaを使ったマルチプラットフォームサービスのデザイン管理
shingo2000
3
1.7k
Filmarks デザイナー向け紹介資料
shingo2000
3
1.6k
つみきのデザインについて
shingo2000
0
200
つみきのデザインポリシー
shingo2000
1
130
Adobe XDでアプリの画面遷移を検証
shingo2000
0
160
Adobe XDでアプリデザインのワークフローを改善
shingo2000
1
130
Other Decks in Design
See All in Design
デザインの意思決定を加速するワークショップ設計 / Workshop design to accelerate design decision-making
lycorptech_jp
PRO
0
530
「批評」を習慣にするための仕組みと場のデザイン/uxdesign202507
nikkei_engineer_recruiting
6
890
AI時代に問われる、リサーチの感受性──地域⇄大企業の現場から見えた「違和感」との向き合い方
muture
PRO
0
120
Memory Man v3 (WIP)
storybychad
PRO
0
2.7k
kintone_aroma
kintone
0
100
組織で取り組むアクセシビリティのはじめ方
masakiohsumi
0
190
Illustrator×Firefly 生成したイラストをベースにドット絵を作ってみよう!
connecre
1
140
AIを身近に感じるために、デザイナー全員で一つのサービスを使ってみた
_psyc0_
0
320
Correspondence:共に生成していく過程
akiramotomura
0
100
チームで事業価値を生み出す、プロアクティブなデザイナーになるための道のり/ Designship2025_Naya
root_recruit
PRO
0
210
保育AIプロダクトの UXデザインで考えてきたこと / hoiku-ai-ux-design
hiro93n
0
180
一次体験を起点にしたUX改善の取り組み / Direct Experience Driven UX Improvements
bitkey
PRO
0
250
Featured
See All Featured
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
1.7k
GraphQLとの向き合い方2022年版
quramy
49
14k
The Invisible Side of Design
smashingmag
302
51k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
34
2.3k
A better future with KSS
kneath
239
18k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.1k
The Illustrated Children's Guide to Kubernetes
chrisshort
49
51k
Designing Experiences People Love
moore
142
24k
How GitHub (no longer) Works
holman
315
140k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.7k
Faster Mobile Websites
deanohume
310
31k
Transcript
AIとデザインのセカンドステージ 鈴木慎吾 株式会社つみき Filmarks リードデザイナー |
#aidesign_2nd デザイナーが AIをどうやって 使っていくか? コンテンツライティング リサーチ後の分析 コンセプトの発散 デザインの説明資料 調査資料をまとめる ドキュメントの作成
業務計画の作成 スケジュール調整 ブレスト相手 インタビューの要約
#aidesign_2nd 既存業務の 効率化だけじゃ 物足りない! コンテンツライティング リサーチ後の分析 コンセプトの発散 デザインの説明資料 調査資料をまとめる ドキュメントの作成
業務計画の作成 スケジュール調整 ブレスト相手 インタビューの要約
#aidesign_2nd もっと、 デザイナーの仕事の幅を 広げるような使い方がないか?
#aidesign_2nd 事例1 社内の課題を元に ChatGPTで Figmaプラグイン開発 デザイナーの仕事の幅を広げるには?
社内の課題を元にChatGPTでFigmaプラグイン開発 #aidesign_2nd チームの課題 解決策のアイディア デザイナーwaka2kiさん デザイン後に、用語一覧をみながら 文言確認することが抜けがち Figmaプラグインをつくってみる
社内の課題を元にChatGPTでFigmaプラグイン開発 #aidesign_2nd プロトタイプ その日のうちに、ChatGPTを使ってプロトタ イプを開発。 基本となるインタラクションと 誤字判定のロジックが決定。 実現性 インタラクション 誤字判定のロジック
社内の課題を元にChatGPTでFigmaプラグイン開発 #aidesign_2nd デザイン調整 機能追加 リリース プロトタイプを元に、 デザイン調整と機能追 加を行いFigmaプラグインとして公開。 基本機能がはじめに検証されていたため、
素早く進めることができた。 ※詳細:Figmaのテキストを自動チェックする用語統一プラグインを作った https://note.com/shingo2000/n/nb4a46f000e4e
#aidesign_2nd デザイナーの仕事の幅を広げるには? 事例2 Cursorで、 触覚フィードバックの 検証用アプリを開発
Cursorで触覚フィードバックの検証アプリを開発 #aidesign_2nd チームの課題 自社アプリに効果的に触覚フィードバックを 取り入れたい。 OSのガイドラインは確認したが、触ってみな いとイメージが沸かない。
Cursorで触覚フィードバックの検証アプリを開発 #aidesign_2nd プロトタイプ Cursor(AIコードエディタ) で検証用iOSアプリを開発 CursorはチャットでAIとやり取りしながら、開 発できるコードエディタ 参考:Vibe Coding for
mobile with Cursor AI https://uxplanet.org/vibe-coding-with- cursor-ai-52f5023bc59a
Cursorで触覚フィードバックの検証アプリを開発 #aidesign_2nd Xcodeでプロジェクトファイルを新規作成 Cursorで開き、実装を依頼 プロジェクトファイルを確認した上で実装を開始 Xcodeでプロジェクトをビルドして実機確認 必要に応じて修正依頼 指示に基づいて修正 修正依頼を数回繰り返して完成!
Cursorで触覚フィードバックの検証アプリを開発 #aidesign_2nd 完成 機能要件の検討 触覚フィードバックを実機確認できる iOSアプリが1時間ほどで完成 触覚フィードバックの種類を確 カスタムパラメータの設u
カスタムパターンの作成と確認 機能要件の検討に素早く進むことができる ※詳細:Cursorで触覚フィードバックの検証アプリを開発した https://note.com/shingo2000/n/n2a0e148824ba
#aidesign_2nd プロトタイプを作ってみて、 初めてわかること 事例1 T テキストチェックのFigmaプラグイン の実現E T どんなインタラクションを備えている と実用的になるか8
T テキスト判定にどんなロジックが必 要か? 事例2 T iOSで標準提供されている触覚 フィードバックの種 T カスタムする場合はどんなパラメー タがあるか8 T パラメータの変更が触覚にどう影響 するか?
#aidesign_2nd プロトタイプ開発 = 試して気づく発見的なアプローチ プロトタイプ開発 = 試して気づく、 発見的なアプローチ 「とりあえず作ってみる」 姿勢は、
デザイナーの得意領域 AIと一緒にプロトタイプ開発すると“試せること”の幅が大きく広がる
#aidesign_2nd AIと一緒にプロトタイプ開発して 「とりあえず作ってみる」 の幅を広げよう
#aidesign_2nd Vibe Coding for mobile with Cursor AI https://uxplanet.org/vibe-coding-with- cursor-ai-52f5023bc59a
アプリエンジニア/Railsエンジニア /データエンジニア https://www.wantedly.com/ companies/tsumiki/projects Filmarksの エンジニアを募集中 5/11 (日) 12時 @面白法人カヤック https://friends.figma.com/events/ details/figma-shonan-presents- shonan-config-watch-party-2025 Config Watch Party 2025 Friends of Figma Shonan The Return of the UX Generalist https://www.nngroup.com/articles/ return-ux-generalist/ 参考資料
ありがとうございました @shingo2000 note.com/shingo2000 #aidesign_2nd