Information

圆 (yuán)- Sound Visualization System

Description

圆 (yuán) is a concept audio visualization system supported by guidelines to create a customizable and recognisable on-screen element.

Case

Collaborators

Skills

Accessibility

Programming

Project

圆 (yuán) used in Dark Souls Remastered (FromSoftware, 2018)

Scoping

Despite the industry getting more and more accessible year for year, I've identified a distinct lack of options for the hearing impared.I wanted to work in a way that could create a meaningful addition to the landscape. My concept would therefore aim to be applicable to any genre of game.

Guidelines

Based on theory of semiotics, amongst others, I developed guidelines for how an on-screen element could communicate to a player. This meant taking into consideration the different parameters of the visual and their respective resolutions for data and readability.

Some parameters should stay consistant throughout all implementations of the visualization, such as the placement of an arch along the circle representing the direction of the sound, and the height of the arch representing the volume.

Other parameters are up to the individual game designers to utilize. Color of the arches can be used in two ways. One is to use the color to represent a certain "element". In a shooter this might be grey for footsteps and red for gun shots. The second way to use color is to associate it with a "concept", this might be red for dangerous sounds, and blue for safe, friendly sounds.

No items found.

(Hover over the visual to discover the correlations between each datapoint)

Implementation

The visual is created of many distinct points connected by a procedually drawn mesh to create an unbroken ring. Each point determines its own height and color by considering the distance, volume and other aspects of currenly playing audio sources. Each point is handled in parallel on the GPU to ensure performance.The visual is rendered as a UI element so it is always visible and clear.

(Hover over the visual to see examples of how the model is used in different cases)