Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
Offline First Web Development

You're reading from   Offline First Web Development Design and build robust offline-first apps for exceptional user experience even when an internet connection is absent

Arrow left icon
Product type Paperback
Published in Nov 2015
Publisher Packt
ISBN-13 9781785884573
Length 316 pages
Edition 1st Edition
Languages
Arrow right icon
Author (1):
Arrow left icon
Daniel Sauble Daniel Sauble
Author Profile Icon Daniel Sauble
Daniel Sauble
Arrow right icon
View More author details
Toc

Table of Contents (12) Chapters Close

Preface 1. The Pain of Being Offline FREE CHAPTER 2. Building a To-do App 3. Designing Online Behavior 4. Getting Online 5. Be Honest about What's Happening 6. Be Eventually Consistent 7. Choosing Intelligent Defaults 8. Networking While Offline 9. Testing and Measuring the UX A. References Index

The offline paradigm

Internet connectivity is only one part of the puzzle. Modern devices rely on different types of wireless networks: GPS, LTE, 4G, 3G, Edge, GPRS, Wi-Fi, Bluetooth, and RFID, among others. If any of these go down, she mused, certain bad things can happen:

  • If GPS goes down, it can mess up your fitness tracking resulting in erratic maps and false progress toward your fitness goals.
  • As your mobile connection degrades from 4G to GPRS, web browsing slows and eventually stops. Wi-Fi has the same problem.
  • Bluetooth is also important. It connects us to our keyboards, mouses, headsets, and other devices. As the signal weakens, these accessories become unreliable or cease functioning altogether.
  • NFC, while not ubiquitous today, certainly will be so in the future. We'll depend on it for all or most of our Point of Sale (POS) financial transactions. If it goes down, can we use other networks as backup?

Susan stopped writing and put down her pen. She gazed reflectively at the list. The paper lay on top of her laptop as though mocking the brick that lay underneath.

So, with these failure cases, how might we develop our apps differently? More importantly, is there a common set of principles that we can use in order to avoid reinventing the wheel each time? What makes an excellent offline experience?

Hand reached for pen and she began a second list:

Principles for a great offline experience are as follows:

  • Give me uninterrupted access to the content I care about.
  • Content is mutable. Don't let my online/offline status change that.
  • Error messages should not leave me guessing or unnecessarily worried.
  • Don't let me start something I can't finish.
  • An app should never contradict itself. If a conflict exists, be honest about it.
  • When the laws of physics prevail, choose breadth over depth when caching.
  • Empty states should tell me what to do next in a delightful way.
  • Don't make me remember what I was doing last. Remember for me.
  • Degrade gracefully as the network degrades. Don't be jarring.
  • Never purge the cache unless I demand it.

Susan put her pen down. A good list. She gave a contented nod, put the paper in her bag, and walked out of the café, humming to herself. It was an interesting thought exercise and possibly more. She would bring it up with her design team at their 10 o'clock review. Their project might benefit from these principles.

You have been reading a chapter from
Offline First Web Development
Published in: Nov 2015
Publisher: Packt
ISBN-13: 9781785884573
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at $19.99/month. Cancel anytime
Banner background image