ARcostume: A Progressive Web App

Matthew Wilber
2 min readOct 2, 2018

--

Progressive Web Apps, or, PWAs, are a new paradigm in web development that strive to bring a native app experience to a website. Modern browsers give us access to device hardware such as the camera, accelerometers, and GPS. The latest versions give us access to the network interface and cache, providing a seamless offline experience. Top that off with the ability to install to the home screen and you have a website that is indistinguishable from a native app.

I was looking for a project to best show off a PWA and serve as an example in my portfolio. I settled on rebuilding one of my legacy properties as an open source project. In the middle of development, I happened upon an idea that was so goofy and so right that I had to put my other project on hold.

ARcostume isn’t unique in placing AR widgets over your body. But it moves the starting point of Augmented Reality from an app, to something physical you wear. It’s something you can talk about immediately and show people with just one instruction: “Scan the QR code”. The code resolves to a link which takes them directly into the app.

ARcostume came together very fast thanks to many disparate projects I had at the ready. I’ve done a lot of work with WebVR lately. Mostly for fun but some client projects. This led me to find work by Jerome Etienne in WebAR. It’s still very experimental but works really well in certain use cases. I already had an infrastructure for hosting user generated images. All I needed was the app.

Going the PWA route had two key benefits for ARcostume:

  • No app hunting in the store. Just follow the link and you’re experiencing the product.
  • No app review process to worry about. That makes deployment fast.

Progressive Web Apps can’t replace all native apps, but they can certainly replace a lot of them. For ARcostume, low barrier to entry for the user provides a better experience than a native app would have. You can try out the ARcostume app right on ARcostume.com, just scroll down to the “TRY IT OUT!” section. While there, buy a shirt and wear your own ARcostume.

This article was originally published at GreenZeta.com

--

--

Matthew Wilber

A professional web developer for over 15 years. For more information, visit greenzeta.com and get the latest updates @greenzeta on twitter.