ノーコードツール「Glide」で、ロゴの管理アプリを作りました。

### ロゴの管理アプリを作りました。
こんにちは。金融業で働く会社員です。
少しでも働きやすい業務環境を整えていきたい、と日々色んなことを試しております。



前回の記事で、販売促進用のロゴデータをTeachable Machineという画像識別Aiツールを使って、探したいロゴの検索をしやすくしたい、と試みましたがうまくいかず、便利にすることができませんでした。

＜前回の記事はこちらです ↓＞

https://qiita.com/kumiko_kimura/items/4238f4f9fb3cd265446b



前回の目的は、どのロゴが、何の資材（パンフレットなど）に使用されているかを、検索したいというものでしたが、今回は、ロゴを管理しているツール自体が、そもそも無いということがわかったので**ロゴ管理アプリ**を作成しました。


そして、今回の使用ツールは、ノーコードでアプリを作れるという[Glide](https://www.glideapps.com/ "Glide") です。

＜ロゴという表現について、少しだけ補足いたします＞
・さまざまな商品には、右上や右下などに、その製品を作った会社のマークなどがあります。そのマークになっている絵のことをここでは、「ロゴ」と呼ばせていただきます。



### 使用ツール
- [Glide](https://www.glideapps.com/ "Glide")
- Googleスプレッドシート




### 完成した画面

**ロゴ管理アプリの画面**

※ロゴ画像や内容は、実際のものではありません。


![スクリーンショット 2023-09-03 13.35.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/18a4881f-2bfe-c1b3-2f86-752f00bfbe4e.png)




:::note info

**ポイント**
- 画像を表示させることで、ロゴの正式名称を認識していなくても、探しやすくなります。
- 所管部署を、画像と共に表示しておくことで、どこに連絡すれば良いかをわかるようにしています。
:::





### 作成手順

**1：[Glide](https://www.glideapps.com/ "Glide")にログイン**

**2：赤枠で囲った　＋　を押してアプリを作成します**

![スクリーンショット 2023-07-31 14.16.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/6b5a38a0-20ea-6662-3702-2e1c08211795.png)



**3：アプリの名称を入力して、Continue　を押す**

![スクリーンショット 2023-07-31 14.53.57.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/108a690d-3a57-3fce-52ea-e39130754eb7.png)




**4：Google Sheetsを選択して、Continue　を押す**

![スクリーンショット 2023-07-31 14.17.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/19e9f733-f42f-c558-a978-764d9705ae8f.png)




**今回使用する「ロゴ管理」という、Googleスプレッドシートを選択**

![スクリーンショット 2023-07-31 14.38.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/c6e9204c-ef88-a4f2-92e8-eb178b4c37e9.png)


**「ロゴ管理」Googleスプレッドシートの内容**
![スクリーンショット 2023-09-03 13.36.50.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/9524f3fd-90b9-d68f-0968-7a43365a5c43.png)






## Glideの画面

**アプリのトップ画面の、レイアウトを決めていきます。**

画像・所管部署・注意事項などの情報を、一目で見たいので、表示する項目は以下に設定しました。

- ロゴ名
- 備考
- 所管部署
- ロゴ画像


![スクリーンショット 2023-09-03 13.50.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/1c52dc56-e681-1c8a-c77a-a6532bebcd80.png)



**探したいロゴ名を検索窓に入力すると、簡単に見つけることができました。
そして、部署名で検索することも出来ます。
とてもわかりやすくなりました。**

![スクリーンショット 2023-07-31 15.38.32.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/511e36cf-414f-03e4-84d3-356c6b81925e.png)



![スクリーンショット 2023-09-03 13.44.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/15957907-e773-c8ff-74da-212f8ee7ac21.png)







# 担当者の感想

- 使ってもらう前に、今回、私がこのアプリを作った経緯をお伝えして、試してもらいました。

 「最新のロゴデータをください」
 「このロゴデータが欲しいんですが、こちらの部署で合っていますか？」

上記のような問い合わせがよく来ているので、そういった質問をしなくてもよくなるように、
また、質問するにしても、どこに連絡をしたら良いかがわかるようにしたら、業務負担が少しでも軽くなるかなと思い、ロゴを管理するアプリを作ったので、試して欲しいと依頼しました。

------------------------------------
　**ロゴや資材の管理をしている担当者　Aさん**
:thumbsup:　良い点
・探しているロゴ画像が、一目で探しやすい。

:frowning2:　悪い点
・グループ企業・加盟店ロゴなど、カテゴリで検索できるとよい。

------------------------------------
　**ロゴや資材の管理をしている担当者　Bさん**
:thumbsup:　良い点
・ロゴが大きく表示されているのは、見やすいと思いました。


:frowning2:　悪い点
・ガイドラインも、直接URLを表示できる仕様がいいかと思います。
・過渡期は旧版と新版について、「旧版使用期日」「新版使用可能日」などを表示するようにできたらいいと思いました。
・「改版予定日」は記載があると便利。
・「監修中」は、担当者が更新しない可能性が高いので、必ず入れるというルールにはしない方が良いかなと思いました。

------------------------------------
　**同じ部署の同僚　Cさん**
:thumbsup:　良い点
・担当部署関係なく一覧化されており、ロゴを視認で確認でき探しやすい。
・担当部署が確認でき、問合せしやすい。
・格納場所へのリンクもあり、内容の確認とデータのダウンロードが1度にでき楽。

:frowning2:　悪い点
・特にないです。使っていく中で、改善点等更新していければよいかと思います。

------------------------------------
:smiley:　改善した点

![スクリーンショット 2023-09-03 13.43.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/88221338-aafa-67f3-c9e0-81b96ea86b32.png)





・カテゴリー検索できるように、カテゴリー項目を追加しました
・「旧版使用期日」「新版使用可能日」「改版予定日」「ガイドライン・マニュアル格納場所」の項目を追加しました


<details>
  <summary>項目の追加方法</summary>

![スクリーンショット 2023-09-12 9.53.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/624dee19-3891-7b2f-c02f-db7b11865fe1.png)



※1　Dateを選択すると、画面が変わります（はじめに取り込んだGoogleスプレッドシートと連動しています）
※2　＋を押すと、列が追加出来ます
※3　列名を入力します
※4　Doneを押して、列が追加されます
※5　Layoutを押して、元の画面に戻ります（iphoneの画面）


![スクリーンショット 2023-09-12 9.49.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3476276/f438f7f1-feeb-6a75-ab3e-941585e0f27a.png)


※1　Fieldsを押して
※2　＋Add Itemを押すと、先ほど列を追加したものが追加されます</details>





## 感想
実際に使用していることを想像しながら、意見をたくさん言っていただけて、使いやすいものに進化していくことができました。
「ガイドラインやマニュアルの格納場所のURLが欲しい」という意見は、担当者視点でないとわからない観点でしたので、貴重な意見でした。
ロゴは、データを渡すだけでなく、そのロゴの使用の仕方（例えば、他の画像と重ねて使用してはいけません。など）が必要なので、その問い合わせも発生しているようです。
今回、この項目を追加しただけでも、大幅に負担が減るようなので、本当にこのアプリを活用したい、と言っていただけました。

Glideについては、とても使いやすく、そして直感的に使えるので、作っていても楽しかったです。
担当者が思い描く業務効率化のアプリを、このスピード感で作成できるということを、同僚の方々に知ってもらえて、自分たちで変えていけるんだと思っていただく良い機会になりました。
他の課題にも、このツールを使って試してみたいことがあるので、引続きまた何か作ってみたいと思います。