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
5k
生成AI×ノーコード (スピーディーなアプリ開発の新時代)
11月12日に開催された「FlutterFlow Tokyo Summit」にて登壇した「生成AI×ノーコード (スピーディーなアプリ開発の新時代)」の登壇資料です
KNR
November 12, 2023
Tweet
Share
More Decks by KNR
See All by KNR
GPTs活用事例集
knr109
6
5.1k
2023年はたくさんアウトプットしたよ
knr109
1
1.1k
要件定義入門 (失敗しないために必要なこと)
knr109
36
12k
ChatGPTとLLMを活用して1週間で個人開発をした話
knr109
2
3.5k
(新人)エンジニアが開発しやすいREADMEの書き方
knr109
17
9.7k
クリエイター広場を作りました
knr109
0
180
Other Decks in Programming
See All in Programming
Honoをフロントエンドで使う 3つのやり方
yusukebe
7
3.5k
推しメソッドsource_locationのしくみを探る - はじめてRubyのコードを読んでみた
nobu09
2
260
Rubyで始める関数型ドメインモデリング
shogo_tksk
0
140
AIプログラミング雑キャッチアップ
yuheinakasaka
17
4.3k
生成AIで加速するテスト実装 - ロリポップ for Gamersの事例と 生成AIエディタの活用
kinosuke01
0
120
複数のAWSアカウントから横断で 利用する Lambda Authorizer の作り方
tc3jp
0
110
もう僕は OpenAPI を書きたくない
sgash708
5
1.9k
How mixi2 Uses TiDB for SNS Scalability and Performance
kanmo
40
16k
技術を改善し続ける
gumioji
0
120
なぜイベント駆動が必要なのか - CQRS/ESで解く複雑系システムの課題 -
j5ik2o
14
4.6k
未経験でSRE、はじめました! 組織を支える役割と軌跡
curekoshimizu
1
150
コミュニティ駆動 AWS CDK ライブラリ「Open Constructs Library」 / community-cdk-library
gotok365
2
240
Featured
See All Featured
Producing Creativity
orderedlist
PRO
344
40k
How to Ace a Technical Interview
jacobian
276
23k
Art, The Web, and Tiny UX
lynnandtonic
298
20k
Git: the NoSQL Database
bkeepers
PRO
427
65k
A Tale of Four Properties
chriscoyier
158
23k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
175
52k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
The Pragmatic Product Professional
lauravandoore
32
6.4k
For a Future-Friendly Web
brad_frost
176
9.6k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
45
9.4k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
10
1.3k
Java REST API Framework Comparison - PWX 2021
mraible
29
8.4k
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) ご清聴ありがとうございました