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にチェック

9
 タスク管理アプリ アドバンスデモ
 ● 完成形の説明 ● さっきの続きから作成 ● 作成手順はスライドにもメモしてます フラグ付きのものだけ表示 期限日順に並べる 期限日をカレンダーで簡単表示 日時系データの自動登録

10
 タスク管理アプリ アドバンス作成メモ
 ● スプレッドシートに列追加 ● 列名 : タスクID / 作成日時 / 更新日時 / 期限日 / 緊急 ○ タスクIDはランダムな KEY列をつけるため。タスク名が変更できない点に対応。 ○ 作成日時/更新日時は記録のため。自動的に記録される。 ○ 期限日は並べ替えとカレンダービュー構築のため。 ○ 緊急はYes/No形式と専用ビュー構築のため。 ● Data > Columns > タスク > Regenerate Structure (列の変更を反映 ) ○ タスクIDを Text, Show無し, search無し, initial value を uniqueId(), KEY列。 ○ 作成日時を 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 にする ● 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([期限日]”完了”), 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。