Augmented Reality (AR) with ZapWorks – Getting My Feet Wet

*Not a sponsored nor an affiliate marketing article but rather, this is just an account of my experience using the tools for Augmented Reality content creation as the hottest trend now in Digital Marketing

Augmented Reality for marketing campaigns is definitely hot right now. I finally decided to get my feet wet because I wanted to share it with you guys. So here’s what happened.


ZapWorks is a powerful AR content creation tools provided by Zappar for its app users.  I used ZapWorks to build two AR projects for a business card: one using ZapWorks Widgets and another using ZapWorks Designer (for multiple scenes, although I just did two scenes).

To do this, I had to forcibly design a business card. Which I didn’t coz I’m lazy. haha Therefore, I just used my current branding asset for this and it’s the one I use as feature image for all my pages on this site. What matters is I get to test the AR waters before my eyelids collapse. It’s dawn already!

What You Need

Before anything else, for you to view my projects (since it’s impossible to hand you the printed cards unless you want to print them) either you use a desktop/laptop to read this post AND your phone to scan the AR code. Alternatively you can use two phones OR a tablet/ipad and a phone, you get the idea.

Of course you need to install the Zappar app on your “AR-viewing” gadget. It’s available for both Android and IOS. Once installed, open the app and initially it will scan right ahead so point it where the zapcode icon is on the business cards below.

Zapworks Widgets

Credit > Music: Energy –

I used Zapworks widgets for this one.  Using widgets, you don’t really need to have the marketing material designed beforehand. On the widget editor you pick the available widgets to customize and it basically provides you the zapcode to display the Augmented Reality. This zapcode… is well… like a barcode. After you’ve published your AR project, download your zapcode and you can place it wherever you want on your business card design.

As you have seen,  the widgets are shown on the AR view as a halo of circle icons that rotate. It’s got this bokeh/lens flare effect beneath and a nice music going on in the background as well. So yeah, pretty cool.

Widget’s widgets

Zapworks Designer

Credits > SM icons: Daniel Oppel  | Music: Clear Day –

The Zapworks Designer is way more cooler! It gives you more real estate because you can create multiple scenes. You can add background images, texts, buttons, plus the Widgets. Transition effects can be applied to most of the elements too. I’m not sure I did some of the transitions correctly though but that’s alright.

Tracking Image

The business card ended up somewhat more spruced up because the Zapworks Designer requires a tracking image, analyzes it first and tells you if it ain’t good enough before you get to the editor.

Apparently the Designer wanted more contrast in the tracking image. It rejected the same image I used for Zapworks Widgets several times so I had to do more adjustments. I’m thinking like it needs something to grab on to like bumpmaps. That means I had to bring in some design elements but there’s not much time for that.

What I did was I copied the hot air balloons which is really part of the zapcode and replaced the zapcode logo itself with social media icons.

The Zapworks designer is different because your zapcode design actually snaps to the image so when you tilt your phone or rotate the actual printed business card, the zapcode follows. So when you view the card at some angle the design shows at its correct perspective view.


I created two scenes and I’m posting a preview of those scenes here for the benefit of those who can’t zap at the moment. Again I recycled some assets for the background of the scenes just to be able to do them real quick. After all this is a practice project for me and a quick glimpse for y’all.

The Verdict

It’s GREAT! After a couple more projects using both Widgets and Designer and I’d be able to experiment on other applications of AR which I will list some of at the bottom of this article.

The Widgets and Designer is great for simple projects and a great starting point for DIYers.  The Widgets would be the obvious choice of those who aren’t designers yet would like to DIY their Augmented Reality project.  The Designer tool is for those who has the knack for customizing the experience further by providing more scenes with backgrounds designed for the concept.

Next-Level ZapWorks Tool: Studio

What’s exciting with ZapWorks is that there is a next level: Zapworks Studio! It offers a complete toolkit for building dynamic and immersive 3D augmented or virtual reality experiences. Fully scriptable using their JavaScript-based scripting language and support for 3D animated and rigged models. It’s got Powerful animation tools including timelines and Gyroscope-oriented immersive environments as well.

Augmented Reality (AR) uses in real life

Here’s some list of Augmented Reality uses that I thought of and some I’ve seen from ZapWork’s Showcase:

  • Business Cards
  • Brochures
  • Corporate Stationeries
  • Product packaging
  • Product labels
  • on the product itself (apparel, book cover & etc)
  • Print ads (Magazine, Newspaper)
  • Outdoor Advertising mediums (billboards, sign boards, & etc)
  • and More…

Designers will love AR because it’s a premium add-on service  and it is applicable to most of the services we already offer. It does boost your branding image and is a great idea to augment the purposes of offline marketing materials.

Leave a Reply

Your email address will not be published. Required fields are marked *