Echo of Frost

Interactive design for the Multi-Arts Pavilion cube

Roles

I assumed the following roles designing this app along with three other classmates:

• User Experience (UX) Designer

• Interaction (IxD) Designer

• User Interface (UI) Designer

• Visual Designer

Interaction Design:

· High-fidelity interactive prototypes for key tasks on iOS and screen projection.

UX/UI Design:

· Competitive analysis

· User surveys and one-on-one interviews

· Personas

· User journeys and task flows

· Low-fidelity wireframes

· High-fidelity mockups and prototypes

· Usability tests and findings

Project Specifications

Duration: 10 weeks

Tools:

· Figma

· Resolume

· Miro

· Photoshop

· Illustrator

Background

The "Echo of Frost" project aims to create an interactive design for the Multi-Arts Pavilion cube, known as MAP MIMA, located in Speers Point, City Lake Macquarie. This immersive digital art installation takes users on a whimsical journey through a snowy landscape.

Goal

The project's objective is to virtually transport users from Lake Macquarie to the enchanting winter beauty of Barrington Tops, a beloved national park frequently visited by locals during the winter season.The interactive experience encompasses a 360-degree view of four distinct snow scenes from Barrington Tops, each featuring a snowman. The ambiance is further enhanced by falling snow and soothing background music, providing users with a truly immersive experience.

Background Research

Lake Macquarie Culture Study

Coal History
The discovery of coal in the Lake Macquarie region led to the establishment of the region's coal mining industry, which played a pivotal role in attracting settlement, and investment. The coal industry's close ties to the region have also shaped the area's character, with a strong sense of community and pride in the region's industrial heritage.

Fishing
Fishing has been an essential part of Lake Macquarie's culture and economy for thousands of years, with evidence of local Aboriginal communities fishing in the area. However, the introduction of marine engines and power winches contributed to lake overfishing, resulting in a commercial fishing ban in 1980. Despite this, fishing remains a popular recreational activity in Lake.

Sailing
When we did the site observation in Speers Point, we noticed that there was a Yacht Club nearby, and there were many sailing boats in the lake. The Lake Macquarie Yacht Club has a very long history which was founded in 1929. And sailing has obviously become a popular activity among Lake Macquarie residents.

Bird and Protection
Swift Parrots are endangered parrots that are about 25 cm long (Office of Environment & Heritage) and are regionally significant birds in Lake Macquarie, where continuous habitat loss and degradation, as well as climate change, pose a major threat to their survival.

Lake Macquarie Location Study

Barrington Tops

Barrington Top, located in the Hunter Valley in New South Wales, is the second-highest region on the Australian mainland, which experiences regular snowfall in the winter. Hiking, having picnics, ice fishing, camping, and playing with snow during the winter are the most popular activities people do in Barrington Top.

Barrington Top is known as one of the closest areas to Newcastle and Sydney for snow play (Barrington Hideaway, n.d.) and attracts many Lake Macquarie residents to visit during winter. Therefore, we have decided to make Barrington Top the destination for our users to experience the wintery wonderland.

Barrington Top is part of the world heritage site Gondwana Rainforests and has a lot of interesting spots for visitors to explore.

Careys Peak lookout

This is the highest lookout (1544m) in Barrington Tops. On the lookout, visitors will be surrounded by World Heritage-listed wildness and feel on top of the world by appreciating the rugged splendid, and dramatic mountains of Barrington Top.

Polblue Swamp
Polblue swamp is located in mountain Polblue, the second highest point in the area. Near the swamp, visitors can see dense grassland spreads across and might even spot swamp birds and swamp wallabies.

Barrington River
The Barrington River is famous for its stunning scenery and paddling. It begins at Edwards Swamp and runs for 93 kilometers, descending 1,370 meters before joining the Gloucester River (visitnsw, n.d.). Fishing, especially trout fishing, is a popular activity in Barrington River.

Snow Chasers
Snow Chasers is one of the popular camping sites in Barrington Tops. In winter, it would present as a magical wonderland with snow (Skardon, 2016). Many nearby residents would drive here to enjoy this snow-covered landscape.

Define

Design Concept

Our design will teleport viewers from Lake Macquarie to a magical winter wonderland in Barrington Top. Now, residents of Lake Macquarie can enjoy the breathtaking snow scenes of Barrington Top in all seasons without actually travelling there. Our innovative design also allows users to customise their snowmen on the projected screen using a variety of local objects. Each item represents an essential part of Lake Macquarie's unique history and culture, from miner hats to fish spears and sailing boat buttons. After decorating their snowmen, visitors can save their creations and bring them home as a cherished keepsakes.

In addition to providing a fun experience of playing with snow, our design can also evoke memories in Lake Macquarie's residents of the joyful family outings in Barrington Top. In this way, our design provides a delightful and engaging experience that brings people together and celebrates the rich history and culture of Lake Macquarie.

Design Inspiration

Visual Style

The visual style of the projected art creation is refered from the precedent studies of other projected artworks visual styles, including the styles of mosaic, mono-lines, spot painting, collages and monochrome. Considering to deliver an immersive magic winterland atmosphere to users and optimize the visual comfort in the projection cube, we decided to use the monochromatic drawing style as the primary design style.

Monochromatic colour
Monochromatic colour palette emphasises the structure and geometry of a scene or item, allowing viewers to concentrate on lines, shapes, and values without being distracted by colour. Various hues within a same colour theme can elicit emotion and ambience. Additionally, monochromatic paintings increase depth and solidity through light-dark contrast, giving spectators a more immersive, three-dimensional sense.

Visual Design

Projected Drawings

In our drawings, the applied colour theme is muted blue which is positive to present the snowy landscape without causing glare produced by the strong chromatic aberration from the dark space and projected bright light. The drawings projected in the cube are created to respond to the following four popular spots in Barrington Tops. Therefore, users in MAP mima are able to experience the snow-covered landscape appearing in Barrington Tops without the constraints of locations and time.

Interface Drawings

After being transported to the Barrington Tops, users could decorate the snowman on the screen with different hats, scarves, arms, and buttons, which all symbolize an important part of Lake Macquarie.

Design Prototype

Passive Mode:

All four screens in the cube are connected to show the 360-view of Mount Sugarloaf and Lake Macquarie, showcasing its natural beauty. And there will be QR codes displayed on the screens for users to scan.

One-user interaction:

Step1: Teleportation
When a user enters the cube and scans the QR code, it will trigger a teleportation effect, bringing people from Lake Macquarie to the magic tent in Barrington Top. And the four screens in the cube will be showing four different scenes in Barrington Top with a snowman on each screen.

Step2: Decorating the snowman
After scanning the QR code, the user will be directed to the web page they could choose from localized objects to decorate the snowman on the cube screens.

Step3: End of the interaction
When the user finishes decorating the snowman and tap the “finish” button on its mobile phone, it will trigger flying snowflakes and sound effects. The snowman user has created will also be shown on the user’s smartphone so the user could take screenshots to keep this piece of memory.

User Testing

Think-Aloud Testing

During our design testing, users experienced tasks from QR code scanning to snowman decoration with screenshots, using pre-recorded videos for a virtual feel, and we evaluated their experience in both passive and interactive modes.

System Usability Scale (SUS)

We used SUS to find out the usability score of the user interface.

Follow-up Interview

The study involved asking users for qualitative feedback on their experience with various teleportation and finishing effects in a virtual environment, focusing on their preferences and effectiveness.

Demographics

The number of participants: 8

Age: 23 to 53 years old

Occupations: university students + other industrials employees

Participants from : Sydney

Test Result

Overall we have provided a smooth and intuitive experience to users. All participants successfully finished the think-aloud tasks without encountering any problems. The SUS score of our interface is 70.3, which is above average (68).

Design Choices

According to user scoring and feedbacks, we choose the teleportation effect (zooming in and closing eyes effect), and finishing effect(falling snowflakes).

Design Iterations

User Interface Optimization

We replace the text of each decoration with pictures, which is more intuitive and visually appealing. We also add a finishing page to show user’s decorated snowman.

Visual effect of the magic tent

We refined the texture and changed the colours of the magic tent to make it more recognisable.

Visual effect of Lake Macquarie view

To make the Lake Macquarie view more vivid and attract user to interact, we add an animation effect of birds flying across the sky. This also matches with the background bird sound.

User Interface Refinement

We have refined the user interface to improve its visual appeal. In addition, we added a loading page for users to read during teleportation, which makes the interaction flow of the mobile device better matches with the overall experience.

Layer Development in Resolume software

In our Resolume design analysis, we anticipated over 30 layers for simultaneous user interaction. To assess performance limits, we tested our laptop, observing lag after 32 layers (12 video, 10 effect, 10 image).

To optimise performance, we tried to merge some layers. For instance, the "snow scene," "snowmen," "snowy effect," and "snow sound" were merged into one video layer. We also organized snowman decorations into columns to save layers.

Sound Design

The goal of the sound design is to help create a calm, immersive and engaging experience for users when interacting with the installation.

Interface Visual Style

The visual style of the user interface aims to establish a harmonious and wintery feeling that aligns with the thematic elements of the installation.

The gradient Delft blue colour on the home page provides a tech-oriented feeling, aligning with our design's sci-fi teleportation element. After the user has started the journey, the background colour of the interface changes from Delft blue to a lighter blue on the loading page and ultimately to snow white on the decorating page, mirroring the user's spatial transition. This gradation not only provides visual continuity but also augments the immersive experience.

Furthermore, the interface is imbued with whimsical wintery elements. The intuitive "snowball" swipe on the start page and the ice block serving as a container for decorations on the decorating page further enhance the overall icy and enchanting aesthetic. These design choices encapsulate the fun, interactive spirit of the project, ensuring an engaging and cohesive user experience.

Final Product

Story Board

The journey of our user Sarah and her 6-year old daughter

User Expeience:

1. Lake Macquarie View - Passive Mode

The immersive 360-degree view of Lake Macquarie, showcasing the stunning lake vista, Mount Sugarloaf, and cityscape, will captivate users with its beauty. Users will be guided to scan a displayed QR code to initiate interaction. Instructions to guide users to start interaction will be located on-screen and on nearby standing posters.

2. Teleportation - Single User Mode

After scanning the QR code, users will be informed that they can swipe up to start a journey. Once started, users will be teleported from Lake Macquarie to Barrington Top. The cube screen will demonstrate the teleportation effect. The user’s mobile device will also show the loading page to provide additional context of what is happening.

3. Barrington Top Snow Scene - Single / Multiple User Mode

The four screens in the cube show different snow scenes in Barrington Top, each featuring a snowman awaiting embellishment. This means our design could maximumly support four users to interact with the system simultaneously. Each user can then select from an array of objects symbolizing Lake Macquarie's rich history and culture to decorate their snowman on the scanned screen.

3. Barrington Top Snow Scene - Single / Multiple User Mode

App Wireflow

After the user scans the QR code, depending on whether the scanned screen is available, the user will be directed to a different page, the start page (when the screen is available) and the notice page (when the screen is unavailable). We have considered allowing users to go back to decorating page after the finish. However, this might confuse the system about whether the screen has become available or not. Therefore, we decided not to add the backward feature once the user has tapped finish.

Generate community pride and local urban spatial identity

Playing with snow is an intuitive and playful for everyone, especially children. Adorning snowmen with localized objects offers users a tangible connection to Lake Macquarie's history and culture. Our user interface is easy to use and friendly to users with any level of technology experience.

Design Highlights

Connect families and community through the digital placemaking

Our design also promotes intergenerational connection and community engagement. Parents and elders can share stories behind each decoration with younger generations, creating a dialogue of shared history. Furthermore, users can invite friends to decorate simultaneously, fostering a collective experience.

Playful Experience

The project creates a playful experience, transforming the universally enchanting activity of playing in the snow into a digital, accessible pastime, particularly engaging for children.

Good Usability

Our interface is intuitively designed, ensuring users of all technological skill levels can engage and enjoy the installation without hindrance.

Brand Promotion

The project also serves as a potent brand promotion tool. Users can save their snowman creations and share them on social media, spreading awareness and enticing a wider audience to explore Lake Macquarie and the MAP MIMA Pavilion.

Attract More Visitors

Playing with snow on a 360-degree immersive cube could not only captivate local residents, but this novel experience also has the potential to attract visitors from beyond Lake Macquarie who share a fascination with snow.