UX / UI Design

User Experience & User Interface Design

Music Player project title

Design Brief

Millions of people around the globe live in partial or complete silence due to hearing loss. With the multitude of events and activities that goes on around them, most of it are inaccessible to them due to lack of resources and awareness. They are often excluded from enjoying music, concerts and entertainment involving sound.

The goal of this design is to empower individuals with hearing impairment and advocate social inclusion.

For this music app player, the concept was to translate sound into other senses. Visualized rythm of sound waves for their sense of sight, and rhythmic vibrations for their sense of touch.

Project Details

UI/UX Designer: Michelle Del Rosario Gordon

Project Type: Music App Player For The Hearing Impaired

Platform: Mobile

Tools: Sketch, Invision, Photoshop

The music player app concept and design

Individuals with hearing impairment have various ways to experience and enjoy music with Smart Wave.

  • Choose a visual display of waveform - fast or soft beat or combine with vibrate and audio.
  • Using wave controls in the music player, redesign the look of your soundwave by adjusting the colors, size and amplitude of the waves.
  • Dancing to the beat of visual display and vibrations is one big step to enjoying music like everyone else.
Music player splash screen
Music player select screen
Music player playscreen

Secondary Research - The Science behind Smart Waves music player

(1)- The Physics of Waveforms

Waveforms Created by Loudness or Volume

  • Louder sounds produces sound waves with more intensity or larger variations in air pressure.
  • Lower volume produces sound waves with smaller fluctuations in air pressure.
Figure 1.1
loudness waves

Waveforms Created by Pitch

  • Pitch is determined by a sound's frequency, or rate of repetition. Frequency is measured in hertz or Hz (cycles per second).
  • Higher frequency produces higher pitch and therefore requires more digital information to reproduce the waveform.
  • Figure 1.2 Rapid vibration of air molecules create a high-pitch sound (treble). A slower rate of vibration creates a low-pitched sound (bass).
Figure 1.2
pitch waves

Waveforms Created by the Timbre

  • Timbre is what makes a particular musical sound have a different sound from another, even when they have the same pitch and loudness. Example a violin and a trumpet playing the same note at the same amplitude level.
  • A sound's unique timber is a result of it's particular transient qualities.
  • Transients are the attack or the begining of a sound. Decay is the ending characteristcs of a sound. Figure 1.3
Figure 1.3
Transient waves

(2)- Haptic Technology

Haptic chair
Figure 1.4 (a)Sketch (b) Actual Chair

Haptic Chair

  • Nanayakkara S.C. designed a Haptic Chair Figure 1.4 which provided sensory input of vibrations via touch by amplifying vibrations produced by music.
  • A visual display was synchronized with the vibrations.
  • Participants of this sensory test had partial or full hearing impairments.
music visualization
Figure 1.5
  • A screen capture of the visual display initially consisted of abstract animations corresponding to specific features of music such as beat, note onset, tonal context and a lot more.Figure 1.5
  • The blob or bursts appear at note onsets. The colour, size and brightness changes according to the instrument type, pitch and loudness respectively.
  • The visual effect of a given note fades away as the audible sound of that note fades.
music visualization
Figure 1.6
  • Test results Figure 1.6. Mean FSS score of partially deaf
    and profoundly deaf
    subjects for four different conditions with error bars showing 95% confident interval. (A-music alone, B-music & visual diplay, C- music & Haptic Chair, D-Music, visual display & Haptic Chair)
  • Almost all participants with hearing impairment prefer to experience music, visual display and amplified vibrations simultaneously.
References:

(1)Oreilly, "Chapter 2, The Science of Sound and Digital Audio".

(2)Suranga Chandima Nanayakkara, "Enhancing Musical Experience For The Hearing-Impaired Using Visual and Haptic Displays", pp.17-22, 26 &891;PDF&893;

What's next for Smart Waves

The concept is currently going through extensive research. Collaboration with developers is ongoing to find out the feasibility of the conceptualized functions. A prototype is in the works and will be collaborting with individudals with hearing impairment.