LoginSignup
5
3
@kiku_2005(kiku)inプロトアウトスタジオ

管理表アプリをGlideとGoogleスプレッドシートを使って作成してみた。

Last updated at Posted at 2023-12-04

おつかれさまです。
金融業界で働いている事務員兼主婦です。
前回はLINE Botで体温チェック判定できるものを作ってみました。

今回は、日々職場で頭を悩ませている手作業管理業務を実際にデジタル化できないものかと色々調べてみました。

Let'sチャレンジ！GlideとGoogleスプレッドシートで管理表アプリ作成

職場では書類授受管理、鍵管理、入退室管理、発送管理と様々な管理が紙に手書きの作業で行われています。この作業を簡単にデジタル化できそうなGlideを使用して、今回は試してみたいと思います。

完成品

使用ツール

製作開始

１. Glideに使用するGoogleスプレッドシートを作成

普段使用しているExcelデータの書式を元にGoogleスプレッドシートを作成します。Glideの設定次第ではExcelをそのまま使用することも可能です。今回は一気に４種類の管理表を作成したので４つのシートとマスタシートを準備しました。

➀授受管理表
image.png
➁鍵管理簿
image.png
➂入退室管理
image.png
➃発送管理表
image.png
マスタシート
image.png

２. Glideの設定

基本的な使い方は下記を参考にしました。

＋New appを押して新規作成。
image.png
名前を付けてモバイル版かＰＣ版かを選択。
image.png
連携させるソースを選択する。
image.png

今回は➀「授受管理簿」➁「鍵管理簿」をＰＣ版に、➂「発送管理表」➃「入退室管理表」は事務所入口で使用するためモバイル版で作成してみました。
image.png

➀授受管理簿（ＰＣ版）

  • 日付＆氏名を検索しやすいようにListスタイルで表示させるようにしました。
    image.png
詳細設定（折りたたみ）
  • ＋Addを押します。
    image.png
  • 受付日はDateコンポーネントを選択。
    image.png
  • カレンダーが表示されます。
    image.png
  • 書類種類はたくさんあるのでChoiceコンポーネントを選択。
    image.png
  • 書類種類はマスタシートからDropdownできるようにしました。
    image.png
  • 氏名は直接入力。
    image.png
  • 経路もChoiceコンポーネントで右下のCrips設定にしてマスタシートから選択。
    image.png
  • 受取担当者もマスタシートからDropdownできるようにしました。
    image.png
  • 保管場所もChoiceコンポーネントで右下のCrips設定。
    image.png
  • 発送日はDateコンポーネント選択してカレンダー表示。
    image.png
  • 発送担当者もマスタシートからDropdown設定。
    image.png
  • 送付先もChoiceコンポーネントで右下のCrips設定にしてマスタシートから選択。
    image.png
  • 発送経路もChoiceコンポーネントで右下のCrips設定にしてマスタシートから選択。
    image.png
  • 提出ボタンを押すとリストが増えました。
    image.png
  • Date表示でも確認できますが、
    image.png
  • スプレッドシートも追記になりました。
    image.png

➁鍵管理簿（ＰＣ版）

  • Data Gridスタイルで表示させるようにしました。
    image.png
詳細設定（折りたたみ）
  • ＋Addを押します。NO.は直接入力。
    image.png
  • メーカーも直接入力。
    image.png
  • 使用場所はChoiceコンポーネントでDropdown設定にしてマスタシートから選択。
    image.png
  • 管理者は直接入力。
    image.png
  • 保管場所もChoiceコンポーネントでDropdown設定にしてマスタシートから選択。
    image.png
  • 授受日はDateコンポーネント設定してカレンダーを選択する。
    image.png
  • 提出ボタンを押す。
    image.png
  • Dataが送信されリストが増えました。
    image.png
  • Dataでも確認できますが、
    image.png
  • スプレッドシートも追記になりました。
    image.png

➂入退室管理（モバイル版）

  • レイアウトがモバイル版になります。毎日の付け忘れ防止にChecklistスタイルで確認できるような表示にしました。
    image.png
詳細設定（折りたたみ）
  • Addボタンを押します。日付はカレンダー選択。
    image.png
  • 解錠時間はDate Timeコンポーネント設定してカレンダー選択の後に時間設定する。
    image.png
  • 氏名は直接入力。
    image.png
  • 施錠時間はDate Timeコンポーネント設定してカレンダー選択の後に時間設定する。
    image.png
  • 氏名は直接入力して、提出ボタンを押す。
    image.png
  • Dataが送信されリストが増えました。
    image.png
  • Dataでも確認できますが、
    image.png
  • スプレッドシートも追記になりました。
    image.png

➃発送管理表（モバイル版）

  • レイアウトがモバイル版になります。Data Gridスタイルで確認しやすい表示にしました。
    image.png
詳細設定（折りたたみ）
  • Addボタンを押します。日付はカレンダーで選択。
    image.png
  • 発送担当者は直接入力。
    image.png
  • 数量は直接入力。
    image.png
  • 受取担当者は直接入力。
    image.png
  • 時間はDate Timeコンポーネントを選択し、
    image.png
  • カレンダーから日付と時間を入れます。
    image.png
  • 提出ボタンを押す。
    image.png
  • Dataが送信されリストが増えました。
    image.png
  • Dataでも確認できますが、
    image.png
  • スプレッドシートも追記になりました。
    image.png

作成のポイント

日付と時間の表記についてはGlideもGoogleスプレッドシートも設定が必要でした。

【Glide】

  • Data画面の日付のプルダウンを押してEditを選択。
    image.png
  • 日付だけ表示されるようにDate onlyを選択し、今回は長さを Shortにしました。
    image.png
  • 時間も同じようにプルダウンを押してEditを選択。
    image.png
  • 今度は時間だけが表示されるようにTime onlyを選択します。
    image.png

【Googleスプレッドシート】

  • 日付と時間の列は表示形式の詳細設定を忘れずに。
    image.png
  • 時間は秒数まで表示されてしまうので、カスタム日時を選択して、見やすいように設定します。
    image.png
    image.png

感想

新しい試みだったので調べるのに時間がかかりましたが、とても簡単に作成できてました。これなら誰にでも簡単に扱えそうですし、色々と応用も出来そう。職場でも試作品としてご披露したところ、とても好感触でした。ただし、気になったのは実際に職場での導入が可能かというところ。今回のGlideは無料プランで作成しているので上限があります。また、先日初めてセミナーに参加して同じような機能を持つPower Appsを知りました。次回はPower Appsへチャレンジして、比較検証してみたいと思います。

参考資料

ここまでお付き合い頂きまして、ありがとうございました。

5
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
5
3