“An Immersive AR weather app that visualizes Real-time forecast of world weather through a magic window”

Weather Window

Group Project with Itay Niv, Joohyun Park, Xuhan Yang, and Davon Larson (my role: Leader, Art director, and Unity 3D developer) | Jan 2019

AR development | UX Design

Tools: Unity 3D, ARKit, Photoshop

AR Data visualizations for ABC News Weather Channel

What it does

Weather Window enables users to have an immersive experience of the weather of any city at any time. Users can obtain the information about the weather both visually through the AR built window view and the accurate data shown along the side. Besides, the slide bar underneath provides the smooth experience of exploring weather changes in a 24 hr range.

IMG_0743.JPG
IMG_0744.JPG

Inspiration

icons8-winter-100.png
icons8-rainy-weather-100.png

Most of the time, weather is either mundane or disappointing. We open our weather apps and hope for a miracle, either a warm day in January, or a cool wind in august. But days like that are few and far between. We wanted to add magic and enjoyment to the monotony of checking the weather.

We also drew inspiration from two primary places: people who live in dense urban cities and snow globes. Many people in dense cities don’t have windows, or views beyond a brick wall next door. It is hard to realize how much a bright window with dynamic weather can improve someone's mood while living in such circumstances. Also, snow globes can offer fun perspectives of familiar cities.

When the Weather Channel went viral for posting a video where a flood surrounding the reporter used Augmented Reality to give the viewer an idea of the size and depth of the flood, the world realized how powerful a tool AR could be when helping people imagine the weather.

As an additional benefit, we built a way to transport the user away from inclement weather, to see and experience better days in other parts of the world. On days that are cold and miserable in New York, you can transport yourself in Augmented Reality to sunny San Diego.

IMG_6088.JPG

How we built

The app was mainly built with Unity 3D. We created a three-layered scene, with a photoshopped view of the city, an obj model of an iconic building of each city, such as the Empire State Building, and a skybox. We added a particle system to simulate snow and rain. And then we placed all of these components into a portal, so that the scene was only visible while looking through a window. Finally, we made an API call from the "Open Weather Map" and connected the components to visualize real-time data over 24 hours in three different cities.

In ARKit, we also used the plane detection function to ensure that the window was always at eye level.

Challenges

It was challenging to partially display a scene through the frame. We approached this problem by making a transparent box to cover five sides and show the front side.

Accomplishments

Finally, we were successful in building the multi-layered AR frame that shows elements within elements. We are also proud that we could eventually create a dynamic particle system in the AR scene that responds to real-time data.

 
IMG_6155.PNG

What’s Next?

The app built during the Hackathon is a prototype. We will definitely include more options for individual cities. We would like to add a search function for selecting and adding cities into a customized index. We will also make the scenes inside the window more dynamic and interesting. We will map real-time data onto the background skybox and 3d models of the sun and the moon to reflect the real timeline more accurately. We will also put some birds flying around for "sunny" and trees blown away for "windy" to better distinguish between different weathers.

IMG_6092.JPG
IMG_6101.JPG