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.8k
生成AI×ノーコード (スピーディーなアプリ開発の新時代)
11月12日に開催された「FlutterFlow Tokyo Summit」にて登壇した「生成AI×ノーコード (スピーディーなアプリ開発の新時代)」の登壇資料です
KNR
November 12, 2023
Tweet
Share
More Decks by KNR
See All by KNR
GPTs活用事例集
knr109
5
3.1k
2023年はたくさんアウトプットしたよ
knr109
1
640
要件定義入門 (失敗しないために必要なこと)
knr109
30
8.9k
ChatGPTとLLMを活用して1週間で個人開発をした話
knr109
0
1.5k
(新人)エンジニアが開発しやすいREADMEの書き方
knr109
17
8.1k
クリエイター広場を作りました
knr109
0
130
Other Decks in Programming
See All in Programming
Going beyond Apache Parquet's default settings
xhochy
0
150
An adventure of Happy Eyeballs
coe401_
1
140
欠陥を早期に発見するための Software Engineer in Test とその重要性 / What is Software Engineer in Test and How they works
orgachem
PRO
17
2.3k
TypeScriptとGraphQLで実現する 型安全なAPI実装 / TSKaigi 2024
hokaccha
5
2.7k
Deep Dive into React Stream/Serialize
mugi_uno
4
850
Ruby on Fails - effective error handling with Rails conventions
talyssonoc
0
290
Next.js App Router
quramy
14
2.3k
Docker_OSS_ホスティング入門
satokoki645
0
140
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
0
120
教えて!スクラムコーチ品質とスピードのバランスはどうすりゃいいの?
pinboro
0
100
RustでAWS Lambda functionをいい感じに書く
taiki45
2
140
Escolhendo (ou não) o melhor ORM para o seu projeto
andreiacsilva
1
160
Featured
See All Featured
The World Runs on Bad Software
bkeepers
PRO
61
6.7k
Bootstrapping a Software Product
garrettdimon
PRO
302
110k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
22
1.4k
Product Roadmaps are Hard
iamctodd
45
9.8k
Designing for Performance
lara
601
67k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
18
7k
The Brand Is Dead. Long Live the Brand.
mthomps
49
30k
Testing 201, or: Great Expectations
jmmastey
30
6.4k
Fontdeck: Realign not Redesign
paulrobertlloyd
76
4.9k
A designer walks into a library…
pauljervisheath
201
23k
Building a Modern Day E-commerce SEO Strategy
aleyda
22
6.5k
jQuery: Nuts, Bolts and Bling
dougneiner
60
7.2k
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) ご清聴ありがとうございました