website design, HiFi Sound

HiFi Sound is high-end sound systems design services & store. The team is passionate about the quality of the sound experience and dedicated to crafting the system to match clients’ desire for particular sound experience and the style of their interior space. Working on the website project for this client of I set out to tell the story of HiFi Sound unique approach to the design process and sound experience quality.


HiFi Sound website design, landing page

There were two reasons for the website redesign – to create a new look and feel that would appeal to the younger (30+) audience and to direct site visitors to face to face interaction at the brick-n-mortar store.

My role

Concept: wireframe, layout
Visual elements: fonts, colors, photography
Web production: front-end editing to ensure mobile devices compatibility
Client communications: creative brief, concept presentation, feedback, approval

Design process

During creative sessions with the owner I learned that opposed to selling sound equipment, supplemental parts, and providing installation, they sell a tailored unique sound experience to last a lifetime and to fit the environment: customer’s desire for high-quality sound, effects/non-interference with other household members, interior design, ease of use, and more. I decided the best way to show who HiFi Sound is is to take visitors of the site through the thinking process of tailoring a custom sound system.

Design section of the site. What variables are taken into consideration and what kind of dialogue is happening during design stage?
Equipment section of the site. What apparent and hidden factors affect a choice of sound devices?
Installation section of the site. What does the installation process entail? How smooth does it go? Is there anything beyond the obvious?
Service section of the site. High-end sound equipment is installed to be enjoyed for years to come! What is needed and how is it done to keep the sound performance at its pick? And what happens in case of “if”?..


Each section page offer highlights and expanded details of each step or variable. They, while offering information and glimpse into resources available, intice direct connection with HiFi Sound staff.
HiFi Sound website design, internal page


At the start of the project, business didn’t have an identity. 3 different looks were used for the website, facebook, and storefront. I suggested taking the look of the storefront sign for all locations.
HiFi Sound storefront sign

Designing brand identity was not a part of the project, but choices of the fonts and colors were made to offer the direction for brand growth in the future.

Choosing fonts

For the sake of the site performance, I decided to use Google font.

The font for the storefront sign I identified as Walkway Black and found a match in Google fonts – Muli. Muli provides 14 styles, has a fast load time and, for these 3 reasons, was chosen for the body copy.

Righteous is the choice for sections’ headers, titles, subheaders, & subtitles.
It has a retro feel and combines features of Futura, Bernhard Gothic, Franklin Gothic – fonts popular in the 50s, reflecting an extensive history of HiFi Sound.

Rajdhani is used for section’s steps summary. Its vertically elongated appearance offers a contrast to a somewhat equal ratio of height-width of the titles and body font, setting summaries apart from the rest of the content on a page.

Selecting colors

The black background was carried over from the old website by client’s request. To break away from the flat appearance of black I explored the association of the sound waves with color waves. I have decided to use variations of blue-green – a visual representation of optimal sound performance in monitors of sound recording devices. Lighter or more intense blue in headers and subheaders helps to create a 3D effect on the pages by making them appear closer to the view or farther away. Glow effect of background is representative of the glow of McIntosh amplifiers – one of the most popular with HiFi Sound customers.