Webアプリを「ホーム画面に追加」してもらい、iPhoneにも通知を届ける。アプ リストアに出さずに配れる無料の案内部品「Jag PWA installer」を公開
スマートフォンに詳しくない利用者が、写真と自分の画面を見比べながら、迷わずホーム画面に追加できる案内です。Webアプリを作る開発者・制作者が、自分のアプリに組み込んで使えます。MITライセンス
ジャグプロジェクト合同会社(本社:東京都江東区、代表:Jag Yamamoto、以下 当社)は、2026年10月20日、Webアプリを利用者のスマートフォンの「ホーム画面に追加」してもらうための案内部品「Jag PWA installer(ジャグ・ピーダブリューエー・インストーラー)」を、オープンソース(MITライセンス)として無料で公開しました。アプリストアから配布せずに、「通知」ができるWebアプリを提供できるようになります。
背景:iPhoneでWebアプリの通知を受け取るには、ホーム画面への追加が要ります
iPhoneでは、Webアプリをホーム画面に追加したときだけ、Webアプリからの通知(Webプッシュ通知)を受け取れます(iOS 16.4以降)。Webページをホーム画面に置いてもらえばよいだけの話なのですが、スマートフォンに詳しくない利用者の多くは「どうやったらいいかわからない」のが実情です。
iPhoneでは、ホーム画面への追加をアプリの側から自動で行えません。利用者が自分で「共有」から「ホーム画面に追加」を選ぶ必要があります。しかも、操作を始めると共有のメニューが画面の下の半分以上を覆い、説明が見えなくなります。当社は、ある町内会のアプリで、実際のiPhoneで試しては直すことを10回以上繰り返し、この問題を解く案内の形を作りました。Jag PWA installerは、その設計を部品にしたものです。
Jag PWA installerとは
Jag PWA installerとは、Webページや Webアプリを利用者のホーム画面に置いてもらい、「Webアプリからの通知」を届けられるようにするための案内部品です。ウィザードの形で、利用者を「手順どおりに進めたら、アプリが通知できる状態」に導きます。
・利用者は、案内の写真と自分の画面を見比べながら、自分のペースで進めます。案内は時間で勝手に進みません。
・iPhoneのSafariとChromeでは、共有のボタンの位置が違います。案内は、押すボタンを隠さない側に出ます(Safariは画面の上、Chromeは画面の下)。
・AndroidのChromeでは、1回押すだけで追加できるボタンを出せる場合はボタンで、出せない場合は文字の手順で案内します。
・LINEなどのアプリの中のブラウザで開いたときは、Safari や Chrome で開き直す案内を出します。
・利用者がホーム画面のアイコンからアプリを開くと、部品がそれを見分けて「設定できました」と伝え、通知の許可の案内に進みます。
・途中で閉じても、利用者は小さな入口からいつでも案内に戻れます。
通知のほかに良いこと
・App Store や Google Play への登録が要りません。
・App Store や Google Play のパスワードを忘れた人、アプリを入れる権限が無い人にも配れます。
・App Store や Google Play の登録料が要りません。
組み込む前に知っておくこと
・Jag PWA installerは、通知を送りません。通知を送る仕組み(Webプッシュ)は、開発者・制作者がアプリの側で用意します。部品が案内するのは、ホーム画面に追加するところまでです。
・部品は React と TypeScript で書かれています。中身を変えられる Webアプリと、その開発の環境が要ります。
・ブラウザだけでは、利用者がもうホーム画面に追加したかを確実には見分けられません(Safariとホーム画面のアプリで、保存の場所が別のため)。アプリの側で記録する方法を、手引きで案内します。
・パソコンでは、スマートフォン向けの案内を出しません。すべての端末とブラウザでの動作は保証しません。
登録制の手引き(ウィザード)
自分のアプリに組み込むための手引きは、メールアドレスを登録すると開けます。手引きの質問に答えると、自分のアプリ向けの組み込みの依頼文ができます。開発者・制作者は、その依頼文をコードAIに渡して組み込み、実際のスマートフォンで表示と操作を確かめます。部品のコードは、登録なしで GitHub から入手できます。
よくある質問
Q. Webアプリ(PWA)を、利用者に「ホーム画面に追加」してもらうには?
A. iPhoneでは、アプリの側から自動で追加できないため、利用者が「共有」から「ホーム画面に追加」を選ぶ必要があります。Jag PWA installerは、その手順を、写真と利用者の画面を見比べられる形で案内します。
Q. iPhoneで、Webアプリの通知(Webプッシュ通知)を受け取るには?
A. iOS 16.4以降で、Webアプリをホーム画面に追加し、ホーム画面のアイコンから開いたうえで、通知を許可する必要があります。Jag PWA installerは、追加から通知の許可の案内までを順に出します。通知を送る仕組みは、アプリの側で用意します。
Q. 「ホーム画面に追加」が表示されないときは?
A. iPhoneでは、iOS 16.3以前は Safari からしか追加できません。LINEなどのアプリの中のブラウザでは、追加の項目が出ないことがあります。Jag PWA installerは、そうした環境を見分けて、Safari や Chrome で開き直す案内を出します。
Q. アプリストアに出さずに、スマートフォンのアプリとして配るには?
A. Webアプリをホーム画面に追加してもらえば、アイコンから開けるアプリとして使ってもらえます。App Store や Google Play への登録と登録料は要りません。
Q. 高齢の利用者にも、ホーム画面への追加を迷わず進めてもらうには?
A. 手順を覚えさせず、写真と自分の画面を見比べるだけで進める形にし、押すボタンを案内で隠さないことです。Jag PWA installerは、ある町内会のアプリで実際のiPhoneで試しては直すことを10回以上繰り返して、この形にしました。
関連情報
・Jag PWA installer のご案内:https://www.jagproject.com/lp/pwa-installer-20261015/
・手引きの登録:https://jagutilities.jagproject.com/pwa-installer
・コード(GitHub・MITライセンス):https://github.com/jagyamamoto/pwa-install-guide
会社概要
・会社名:ジャグプロジェクト合同会社(Jag Project, LLC)
・所在地:東京都江東区
・代表者:Jag Yamamoto(武蔵野美術大学 非常勤講師。2020年から大学院の授業「イノベーションのための実践的社会論」を担当し、行動経済学を教える。G DATA Software 日本法人 CEO などを経て、2015年に当社を設立)
・当社について:まだ名前のない需要を、売上の立つ事業にする会社です。事業の企画と B2B のマーケティングを、ご依頼を受けて支えています。
・無料で公開する理由:町内会や小さな店・会社が、費用をかけずに自分たちで発信と運営を続けられるようにするため。そして、当社の考え方と技術を実物で確かめていただくためです。どの道具も、人がどこで迷い、どこで手が止まるかを見て設計しています(行動経済学の考え方)。
・事業の企画とマーケティングのご相談:https://www.jagproject.com/contact
・URL:https://www.jagproject.com/
本件に関する報道関係者のお問い合わせ
ジャグプロジェクト合同会社 広報(代表・Jag Yamamoto)
info@jagproject.com / 050-5051-1141
このプレスリリースには、メディア関係者向けの情報があります
メディアユーザー登録を行うと、企業担当者の連絡先や、イベント・記者会見の情報など様々な特記情報を閲覧できます。※内容はプレスリリースにより異なります。
すべての画像
- 種類
- 商品サービス
- ビジネスカテゴリ
- システム・Webサイト・アプリ開発スマートフォンアプリ
- ダウンロード
- プレスリリース素材
このプレスリリース内で使われている画像ファイルがダウンロードできます
