Wcześniej instalacja aplikacji była możliwa tylko w kontekście aplikacji na konkretne platformy. Obecnie nowoczesne aplikacje internetowe umożliwiają instalację i zapewniają ten sam poziom integracji i niezawodności co aplikacje na konkretne platformy.
Możesz to zrobić na kilka sposobów:
- Instalowanie PWA z poziomu przeglądarki.
- Instalowanie PWA ze sklepu z aplikacjami.
Używanie różnych kanałów dystrybucji to skuteczny sposób na dotarcie do szerokiego grona użytkowników, ale wybór odpowiedniej strategii promowania instalacji PWA może być trudny.
W tym przewodniku znajdziesz wskazówki dotyczące łączenia różnych opcji instalacji w celu zwiększenia współczynnika instalacji i unikania konkurencji i kanibalizmie platform. Oferta instalacji obejmuje PWA instalowane zarówno z przeglądarki, jak i z App Store, a także aplikacje przeznaczone na konkretne platformy.
Dlaczego warto udostępnić aplikację internetową do zainstalowania?
Zainstalowane progresywne aplikacje internetowe działają w oknie samodzielnym, a nie na karcie przeglądarki. Można je uruchamiać z ekranu głównego, docka, paska aplikacji lub półki. Można je wyszukiwać na urządzeniu i przełączać się między nimi za pomocą przełącznika aplikacji, dzięki czemu będą one wyglądać jak część urządzenia, na którym są zainstalowane.
Jednak udostępnianie zarówno aplikacji internetowej do zainstalowania, jak i aplikacji na daną platformę może wprowadzać użytkowników w błąd. Dla niektórych użytkowników aplikacje na konkretne platformy mogą być najlepszym wyborem, ale w przypadku innych mogą one mieć pewne wady:
- Ograniczenia miejsca na dane: zainstalowanie nowej aplikacji może wymagać usunięcia innych aplikacji lub zwolnienia miejsca przez usunięcie wartościowych treści. Jest to szczególnie niekorzystne dla użytkowników urządzeń niskiej klasy.
- Dostępna przepustowość: pobieranie aplikacji może być kosztownym i powolnym procesem, a szczególnie w przypadku użytkowników korzystających z wolnych połączeń i drogich planów taryfowych.
- Opory: opuszczenie witryny i przejście do sklepu w celu pobrania aplikacji powoduje dodatkowe trudności i opóźnia działanie użytkownika, które można wykonać bezpośrednio w internecie.
- Cykl aktualizacji: wprowadzanie zmian w aplikacjach na konkretne platformy może wymagać przejścia przez proces sprawdzania aplikacji, co może spowolnić wprowadzanie zmian i eksperymenty (np. testy A/B).
W niektórych przypadkach odsetek użytkowników, którzy nie pobiorą aplikacji na daną platformę, może być duży. Należą do nich na przykład osoby, które uważają, że nie będą korzystać z aplikacji zbyt często, lub nie mogą uzasadnić poświęcenia kilku megabajtów miejsca na dane. Wielkość tego segmentu możesz określić na kilka sposobów, np. za pomocą ustawień usługi Analytics, aby śledzić odsetek użytkowników „tylko w przeglądarce mobilnej”.
Jeśli rozmiar tego segmentu jest znaczny, oznacza to, że musisz udostępnić alternatywne sposoby instalowania aplikacji.
Promowanie instalacji PWA w przeglądarce
Jeśli masz aplikację PWA wysokiej jakości, lepiej może być promować jej instalację zamiast aplikacji na daną platformę. Może się tak zdarzyć, jeśli w aplikacji na daną platformę brakuje funkcji oferowanych przez aplikację PWA lub jeśli od dawna nie była ona aktualizowana. Możesz też promować instalację PWA, jeśli aplikacja na daną platformę nie została zoptymalizowana pod kątem większych ekranów, np. w przypadku ChromeOS.
W przypadku niektórych aplikacji pozyskiwanie użytkowników na konkretnej platformie jest kluczowym elementem modelu biznesowego. W takim przypadku warto promować instalację aplikacji na danej platformie. Niektórzy użytkownicy mogą jednak woleć przeglądanie internetu. Jeśli można zidentyfikować taki segment, prompt dotyczący PWA może być wyświetlany tylko w jego przypadku (nazywamy to „PWA jako rozwiązanie zastępcze”).
PWA jako główna aplikacja do zainstalowania
Gdy PWA spełnia kryteria możliwości zainstalowania, większość przeglądarek wyświetla informację, że można ją zainstalować. Na przykład w Chrome na komputerze na pasku adresu wyświetla się ikona umożliwiająca instalację, a na urządzeniu mobilnym – minipasek informacji:
W przypadku niektórych aplikacji może to wystarczyć, ale jeśli Twoim celem jest zwiększenie liczby instalacji aplikacji internetowej, zdecydowanie zalecamy uwzględnienie BeforeInstallPromptEvent i stosowanie wzorców promowania instalacji aplikacji internetowej.
Zapobieganie rywalizacji własnej aplikacji internetowej z wersją na daną platformę, która może obniżać liczbę instalacji aplikacji
W niektórych przypadkach możesz promować instalację aplikacji na daną platformę zamiast PWA, ale w takim przypadku zalecamy też udostępnienie mechanizmu umożliwiającego użytkownikom zainstalowanie PWA. Ta opcja umożliwia użytkownikom, którzy nie mogą lub nie chcą zainstalować aplikacji na danej platformie, korzystanie z podobnej wersji.
Pierwszym krokiem do wdrożenia tej strategii jest zdefiniowanie heurystyki, która określa, kiedy użytkownikowi ma zostać wyświetlona promocja zachęcająca do zainstalowania PWA.
Przykład: użytkownik PWA to użytkownik, który zobaczył prośbę o zainstalowanie aplikacji na danej platformie, ale jej nie zainstalował. Taki użytkownik wrócił do witryny co najmniej 5 razy lub kliknął baner aplikacji, ale nadal korzystał z witryny.
Następnie heurystyka może być stosowana w ten sposób:
- wyświetlać baner instalowania aplikacji na konkretnej platformie;
- Jeśli użytkownik zamknie baner, ustaw plik cookie z tymi informacjami (np.
document.cookie = "app-install-banner=dismissed"). - Użyj innego pliku cookie do śledzenia liczby wizyt użytkowników w witrynie (np.
document.cookie = "user-visits=1"). - Napisz funkcję, np.
isPWAUser(), która wykorzystuje informacje wcześniej zapisane w plikach cookie wraz z interfejsemgetInstalledRelatedApps()API, aby określić, czy użytkownik jest „użytkownikiem PWA”. - Gdy użytkownik wykona znaczące działanie, wywołaj funkcję
isPWAUser(). Jeśli funkcja zwróci wartość true i poprzednio zapisano prompt instalacji PWA, możesz wyświetlić przycisk instalacji PWA.
Promowanie instalacji PWA w sklepie z aplikacjami
Aplikacje na potrzeby sklepów z aplikacjami mogą być tworzone przy użyciu różnych technologii, w tym technik PWA. W artykule Włączanie aplikacji PWA w środowiskach natywnych znajdziesz podsumowanie technologii, które można do tego celu wykorzystać.
W tej sekcji aplikacje w sklepie zostaną podzielone na 2 grupy:
- Aplikacje platformowe: te aplikacje są tworzone głównie z użyciem kodu platformowego. Ich rozmiary zależą od platformy, ale zwykle przekraczają 10 MB na Androidzie i 30 MB na iOS. Możesz promować aplikację na daną platformę, jeśli nie masz aplikacji internetowej lub jeśli aplikacja na daną platformę zawiera pełniejszy zestaw funkcji.
- Lekkie aplikacje: te aplikacje można też tworzyć za pomocą kodu platformowego, ale zwykle są one tworzone przy użyciu technologii internetowych i opakowane w pakiet dla danej platformy. PWA można też przesłać do sklepów. (temat ten omówimy później w tym artykule). Niektóre firmy decydują się na udostępnianie wersji „lite”, a inne stosują to podejście również w przypadku swoich flagowych (podstawowych) aplikacji.
Promowanie aplikacji o małej wielkości
Według badania Google Play za każdym razem, gdy rozmiar pliku APK zwiększa się o 6 MB, współczynnik konwersji instalacji maleje o 1%. Oznacza to, że współczynnik ukończenia pobierania aplikacji o rozmiarze 10 MB może być o około 30% wyższy niż w przypadku aplikacji o rozmiarze 100 MB.
Aby rozwiązać ten problem, niektóre firmy korzystają z PWA, aby udostępniać w Sklepie Play lekką wersję aplikacji za pomocą zaufanych działań w internecie (Trusted Web Activities, TWA). TWA otacza PWA komponentem podobnym do WebView, a wynikająca z tego aplikacja ma zwykle rozmiar zaledwie kilku megabajtów.
Oyo, jedna z największych indyjskich firm z branży hotelarskiej, stworzyła wersję Lite swojej aplikacji i udostępniła ją w Sklepie Play za pomocą TWA. W momencie pisania tego artykułu aplikacja Oyo miała tylko 850 KB, czyli 7% rozmiaru aplikacji na Androida. Po zainstalowaniu jest ona nie do odróżnienia od aplikacji na Androida:
Firma Oyo zachowała w sklepie zarówno wersję flagową, jak i wersję „lite”, dając użytkownikom możliwość wyboru.
Zapewnianie wydajnego działania witryny
Logiczne jest, że użytkownicy słabszych urządzeń chętniej pobierają lekkie wersje aplikacji niż użytkownicy telefonów z wysokimi parametrami. Dlatego jeśli można zidentyfikować urządzenie użytkownika, możesz nadać priorytet banerowi instalowania aplikacji o małej wielkości zamiast wersji aplikacji przeznaczonej dla konkretnej platformy.
W internecie można uzyskać sygnały z urządzeń i przybliżone informacje o ich kategoriach (np. „wysoka”, „średnia” lub „niska”). Możesz uzyskać te informacje na różne sposoby: za pomocą interfejsów JavaScript API lub wskazówek klienta.
Za pomocą JavaScriptu
Korzystając z właściwości JavaScript, takich jak navigator.hardwareConcurrency, navigator.deviceMemory i navigator.connection, możesz uzyskać informacje odpowiednio o procesorze, pamięci i stanie sieci urządzenia. Na przykład:
const deviceCategory = req.get('Device-Memory') < 1 ? 'lite' : 'full';`
Korzystanie ze wskazówek dotyczących klienta
Sygnały urządzenia można też wywnioskować z nagłówków żądań HTTP za pomocą wskazówek klienta. Oto jak zaimplementować poprzedni kod dotyczący pamięci urządzenia z użyciem wskazówek klienta:
Najpierw w nagłówku odpowiedzi HTTP w przypadku dowolnego żądania własnego powiedz przeglądarce, że chcesz otrzymywać wskazówki dotyczące pamięci urządzenia:
HTTP/1.1 200 OK
Content-Type: text/html
Accept-CH: Device-Memory
Następnie w nagłówku żądań HTTP zaczniesz otrzymywać informacje Device-Memory:
GET /main.js HTTP/1.1
Device-Memory: 0.5
Możesz użyć tych informacji w systemie backend, aby zapisać plik cookie z kategorią urządzenia użytkownika:
app.get('/route', (req, res) => {
// Determine device category
const deviceCategory = req.get('Device-Memory') < 1 ? 'lite' : 'full';
// Set cookie
res.setCookie('Device-Category', deviceCategory);
…
});
Na koniec utwórz własną logikę, aby odwzorować te informacje w kategoriach urządzeń i wyświetlać odpowiedni komunikat o instalacji aplikacji w każdym przypadku:
if (isDeviceMidOrLowEnd()) {
// show "Lite app" install banner or PWA A2HS prompt
} else {
// show "Core app" install banner
}
Podsumowanie
Możliwość umieszczenia ikony na ekranie głównym użytkownika jest jedną z najbardziej angażujących funkcji aplikacji. Ponieważ do tej pory było to możliwe tylko w przypadku aplikacji instalowanych ze sklepów z aplikacjami, firmy mogły sądzić, że wyświetlanie banera z zachętą do zainstalowania aplikacji w sklepie z aplikacjami wystarczy, aby przekonać użytkowników do zainstalowania aplikacji. Obecnie istnieje więcej opcji umożliwiających użytkownikom instalację aplikacji, w tym udostępnianie w sklepach aplikacji o lekkiej konstrukcji oraz umożliwienie użytkownikom dodawania aplikacji PWA do ekranu głównego poprzez wyświetlanie im odpowiedniego promptu bezpośrednio w witrynie.