7
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Glideでサクッと! 売場で役立つシフト管理アプリの作り方

Last updated at Posted at 2024-06-13

Glideでアプリ作成に挑戦

みなさま、こんにちは。
私は小売業で販売課長をしています。
デジタルを学び始めて早1ヶ月。今では業務や日常の中で、常にアイデアを探しています。さて、以前作成した「主任・課長シフトがすぐに確認できるLINEBot」が便利で私は毎日愛用しています。初めての制作物という愛おしさと無事に返答が帰ってくる嬉しさを感じています。一方、売場ではというと、残念ながら会社支給のスマホにはLINE機能が搭載されていないため、業務の中では活用できていないのが現状です。

最近、Glideというノーコードツールを知りました。Glideは、プログラミング知識がなくても簡単にアプリ開発ができるツールです。そこでチームメンバーのために、学んだばかりのGlideを使って、売場で誰でも簡単に主任・課長シフトを確認できるアプリの作成に挑戦しました。このアプリが売場で活用されたら、シフト表を調べる時間や広いフロアを探し回る時間が削減できます。

完成品

RPReplay_Final1718463784.gif

使用ツール

・Glide
・Googleスプレッドシート

制作開始

ステップ1: Googleスプレッドシートの準備

Googleスプレッドシートを新規作成します。
会社で使用している勤務計画をCSVデータでダウンロードし、アプリに必要なデータを加工しました。
スクリーンショット 2024-06-13 13.19.21.png

ステップ2: Glideの設定

Glideのホーム画面にアクセスし、New Appを作成します。

スクリーンショット 2024-06-12 14.32.15.png

「Start with data」の「GoogleSheets」を選択し、continueをクリックします。
スクリーンショット 2024-06-12 14.41.59.png

「Import Google Sheet once」を選択し、continueをクリックします。
スクリーンショット 2024-06-12 14.44.49.png

先ほど作成したスプレッドシートを選択します。
スクリーンショット 2024-06-12 14.51.07.png

すると、このようなアプリがすぐに出来上がります。早い!
スクリーンショット 2024-06-12 14.59.13.png

ステップ3: Glideの調整

画面右下の「ITEMS DATA」で表示方法を調整します。
勤務計画だけでは寂しいので、スプレッドシートに販促計画を加え、「Title」に「販促計画」を選択しました。
スクリーンショット 2024-06-12 15.09.16.png

ステップ4: アプリを公開

画面右上の「Share」を押すと、QRコードとリンクが表示されるので使用する端末でアプリを開くことができます。登録したメールアドレスを入力し、ログイン用のPINコードが送られるので、メールを確認し、PINコードを入力してサインインをすると使用できます。
スクリーンショット 2024-06-12 15.30.32.png

チームメンバーにアプリを試してもらう

作成したアプリを早速売場の方々に使用してもらい、貴重なご意見をいただきました。ご協力いただいたのは、チームメンバーAさん(50代)とBさん(60代)の2名です。お二人は、普段から積極的に意見をくれる頼りになるパートさんです。
今回作成したアプリは、①売場ですぐに確認できること②誰でも簡単に操作できること、という2つを目標に作成したアプリと伝えました。

Aさんの感想

・すごい!これなら私でも使える。
・会議中に主任や課長を探すことがあるから、会議の日がわかるようにしてほしいな。
・セール企画がもっとわかるといいな。
・文字の大きさや曜日の色を変えたらさらに見やすくなるかも。

Bさんの感想

・すごい!これは助かる。これを見てハンコを貰いに行けばいいんだね。
・カード企画もスマホでパッとわかるといいな。レジでカード企画を聞かれることが多くて、企画書をファイリングしているけど入っている作業台はレジから離れているから。

フィードバックを受けて改良

【改良点①】「Title」を日付に変更し見やすく、販促計画に売場が関係する企画日を加えました。
スクリーンショット 2024-06-12 18.44.26.png

勤務時間に会議日程を加えました。
スクリーンショット 2024-06-12 17.31.26.png

【改良点②】「会員販促」のタブを増やし、カード・アプリ会員企画をカレンダースタイルでわかるようにしました。
スクリーンショット 2024-06-16 0.28.47.png

【改良点③】画面右上の「Settings」をクリックし、「Appearance」で色をつけました。文字の大きさや色の変更はできませんでしたが、作成した日付画像をアイコンに設定しました。改良前に比べるとアプリ感も増して見やすくなりました。
スクリーンショット 2024-06-16 0.26.06.png

アイコン画像は「canva」でテンプレートと素材を組み合わせてオリジナル画像が作成できます。無料版なので使用できるものには制限がありますが十分です。アプリを開くたびにワクワクするような可愛いアイコンを作りたくて、黙々と31日分を作成しDataに貼り付けしました。喜んでもらえますように。
スクリーンショット 2024-06-13 12.27.48.png

まとめ

前回のCodePenでのアプリ作成では、コードの壁にぶつかり悪戦苦闘しました。しかし、今回Glideに出会ったことで簡単にアプリを作成することができました。チームメンバーにアプリを披露する際はドキドキでしたが、実際に使用してもらったところ良い反応を貰うことができとても嬉しかったです。今後も多くの人にアプリを活用してもらい、さらにブラッシュアップを重ねながら業務効率化に繋げていきたいと考えています。

参考資料

7
2
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
7
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?