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
220906_誰でもすぐに使えるノーコードツール「Google AppSheet」タスク管理アプリをライブ作成!rev2_吉積情報_伊藤
Search
comucal
PRO
September 06, 2022
Technology
1
2.6k
220906_誰でもすぐに使えるノーコードツール「Google AppSheet」タスク管理アプリをライブ作成!rev2_吉積情報_伊藤
220906_誰でもすぐに使えるノーコードツール「Google AppSheet」タスク管理アプリをライブ作成!rev2_吉積情報_伊藤
comucal
PRO
September 06, 2022
Tweet
Share
More Decks by comucal
See All by comucal
Google Workspace で問い合わせ業務を改善!_株式会社G-gen 荒井
comucal
PRO
0
3.5k
RPACommunityについて 2024年6月版
comucal
PRO
0
380
はじめて買ったパソコンってなんでした_株式会社コミュカル_Mitz
comucal
PRO
0
1.3k
Self-introduction_Mitz
comucal
PRO
0
27
Gemini in AppSheet_吉積情報株式会社 石見
comucal
PRO
0
2.4k
ハイブリッドイベント&イベント盛り上げ&集客話_株式会社コミュカル Mitz
comucal
PRO
0
46
オンラインイベント活性化を考える_株式会社コミュカル Mitz
comucal
PRO
0
46
コミュニティが力を発揮できるケース_株式会社コミュカル Mitz
comucal
PRO
0
49
Gといえば? Mitz
comucal
PRO
0
42
Other Decks in Technology
See All in Technology
Classmethod流のPlatform Engineering / classmethod-platform-engineering-devio2024
tomoki10
0
480
累計ダウンロード数1億8000万を超えるアプリケーションプラットフォームのレガシーシステム脱却とモダン化への道
kmitsuhashi
0
120
大規模ドラレコデータ収集・機械学習基盤を支える AWS CDK 〜導入・運用事例紹介〜
pemugi
0
110
開発生産性をむしろ向上させる セキュリティパートナーの作り方 / Dev Productivity Con 2024
flatt_security
0
380
Luupの開発組織におけるインシデントマネジメントの変遷 ver.RoadtoSRENEXT2024
grimoh
1
270
Amazon FSx for NetApp ONTAPのパフォーマンスチューニング要素をまとめてみた #cm_odyssey #devio2024
non97
0
220
Git 研修 Advanced【MIXI 24新卒技術研修】
mixi_engineers
PRO
0
200
開発と事業を繋ぐ!SREのオブザーバビリティ戦略 ~ Developers Summit 2024 Summer ~
leveragestech
0
630
エンジニアリングマネージャーはどう学んでいくのか #devsumi / How Do Engineering Managers Continue to Learn and Grow?
expajp
4
1.3k
シフトレフトで挑む セキュリティの生産性向上
sekido
PRO
0
270
エンジニア向け会社紹介資料
caddi_eng
14
230k
AWS IAMのアンチパターン/AWSが考える最低権限実現へのアプローチ概略(JAWS-UG朝会#59資料改修20分版)
htan
0
330
Featured
See All Featured
Stop Working from a Prison Cell
hatefulcrawdad
266
20k
10 Git Anti Patterns You Should be Aware of
lemiorhan
652
58k
Making Projects Easy
brettharned
111
5.7k
Six Lessons from altMBA
skipperchong
24
3.2k
ParisWeb 2013: Learning to Love: Crash Course in Emotional UX Design
dotmariusz
105
6.8k
Build The Right Thing And Hit Your Dates
maggiecrowley
28
2.2k
StorybookのUI Testing Handbookを読んだ
zakiyama
15
4.9k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
277
13k
Adopting Sorbet at Scale
ufuk
71
8.8k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
26
1.8k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
155
14k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
16
1.6k
Transcript
Copyright(c) YOSHIDUMI Information, Inc. All Rights Reserved. 誰でもすぐに使える ノーコードツール 「Google
AppSheet」 タスク管理アプリをライブ作成!
2 Copyright(c) YOSHIDUMI Information, Inc. All Rights Reserved. スピーカー詳細 伊藤
勇斗 Ito Hayato 吉積情報株式会社 出身:多分千葉県 趣味:ゲーム全般 経歴:吉積情報株式会社にて、 Google Workspace関連の開発 業務に従事。Google Cloud Platformを活用したシステム開 発の他、Google Apps Scriptや AppSheet等を用いたアプリケー ション開発が得意。
[email protected]
https://www.yoshidumi.co.jp/ お問い合わせはこちらから AppSheetのライセンス販売や導入支援を行っています。 @ExistMikan
3 Googleが買収したノーコードアプリ作成ツール 最速アプリ開発とタスク自動化を 可能とする強力なノーコードツール 自身で業務をスマート化 アプリ開発 タスク自動化 高度なインテグレーション 数多くのアプリケーション実績
4 アプリ作成の流れ 1. データを接続します 2. アプリを編集します 3. アプリを展開します Copyright(c) YOSHIDUMI
Information, Inc. All Rights Reserved.
5 アカウント作成は超簡単 (無料です) Copyright(c) YOSHIDUMI Information, Inc. All Rights Reserved.
まずは https://www.appsheet.com/にアクセス。 右上のStart for freeをクリックします。 Google Driveのアイコンを クリックします。 appsheetで検索すると出てくる ↑からでもOKです
6 アカウント作成は超簡単 (無料です) Copyright(c) YOSHIDUMI Information, Inc. All Rights Reserved.
Google ログインを促されるので、 お持ちのGoogleアカウント(gmail.com) でログインしてください。 AppSheetからのアクセスを許可すると 準備完了です! 今日のデモを再現するために必要な準備もこ れだけです!
7 タスク管理アプリ デモ • 完成形の説明 • ゼロから作成 • 作成手順はスライドにもメモしてます 完了以外のタスクだけ出る画面
すべてのタスクが出る画面 ボタン一つでステータス切り替え
8 タスク管理アプリ 作成メモ • スプレッドシートを作成 ◦ 列名 : タスク名 /
詳細 / ステータス シート名 : タスク ◦ サンプル値 : リビングお掃除 / 掃除機を使って掃除する / 新規 • シートのメニューからアプリ化 • Data > Columns > ステータスを Enumに。Base typeはTextに。Input modeはButtonsに。選択肢は 新規, 処理中, 完了, 中止。initial valueを新規に • View > タスク > Summary column を ステータスに。 • Data > Slice > 完了以外 で作成し、conditionを [ステータス] <> “完了” に。 • UX > View > New View で残タスクを作成し、 For this data に 完了以外 (slice) を指定。deckビューとして positionをcenterに。Summary column をステータスに。 • UX > View > タスク の position を menu に。 • Behavior > Actions > New Action で 完了 で作成し、 Do this を Data: set the values of … にして ステータス = “完了” を設定する ◦ Appearance の Action icon を check-circle にする • UX > Brand で Primary color をオレンジに、 Header & Footer の Style を全面塗りに、 show view name..とshow logo..をONに。 • UX > Localize で Save を 保存に、 Cancel を キャンセルに • UX > Format Rules > New Format Rule で タスク名太字 を作成、 Format these … でタスク名のみにチェック、 Text Format で Text size : 1.5, Bold をチェック • UX > Format Rules > New Format Rule で ボタンの色かえるを作成、 Format these … で完了(action)のみにチェック、 Highlight colorで blueにチェック
Copyright(c) YOSHIDUMI Information, Inc. All Rights Reserved. 誰でもすぐに使える ノーコードツール 「Google
AppSheet」 タスク管理アプリをライブ作成! Rev.2
10 タスク管理アプリ アドバンスデモ • 完成形の説明 • さっきの続きから作成 • 作成手順はスライドにもメモしてます フラグ付きのものだけ表示
期限日順に並べる 期限日をカレンダーで簡単表示 日時系データの自動登録
11 タスク管理アプリ アドバンス作成メモ • スプレッドシートに列追加 • 列名 : タスクID /
作成日時 / 更新日時 / 期限日 / 緊急 ◦ タスクIDはランダムな KEY列をつけるため。タスク名が変更できない点に対応。 ◦ 作成日時/更新日時は記録のため。自動的に記録される。 ◦ 期限日は並べ替えとカレンダービュー構築のため。 ◦ 緊急はYes/No形式と専用ビュー構築のため。 • Data > Columns > タスク > Regenerate Structure (列の変更を反映 ) ◦ タスクIDを Text, Show無し, search無し, initial value を uniqueId(), KEY列, require?をon ◦ 作成日時を DateTime, initial value をnow(), editable無し ◦ 編集日時を ChangeTimestamp ◦ 期限日をDate, initial valueをtoday()+7 ◦ 緊急度をYes/No 期限周り • UX > Views > 残タスク > card, large, Title goes hereを期限日に , Subtitleをステータスに , Headerはタスク名, long pieceは詳細、右端のアイコンは完了 ◦ Sort by を 期限日 Ascending にする。subheader, action1,action2,ハートマークは Noneにする。 • UX > Views > NewViewで期限カレンダーを作成、 For this dataはタスク、view typeはcalendar、positionはright most、start date と end date を期限日に。 Iconをcalendarに。 • UX > Format Rules > New Format Ruleで期限切れを作成、 conditionは AND([期限日]<TODAY(),[ステータス]<>”完了”), Formatは全部, Text colorを赤に, Text Sizeは1.5でboldチェック 緊急周り • Data > Slices > New Sliceで 緊急を作成、 conditionはAND([緊急],[ステータス]<>"完了") • UX > Views > NewViewで緊急を作成、緊急 (slice)指定で、deckビュー。positionはleft most。Iconはexclamation-circle。