Aggressive Web Apps

(funky, upbeat music) (applause) - [Phil] Thank you, thank you.

I wanna start this talk with a tweet.

It's not actually by a person I follow or I personally know. It has some people who liked it, a few thousand retweets, a few tens of thousands of likes, and that's not many in the course of Twitter these days, but I feel like you might recognise some feelings and thoughts from it, and that's why I wanted to share it.

Dear website, I don't want you to post notifications to my desktop, I don't to subscribe to your thing via popup, I don't want you to know my location, please stop autoplaying that video, I am angry and sad now. Some of our web applications are making our users angry and sad, and that's kind of where I came up, in my mind, with the term aggressive web apps, all of those behaviours are very aggressive to the user, and I want to change that. I want us to change that, together.

Now I don't have an awful lot of time to talk about it today, so I do wanna concentrate specifically on notifications, and so I want to talk about how we can make good push notifications, but also how we can deal with permissions a little better. We'll see more skull emojis as the talk progresses. (light audience laughter) So as John introduced me, my name's Phil Nash. I am a developer evangelist for Twilio.

If you don't know Twilio, then we do things like applications where you can, also we have APIs for things where you can build applications, like the coffee application we're using today, but also things over voice, video, other messaging, and notifications.

If you wanna talk about any of those, please find me during the rest of the event. I'll be around as much as I possibly can, and I'll be probably dressed in bright red. So yes, I absolutely loved Simon's talk just then as well. We're talking about the better things we can do, the better experiences we can give users via the means of progressive web apps and via my favourite recent API, the service worker.

It's gonna do it.

That.

(laughter) The service worker; it's fantastic, and it gives us this ability to build these offline experiences and give users greater experiences, and it's supported across the board. We've got check marks everywhere.

(breathes loudly and excitedly) Sorry, you should have seen me the day that the final browser dropped in.

I was just like, "Yes!" in my room.

(breathes deeply) But it doesn't just give us those offline experiences, it gives us push notifications, and Simon actually gave us some great use cases for how we could use push notifications to announce some offline kind of things happening. Push notifications have pretty good support, actually better than background sync, and so it does go in Chrome, and Opera, and Firefox, and yeah, no.

It stops there, but it does carry on to Edge and that's why I was pretty excited the day that Edge released the bot for this.

So excited it was actually working on a demo using push notifications at the time, and so I went to the Windows site and I downloaded a VM, and I got the VM running, and I ran Windows Internet Explorer Edge 14 or 17, Edge 17 HTML, and it worked! It worked first time, and I was super excited about that. And this is that kind of can I use graph, which says a little bit more red on it, but if you are looking carefully in the top right-hand corner, there, it's about 75% of global people can actually receive push notifications, so it's worth considering right now, and worth considering how we use them.

So we need to talk about good push notifications, because just push notifications can land us in bad places, bad user experiences, aggressive experiences. This was that first line of the tweet.

I don't want you to post notifications to my desktop. And we can swap mobile device in there, as well, probably. But I don't believe this.

I don't believe that users don't want notifications. I believe that there are the ability for us to have great notifications that will help people and give them a better experience of our applications. I think they're incredibly useful.

But as a side note, I do believe that perhaps you're the person sitting in the crowd that genuinely doesn't want push notifications ever, and has it turned off on every device they've ever owned, and that's fine.

You might not want them ever, but I don't believe that's the case for everyone. So, we can carry on.

Good notifications, I have some examples, because I can't just keep talking about them and they're kind of generic term.

I've some good examples of this.

First up is appointment reminders, and I see as Twilio we've been sending text messages for about nine years as part of an API, and I wanted to just call out one of our customers, here, the Arkansas Children's Hospital, who before implementing appointment notifications via SMS, had a drop-off rate, a no-show rate for appointments at the hospital, of 20%.

So one in five children were not turning up to a hospital appointment.

I don't know why they weren't, but that's pretty horrifying for both the children who had appointments, but also the doctors who are wasting time not seeing patient in 20% of the time.

But after implementing appointment reminders, that dropped to 2%, and maybe SMS is the correct way to do this if there's appointments being made in person at a hospital, but if you are building some kind of online appointment form, then offering, once you've made that appointment, offering up a push notification to remind the person afterwards, is a great experience and will likely cause that person to actually show up. Other things such as chat alerts.

Chat's a fairly obvious thing for push notifications, I think.

It's also probably one of those things that makes some of the people in the crowd turn off all of those notifications for everything.

But I know that I get around, I am lucky enough to go and speak in various places around the world, and I get around talking to various friends that I've made over those things, other family, all sorts of things over a multitude of different chat applications, and without push notifications for that, I'd never find any of them, and that would be sad. ETA alerts are things for stuff turning up for you. Think if you booked a car, or food, or any kind of delivery is turning up today. Knowing that that thing is almost here, here, or gonna be here today, is a pretty useful experience. And finally event updates.

It'd be great if we could all get a push notifications to remind us when Sarah will be giving that surprise lunchtime talk, but also I like to use this as any kind of those one-off events that don't happen that often. Getting on a plane for example, when it's time to check in, when it's time to arrive at the airport, all that kind of thing, I think is incredibly useful. These notifications all have these three tenants. They are timely, actionable, and personal, and I think that is what makes for a good notification. And when I say timely, what I mean is that, you know, these kind of options that like, the message was just sent to you, your car is here now, you can check in now.

That one's particularly useful for me on flights because I like to steal the exit rows in the 24 hours before we fly.

But they're timely, like if I got that notification two days after the flight, I can't check in now, so that's not very helpful.

This goes to more than that, you've gotta consider things like time zones, and whether people want to be disturbed at the time. You might've seen this flow chart go around Twitter. It's apparently the decision tree for Slack as to whether they send you a push notification or not. A lot of stuff going into that, and that's fair. I don't quite believe this one, either, because I've genuinely been on my desktop, answering people on Slack, receiving notifications on my phone for the message I just saw, so I'm pretty sure that it should say that for me, but-- (audience laughter) They'll work it out eventually I'm sure.

But yes, the time of day, the type, the time zone of the press, and the number of notifications you've sent them are all important to not give them notification fatigue, to not put people off notifications once you have their attention.

Then they are actionable.

Some of the worst notifications are telling you about things that you can do nothing about, like a news article was just published, or whatever. But things like this, when you've just got a message, you can read that message, reply to that person, it might be important.

If your car is here, you should go outside and get into it. If you can check in now, you can get that leg room in that seat.

And it's actionable and useful for that reason. And then they are personal.

This is not somebody else can check in, this is not somebody else got a message, but you got a message, your car is here, you can check in now, and without those tenants, messages can just be annoying.

I like to think of news, the Apple news app once in a while just sends me notifications something I care absolutely nothing about.

Have you ever woken up to 12 or 14 notifications telling you about a royal wedding that happened overnight? You're like, why did I need to know this? It's hardly breaking news.

I was fairly aware because of all the other notifications you sent me. I believe some people do wanna hear that, though, so there should be an option for this, but you kind of need to know when to break the rules. And I think a really good example of this is actually the guardian team in the UK.

Last year for the general election, where they built this little notification, which kept you up to date with how the votes were coming in for the parties as counts were announced.

Not particularly personal, probably overnight because that's when the counts happen, and not exactly actionable, but certainly timely, because this is what was happening right now, and people who wanted to opt into this could. And what's really nice is you could also opt out pretty swiftly by pressing the stop button there in the middle.

And that's important, too, because if we have all these notifications of different things and varying reasons all within one application, this is all scoped to that one URL.

You need to let your users opt out within the application. This is important for a number of reasons, because firstly, you don't want them to opt out overall. And this is Twitter's iOS application which allows me to turn off all the rubbish I never wanna hear about, but it's in the application, because if I went to iOS settings and turned off notifications to Twitter, they'd never get to message me again.

And this exists in the browser, and it's not a great alternative, because, this is Chrome's settings page for it, and what you can do, you can fit, you can put a URL into here, but entering a URL into a box is a little bit difficult, so you could just press the toggle at the top there and turn off notifications for everything, and users are gonna do that.

If we send people to this page, and it's not an easy page to find, if we send them there, they're going to turn them off, and they're gonna be off forever.

Not just for your application, but for everybody's. This is the same in Firefox.

Slightly easier to find, but instead of adding a URL and giving some kind of like, tweaking specific things, the check box hammer of turn the whole thing off is it gonna turn off for everyone.

Skulls.

So before we even get to having permission to people to send these push notifications and annoy people with a pop notification, we actually need to get permissions about it, permission for that.

And so, that I think is also-- Permissions are absolutely what drives, I think, that first line, not just the first line, the first and seconds lines, of that tweet from the start. See, permissions are required for a whole lot of new use cases on the web.

We have exciting APIs such as push notifications, but also geolocation, which has been around for ages, but the media devices, cameras and microphones, Bluetooth, MIDI, WebUSB, all those kind of cool, new hardware kind of things. Coming out is get display media, which gives access to your kind of screen so you can share that across a WebRTC connection, which I think is kinda cool.

But they all require permission, as these are powerful enough to be privacy issues otherwise, and without asking users whether we can have this permission, then how could they have ever trust us? But the issue with this, is this experience, where you visit say Product Hunt for the first time, and whoa, I would like to send you push notifications. That's interesting cuz I don't know what your site does yet. I could guess from the URL I suppose, hunting products, I dunno, but that pops up on that first page load, and that's a bad experience.

And it's not just Product Hunt, I just like to pick them out for the video. This is CNET, so when you turn up for tech news for the first time, do you wanna hear it every time? I dunno.

This is SitePoint, web tutorials website, which not only has the pop-up for push notifications, but also a full page overlay asking you to pay money for a thing you can't see yet, because this is what the site should look like. So tutorials site for web applications and they do two things that are hostile to the user before you even see what the site does, and that's a little bit of a shame in my experience. And then finally, there's YouTube.

Now this is not the first time I've visited youtube.com. I'm logged in, but up in the top corner, there is the push notification thing.

I haven't pressed anything.

I just arrived.

And the problem with all of these examples, the problem that is scaring and putting off users, is the complete lack of context that we are giving those users to make that decision.

How do we decide whether we want push notifications when we know not what they will be used for and when they will come and why I would even have this because I don't know what this site does yet. So we need to stop it.

It's quite simple.

Stop! Because otherwise the users are gonna stop us. This is an article, it was written last year on How-To Geek, and I'm sure it's got great SEO by this point of how to stop Windows, how to stop websites from asking to show notifications.

And it's not just our third parties like this. On the occasion, the browsers themselves will complain about the feature they implemented themselves. Firefox, stop it.

So please, and this is an ask to everyone in this room, anybody watching on camera.

(audience laughter) Have any of you ever wanted to do that, anyway? Please do not demand permissions, not just for notifications, but for anything, on page load. We need to give our users context before we can ask anything of them like this, because my worry is that permissions will become the new pop-ups. We sold pop-ups a long time ago by just banning them, because people would get annoyed by them, they would close them, they wouldn't even care what was on them.

You could be popping up the greatest thing in the world, but because it was a pop-up and because every other nasty site on the Internet in the late nineties wanted to do that to you, you'd just close them, and so eventually the browsers banned them, unless we have a user interaction.

We can't do window.open until we get interaction, because when users dismiss these permissions, anything like this, by default the web platform itself loses its power. If they are just hitting escape or hitting block as soon as one of those notifications come up, then it's not just ruining it for the site that is doing this with no context, it's ruining it for every other site that has a real reason to ask for these permissions. When they're dismissed by default, we lose everything, and beyond that, they can go in and block them all! And that's, you know, that means that they don't even get to hear, they don't even get your context, your applications, experience that it could be giving to that user. They don't even get it at all.

They're never gonna hear that.

So we need to not only stop it ourselves, but make sure that the web itself catches up with this. I just want to repeat, maybe not for the first time in this talk, please do not demand permissions on page load. I have some suggestions as to what we could do instead. First up, we should be giving that context. We should just wait until the right time, until time for that notification, until a user is invested in the site.

Matt Gaunt of the Chrome developer relations team wrote a great blog post on the UX of permissions, and built this example, which is an airline, polymer airways, that doesn't exist.

But if you were to buy a ticket from polymer airways, at the end of the purchase flow, down at the bottom of the screen here, it says, "Hey, would you like to hear if there are flight delays?" And you just bought a ticket to this flight. You probably do wanna know if it's delayed. You don't wanna turn up to the airport eight hours too early and have to sit in a McDonalds with a bunch of crying children.

I dunno, it could be a horrible experience. You'd love to hear that you don't want to have this experience, and then when you click yes, I would like that, then it pops up the permissions dialogue, and you can say, "I know exactly what you're going to do with this." And of course, if polymer airways then later sends you a push notification to tell you that it's now 10% off flights to Denmark, and you didn't care about that, you can ban them then. But you have the context about what you are getting at that point, and so you agreed to it.

There are cases where this could be obvious. If you are building a chat application, then people are fairly aware that push notifications are useful to this, and so Slack of course implements a banner across the top of its web application, saying hey, I wanna get access to your permission, see your notifications.

But this is not a pop-up over the page, it's not getting in somebody's way, there is a little cross in the top-right corner, so you dismiss this without ever having to see the actual browser, Chrome, for permissions. And Slack won't ask you, again, until you add another channel, and then it will. But for the future, because just not doing something is clearly not, doesn't necessarily work for the web. There are plenty of people not in this room. There are plenty of people not watching the video. So for the future, I think we do need to fix this together in a better way. And this is where we can get involved in actually driving the future of the web via the browsers and things like that.

My suggestion is that browsers should, much like pop-ups, enforce some kind of user interaction before asking for permission, before popping any kind of permissions dialogue. Certainly for push notifications, there are arguments say that geolocation is fairly obvious if the page is a full screen map behind you, might be obvious why that's needed, but for permissions for push notifications, I would like to see some kind of interaction like this. And you can get involved in this.

There's actually a discussion going on online at the WICG. They have an interventions repo.

Interventions repo is a really interesting place. It's a place to open issues, to suggest small, but breaking changes to the web that will improve the user experience for everybody. One of those, issue number 49 I think it is, one of those is expect an interaction before we pop up permissions.

There's one argument against it right now, and that argument is that there have been a couple of companies set up that will handle push notifications for sites that haven't managed to move to https yet. As the service worker requires https to run, we can't do push notifications without that. And so those sites set the middle man and have the original site direct to them to then push up the permissions.

But the world is moving to https, and that is not a sustainable business plan as far as I'm concerned, whether we intervene or not, and so that's not an argument in my case, although I don't work for one of those companies. So I think we need to reopen that conversation, cuz there's not been much said on it recently. On the other hand, we also have the emerging permissions API as part of the W3C, at which point we should be asking ourselves, should this just be a repository of what permissions we have or don't have, or should it be whether we can ask for these permissions as well? Have we got enough user engagement with our site to ask for this permission? This is, user engagement is a heuristic that the browsers use to decide whether you can at the, pop up at the home screen notification, if you've built yourself a progressive web app. And so that heuristic could potentially be used in this case as well, and we can't ask for permission for this until the user has at least clicked around or visited a couple of pages and might actually be interested.

Just a couple of suggestions.

I actually wanna, I haven't gone too deep into this, I'm not too aware of the W3C's standards and processes, but it's something I'd like a conversation to be had about. So in conclusion, push notifications are awesome. I hope you do think there are some really good use cases for this that can help people and can improve the experience of your applications, but they do need to be for the right things. Do not demand permissions on page load.

Remember that one.

Make those notifications timely, actionable, and personal, and people will love them and want more of them, as long as they have more timely actions that they need to do.

Or don't.

There are options, and there are existing things that people do want notifications for that I would never have.

But if we're not asking for them on page load, if we're giving the context about that notification, then our users will be happy with the way that we presented it to them.

And of course, do allow opt outs.

Allow opt outs for the types of notifications that users can have from your site, and don't push them to that ban all notification screen in the browser, because that is gonna spoil the web for everyone. If users block all notifications, we as web developers trying to build experiences for them suffer, but all those users will suffer by not being able to receive those experiences as well. So ultimately, all I want to call to you today is to build progressive web apps, and not those aggressive web apps that are up in your face and making users sad and angry.

We can do this together.

We can fix this in the future, and that's all I have for you today.

Thank you so much.

(applause) (funky, upbeat music)