W przeszłości instalowanie aplikacji było możliwe tylko w kontekście aplikacji działających na określonej platformie. Dziś nowoczesne aplikacje internetowe oferują możliwość zainstalowania, które zapewniają taki sam poziom integracji i niezawodności jak aplikacje dostępne na poszczególnych platformach.
Możesz to osiągnąć na różne sposoby:
- Zainstaluj PWA w przeglądarce.
- Zainstaluj progresywną aplikację internetową ze sklepu z aplikacjami.
Skonfigurowanie różnych kanałów dystrybucji to skuteczny sposób na dotarcie do szerokiego grona użytkowników, ale wybór odpowiedniej strategii promującej instalację aplikacji PWA może być trudny.
Z tego przewodnika dowiesz się, jak łączyć różne opcje instalacji w celu zwiększenia liczby instalacji oraz uniknięcia konkurencji na platformie i kanibalizacji. Oferta instalacyjna obejmuje aplikacje PWA zainstalowane zarówno z przeglądarki, jak i z App Store, a także aplikacje przeznaczone dla konkretnej platformy.
Dlaczego warto zadbać o możliwość zainstalowania aplikacji internetowej?
Zainstalowane progresywne aplikacje internetowe działają w osobnym oknie zamiast na karcie przeglądarki. Można je uruchamiać z poziomu ekranu głównego, stacji dokującej, paska zadań lub półki użytkownika. Można je wyszukiwać na urządzeniu i przełączać między nimi za pomocą przełącznika aplikacji. Dzięki temu poczują się jak część urządzenia, na którym są zainstalowane.
Jednak posiadanie zarówno aplikacji internetowej z możliwością zainstalowania, jak i aplikacji działających na określonej platformie może być mylące dla użytkowników. Dla niektórych użytkowników aplikacje działające na określonej platformie mogą być najlepszym wyborem, ale dla innych mogą mieć pewne wady:
- Ograniczenia miejsca na dane: instalacja nowej aplikacji może oznaczać usunięcie innych aplikacji lub zwolnienie miejsca przez usunięcie cennych treści. Jest to niekorzystne zwłaszcza w przypadku użytkowników słabszych urządzeń.
- Dostępna przepustowość: pobieranie aplikacji może być kosztowne i powolne, zwłaszcza w przypadku użytkowników, którzy korzystają z powolnego połączenia i drogich pakietów danych.
- Utrudnienie: opuszczenie strony internetowej i przejście do sklepu w celu pobrania aplikacji powoduje dodatkowe utrudnienia i opóźnia działanie użytkownika, które można wykonać bezpośrednio w internecie.
- Cykl aktualizacji: wprowadzanie zmian w aplikacjach na określonych platformach może wymagać przejścia procesu sprawdzania aplikacji, co może spowolnić wprowadzanie zmian i wykonywanie eksperymentów (np. testy A/B).
W niektórych przypadkach odsetek użytkowników, którzy nie pobiorą Twojej aplikacji na danej platformie, może być duży. Mogą to być np. tacy, którzy uważają, że nie będą z niej korzystać zbyt często albo nie usprawiedliwiają wydawania kilku megabajtów pamięci lub danych. Wielkość tego segmentu możesz określić na kilka sposobów, np. stosując konfigurację analityki do śledzenia odsetka użytkowników „tylko internet mobilny” użytkowników.
Jeśli rozmiar tego segmentu jest spory, oznacza to, że musisz zapewnić użytkownikom alternatywne sposoby instalacji treści.
Promowanie instalacji PWA w przeglądarce
Jeśli masz wysokiej jakości progresywną aplikację internetową, lepiej promować jej instalację zamiast aplikacji na konkretnej platformie. Dotyczy to na przykład sytuacji, gdy w aplikacji na danej platformie brakuje funkcji oferowanych przez progresywną aplikację internetową lub jeśli aplikacja nie była od jakiegoś czasu aktualizowana. Pomocne może też być promowanie instalacji aplikacji PWA, jeśli aplikacja na danej platformie nie została zoptymalizowana pod kątem większych ekranów, np. w ChromeOS.
W przypadku niektórych aplikacji zwiększanie liczby instalacji na określonej platformie jest kluczowym elementem modelu biznesowego. W takim przypadku promowanie instalacji aplikacji na danej platformie ma sens biznesowy. Niektórzy użytkownicy mogą jednak wygodniej pozostać w internecie. Jeśli uda się zidentyfikować taki segment, tylko zobaczy on prośbę o aplikację (tak zwany „PWA jako aplikacja zastępcza”).
PWA jako główna aplikacja z możliwością zainstalowania
Gdy aplikacja PWA spełnia kryteria instalacji, większość przeglądarek wyświetla informację, że można ją zainstalować. Na przykład Chrome w wersji na komputer pokazuje na pasku adresu ikonę do zainstalowania, a na komórce – minipasek informacyjny:
W niektórych przypadkach może to wystarczyć, ale jeśli zależy Ci na zwiększeniu liczby instalacji PWA, zdecydowanie zalecamy przesłuchanie BeforeInstallPromptEvent i postępowanie zgodnie z wzorcami promowania aplikacji PWA.
Zapobiegaj zmniejszaniu liczby instalacji aplikacji na konkretnej platformie przez progresywną aplikację internetową.
W niektórych przypadkach możesz promować instalację aplikacji na danej platformie zamiast progresywnej aplikacji internetowej. W takim przypadku nadal zalecamy jednak udostępnienie mechanizmu umożliwiającego użytkownikom instalację tej aplikacji. Dzięki tej opcji zastępczej użytkownicy, którzy nie mogą lub nie chcą zainstalować Twojej aplikacji na danej platformie, mogą z niej korzystać na podobnej zasadzie.
Pierwszym krokiem w implementacji tej strategii jest zdefiniowanie heurystyki na potrzeby wyświetlania użytkownikowi promocji instalacji aplikacji PWA.
Przykład: użytkownik PWA to użytkownik, który widział prośbę o zainstalowanie aplikacji na danej platformie i nie zainstalował tej aplikacji. Co najmniej 5 razy wrócili na stronę lub kliknęli baner aplikacji, ale nadal korzystali z witryny.
Następnie heurystykę można zaimplementować w następujący sposób:
- Pokaż baner promujący instalację aplikacji na danej platformie.
- Jeśli użytkownik zamknie baner, ustaw plik cookie z tą informacją (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"). - Utwórz funkcję (np.
isPWAUser()), która będzie wykorzystywać informacje zapisane wcześniej w plikach cookie razem z interfejsem APIgetInstalledRelatedApps()do określenia, czy użytkownik jest uznawany za „użytkownika PWA”. - Gdy użytkownik wykona istotne działanie, wywołaj
isPWAUser(). Jeśli funkcja zwróci wartość true, a prośba o instalację aplikacji PWA została wcześniej zapisana, możesz wyświetlić przycisk instalacji aplikacji PWA.
Promowanie instalowania aplikacji PWA w sklepie z aplikacjami
Aplikacje dla sklepów z aplikacjami można tworzyć przy użyciu różnych technologii, w tym technik PWA. W sekcji Łączenie PWA ze środowiskami natywnymi znajdziesz podsumowanie technologii, które można w tym celu wykorzystać.
W tej sekcji podzielimy aplikacje w sklepie na 2 grupy:
- Aplikacje dostępne na określonych platformach: takie aplikacje są w większości tworzone za pomocą kodu przeznaczonego na daną platformę. Ich rozmiar zależy od platformy, ale zwykle przekracza 10 MB w przypadku Androida i 30 MB w przypadku iOS. Możesz ją promować, jeśli nie masz aplikacji PWA lub jeśli ma ona pełniejszy zestaw funkcji.
- Lekkie aplikacje: te aplikacje również można tworzyć za pomocą kodu przeznaczonego na daną platformę, ale zwykle są one tworzone przy użyciu technologii internetowej w ramach opakowania. Pełne aplikacje PWA można także przesyłać do sklepów. (Zostało to omówione w dalszej części tego artykułu). Niektóre firmy udostępniają je jako „proste” i inni zastosowali ją również w swoich sztandarowych (podstawowych) aplikacjach.
Promowanie uproszczonych aplikacji
Według badania Google Play każde zwiększenie rozmiaru pliku APK o 6 MB powoduje spadek współczynnika konwersji polegającej na instalacji aplikacji o 1%. Oznacza to, że współczynnik pełnych obejrzeń 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 wykorzystują aplikacje PWA, aby udostępniać prostą wersję aplikacji w Sklepie Play przy użyciu Trusted Web Activities (TWA). Tworzone przez TWA pakiety aplikacji PWA są umieszczane w komponencie typu WebView. Rozmiar aplikacji to zwykle tylko kilka megabajtów.
Oyo, jedna z największych indyjskich firm turystycznych, stworzyła aplikację w wersji Lite i udostępniła ją w Sklepie Play za pomocą TWA. W chwili napisania tego artykułu aplikacja Oyo miała zaledwie 850 KB, czyli 7% rozmiaru aplikacji na Androida. Po zainstalowaniu nie da się go odróżnić od aplikacji na Androida:
Oyo zachował zarówno sztandarowy, jak i „lite” wersji aplikacji w sklepie, zapewniając użytkownikom wybór.
Wygodne korzystanie z internetu
Intuicyjnie wskazuje się, że użytkownicy słabszych urządzeń mogą być bardziej skłonni do pobierania prostszych wersji aplikacji niż użytkownicy z zaawansowanych telefonów. W związku z tym, jeśli można zidentyfikować urządzenie użytkownika, można potraktować priorytetowo prostszy baner promujący instalację aplikacji, a nie cięższa wersja aplikacji na danej platformie.
W internecie można uzyskiwać sygnały z urządzenia i przyporządkowywać je w przybliżeniu do kategorii urządzeń (np. „wysokie”, „średnie” czy „niskie”). Informacje te można uzyskać na różne sposoby, korzystając z interfejsów API JavaScript lub wskazówek dla klientów.
Używanie JavaScriptu
Korzystając z właściwości JavaScriptu, takich jak navigator.hardwareConcurrency, navigator.deviceMemory i navigator.connection, możesz uzyskać informacje o procesie CPU, 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 z urządzenia można też wnioskować w nagłówkach żądań HTTP za pomocą wskazówek dotyczących klientów. Oto jak możesz wdrożyć poprzedni kod pamięci urządzenia, korzystając ze wskazówek dla klienta:
Najpierw poinformuj przeglądarkę, że chcesz otrzymywać wskazówki dotyczące pamięci urządzenia w nagłówku odpowiedzi HTTP dla dowolnego żądania własnego:
HTTP/1.1 200 OK
Content-Type: text/html
Accept-CH: Device-Memory
Od teraz będziesz otrzymywać informacje Device-Memory w nagłówku żądania HTTP:
GET /main.js HTTP/1.1
Device-Memory: 0.5
Możesz wykorzystać te informacje w backendach, aby przechowywać 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 zmapować te informacje na kategorie urządzeń i wyświetlać odpowiednie prośby o instalację 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 to jedna z najciekawszych funkcji aplikacji. Biorąc pod uwagę, że w przeszłości było to możliwe tylko w przypadku aplikacji instalowanych ze sklepów z aplikacjami, firmy mogą sądzić, że wyświetlenie banera instalacji w sklepie z aplikacjami wystarczy, aby przekonać użytkowników do instalacji. Obecnie dostępnych jest więcej sposobów na umożliwienie użytkownikom instalowania aplikacji, na przykład oferowanie im lżejszych aplikacji w sklepach oraz umożliwienie użytkownikom dodawania aplikacji PWA do ekranu głównego przez zachęcanie ich do instalacji bezpośrednio ze strony internetowej.