> I thought it was fairly straightforward to add an "add to home screen" overlay to a webpage with javascript.
On Android, yes. On iOS, users have to click “share” and “add to Home Screen”, which practically nobody knows how to do, and it presents the user with a rather confusing prompt for them to choose the name of the PWA they’re about to install. The website could tell you to do that, of course, but then it only works in safari at the moment, and it is very clunky.
iOS allows websites to show a banner that will help them install the equivalent app from the App Store, but there is no similar functionality for PWAs.
Some people speculate that Apple relies on the PWA install process being confusing to help push developers into the App Store.
On my phone, when I click "Add to Home Screen", it immediately focuses the name text field and pops up a keyboard. As a user installing an app, I expect to see the name, the icon, possibly a description, and a big, obvious "install" button. I do not expect to suddenly be presented with a keyboard letting me edit the name of the app. When a user changes the name, it is far more likely to be a mistake than an intentional action, unless the PWA did a phenomenally poor job of naming itself. On Windows, when you install an application, do you expect it to start by highlighting the app shortcut and entering edit mode so you can choose the name of the app? No, that would be bizarre, and it is bizarre here too.
Regardless of it being auto-populated, I think being immediately presented with the option to choose the name will inevitably confuse many users. If the user accidentally hits any keys, that will mess up the name... then they have to try to fix it themselves, if they even notice before they hit the "add" button. That just doesn't seem like a great user experience.
Talking about the "add" button, it is not called "install", unfortunately. The "add" button by itself may confuse users into wondering if they clicked bookmark by mistake. In fact, the interface is nearly identical to the bookmark interface in Safari, except that the bookmark interface uses the word "save" instead of "add", and the bookmark interface shows you which folder you're saving into. How clear and simple!
The "add" button is also a small button in the top right, which is completely different from how the "GET" button with a vivid blue background is presented in the App Store. Renaming and restyling the button to match the one in the App Store would make the experience more consistent for the user.
None of this matters to technical users like us either way, but making PWAs more accessible to all users requires making the process as easy as possible, smoothing out weird rough edges like this. The option to edit the name would make more sense under the Settings app or maybe an additional "Edit" option in "jiggle mode" on the home screen, if it should even exist at all. I can't edit the name of other apps on my phone. From a technical perspective, someone might ask "why can't I edit those names too?" But, it should be consistent either way, in my opinion.
Those are my opinions on the current interface, anyways. I don't think Apple has meaningfully changed it for over a decade, and if they have decided to care about PWAs, they really should polish this interface up.
I honestly think you are overthinking this. Many users would actually prefer to customize the displayed name. Discoverability of the installation process is IMO the real issue.
Then why doesn’t iOS ask users to customize the displayed name of native App Store apps before installing them? As I said, I think it should be consistent, and I don’t think that's a hugely controversial opinion.
Also, why don’t Windows or Android ask you to name apps before you install them? Why doesn’t Steam? This is just not how installing apps works. At a minimum, I would like it to avoid popping the keyboard up by default. If a user wants to edit the name, tapping on the name themselves shouldn't be a problem.
> Discoverability of the installation process is IMO the real issue.
> On iOS, users have to click “share” and “add to Home Screen”
Thanks very much for your detailed explanation. Man, more and more I don't know how people can continue to praise Apple for better usability. So much shit on an iPhone these days is in completely hidden, non-obvious gestures or swipes - e.g. why TF would anyone think "add to home screen" would be in the share menu?
On Android, yes. On iOS, users have to click “share” and “add to Home Screen”, which practically nobody knows how to do, and it presents the user with a rather confusing prompt for them to choose the name of the PWA they’re about to install. The website could tell you to do that, of course, but then it only works in safari at the moment, and it is very clunky.
iOS allows websites to show a banner that will help them install the equivalent app from the App Store, but there is no similar functionality for PWAs.
Some people speculate that Apple relies on the PWA install process being confusing to help push developers into the App Store.