What’s the proper role of audio in web design? It seems that, for as
long as we’ve been building websites, designers have looked for a way
to use sound effectively. Sometimes we’ve hit the mark (audio
interactions within games) while other attempts are a bit more
forgettable (auto-play background music).
As the web has matured, we have continued to find better uses for
sound. And, as long as we make users aware of our intentions ahead of
time, it can be a welcome edition to the overall experience.
Today, we’re going to explore some ways audio can enhance modern web
applications. We’ll also provide you with some incredible examples
from the new sound library at Envato Elements.
Your Elements subscription provides you with access to 8,300+ audio tracks and
76,000+ sound effects. You’ll have an amazing variety of sounds
available for all of your projects.
1. Reward Users
Many popular websites have embraced gamification as a way to keep
users coming back. Completing various tasks such as reaching a
participation threshold are rewarded with points, badges or even product
discounts. This is where the right sound effect can add to that sense
of accomplishment. Look for something short and sweet to bring a smile
to your loyal users.
The Game Reward
sound effect clocks in at just two seconds. That, coupled with its
magical tone will have users coming back time and again. They’ll
quickly associate this sound with something good.
2. Improve Accessibility
When we talk about making content accessible, sound is not always at
the top of our list. But it does have a potential role to play. For
example, websites that enable audio readings of printed text can be of
help to users who are visually impaired. Text-based CAPTCHA fields, for
instance, have offered audio alternatives for years.
A sound collection such as Male Voice Colors Pack
could be of use in an eCommerce site. It’s dead-simple, with a male
voice reading out various color names. But it could make the selection
of a product variation that much easier for some. And, it gets us
thinking of other ways we can make the web more accessible to all.
3. Strike a Positive Note
Music provides a great vehicle for creating an emotional connection
with others. And it’s not just for streaming services or the radio.
Website product demonstrations, for example, can also benefit from a
well-selected tune. A song with the right vibe can bring about positive
emotion in users, potentially leading to a more positive sales outcome.
Uplifting Upbeat Inspiring & Motivational is an excellent choice for adding personality to a product demo or
company video. The song has a light, airy feeling that is perfect for
background music. Coming in at 2:48, it hits the sweet spot for this
type of presentation.
4. Paint a Picture for Your Readers
Storytelling on the web has become its own art form. Whether it’s a
fictional short story or a true journalistic account, you can take the
opportunity to create an immersive experience. The use of audio can add
to the scene, helping to transport the user to another time and place.
For a story set by the ocean, Sea Waves Crashing Into Pier
brings you almost close enough to smell the salty air. The atmospheric
sounds of water make for a gentle complement to a riveting tale.
5. Reinforce UI Interactions
Visual cues, such as microinteractions, are often used as a means to
guide users through an interface. Adding hover effects to a button,
for instance, conveys that the element is clickable. Sound is a great
way to take things a step further. A reassuring sound when someone
clicks that same button confirms that the intended action was a
success. It’s another little thing we can do to increase user
confidence.
Sounds like Rich Click Pop
are perfect for UI elements. They’re quick (this one measures just one
second) and unobtrusive. Yet they still add something positive to the
overall experience.
Music to Our Ears!
Sound can help us do some amazing things on the web. We can leverage
it to create both a connection with users and a better UI. In some
circumstances, sound can even heighten the accessibility of our
projects.
So, the next time you’re building a web application and want to give
it that something extra, consider the role sound can play. There are
any number of creative ways that it can be responsibly implemented while
enhancing the interface.
{excerpt}
Read More