Design For Offline

Our most consequential work comes through treating context, motivation and their respective futures with paramount importance. Steven Trevathan explains how Offline First forces the next evolutionary step in good design

You know the moment. You’re on the train attempting to open an article you were reading earlier that morning but didn’t get the chance to finish. You’ve loaded it once before, and you even have two bars of service. However, it just won’t open. Your phone thinks it is online, but really it is not. You are offline.

What you’re experiencing, day in and day out in a variety of ways, is a problem that we have all accepted as the standard yet haven’t seen for what it truly is: a fundamentally flawed experience. Regardless of whether you’re a maker or a consumer of tech, we don’t expect things to work offline, and decades of requiring constant internet connection has set us up to be blind to this issue. As such, supporting offline experiences requires attention to be paid to the negative space, which is somewhere we didn’t really know to look until Alex Feyerke introduced us to the concept of Offline First (alistapart.com/article/offline-first) a little more than three years ago.

However obvious it may seem, it’s worth establishing what we mean when we speak of ‘offline’ before describing what Offline First is. Offline is any scenario in which a user seeks information or functionality while being unable to access a supportive outside network. This may be experienced due to low bandwidth, a lack of internet connection, server outages, or countless other reasons.

At first glance it may seem like designing for offline is as simple as communicating to users that they cannot access the app or that any new data they enter will be lost, but this approach falls far short of what is possible with today’s technology. Instead, we should look at this as an opportunity to create a ‘deployed’ application that is as close to fully functional offline as it is online; blending the experiential line between native and web apps.