JAG UTILITIES

Jag PWA installerPWAをホーム画面に追加する案内

PWAをホーム画面に追加する操作を利用者に案内し、iPhoneでWebアプリの通知を受け取るための準備を支える部品です。通知の配信は、開発者がアプリ側で用意します。

メールで登録して手引きを開く組み込むための条件を見る

ホーム画面への追加を、迷わない手順に。

アプリストアから配布せずに、「通知」ができる Web アプリを提供できるようになります。

Jag PWA installer は、Web ページや Web アプリを利用者のスマートフォンのホーム画面に置いてもらい、「Web アプリからの通知」を届けられるようにするための仕組みです。

Web ページをホーム画面に置いて（登録して）もらえればよいだけの話なのですが、スマートフォンに詳しくない利用者の多くは「どうやったらいいかわからない」のが実情です。

Jag PWA installer は、ウィザードの形で、利用者を「手順どおりに進めたら、アプリが通知できる状態」に導く仕組みです。

通知のほかに良いこと

App Store や Google Play への登録が要りません。
App Store や Google Play のパスワードを忘れた人、アプリを入れる権限が無い人にも配れます。
App Store や Google Play の登録料が要りません。

だれのための部品か

Jag PWA installer は、自分の Web アプリやホームページを持つ開発者・制作者のための部品です。たとえば、町内会の回覧のアプリ、店や教室のお知らせのページ、会員向けのサービスを作る人が、利用者に通知を届けたいときに使います。

利用者のスマートフォンに入れるものではありません。開発者・制作者が、自分のアプリの中に組み込みます。

利用者のスマートフォンで起きること

利用者がアプリを開くと、Jag PWA installer が「ホーム画面に置く」手順を案内します。

利用者は、案内の写真と自分の画面を見比べながら、自分のペースで進めます。案内は時間で勝手に進みません。
iPhone の Safari と Chrome では、共有のボタンの位置が違います。Jag PWA installer は、ボタンを隠さない側に案内を出します。
Android の Chrome では、ホーム画面に置くボタンを出せる場合はボタンで、出せない場合は文字の手順で案内します。
利用者がホーム画面のアイコンからアプリを開くと、Jag PWA installer がそれを見分けて「設定できました」と伝えます。
途中で閉じても、利用者は小さな入口からいつでも案内に戻れます。

通知について知っておくこと

iPhone では、Web アプリがホーム画面に置かれていないと、通知を受け取れません（iOS 16.4 以降）。Jag PWA installer は、この「ホーム画面に置く」ところまでを案内します。

通知を送る仕組み（Web Push）そのものは、開発者・制作者がアプリの側で用意します。Jag PWA installer は通知を送りません。

組み込む前に用意するもの

開発者・制作者は、次のものを用意します。

中身を変えられる Web アプリと、その開発の環境（部品は React と TypeScript で書かれています）
アプリの URL、ホーム画面のアイコン、案内に使う写真の置き場所
アプリの manifest とアイコンの設定、利用者がホーム画面に置いたことを記録する仕組み

できないこと

iPhone のホーム画面に置く操作は、アプリの側から自動ではできません。利用者が自分で操作します。
ブラウザだけでは、利用者がもうホーム画面に置いたかを確実には見分けられません。
パソコンでは、スマートフォン向けの案内を出しません。
すべての端末とブラウザでの動作は保証しません。案内の写真は、部品に入っている操作の例で、OS や版によって画面が違います。

コードの公開と、登録制の手引き

Jag PWA installer のコードは MIT ライセンスで公開しています。だれでも無料で使い、変え、商用にも使えます。サポートと動作の保証はありません。

自分のアプリに組み込むための手引き（ウィザード）は、メールアドレスを登録すると開けます。手引きの 7 つの質問に答えると、自分のアプリ向けの組み込みの依頼文ができます。開発者・制作者は、その依頼文をコード AI に渡して組み込み、実際のスマートフォンで表示と操作を確かめます。

登録の条件

登録には、利用規約への同意と、メールアドレスが要ります。登録すると、手引きがすぐ開きます。

無料で使える条件として、Jag Project からのお知らせ（道具の更新・新しい道具の案内）と、手引きについての連絡をメールで受け取ることに同意していただきます。お知らせは、メールの最後の案内からいつでも止められます。止めたあとも、手引きは引き続き使えます。

案内の写真

写真は原本同梱のOS操作例で、当ページでの実動作を検証した画面ではありません。端末・OS・ブラウザーの版で表示が異なります。通知の実配信を検証していません。

登録の手順

登録画面のスクロール枠で利用規約（EULA）を最後まで読むと、登録のボタンが押せます。
メールアドレス（必須）とお名前（任意）を入れます。
「利用規約に同意して登録する」を押すと、その場で手引きが開きます。

メールで登録して手引きを開く

作り手について

Jag PWA installerは、ジャグプロジェクト合同会社（Jag Project, LLC・東京都江東区）が作り、公開しています。

代表の Jag Yamamoto は、武蔵野美術大学の非常勤講師として、2020年から大学院の授業「イノベーションのための実践的社会論」を担当し、行動経済学を教えています。G DATA Software 日本法人の CEO などを経て、2015年に当社を設立しました。

Jag Project が無料の道具を公開する理由

当社は、まだ名前のない需要を、売上の立つ事業にする会社です。事業の企画と B2B のマーケティングを、ご依頼を受けて支えています。

当社は、実務で作り、自分たちで使ってきた道具を、無料で公開しています。理由は 2 つあります。

町内会や、小さな店・会社が、費用をかけずに、自分たちで発信と運営を続けられるようにするためです。
当社の考え方と技術を、実物で確かめていただくためです。

どの道具も、人が実際にどこで迷い、どこで手が止まるかを見て設計しています。行動経済学の考え方です。

Jag Yamamoto の経歴 / 事業の企画とマーケティングのご相談

原本と関連資料

GitHub / MIT / Jag Project

当社について