自分でアプリを作る方法 第2回|ウェブで動くアプリとスマホに入れるアプリの違い

CONNECT BASE 開発担当のNinoです。お疲れ様です!今日は、ウェブで動くアプリとスマホに入れるアプリの違いについての話題です。

同じサービスなのに、入口が2つあるのはなぜでしょう

ネット通販で買い物をする時、パソコンではブラウザ(Chrome や Safari など、ウェブを見るためのソフト)でお店のページを開き、スマホではストアから入れたアプリを開く。そんな使い分けをしている方は多いと思います。

中身はほとんど同じなのに、入口が2つある。しかも、スマホのアプリは「更新してください」とよく言われるのに、ブラウザのほうは何もしなくても新しくなっている。不思議に思ったことはありませんか。

もし自分でアプリを作るとしたら、最初に決めることの1つが、この「どちらの形で届けるか」です。今日は、その違いを見ていきます。

一言でいうと、「どこで動くか」と「どう届くか」の違いです

ウェブのアプリは、ブラウザで開いて使うアプリです。端末に入れる必要がなく、住所(URL)を開けばすぐに使えます。スマホのアプリは、App Store や Google Play などのストア(アプリを配る公式の売り場)から、端末に入れて使うアプリです。専門の言葉では、スマホに入れるほうを「ネイティブアプリ」と呼びます。

AWS(Amazon のクラウドのサービス)の解説でも、ウェブのアプリは入れる必要がなくブラウザで使う物、ネイティブアプリは端末ごとに作って入れて使う物、と分けて説明されています。

お店にたとえると、路面店と、大きな商業施設の中のお店です

第1回(アプリは画面・裏側・データの3つでできているという話)で、アプリをレストランにたとえました。客席が「画面」、厨房が「裏側」、倉庫が「データ」でしたね。

ウェブのアプリは、通りに面した路面店です。自分の判断でいつでも開店でき、メニューを変えたければ、次の日の朝から新しいメニューを出せます。お客さんは何も持ち帰らず、来ればいつも最新のお店に入れます。その代わり、場所を知ってもらう工夫は自分でしなければなりません。

スマホのアプリは、大きな商業施設の中のお店です。施設にはたくさんの人が来るので、見つけてもらいやすい。お店の設備も、施設のしっかりした物を使えます。ただし、出店するには施設の審査を通る必要があり、改装するたびに届け出も要ります。

ここで大事なのは、どちらの店も、厨房と倉庫は同じ物を使えるということです。違うのは主に「客席」、つまり画面の届け方です。裏側とデータはインターネットの向こう側に1つ置いておき、路面店と施設の中のお店の両方から注文を受ける。ネット通販のように入口が2つあるサービスも、こうした形をとることができます。

あなたが作るなら、どちらが合うか

たとえば、社内で使う日報や在庫の管理を、自分でアプリにするとします。

社員がパソコンとスマホの両方で見るなら、ウェブのアプリは手軽です。入れてもらう手間がなく、住所を伝えるだけで使い始められます。直したい所が見つかっても、こちらで1か所直せば、全員の画面がすぐ新しくなります。

ただし、同じ画面をパソコンの大きな画面でも、スマホの小さな画面でも見ることになります。パソコンでは横に並べていた表やボタンを、スマホでは縦に並べ直すなど、画面の大きさに合わせて見え方を変える作りが要ります。これを用意しないと、スマホでは文字が小さすぎたり、横にはみ出したりして使いにくくなります。

一方で、スマホのアプリが向く場面もあります。電波の弱い倉庫でも記録をつけたい、カメラや位置の情報をよく使う、たくさんの人にストアで見つけてほしい。AWS の比較でも、端末の機能を使うことや、つながっていない時の動き(オフライン)は、端末に入れるアプリのほうが得意だとされています。

ただし、ストアに出すには審査があります。Apple は、提出されたアプリの通常50%以上を24時間以内に、90%を48時間以内に審査していると案内しています。Google Play のヘルプには、一部のアカウントは詳しく審査するため、審査に最大で7日ほど、例外的にはそれ以上かかることがあると書かれています。しかも審査は、最初の1回だけではありません。直した版を出すたびに、また審査を通ります。

最近の動きとして、Apple は2026年10月16日に、ストアの審査の決まりを改めました。その中で、審査の時には見せなかった機能を、通ったあとに出すことを認めないという以前からの決まりが、新しい番号の付いた独立した項目になりました。施設の中のお店は、施設の決まりの変化にもついていく必要がある、ということです。

ウェブのアプリとスマホのアプリの中間の形もあります。PWA(プログレッシブウェブアプリ)と呼ばれる、ウェブのアプリをスマホのホーム画面に置いて、スマホのアプリのように開けるようにした形です。MDN(ウェブの技術の解説で広く使われている資料)でも、ウェブの技術で作りながら、端末に入れてスマホのアプリに近い使い心地を出せる物だと説明されています。路面店が、近所の家にお店の「呼び出しボタン」を配るようなイメージです。

この知識があると、AIにこう頼めます

AIにアプリを作ってもらう時、何も言わないと、AIが勝手にどちらかの形を選んで進めてしまうことがあります。あとから「やっぱりスマホのアプリにしたい」となると、作り直しが大きくなりがちです。最初に条件を伝えて、どの形が合うかを一緒に決めましょう。

[例:社内の在庫の記録]を管理するアプリを作りたいです。
使う人:[例:社員10人。事務所ではパソコン、倉庫ではスマホ]
使う場所:[例:倉庫は電波が弱いことがある]
使いたい端末の機能:[例:スマホのカメラで商品のラベルを撮る]
この条件で、次の3つの形を比べてください。
1. ブラウザで開くウェブのアプリ
2. ホーム画面に置けるウェブのアプリ(PWA)
3. ストアから入れるスマホのアプリ
それぞれについて、できること・できないこと・更新の手間・ストアの審査の有無を表にして、どれが合うかと、その理由を教えてください。

AIが形をすすめてきたら、今度はこちらから聞き返してみてください。答えの中に、自分の仕事では困る点が隠れていることがあります。

今の案は[例:ウェブのアプリ]ですね。
この形を選んだ場合に、あとから困りそうなことを3つ挙げてください。
特に、電波が無い場所で使った時に、入力した内容がどうなるかを教えてください。

AIの答えは、もっともらしく聞こえても、ストアの決まりや端末の機能について古い情報が混ざっていることがあります。ストアの審査や料金のように変わりやすいことは、Apple や Google の公式のページで確かめてください。そして、どの形で届けるかを最後に決めるのは、そのアプリを使う人のことをいちばん知っている、あなた自身です。

アプリづくりに必要なもの一覧(全6個)

  • 画面(使う人が見て、さわる所)…第1回
  • 裏側(見えない所で計算や受け渡しをする所)…第1回
  • データ(お客様や予約などの情報をしまっておく所)…第1回
  • ★今回 スマホの小さな画面に合わせた作り(ブラウザで開いても、スマホで見やすくするため)…第2回(この回)
  • ★今回 ホーム画面に置くための設定(ウェブのアプリを、スマホのアプリのように開けるようにするため)…第2回(この回)
  • ★今回 ストアの審査に出す準備(スマホに入れるアプリとして配る場合に、審査を通すため)…第2回(この回)

この一覧は、回を追うごとに増えていきます。

うちのシステムの場合

ここまでの一覧の6個のうち、うちのビジネス管理システムでは5個に取り組んでいます。いま開発中のこのシステムは、ブラウザで動くウェブのアプリとして作っていて、スマホのホーム画面に置いて開けるようにしています。開発145日目の今日数えてみると、プログラム(コンピューターへの指示を書いた文)は約28万行で、そのうち約15万行が、正しく動くかを確かめるテストの部分でした。

CONNECT BASE ブログ

最新記事の配信と完成のお知らせを受け取る

毎週木曜日の夜に、その週の新しい記事(連載「自分でアプリを作る方法」など)のまとめをお届けします。現在開発中のビジネス管理システムが完成した際にも、優先して案内をお送りします。

CONNECT BASE株式会社からメールでお送りします。配信はいつでも止められます。プライバシーポリシー

今回のまとめ

アプリには、ブラウザで開くウェブのアプリと、ストアから入れるスマホのアプリがあり、違いは「どこで動くか」と「どう届くか」、つまり画面の届け方でした。ウェブのアプリは手軽に配れていつでも直せる路面店、スマホのアプリは見つけてもらいやすい代わりに審査のある商業施設の中のお店です。

次回は、「AIでアプリが作れるようになって、何が変わったのか」をお話しします。最近の新しい発表を手がかりに、今日の2つの形がAIでどこまで作れるようになったのかを見ていきます。

AIのことや、AIでのアプリづくりについての質問を、いつでも受け付けています。X(@cb_nino_dev)で、気軽に聞いてください。可能な限り、一つひとつにお返事します。

次の回:AIに任せられること、人が担うこと

これまでの回は、連載「自分でアプリを作る方法」の一覧から読めます。

参考にした資料

この記事は、一部AIを利用して執筆しています。

“自分でアプリを作る方法 第2回|ウェブで動くアプリとスマホに入れるアプリの違い” に対して3件のコメントがあります。

コメントを残す

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です