Inspiration

Just a few days back Hurricane Harvey hit and we had to change our apartment. And like every new apartment it's again starting a new life. With literally an empty room you have to guess what you need to buy. Where they will fit. If they will fit at all or not. How many and what furniture you can keep in the room. And then start imagining how they will look like when they are there.

We realized furnishing really should not be this hard. Specially since we all now carry an Augmented Reality device in our pocket. A smartphone (see how I didn't just say iPhone or Android?)

What it does

It maps your room, any room you give it. You define the boundaries of the room. The app lets you draw a floor plan in Augmented Reality using your phone.

Drawing Floor Plan

And then it furnishes the house for you.

Recommended Furnishing

Recommendation System

The AI (just a clever term) automatically takes into factor how big your room is and arranges what furniture can fit into it. It will recommend both what furniture can fit and where. The user has option to see the furniture in three different style of models. Including minimal, urban and modern. You also have the option to see the floor plan.

The position of the furniture or what furniture will fit is not hardcoded or fixed, It will change depending on the size of the room. See the video explaining how it behaves in two different rooms. Even for a same room if you are not happy with a room arrangement you can ask it to recommend a different pattern and it will (again in the video).

Configuration

The furniture is not haphazardly scattered throughout the room/bounded box either. You can define door and windows and it will keep it in mind while creating the arrangement so as not to block it. And it will keep enough gap in between the things to give you enough space to walk around (again see the video).

How we built it

The wonderful thing called Mozilla aframe, threejs and Google's similarly awesome WebAronARcore. For models we used sketchfab and Google Blocks (now poly?). None of the 3d furniture models are our own creation and license belongs to respective owners.

  • We used aframe to quickly prototype and show the VR scene.
  • WebARonARcore allowed us to create this as a web application and still have the tracking capabilities of ARCore. It allow allowed us to be cross compatible and run it in iOS11 with Arkit using WebARonArkit

Challenges we ran into

It's hard to build AR/VR applications without expensive hardware and machines. But as we know hard but not impossible

Scene tracking is hard and WebARonArcore is really really experimental piece of software. It kept on crashing on us. Also there is no real way to debug these applications. AND Apple really needs to come out and clarify certain things instead of all their marketing gimmicks. We spent a lot of time trying to implement some Arkit specific features and trying out in an iPad Air 2 which had iOS11 only to deploy and later understand that even though iOS11 with iPad Air 2 supports ARkit. It doesn't support real world tracking. So essentially useless for any device which doesnt have A9 processor.

Also it was hard to actually screen record the demo as it keeps getting the phone very very hot

Accomplishments that we're proud of

That it runs! We can map a room. Furnish it. The auto recommendation works as we expected and really happy that our dynamic configuration works. It is NOT TIED to one platform. We built it in open web so any device which will support WebAR api's will evnatually support it.

Supported Devices

WebAR phone

You'll need an WebAR enabled device Currently this limits your choices to:

- Google Pixel
- Samsung S8
- iPhone with iOS 11

Get started here to install WebARonARCore / WebARonARKit Browser:

How to run it

Visit the demo URL in your WebAR capable browser. It's not chrome or Firefox. In Android (on a capable phone) it will be "WebARCore"

What we learned

Open Web is awesome.

What's next for DecorateAR

MAybe integration with iKea? :D

Built With

  • aframe
  • arcore
  • arkit
  • webar
  • webvr
  • webxr
Share this project:
×

Updates