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
KNR
November 12, 2023
Programming
3
4.9k
生成AI×ノーコード (スピーディーなアプリ開発の新時代)
11月12日に開催された「FlutterFlow Tokyo Summit」にて登壇した「生成AI×ノーコード (スピーディーなアプリ開発の新時代)」の登壇資料です
KNR
November 12, 2023
Tweet
Share
More Decks by KNR
See All by KNR
GPTs活用事例集
knr109
6
4.8k
2023年はたくさんアウトプットしたよ
knr109
1
740
要件定義入門 (失敗しないために必要なこと)
knr109
31
9.6k
ChatGPTとLLMを活用して1週間で個人開発をした話
knr109
2
2.9k
(新人)エンジニアが開発しやすいREADMEの書き方
knr109
17
9.1k
クリエイター広場を作りました
knr109
0
160
Other Decks in Programming
See All in Programming
LR で JSON パーサーを作る / Coding LR JSON Parser
junk0612
2
170
Regular Expressions, REXML, Automata Learning
makenowjust
0
180
労務ドメインを快適に開発する方法 / How to Comfortably Develop in the Labor Domain
yuki21
1
250
Modular Monolith Go Server with GraphQL Federation + gRPC
110y
1
550
Method Swizzlingを行うライブラリにおけるマルチモジュール設計
yoshikma
0
100
Mastering AsyncSequence - 使う・作る・他のデザインパターン(クロージャ、Delegate など)から移行する
treastrain
3
1.3k
connect-go で面倒くささと戦う / 2024-08-27 #newmo_layerx_go
izumin5210
2
590
LangChainの現在とv0.3にむけて
os1ma
3
650
Uncharted packages (Laravel Live Denmark)
freekmurze
0
140
Kotlin 2.0 and Beyond
antonarhipov
2
130
長期運用プロダクトの開発速度を維持し続けるためのリファクタリング実践例
wataruss
8
2.5k
【TID2024】模擬講義:プログラマと一緒にゲームをデザインしてみよう!
akatsukigames_tech
0
380
Featured
See All Featured
Why Our Code Smells
bkeepers
PRO
333
56k
Optimizing for Happiness
mojombo
375
69k
The Brand Is Dead. Long Live the Brand.
mthomps
53
37k
What’s in a name? Adding method to the madness
productmarketing
PRO
21
3k
Typedesign – Prime Four
hannesfritz
38
2.3k
Building Flexible Design Systems
yeseniaperezcruz
324
37k
Why You Should Never Use an ORM
jnunemaker
PRO
53
8.9k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
22
1.7k
How GitHub (no longer) Works
holman
309
140k
For a Future-Friendly Web
brad_frost
173
9.3k
Building Better People: How to give real-time feedback that sticks.
wjessup
359
18k
The Art of Programming - Codeland 2020
erikaheidi
48
13k
Transcript
生成AI×ノーコード スピーディーなアプリ開発の新時代 KNR
1 2 3 4 自己紹介・今日のゴール 従来のアプリ開発 生成AIを使った上流工程 ノーコードでのアプリ開発 目次
1 2 3 4 自己紹介・今日のゴール 従来のアプリ開発 生成AIを使った上流工程 ノーコードでのアプリ開発 目次
自己紹介 名前: KNR (26) 会社: Web系のシステム開発 役職: 執行役員 実績: Qiita
2022年 1位 趣味: DJ, サウナ, イベント運営
今日のゴール 生成AIを使った要件定義、設計 (上流工程)の進め方がわかる ノーコード・ローコードを使ったアプリ開発 (プロトタイプの作成)がわかる
1 2 3 4 自己紹介 従来のアプリ開発と今 生成AIを使った上流工程 ノーコードでのアプリ開発 目次
アプリ開発の流れ
ノーコードの登場 ノーコード・ローコード
生成AIの登場 生成AI ノーコード・ローコード
生成AIの登場 生成AI ノーコード・ローコード 前半 後半
1 2 3 4 自己紹介 従来のアプリ開発と今 生成AIを使った上流工程 ノーコードでのアプリ開発 目次
生成AI(ChatGPT)を使った上流工程 (要件定義、設計) 建築業界における資料のDX化を例に考える
要件定義の成果物 システム開発する目的 (Why) - 要件定義 どのように課題を解決するか (What) - 要件定義 どのようなシステムを作るのか
(How) - 設計
要件定義の成果物 システム開発する目的 (Why) - 要件定義 どのように課題を解決するか (What) - 要件定義 どのようなシステムを作るのか
(How) - 設計
システム開発する目的 (Why) - お客さんからヒアリング 建築現場の資料のDX化により、資料作成、検索及び整理の迅速化 作成された資料を元に情報をナレッジ化し共有
要件定義の成果物 システム開発する目的 (Why) - 要件定義 どのように課題を解決するか (What) - 要件定義 どのようなシステムを作るのか
(How) - 設計
None
None
None
要件定義の成果物 作成した仮説を元にヒアリングを行い要件を決めていく
生成AI(ChatGPT)を使った上流工程 (要件定義、設計) 要件定義 設計
設計の成果物 システム開発する目的 (Why) - 要件定義 どのように課題を解決するか (What) - 要件定義 どのようなシステムを作るのか
(How) - 設計
設計フェーズの成果物 機能設計 画面設計 (ワイヤー) データモデル
設計フェーズの成果物 機能設計 画面設計 (ワイヤー) データモデル
機能の仕様書 - プロンプト
None
設計フェーズの成果物 機能の仕様書 画面設計 (ワイヤー) データモデル
画面設計 (ワイヤー) - プロンプト
None
None
設計フェーズの成果物 これを元に実際は、画面のワイヤーを作成していきます
設計フェーズの成果物 機能の仕様書 画面設計 (ワイヤー) データモデル
データモデル - プロンプト
データモデル - 回答
データモデル - 回答
設計フェーズの成果物 機能仕様書 画面設計書 データ設計書
1 2 3 4 自己紹介 従来のアプリ開発と今 生成AIを使った上流工程 ノーコードでのアプリ開発 目次
ローコード・ノーコードでのアプリ開発 FlutterFlowの特徴 FlutterFlowでプロトタイプを作成する
ローコード・ノーコードでのアプリ開発 FlutterFlowの特徴 FlutterFlowでプロトタイプを作成する
FlutterFlowの特徴 GUIでサクッとアプリが開発できる ウィジェットやテンプレートが豊富 ソースコードをダウンロードできる FirebaseやSupabaseとの外部連携が容易
ノーコードでのアプリ開発 FlutterFlowと他のノーコードツール比較 FlutterFlowでプロトタイプを作成する
ノーコードでのアプリ開発 - 前提 今回作成するものは完成品ではなく、提案フェーズで見せるプロトタイプ
FlutterFlowでプロトタイプを作成する
FlutterFlowでプロトタイプを作成する - ダッシュボード
FlutterFlowでプロトタイプを作成する - ダッシュボード
None
FlutterFlowでプロトタイプを作成する - 資料作成
FlutterFlowでプロトタイプを作成する - 資料作成 画面作成自体もAIを使う
FlutterFlow AI Gen
None
まとめ 生成AIとFlutterFlowを使うことで提案フェーズで動くものを見せられる 実際の開発工数も大幅に削減できる
Twitter (X) ご清聴ありがとうございました