search

khmyznikov / pwa-install

Installation dialog for Progressive Web Application. Provides a more convenient user experience and fixes the lack of native dialogs in some browsers.
https://www.khmyznikov.com/pwa-install
MIT License
378 stars 61 forks source link

One more step for iOS instruction #38

Open s0xDk opened 10 months ago

s0xDk commented 10 months ago

In all (most?) cases, "Add to Home Screen" button is hidden under the bottom edge of the screen and Share Panel must be scrolled down to reveal that button.

Suggesting to add "Scroll Down" step between "Press Share in Navigation bar" and "Press Add to Home Screen".

1) Open in Safari browser (maybe hide this item if user is already in Safari? 🤔) 2) Press Share in Navigation bar 3) Scroll Down 👈 4) Press Add to Home Screen

khmyznikov commented 10 months ago
  1. You can't hide it because of existence SFSafariViewController image AFAIK you can't add to home screen from this state. And detect this state not sure is possible...
s0xDk commented 10 months ago

I mean, after clicking on the Share button in the nav bar, user can't see "Add to Home Screen" button and needs to scroll down to find it.

Screenshot 2024-01-13 at 18 50 43
khmyznikov commented 10 months ago

Yeah I got this point. But do you think it's a real problem? Have any real life experience or just a clue?

s0xDk commented 10 months ago

Noticed that when explained to my friends how to install my PWA. 2 of 3 told me that they "don't see Add to Home Screen button" 🫠 I think the problem is real for not-so-technically savvy users.

s0xDk commented 10 months ago

@khmyznikov also check this project out: https://github.com/philfung/add-to-homescreen

Screenshot 2024-01-13 at 19 45 06
khmyznikov commented 10 months ago

@s0xDk nice project. Interesting why he is not reached me to collaborate.

s0xDk commented 10 months ago

@khmyznikov I like how it detects different kinds of Safari WebViews and points an arrow to proper places.

s0xDk commented 10 months ago

One more thing: If a user is already within Safari, step “1) Open in Safari browser” may be misleading.

So the instruction could be updated to this:

1) Press Share in Navigation bar 2) Scroll down the Share menu 3) Press Add to Home Screen

khmyznikov commented 10 months ago

Maybe:

  1. Press Share in Navigation bar
  2. Scroll down to Add to Home Screen
s0xDk commented 10 months ago

Maybe:

  1. Press Share in Navigation bar
  2. Scroll down to Add to Home Screen

Yeah, it's more concise and keeps the point.

zehawki commented 7 months ago

Here's how I do it:

image

The language is directly borrowed from Apple - https://support.apple.com/en-sg/guide/iphone/iph42ab2f3a7/ios

cillian-cwb commented 3 months ago

In all (most?) cases, "Add to Home Screen" button is hidden under the bottom edge of the screen and Share Panel must be scrolled down to reveal that button.

Suggesting to add "Scroll Down" step between "Press Share in Navigation bar" and "Press Add to Home Screen".

  1. Open in Safari browser (maybe hide this item if user is already in Safari? 🤔)
  2. Press Share in Navigation bar
  3. Scroll Down 👈
  4. Press Add to Home Screen

In all (most?) cases, "Add to Home Screen" button is hidden under the bottom edge of the screen and Share Panel must be scrolled down to reveal that button.

Suggesting to add "Scroll Down" step between "Press Share in Navigation bar" and "Press Add to Home Screen".

  1. Open in Safari browser (maybe hide this item if user is already in Safari? 🤔)
  2. Press Share in Navigation bar
  3. Scroll Down 👈
  4. Press Add to Home Screen

In all (most?) cases, "Add to Home Screen" button is hidden under the bottom edge of the screen and Share Panel must be scrolled down to reveal that button.

Suggesting to add "Scroll Down" step between "Press Share in Navigation bar" and "Press Add to Home Screen".

  1. Open in Safari browser (maybe hide this item if user is already in Safari? 🤔)
  2. Press Share in Navigation bar
  3. Scroll Down 👈
  4. Press Add to Home Screen

As iOS Chrome and Edge now supports 'Add to Home Screen' there is no need for '1. Open in Safari browser'.