Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Flutterエンジニアが FlutterFlowを使ってみた

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for MinatoIshiwata MinatoIshiwata
December 27, 2023
Technology
0
100

Flutterエンジニアが FlutterFlowを使ってみた

Avatar for MinatoIshiwata

MinatoIshiwata

December 27, 2023
Tweet

More Decks by MinatoIshiwata

See All by MinatoIshiwata
FlutterでFigmaのデザインに合わせて かっちりした実装する方法について
Avatar for MinatoIshiwata minatoishiwata
1
730

Other Decks in Technology

See All in Technology
OCI Security サービス 概要
Avatar for oracle4engineer oracle4engineer
PRO
2
13k
メタデータ同期に潜んでいた問題 〜 Cache Stampede 時の Cycle Wait を⾒つけた話
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
150
オンプレとGoogle Cloudを安全に繋ぐための、セキュア通信の勘所
Avatar for Yuta Ozaki waiwai2111
3
1.1k
チームメンバー迷わないIaC設計
Avatar for hayama hayama17
5
3.8k
組織のSREを推進するためのPlatform EngineeringとEKS / Platform Engineering and EKS to drive SRE in your organization
Avatar for mekka chmikata
0
180
AI時代にエンジニアはどう成長すれば良いのか？
Avatar for Recruit recruitengineers
PRO
1
130
ビズリーチにおける検索・推薦の取り組み / DEIM2026
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
1
100
自動テストが巻き起こした開発プロセス・チームの変化 / Impact of Automated Testing on Development Cycles and Team Dynamics
Avatar for コドモン開発チーム codmoninc
1
1.1k
EMからICへ、二周目人材としてAI全振りのプロダクト開発で見つけた武器
Avatar for Yuji Yamaguchi yug1224
3
380
「使いにくい」も「運用疲れ」も卒業する　UIデザイナーとエンジニアが創る持続可能な内製開発
Avatar for NRI Netcom nrinetcom
PRO
1
780
Agentic Software Modernization - Back to the Roots (Zürich Agentic Coding and Architectures, März 2026)
Avatar for Markus Harrer feststelltaste
1
170
Introduction to Bill One Development Engineer
Avatar for Sansan, Inc. sansan33
PRO
0
380

Featured

See All Featured
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
50
14k
Prompt Engineering for Job Search
Avatar for Mfonobong Umondia mfonobong
0
180
AI: The stuff that nobody shows you
Avatar for John Nunemaker jnunemaker
PRO
3
350
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.3k
Money Talks: Using Revenue to Get Sh*t Done
Avatar for Nikki Halliwell nikkihalliwell
0
170
The Spectacular Lies of Maps
Avatar for Per Axbom axbom
PRO
1
580
Utilizing Notion as your number one productivity tool
Avatar for Mfonobong Umondia mfonobong
4
240
Un-Boring Meetings
Avatar for Sebastian Deterding codingconduct
0
220
Building the Perfect Custom Keyboard
Avatar for Naoto Takai takai
2
710
Claude Code どこまでも/ Claude Code Everywhere
Avatar for nwiizo nwiizo
63
53k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8.1k
Claude Code のすすめ
Avatar for schroneko schroneko
67
220k

Transcript

  1. Flutterエンジニアが FlutterFlowを使ってみた 株式会社Pentagon 石渡港

  2. • 自己紹介 • FlutterFlowとは • FlutterFlowをつかってみての所感 • まとめ

  3. 自己紹介 01 株式会社Pentagon　石渡港 2011年 iOSアプリ開発開始 2012年 株式会社PYSE 2023年 株式会社Pentagon スキルセット

    Objective-C, Swift, Java, Kotlin, Flutter, Firebase, supabase

  4. 02

  5. FlutterFlowとは - Flutterアプリをノーコードで作成できるツール - UIとロジックを画面上で、ある程度指定可能 - Firebaseやsupabaseなどと連携ができる - 作成後、コードの出力が可能 03

  6. 実際の操作 動かしたほうが早いのでこちらをご覧ください デザインファイルも一緒に見てみましょう 04

  7. 実際の実装とは何が違うのか？ - TextThemeの種類が違う（Display**系） - SizedBoxが無いのでListView内でもPaddingで調整が必要 - ComponentをUI上で作成するとき結構大変だが、引数設定は楽 - 丸角設定は四隅を簡単に設定できる -

    obscureTextの設定をすると勝手にアイコンが付く - ボタンを押したときに画面遷移の設定は簡単で、ダイアログを出すのも簡単 - カラーの設定が意外と面倒 05

  8. コードの観点で見てみると コードダウンロードしたかったけど有料じゃないと出来なかった… - コードは無駄が多そうだけど読みやすい - 書くべきこと（disposeするなどのお作法）は整ってそう 06

  9. まとめ 簡単な画面をコードで1から書くより早そう デザイナさんとコラボして作ったらよさそう 一部は実装めんどくさそう