explore

THE SOUNDSCAPE

Take a spin around the project! It's completely interactive with audio intact.

what

THE CHALLENGE

As a second-year student at IIT Guwahati, we had our first-semester thesis project for four months. I worked under Dr Abhishek Shrivastava to represent the various dialects, demographics, and recordings of the Assamese language in a suitable medium.

The project was based on an ongoing research project at the time, under Dr Priyankoo Sarmah, which studied the effects of socio-linguistic factors on vowel pattern variation across different dialects of Assamese.

For

Semester Thesis Project 1 (DD216)

Duration

Jan 2020 to May 2020

Mentor:

Dr Abhishek Shrivastava

To create a soundscape interface derived from the data from a research project for anyone to access and interpret.

skip to solution read the report

how

THE DESIGN PROCESS

image alt
1. Study existing designs

by scouring the internet and reading up papers.

image alt
2. Analyse the flaws

while extensively using the designs and identifying the painpoints.

image alt
3. Ideate the concepts

through brainstorming and repeated sessions with the guide.

image alt
4. Design and reiterate

through feedback and rebuilding the design to perfect it.

why

SECONDARY RESEARCH

Understanding the space

This was the first time I had heard of soundscapes, and it was an exciting topic. I spent the initial weeks trying to gather knowledge about soundscapes and how they work.

I also spent time on the basics of data visualisation, because at the core, a soundscape is an auditory depiction of data.

image alt
Definition of soundscapes

A term first coined by the Canadian composer R. Murray Schafer, a soundscape is a sonic landscape. It is the total acoustic values related to a specific place.

image alt
Information through sounds

Soundscapes can be understood only through peoples’ perceptions. Information can easily be interpreted when we create an abstraction with the sounds from the soundscape.

image alt
Data visualisation

Information that has been abstracted in some schematic form, including attributes or variables for the units of information.

image alt
Why visualisation is important

Data is inherently difficult for the human brain to understand and retain. Most adults can store between 5 and 9 items in their short-term memory.

Finding existing designs

After the preliminary research, I was to find and analyse the existing designs out there.
I came across 2 of them, which seemed interesting.

Hover over the images to see the key points.

Soundsslike Project

They used small dots as identifiers for sounds. On click, it plays the audio along with details about the place.

Soundscape World

They had a different approach. It consists of a player with multiple buttons and a lot more control of the audio. These were categorised into the nature of the sound. This design was completely different from Soundsslike.

create

SETTING THE PREMISE

The research report

The original report from the research is now published and available over at ResearchGate.

I spent around a couple of weeks going through this report multiple times, understanding phonetics and how linguistics works. There were a few things that could be easily represented for the end-user.

Audio Recordings
Dialect Map
Level of Pride Data
Graduated Distribution Terms
The concept

I decided to divide the design into three sections. These had different colours, indicating the data is different from one another. I started with some concept sketches.

image alt
Listen Tab

The user can listen to speech recordings from various districts of Assam. These, when clicked, show a pop-up with multiple play buttons placed accurately.


Dialects Tab

Shows the different dialects across the state. One can hover over a region to see what variety they speak, their popularity and how proud they are of their language.

image alt

image alt
Words Tab

Shows the distribution of lexical terms. Twelve terms were selected, which had multiple synonyms to study the usage of these words in different regions. We put these terms in a grid, and we showed the distribution using a gradient. The darker the shade, the more frequent the word was used in that region.


Design Language

As I converged on to my final design, I needed to set a design language to be followed throughout the entire page.

Logo
Font
Colour Pallete
UI Elements

Cod Gray is the primary background colour to be easy on the eye.
Torch Red was used as the primary colour for Listen tab to invoke stimulation since the page’s function is auditory.
Jade Green was used to showcase the words to represent information.
Azure Blue was encompassed in dialects to show the abundance of varieties.

create

FINAL DESIGNS

The platform was developed using HTML5, with Bootstrap 4 as the front-end framework for CSS. JavaScript, accompanied by the jQuery library, was used to handle the back-end of the website. It is currently hosted on GitHub pages.

final

REFLECTIONS

This project was a game-changer for me. I had always wanted to start with WebD, and this project was enough motivation to get started with. I have come a long way since then, creating my website entirely from scratch.

Coming to the project, there were a few shortcomings that I could have done better.

• Call to Action functions for the user is limited, and thus, interactions with the user are minimal.
• Currently, there are no ways to upload audio by the user. This means our project data cannot be crowd-sourced.
• The recordings are short and repetitive and hence doesn’t capture the user’s attention for long.

If given the time and energy, a function to record the user’s speech can be implemented. This would enhance user intractability and would also serve to crowd-sourced data. Moreover, this speech can be used to compare with other audio to determine their variety.