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.5k
業務効率化だけじゃ物足りない AIと一緒にプロトタイプ開発
2025年4月9日に、「
AIとデザインのセカンドステージ
」で発表した資料です。
Shingo Suzuki
April 08, 2025
Tweet
Share
More Decks by Shingo Suzuki
See All by Shingo Suzuki
実務のための マイクロ インタラクション入門
shingo2000
0
690
Figmaを使ったマルチプラットフォームサービスのデザイン管理
shingo2000
3
1.6k
Filmarks デザイナー向け紹介資料
shingo2000
3
1.6k
つみきのデザインについて
shingo2000
0
200
つみきのデザインポリシー
shingo2000
1
120
Adobe XDでアプリの画面遷移を検証
shingo2000
0
160
Adobe XDでアプリデザインのワークフローを改善
shingo2000
1
130
Other Decks in Design
See All in Design
文字コントラストを改めて考える / Reevaluating Text Contrast
lycorptech_jp
PRO
0
330
Crisp Code inc. ブランドガイドライン
so_kotani
1
190
PF_濵村ひろみ_202503
maru_design78
0
200
数理的アプローチで挑むスマホUIのデザイン改善:タップ成功率推定ツール「Tappy」の社内活用事例 / Improving Smartphone UI Design with a Mathematical Approach: In-house Use Case of the Tap Success Rate Estimation Tool "Tappy"
lycorptech_jp
PRO
0
580
The Golden Whitney
ohtristanart
PRO
0
580
The Spectacular Lies of Maps
axbom
PRO
1
140
Goodpatch Tour💙 / We are hiring!
goodpatch
31
870k
UXとUIの違いを自分の言葉で表現する: UX DAYS TOKYO
mizunashi_mana
0
200
Hatena Engineer Seminar #33 チームと開発するためのモック
takuwolog
0
390
portfolio_YumiYasuda
yum0418
0
300
株式会社ログラス - 会社説明資料【デザイナー】/ Loglass Designer
loglass2019
1
790
BPStudy#213〜ビジネスアナリシスとDDD(ドメイン駆動設計)パネルディスカッション資料 / BPStudy213-panel
haru860
0
450
Featured
See All Featured
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.5k
Music & Morning Musume
bryan
46
6.7k
Mobile First: as difficult as doing things right
swwweet
223
9.7k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
54k
Fireside Chat
paigeccino
37
3.5k
Gamification - CAS2011
davidbonilla
81
5.4k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
282
13k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
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