Skip to content Skip to sidebar Skip to footer

How to Integrate Augmented Reality into Your WP WooCommerce Site

Why would one need Augmented Reality WordPress solution at all?

Let me tell you a few words about how we came up with the idea of Augmented Reality WordPress Theme.

I think it was January or February 2018, one of our programmers Demian shared his story during a coffee break. He told that his wife found a very nice couch in a local furniture store. So they bought it. Although, when the couch was delivered it did not fit the place by the window (it was too wide) and did not match the interior colors. So Demian had to hire a truck, went back to the store and returned it.

He was so desperate cause he really liked the couch but had to waste his time, efforts and money on both way shipping. And I must say that the store also wasted their time on assisting Demian and then restocking the item. Thus everybody is unhappy (except delivery guys I guess).

IKEA Augmented Reality App

And then someone remembered that IKEA (huge furniture store) developed an Augmented Reality application that helps their clients pick their goods using gadgets (smartphones & tablets). A client can pick the model, the color and check whether it fits interior.

IKEA AR APP PLACE

And we were like “Wow! This eliminates all that troubles Demian had.” The other thing we thought is why wouldn’t other furniture stores do that for their clients? And the answer is very simple: money, time & resources.

Apparently own application designing, coding, testing will cost approximately from $66,000 to $114,000 and will take around 3-5 months. Furthermore, you will need to get a good hosting provider, constantly support the app, update it for Android and IOs which brings us to additional expenses. Long story short – small business cannot afford AR right now!

How we integrated Augmented Reality into WordPress

The same day on one of our meetings we decided that we must find a solution for small and medium businesses and produce affordable Augmented Reality WordPress Theme (as we are known as niche WP leaders and have to be the 1st everywhere). We called the project – Ozisti.

There is no WordPress plugins or WordPress solutions for AR integration at the time of writing this post. In fact, there is 1 so called augmented reality plugin on wordpress.org called Augmented Reality, but it does not work at all. Our marketing team did a lot of research and contacted literally every AR/MR/VR company in the world in order to produce 1 universal affordable solution.

And finally, after 4 months of negotiations, we were able to make an agreement with Augment.com. This company is one of the leaders in AR e-commerce and their active customers are Coca-Cola, Moulinex, Microsoft etc. Moreover, we got 7% promo code – THEMEREX for every Ozisti buyer. So if you move to 1 of their paid plans make sure to mention this promo code to save some money.

augmented reality app

Briefly about Ozisti WordPress Theme

The Ozisti Augmented Reality WordPress Theme was made primarily for eCommerce purposes. Therefore it has a full Woocommerce integration. However, it still works for other purposes like education, blogging, the portfolio where the AR may be necessary. At the same time, we left an option to disable AR and use it as any other wp or woo theme. So you can either use AR in your future project or not. It is prepared for both options. Above all the theme is made on the most progressive free page builder Elementor. It gives a live page edit options and no coding content building.

Besides all the regular WP and Woo features Ozisti has options to download free Augment application for Android and for IOS. Also, it has modules to upload & display QR codes from the Augment app. We will talk about them a bit later. The system is pretty simple: you upload your 3d object to Augment App -> Get QR code -> Upload QR code to your Ozisti based project -> Your customers scan the item on your website with Augment App and enjoy it in 3D.

In fact, the process is very quick, understandable and convenient. You will find it in the video below. It can be done in less than 7 mins.

WordPress Engine Installation

We decided to write a full exhaustive guide. Therefore will start from the very beginning (considering that you already have a domain and a hosting). If you are familiar with WP installation – just skip this paragraph.

There are several ways to install WP engine on your server:

  • If your hosting provider has easy wp installation – feel free to use it to save your time.

quick-install-1

  • Manual 5-minute WP installation. Basically, you will need to download the wp engine archive, unzip it on your hosting, connect it with your database and then run the WordPress installation script. You can find a detailed step-by-step guide here.

Ozisti Augmented Reality WordPress Theme installation

Once your WordPress is ready – proceed with the Ozisti augmented reality website template installation. Although the installation process was made very intuitive for customers, we prepared a detailed documentation. The process starts with uploading the theme. Then you install and activate it. After activation, the system offers to install the required plugin “ThemeREX Add-ons” which helps to manage most of the settings.

When the ThemeREX Add-ons plugin is activated you will be headed to the screen with theme activation & required plugins installation. The Ozisti installer automates the process and the plugins will be activated as well.

plugins

The next step is the demo data import. If you have a brand new WP installation and don’t have a content yet – pick the Whole Demo-Site option. Though if you already have some content and want to save it – choose the 1st option: Only Selected Pages.

Once the import is completed it is a good time to make your WordPress/Woocommerce store Augmented Reality compatible.

Augment AR account registration

This is the easy step. All you have to do is to go to augment.com and click start a 14-days free trial.

augment-signup.

Next – you just register your free account and provide your company details (you can even provide your logo that your customers will see while playing with your product in AR). After that, you can start uploading your 3D objects. Right now Augment works with the following 3d extension: dae, obj, stl, zae, kmz or zip with the 3d files.

add_model_button

Also, you can specify the name of the object, short description, placement. Furthermore, you can set the other parameters like type, category, dimensions etc. Once the model is confirmed save the QR-code:

qr-code

3D Objects & 3D models for Augment Reality
What do you do if you have only regular images of your products but don’t have their 3D models?

The answer is obvious and simple – you should get them.

– If you resell products all you have to do is to contact your vendor and ask for them.

– if you sell your own items – order 3d models from one of the hundreds of web studios online or on Upwork. Also, you can order them from ThemeREX team. All you need to do is to contact our support team.

The price and time may vary but since you delegate it to professionals it won’t take more than 2-4 days per model. Again, make sure the studio makes models in the format of either dae or obj.

Getting QR Codes & Uploading to Augmented Reality WordPress Store

When we uploaded our 3d objects to Augment manager and downloaded QR codes to our local computer we can upload them into our Augmented Reality WordPress shop. Go to the proper product (Products->Your Product) and find AR Params section.

product_upload_qr

Click Choose Image and upload the QR code. After that – enable AR Layout popup and AR badge for your product. Now your product is available for AR interactions.

On the product page, you will see the AR badge enabled and 2 buttons. The 1st one helps your customers to download free augment application and the 2nd one helps to get your product to Augmented Reality.

product_download_app_button

So your customer just downloads the free app, launches it on his smartphone or tablet and scans the item QR code. Here you go! You’ve just provided the service level that only Multimillion-Dollar Companies could afford.

Test Your AR Store with Your Gadgets

Once all the above steps are done – make sure to test your Augmented Reality store. Ensure that all the information about 3d objects is correct. For example, if you sell furniture the dimensions should be correct. Because when your customers test your furniture in AR they have to be sure the furniture fits their interior. Another example, if you sell table lamps, monitors or TVs make sure you pick the placement type “Table” (not “Floor”).

Also, the extremely important thing is testing items on your mobile devices (smartphones & tablets). Ensure that 3d models look good and your company logo is present.

screenshot-ar-with-arrow

After 14 days trial if you are happy with Augment application you can upgrade your account to a paid plan. Don’t forget to mention our 7% coupon code: ThemeREX to save on your purchase.

Another Interesting Example of Augmented Reality WordPress Integrations

Ozisti usage is not limited only to the AR Woocommerce store. It can be easily used for science or educational purposes, like history, physics, astronomy, anatomy, geography. Here is the example of history related blog.

Can you imagine this outstanding historical blog where you can check the historical monuments, battles, castles in 3d?

Also, it can be used for a travel blogging or travel agencies to show the objects you visited in 3D.

travel-blog

I am sure that it is much more interesting to see the sights in 3D than on regular images.

Another option is architecture, real estate, flat renting, apartment complex sale.

appartment-complex

Do you imagine the wow effect for the customers that can check the apartment in 3d, rotate it, zoom in and zoom out, move the objects etc?

Basically, Ozisti is quite versatile and multi-purpose. Hence it can be used in all branches where the visual presentation is necessary for customers.

Conclusions and Feedback about Augmented Reality in WordPress

We are very proud that we are the 1st in the world who were able to make Augmented Reality WordPress Theme. And not just we made AR affordable for medium and small business, but we also gave it an outstanding look and flexibility. Above all, the solution we made is easy to use and understandable. So any person (even without technical, coding, designing skills) can manage using it.

We prepared 4 premade homepages for Augmented Reality WordPress website: Furniture Store, Interior items Shop, Electronics Store & Exterior Products. There will be much more with the future updates.

Though, as we could see from examples Ozisti can also be a beautiful solution for blogging, news & magazines, educational portals, professional websites (construction companies, designers, engineers).

There are plenty of modules that can be used to build literally any website.

elementor_addons_elements

Go ahead and get the 1st ever Augmented Reality WordPress Theme now.

For the Updates

Exploring ideas at the intersection of design, code, and technology. Subscribe to our newsletter and always be aware of all the latest updates.

2 Comments

  • Jason
    Posted Aug 7, 2018 10:01 am 0Likes

    Amazing article! thank you Taylor. Very convincing! I’m gona go ahead and buy the theme now!

Leave a comment

Subscribe to our newsletter and always be aware of all the latest updates. Check Privacy Policy ?

ThemeREX © 2020. All rights reserved.

ThemeREX © 2020. All rights reserved.

Download a Free Theme