【New Release!!】スマートフォンのホーム画面に好きな画像のアイコンを追加できるWEBサービスをリリースしました。

Home Icon Makerという新しいサービスをリリースしました！

homeicon.site

何ができるか・・・はタイトルですべて説明されてしまったのですが（笑）、スマートフォンのホーム画面に自分の好きな画像をアイコンとして配置できるようにするというWEBサービスです。

昔はアプリで実現する方法があったのですが、現在のところネイティブアプリでそういった機能を実現するものはない（と思われる）ので、恐らくネイティブアプリでは実装できないものだと思われます。

でも、好きな画像をホーム画面にアイコンとしておけると、面白いことができるんです。

例えばこんな感じ。

自分の飼ってる猫がホーム画面いっぱいに！！最高！！

もうこれだけ十分ですね。

あとは好きなようにお使いいただければ良いかなと思います。

技術的なお話

さて、一応技術的なお話も少し。

まずどんな仕組みでやってるの？というと、簡単に言うとPWAを使っています。

PWAは要するにWebページをアプリのようにスマホにインストールできる機能なので、ユーザーさんがアップロードしたファイルをPWAとして登録できるようにWEBページを動的に生成してあげれば良いだろう、というわけです。

うまいこと動的にPWAとして登録できるページが作れたので、良かったです。

また、今回どういう構成で作ったかというと、以下のような構成になります。

インフラ

• Firebase Hosting


• Firebase Cloud Functions


• Firebase Storage

技術

• UIKit（技術と呼んでいいのか？？）


• ejs（動的にPWAサイトを作るために使用）


• Fabric.js（指定した画像の切り抜き操作に使用）

作ろうと思ったきっかけ

実はきっかけは別のアプリの作成時に、アイコンの実機確認がしたいなぁと思ったことがきっかけでした。

アイコンって大体4角形なんですが、iPhoneは微妙に角丸だし、Androidだと完全に丸いアイコンもあるし、実機で見やすいかとかも見ておきたいですよね。

そのためにWebサイトを作って登録するって手順を説明しているサイトがいくつかあったのですが、「あれ、もしかしてPWA使えば便利に使えるんじゃね？」と思って作ることにしました。

なので、アプリ開発しててアイコンの実機確認をさくっとしたい人とかにも使ってもらえると嬉しいです。