職場メンバーや友人間で使用できる！スケジュール共有アプリを試作

# 今回は、実際に誰かに使ってもらうことを目的に試作
こんにちは。Qiita記事3回目を書いています、IT初心者のkaneです。

前回、初めて投稿した記事では、「Teachable Machine」の画像認識技術を使って、オンラインミーティング時に使うことを想定した在籍離席・意思表示確認をするツールを作成しました。
こちらを実装することで色々学んだのですが、一番学んだことは、専門的なスキルがなくてもそこそこのところまで短時間で実装できるということ。

なので、今回もあまり時間をかけずに何かひとつツールを試作、そして今回は職場の誰かに使ってもらい、フィードバックを得てみようと思います。
第三者の意見を聞くことで、自分では思いつかないようなアイディア等を得るきっかけになればと思います！

今回は何を使ってみようか？？ということで色々考えました。
スマホで簡単に使えるアプリが作れたら他の人にも気軽に使ってもらえるのではと考え、ノーコードでアプリ制作ができるらしい開発環境があるとのことで「Glide」を使ってみることに！
 # 使用ツール
 - Glide ( https://www.glideapps.com )
 ※登録は必要ですが、一定の機能までは無料で使えます。サンプルコードもあるのでサンプルをアレンジして、短時間で一つのアプリを作ることが可能です。
 
 # 職場内で使えるようなものは・・・・
今回は、「スマホで使えるもの」と考えたので、実務に直結するものは難しいかなと思いつつ、色々考えました。
考えたところ、他のチームメンバーの座席に用があって行った際にいないということが意外とあるなと気づきました。
こんな場面、一度はないでしょうか。
 - 明日までにこの書類に押印をもらわないといけないのに、その方が出張で不在だった
 - 自分が企画したミーティング等に参加してほしい際に一目でチームメンバーの管理を把握したい
この点を解消するために今回は、
***操作が簡単！必要最低限の機能のみを備えたスケジュール共有アプリ***　
を試作することに決定！

 # 実装開始
 ### 今回実装したこと
今回はスマホ上で使用することを想定しましたが、PC上でも問題なく使えることを確認しました。
機能は、ごく最低限での実装です。
 - PC画面上での動作
![Lesson3課題PC.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3491090/31293a02-29ed-e7e1-e2f8-f058d8ec8af1.gif)
画面が小さくてわかりづらいかと思うのですが、スケジュールの登録をするところ、各々のスケジュールを確認するところの動作になります。


 - スマホ画面上での動作
![Lesson3課題.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3491090/9121d388-75e7-822f-9aea-840a04b968ce.gif)
こちらはスマホでの動作を確認した画面です。確認したことはPC画面と同様、スケジュールを登録するところと各々のスケジュールを確認している様子の動画になります。

 ### Glideでの実装
 - テンプレートの活用
一から作った方が色々とスキルも身につき、自分の完全オリジナルなアプリが作成できるとは思うのですが、今回はあまり時間をかけずに作りたかったこともあり、テンプレートを使用することに。
![2023-09-12 11.50のイメージ.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3491090/ba15a7aa-b292-0c4b-d16b-6028ac65cac6.jpeg)
ちなみに、Glideは日本語のサイトはないので日本語しか分からない私にはやや使いづらいです。
Googleの翻訳機能とかを使って、何とか完成まで頑張ることにします！

ちなみに今回使用したテンプレートはこちら
![2023-09-12 12.00のイメージ.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3491090/88f78ee9-ce23-bf8c-cf37-fdc65b426a90.jpeg)
そして、このカレンダーを選択すると、あっという間に一つのカレンダーアプリが完成してしまいます。
右上にある「Publish」ボタンをクリックすれば、スマホでもPCでも使えるアプリが完成してしまうというアッと驚くツールです。
![2023-09-12 12.17のイメージ.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3491090/f2ae4aad-8d49-a7b4-ba90-9de53c1b9d2d.jpeg)
これでおしまいでは、何もしていないことになってしまうので、次章で少しだけ加工し、使いやすいように加工していきます。

 - テンプレートのカスタマイズ
詳細は割愛するのですが、ざっくりやったことは以下の２点です。
①完全英語仕様のテンプレートアプリを日本語にそれぞれ編集。
②不要な機能の削除（極力シンプルにすることを意識）
 
 - カスタマイズ後の編集画面
![2023-09-12 16.02のイメージ.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3491090/db91b3aa-b3f8-3ddd-09c0-d76c0e8c1220.jpeg)
両サイドにある各編集項目を編集することで簡単に画面上の文言は変えられます。
ただし、細かいところは現状あまりよく分からない・・・でも今回は「使ってみてもらうこと」がメインでありスピード勝負なので、細かいことは気にせず突っ走りました！

なので、ここで詳細の説明はできずです。
しかし、よく分からない状態でもここまでやって、冒頭の動画のような動作をするスケジュール管理アプリが短時間で完成できたわけです！すごいですね！！

ちなみに以下のリンクから実際に今回作成したツールを使っていただけます。雑なアプリですが使ってみてください。
https://calendar-7fys.glide.page

次の章で、実際に使ってみてもらった感想を書きたいと思います。
が、チーム全体で業務多忙のため今回は1名しか使ってもらうことができずでした。後々チームメンバーに絞らず使ってみてもらおうと思います。

 ### 使ってもらうまでの事前説明（対象者：同じチームメンバー・現部署着任1年の先輩社員）
とにかく今、かなり忙しい部署なので、長々と説明している時間はない！ということで要点を絞って下記について説明しました。
①メンバー間との連携を取りやすくしたいという想いでアプリを作成したことのご説明
②どの部分を改良すれば、実務で使えるかのフィードバックをいただきたいこと
③実務を抜きにして、率直使ってどうかの感想をいただきたいこと


 ### フィードバック結果（ポジティブな意見）
ポジティブな内容はごく僅かですが、記載していきます。
- シンプルなので、操作性は良い
- 複数人で共有できる点は良い

 ### フィードバック結果（ネガティブな意見）
こちらはたくさんあります。
- シンプルではあるが、どこを押した時に何の画面が出てきて、何の編集ができるのか分かりづらい
- 人ごとにスケジュール管理できるが、最初にスケジュールを登録する際に人物指定ができない。スケジュール登録→もう一度編集画面を開いて人物指定をするという２段階を踏まないといけない
- 現状Outlookのスケジュール表の方が使いやすい
- 現状他の人のスケジュールについても第三者が編集できてしまう仕様になっているので、使っているうちにごちゃごちゃになりそう
その他多数ありますが、文章量が膨大になるのでこの辺にしておきます。

 # 振り返り
今回は、とにかく誰かに使ってもらいフィードバックを受けるということを目的に実装から使ってみてもらうところまで一連の流れでやってみました。

反省点として、今回は業務改善が目的だったのですが、改善したいことの前に実装する環境を先に考えて作成したので、直接業務の改善に直結するものを作成できなかったことがまず反省点として残ります。


フィードバック結果のネガティブな意見が多いことは想定内ではあります。細かいことは気にせずに勢いのみで作ったので、こういう意見が来るのも当然であると思います。

ただし、使ってみてもらうことで気づく点もあります。例えば、私は作る側だからどのボタンを押したらどの画面が開いて・・・・みたいのが容易にわかるので無意識で使えていても初めて使う人からしたら何のことやらさっぱり分からない。

こういったことが多々あったので、
実務での課題や改善したい問題のヒアリング→プロトタイプを作成する→使ってもらう→修正するのサイクルが大事であるということが実際にやってみて分かりました。

今回は、実務が忙しいことを言い訳にツール作成もこの記事も雑になってしまった感が否めないので、もっと深掘りして、時間をかけてやってみたいなとも思い、今後継続していきたいと思っています。

最後まで、読んでいただきありがとうございました！