URIEL BROWN
PRODUCT STRATEGY & EXPERIENCE DESIGN FOR CONSUMER AUDIO PRODUCT
CLIENT: BANG & OLUFSEN
OVERVIEW
PRODUCT REDESIGN FOR A LUXURY AUDIO BRAND TO DESIGN A NEW & INNOVATIVE PRODUCT FOR THEIR CONSUMER ELECTRONICS MARKET.
Bang & Olufsen is a high-end luxury consumer electronics company. Bang & Olufsen aims to deliver audio solutions suited to all occasions and needs. Bang & Olufsen explores and discovers how distinctive design and innovative technology can elevate any given experience.
Bang & Olufsen has an idea to create a new product that brings people together regardless of the environment. They would like to create a holistic solution that allows users to share their music and the Bang & Olufsen audio experience.
​
Bang & Olufsen’s idea is to create an audio device that can connect with multiple audio devices. This product would allow users to play music and connect to older audio devices. Bang & Olufsen would also like to update their mobile application to support this product and its partnerships.
THIS PRODUCT AIMS TO ALLOW USERS TO STREAM MUSIC WITH MULTIPLE WIRED AND WIRELESS DEVICES. WHILE BEING ABLE TO STORE MUSIC SO THE USER CAN SHARE AND PLAY MUSIC IN A VARIETY OF ENVIRONMENTS
This became relevant when Bang & Olufsen decided to create a product that could bring people together during and after a pandemic.
Problem Statement
How can we create an audio device that connects people in any environment, that will appeal to the market during and after a pandemic?
Requirements
-
Create a solution that is competitive in the market.
-
Design a product that can be used in various social spaces
-
Design a product that is functional in multiple environments
-
Design a product that encourages connection and sharing.
-
Design a product that can connect with multiple wired and wireless devices.
-
Create a product and solution that is durable and timeless
-
Create a solution with relevant technology
-
Create a product that will appeal to current and new Bang & Olufsen users
THE PURPOSE
THE PROCESS
THIS WAS A TWO PART PROJECT THAT INCORPORATED TWO METHODS OF DESIGN TO CREATE A SELF-SUSTAINING SOLUTION
This process involved user research, product research, quantitative research, product strategy, concept development, information architecture, visual design and prototyping to create the products for this solution
Wholistic Solution
This 20 week process resulted in the physical and digital product that formed the solution that would serve
Bang & Olufsen and it’s users.
DESIGN PROCESS
PHYSICAL SOLUTION - PHASE 1: EMPATHIZE
THE DESIGN THINKING METHOD WAS USED FOR THE PHYSICAL SOLUTION TO ENSURE ITS ADOPTION BY THE USER AND THE CLIENT
This process was chosen because it highlights and solves for the immediate issues of the design.
QUANTITATIVE RESEARCH
PHYSICAL SOLUTION - PHASE 1: EMPATHIZE
QUANTITATIVE RESEARCH LED TO LEARNING THAT A AUDIO DEVICE WOULD BE A VIABLE PRODUCT FOR DURING A PANDEMIC
To accurately learn about the problem, questions were written down that could lead to insights into a solution
Questions
• How does music affect socializing?
• Where do people listen to music most?
• What devices do people use to listen to music most?
• How do people prefer to listen to music?
Key Findings
Audio Streaming Is a Primary Source of Music
Within the past two years. a milestone of one trillion on-demand music streams was hit in the US. 48% of Americans use streaming services, with Spotify being the primary streaming service. Followed by Pandora, Apple Music, and Amazon Prime.
In Transit and at Home Are Primary Listening Location
Research uncovered that listening to music in transit is most popular in commute to work and to the gym. With listening to music at homecoming in a close second during activities.
Music Listening Increased during
Covid-19
The last key discovery from the research found that 94% of people listened to music for relaxation purposes during the pandemic. With more than half of those people stating they listened to more music during the pandemic.
PRODUCT RESEARCH
PHYSICAL SOLUTION - PHASE 2: DEFINE
QUANTITATIVE RESEARCH WAS FOLLOWED BY PRODUCT RESEARCH TO IDENTIFY AREAS OF OPPORTUNITY TO MAKE THE PRODUCT UNIQUE IN ITS MARKET
The product research identified the pros and cons of the competition's features. Which inspired the idea of creating a product that combines the areas of opportunity of the competition. While including features of the competition that current Bang & Olufsen products lack.
Top Competitor's Areas Of Opportunity & Features
1​
4
2
5
3
6
1​
Sonos
Port
This product provides multiple wired streaming ports for in-home audio devices. A product that Bang and Olufsen does not have.
2
Apple Airplay
This product provides a dual audio
connection, that drains the battery quickly. Which most brands including Bang and Olufsen does not account for.
3
Bose Portable Speaker
This product is portable like most but is only works if you have a phone, streaming service or music downloaded. This is a problem that Bang & Olufsen can solve for
4
Sonos
Move
This product is durable and great for indoor and outdoor use. Outdoor durability is a feature that could grow Bang & Olufsen's customer base
5
JBL
Charge 3
This product is portable, requires a phone. and only one device can be connected to this product at a time. Which is also a feature Bang & Olufsen can solve for.
6
Google Home
Max
This product is meant for in-home use and incorporates smart home and AI features. Features which Bang and Olufsen could adopt
BRAND RESEARCH
PHYSICAL SOLUTION - PHASE 2: DEFINE
THE PRODUCT RESEARCH WAS FOLLOWED BY BRAND RESEARCH TO IDENTIFY THE DESIGN LANGUAGE FOR THE PRODUCT & ACCURATELY REPRESENT THE BRAND
Brand research provided the information needed to create a product that would align with the Bang & Olufsen speaker collection
Top 3 Elements Of Design Language
Flat Base
The most commonly seen component in Bang & Olufsen’s speaker design
language is a flat base
Round Geometric Form
The second most common element of Bang & Olufsen’s speaker design language is a geometrical form that is often rounded.
Two Materials
The third common theme in Bang & Olufsen’s speaker design language is the use of two different materials to emphasis the products form
IDEATION & AFFINITIZATION
PHYSICAL SOLUTION - PHASE 3: IDEATE
WITH THE DESIGN LANGUAGE SOLIDIFIED THE IDEATION FOR THE PHYSICAL PRODUCT BEGAN WITH SKETCHING PRODUCTS WITH THE NEW DESIGN LANGUAGE.
The ideation was followed by affinitization to narrow down the best designs. Function and form was kept in mind during this ideation process.
Initial Ideation Process
The ideation process began with focusing on one component of the design language
Flat base
1
2
3
Round Geometric Form
3
1
2
Two Materials
1
2
3
Results of Second Round of Ideation & Affinitization
The second round of ideation focused on using all components of the design language by combining ideas from each section of the initial ideation. Resulting in the following designs.
1
2
3
REFINED IDEATION
PHYSICAL SOLUTION - PHASE 3: IDEATE
AFTER CHOOSING THE BEST DESIGN, THE IDEA WAS REFINED WITH A THIRD ROUND OF IDEATION WHICH CREATED THE FINAL DESIGN
The first design was chosen because the form aligned with the design language the best. It was also chosen because the form was highly suited for the product's function.
Ideation Refinment Process
Finalize Ideation To Define the Form, Function, and Idea
The third round of ideation led to designing how the product would charge, connect wired devices, store electrical components,
and connect with older audio devices
Choose Materials and Colors From Designer Research
The inspiration for the materials and colors was chosen from products
that represented the design language and incorporate likely materials
for the idea
Rendered Sketch With Form, Function, Color & Material
The digital rendering of the final product provided a quick visual of the end product to determine its visual appeal.
DIGITAL PROTOTYPE
PHYSICAL SOLUTION - PHASE 4: PROTOTYPE
WITH THE FINAL DESIGN CHOSEN, A 3D MODEL WAS CREATED TO ASSIST IN BUILDING THE PHYSICAL PROTOTYPE.
The 3D CAD model helped to understanding what materials would be needed to create the prototype. As well as the dimensions and function of the internal and external components
Digital Prototype Components
1​
2
3
4
Wireless Charging Pad
Speaker Cover
Internal Frame
Speaker Mount
5
6
7
8
Speakers
Battery Cap /Speaker Mount
Motherboard
Charging Base
USABILITY TEST
PHYSICAL SOLUTION - PHASE 5: TEST
WITH THE DIGITAL PROTOTYPE FINISHED, THE PROTOTYPE WAS MADE TO SCALE TO BRING THE PRODUCT TO LIFE AND ASSESS THE DESIGN & USABILITY.
Since it could not be physically prototyped at the time of its design. The digital prototype was put in different environments to explain the usability of its features to stakeholders. This was also done to assess its real-world application with potential users.
Features and Application
1​
2
1​
3
1​
.jpg)
4
1​
The Beoplay A3 is a wireless speaker that can store music and control other smart devices in the home. The wireless charging base of the Beoplay A3 can also be used to stream music to wired devices
3
When the wireless phone charger is pushed down it opens the compartment holding six Bluetooth auxiliary connectors that will allow other audio devices to connect to the Beoplay A3 if they are not Bluetooth compatible
2
The top of the beoplay A3 is a detachable wireless phone charger that gets a charge when the Beoplay A3 is connected to the charging base. The detachable charger has a battery life of 8 hours, while the Beoplay A3 has a better battery life of 16 hours.
4
The Bluetooth auxiliary connectors allow the Beoplay A3 to be compatible with the devices they are connected to. Providing the surround sound feature as well as the smart home, voice command, and walkie talkie feature.
USABILITY DEBRIEF
PHYSICAL SOLUTION - PHASE 5: TEST
WITH THE DIGITAL PROTOTYPE TESTED, IT PROVIDED A BASIS FOR THE BRAND TO BUILD A WORKING PHYSICAL PROTOTYPE
The digital prototyped usability test resulted in feedback from potential users and stakeholders.
Prototype Results & Feedback
The design got positive feedback because it showed the potential to work well in an in-home and outdoor setting. The usability test highlighted, the prototype's ability to align with the Bang & Olufsen speaker collection.
RESULTS
PHYSICAL SOLUTION - PHASE 5: TEST
WITH THE PROTOTYPE VALIDATED, THE PHYSICAL SOLUTION CREATED MULTIPLE WAYS FOR BANG & OLUFSEN TO CONNECT USERS WITH EACH OTHER AND OTHER AUDIO DEVICES.
The physical solution resulted in a product with features that solved for the problem statement
Problems Solved
Connecting People
The physical solution solves the problem of connecting people by creating a product that would require the user to interact with someone else if they wanted to share the walkie talkie ,surround sound, or playlist feature. However, the physical solution primarily connects people by providing music for social gatherings.
Relevant Product
The physical solution solves the problem of designing a relevant product for during and after a pandemic by designing a product that has the features needed for different users who are at home. Along with having the capacity to be portable, durable, reliable, and collaborative for when users are outside of the home.
DESIGN PROCESS
DIGITAL SOLUTION - PHASE 1: INSPIRATION
THE HUMAN-CENTERED DESIGN THINKING METHOD WAS USED FOR THE DIGITAL SOLUTION TO MAXIMIZE THE VALUE AND LONGEVITY OF THE PRODUCT PROVIDED TO THE USER
This process was chosen to ensure the solution is relevant and beneficial.
USER & AUDIENCE
DIGITAL SOLUTION - PHASE 1: INSPIRATION
THREE PERSONAS WERE CREATED TO BETTER UNDERSTAND THE USER GROUPS AND EFFECTIVELY DESIGN A SOLUTION FOR THEM
Personas were created from online user research and informal Q&As
Top 3 User Group's Personas
Bang & Olufsen Fanatics
Bang & Olufsen Fanatics are fans of the brand that would own all of their products if they could. They are Gen X and Millennials that love quality products
Demographics
​
Age: 18 - 30+
Income: 30 -50k+
Education: College Grad + Occupation: Entry - Jr Level
​
Behavior
​
Benefits Sought: Collect B&O products
Usage: 2 - 3 times a day
Intent: Products relevance Occasion: Newest B&O product
​
Psychographics:
​
Interest: High
Personality: Outgoing, Organized,
Funny
Values: Quality, Success, Progress
Audio Aficionados
Audio Aficionados are mainly Gen X users that have multiple audio devices and respect a variety of audio brands. Audio Aficionados value vintage products, quality sound and modern experiences
Demographics
​
Age: 25 - 50+
Income: 50 -100k+
Education: College Grad + Occupation: Entry - Sr Level
​
Behavior
​
Benefits Sought: Quality Sound
Usage: 2-3 times a week
Intent: Add to their audio collection
Occasion: Researched and reviewed the product
​
Psychographics:
​
Interest: High
Personality: Technical, Organized,
Calm
Values: Relationships & Quality time
Music Enthusiasts
Music Enthusiasts are a variety of generations but Millenials make up a large fraction of these users since music streaming grew during their generation. They
value quality and mobility
Demographics
​
Age: 25 - 50+
Income: 50 - 150k+
Education: College Grad +
Occupation: Jr - Sr level position
​
Behavior
​
Benefits Sought: Quality & Practical
product
Usage: 1-3 times a week:
Intent: Travel and socialize
Occasion: Friend recommended
​
Psychographics:
​
Interest: Medium
Personality: Humble, Sociable,
Creative
Values: Happiness, Health & Fun
EMPATHY EXERCISE
DIGITAL SOLUTION - PHASE 1: INSPIRATION
DESIGNING FOR THE DIGITAL SOLUTION CONTINUED WITH AN EMPATHY EXERCISE TO CREATE FEATURES THAT SOLVED FOR THE PROBLEM STATEMENT AND THE USERS
The empathy exercise consisted of listing ideas that the mobile application could have that would be valuable assets to the user. This exercise also focused on discovering what features could Bang & Olufsen provide that would connect people and be relevant during and after a pandemic.
Top 7 Ideas From Empathy Exercise
1​
2
3
4
Can connect with multiple devices
​
Can connect to older devices to create a surround sound & walkie talkie feature
​
Can stream music by connecting with
streaming services
​
Can encourage sharing music and devices with people nearby
5
6
7
Can save music to mobile device or application
​
Can connect and control smart home devices.
​
Can que up different songs from other users/friends who have the app.
INITIAL SITEMAP
DIGITAL SOLUTION - PHASE 2: IDEATION
WITH INSPIRATION FOR WHAT THE APPLICATION WOULD DO, A SITEMAP WAS CREATED TO UNDERSTAND THE LAYOUT OF THE MOBILE APPLICATION
The initial sitemap was done by hand to quickly and efficiently visualize the architecture of the application. This encouraged a logical and empathetic brainstorming process about how and what the user would want and need to engage with.
Initial Sitemap Breakdown
1​
Potential Pages
The first row of the sitemap helped ideate the major tabs and pages that would be designed.
2
Potential Page Content
and Features
The columns beneath each row helped with listing the content that would need to be inside each major page above it.
1​
2
REFINED SITEMAP
DIGITAL SOLUTION - PHASE 2: IDEATION
TO ELIMINATE ANY BIAS IN THE DESIGN THE INITIAL SITEMAP WAS REFINED AND DIGITIZED TO CREATE A DELIVERABLE FOR DEVELOPERS.
After creating the initial sitemap it was reviewed to assess its alignment with the problem statement, user, and competition. After its revisions, it was digitized as a tool to explain the application's architecture to developers.
Final Sitemap Edits
3
3
2
1
1
Refined Sitemap
This sitemap displays the entire digitized sitemap with all the edits made. The refined sitemap also includes the edits to the Home, Setting, and Music Library page
3
Edited Home & Setting Page
This section of the sitemap displays the edits to the home and settings page. The edits to the home page now provide the user access to audio presets and the current user playing a song. With the addition of the setting page, the user can now control the audio, preset, and smart home settings
2
Edited Music Library Page
This section of the sitemap displays the music library page. The decision to change the storage page to a playlist page was done to prevent redundant pages from being designed. Now the saved songs are songs that the user saved to audio devices. While the offline mode are songs saved to the mobile device
INITIAL TASKFLOW
DIGITAL SOLUTION - PHASE 2: IDEATION
WITH THE SITEMAP FINALIZED TASK FLOWS OF THE PRIMARY FEATURES WERE CREATED TO UNDERSTAND WHAT SCREENS WOULD BE NEEDED
Creating the Task-flows provided the ability to focus on the user's experience. The Task-flow began by creating a visual of how the user would accomplish major features/task of the application
Top 3 Major Task-flows for Digital Solution
How To Sync a Streaming Service To Download Music
This feature was chosen because it will be how users connect their streaming service to the application. Allowing them to stream and save the music to the physical or digital solution
How To Invite Users To Join Surround Sound Mode
This feature was chosen because it will allow users to invite others to connect their audio devices to the user's audio device to create a broader listening experience
How To Edit Audio Device Que
This feature was chosen because it will allow the user to edit the order of the songs played by the device it’s coming from so song request can be prioritized
REFINED TASKFLOW
DIGITAL SOLUTION - PHASE 2: IDEATION
WITH THE INITIAL TASK FLOW COMPLETED IT WAS REFINED INTO A USER FLOW. CREATING A DIGITIZED REFERENCE FOR DESIGNING FUTURE WIREFRAMES
After the initial task flows were created, they were reviewed, revised, and digitized to create low-fidelity user flows for future wireframing. It was also decided that a single task flow from one of the three initial task flows would need to be chosen to become the first user flow to be presented to stakeholders. With that in mind, a task flow was chosen to later create a high-fidelity user flow.
Final Edits To Task-flow and User Flows
2
1​
1​
Digitized and Refined Task-Flows for Primary Features
In the case of the digital solution’s task flows there weren’t any changes made to the task flows. Instead, the changes made converting the task flows to users-flows by displaying the options and the interactions the user will encounter while completing a task
2
Choosen Task-Flow: How To Invite Users To Join Surround Sound Mode
This task flow displays the user’s options when choosing to invite others to join the surround sound mode. This task flow highlights the user’s options to sync devices and add/ invite friends to the surround sound feature.
INITIAL WIREFLOW
DIGITAL SOLUTION - PHASE 2: IDEATION
WITH THE NEEDED SCREENS IDENTIFIED WIRE-FLOWS WERE MADE TO IDEATE THE USER INTERACTION AND VISUAL DESIGN FOR THE MOBILE APPLICATIONS PRIMARY FEATURES
Creating the wireframes provided the ability to focus on the brand's design language and the user’s experience. The wireframes began with hand-drawn sketches to ideate the visual design and the user's interaction with each screen.
Wireframe Design Decisions
1​
3
2
1​
Option to Connect Multiple Streaming Services
These wireframes display the initial ideas and decisions as to how the user will connect their music from multiple streaming services and control them from one application.
2
Offering To Connect a Device Before Sending a Friend Invite
These wireframes display the ideas and decisions as to how to design the initial interaction between users that may connect devices. This displays making the user aware of other audio devices that can connect via Bluetooth so the user can create an initial interaction before sending a friend request.
3
Prioritizing the Device Queue Rather than Song Queue
These wireframes display how a user can prioritize by user/device while in surround sound mode, so the songs from a user/device are played based on the owner's queue settings. Which could be set to play 1 to 5 songs from each device before moving on to the next device in the queue
REFINED WIREFLOW
DIGITAL SOLUTION - PHASE 2: IDEATION
WITH THE REFINED TASK FLOWS CREATED AND CHOSEN, THE INITIAL WIRE FLOWS WERE REFINED AND DIGITIZED. ELIMINATING BIAS IN THE DESIGN THUS CREATING THE FINAL WIRE-FLOWS
After reviewing the initial wire flow it was revised to clarify the visual design and user interactions. With the initial wireframes revised, it was digitized into low fidelity wire flows allowing the chosen wire flow to be used as a reference for the high fidelity user flow.
Final Edits To Wire-flows
1​
2
1​
Digitized and Refined Wire-Flows for Primary Features
The wire-flows were improved by editing the contents of each screen and adding the user’s options to the wire flow. This provided all the screens needed for the final user-flow
2
Refined Wire-Flow: How To Invite Users To Join Surround Sound Mode
These wireframes display the options the users would have when inviting a friend to join surround sound mode. This wire-flow also displays the user's option to offer how the friend connects to the surround sound mode.
VISUAL DESIGN ELEMENTS
DIGITAL SOLUTION - PHASE 3: IMPLEMENTAION
WITH THE WIRE-FLOWS FOR THE DIGITAL SOLUTION COMPLETED, THE VISUAL DESIGN ELEMENTS WERE CHOSEN TO PROTOTYPE THE CHOOSEN USER FLOW
Creating the design system and its visual elements saved time in the visual design process. It also ensured the design language was consistent and best represented Bang & Olufsen.
Design Elements
Typography
This font was chosen to keep the design aligned with the Bang & Olufsen website. The objective was to keep the font simple.
Color
When deciding the colors, it was important to choose colors that were simple so the content would stand out in the application rather than the color.
Icons
When deciding on the icons to use it was important to keep the theme of simplicity. The objective was to use simple lines and edges to imitate Bang & Olufsen's website icons
VISUAL DESIGN DECISIONS
DIGITAL SOLUTION - PHASE 3: IMPLEMENTAION
WITH THE DESIGN SYSTEM CREATED, THE VISUAL DESIGN ELEMENTS WERE ADDED TO THE WIRE FLOWS TO PROTOTYPE THE CHOSEN USER FLOW.
To display how and what the user would interact with, the user flow was prototyped by adding the visual design elements to the wire flows while making design decisions.
Design Decisions
1​
1​
Device Display
In the digital solution, the ability to play different music on multiple devices needed a clever way to be displayed. The decision to use the image carousel of the actual device was made to make that process easier. This allowed the background color to remain one solid color and section of that element of the design
2
2
Solid Background Color
The digital solution was limited to single background colors to simplify the design and keep the focus on the interactions and tasks of the user.
PROTOTYPE
DIGITAL SOLUTION - PHASE 3: IMPLEMENTAION
WITH THE VISUAL DESIGN ADDED AND THE USER-FLOW COMPLETE THE PROTOTYPE COULD BE USER-TESTED.
This prototype uses Ben (the Bang & Olufsen Fanatic persona) to display his understanding of how to invite users to join the surround sound mod thus testing the usability of the user flow created
Persona & Userflow Scenario
Ben the Bang & Olufsen Fanatic Invites Friends To Join Surround Sound Mode
Bang & Olufsen Fanatics are fans of the brand that would own all of their products if they could. They are Gen X and Millennials that love quality products. Ben is a full-time music teacher. Ben has been collecting Bang & Olufsen products for the past 3 years. Ben heard about Bang & Olufsen’s new product and made sure to order. Now he is testing out the surround sound mode with his friends.
RESULTS
DIGITAL SOLUTION - PHASE 3: IMPLEMENTAION
WITH THE VISUAL DESIGN ADDED THE FINAL USER FLOW COMPLETED THE DIGITAL SOLUTION, PROVIDING WAYS FOR BANG & OLUFSEN TO CONNECT PEOPLE.
The digital solution connects people and creates a solution that is relevant before and after a pandemic by using music and technology as a common ground.
Problems Solved
Connecting People
The digital solution solves the problem of connecting people by creating an application that requires the user to interact with others to use features like walkie-talkie and surround sound. However, the digital solution primarily connects people by providing music for social gatherings in rural and urban places by being able to play downloaded music
Product Relevance
The digital solution solves the problem of designing a relevant product during and after a pandemic by designing a product for users who are in private and public spaces. Features like being smart home compatible and the ability to save music to a mobile device make the product relevant since it can be used with or without a wifi or cellular connection.
CONCLUSION
THIS PROJECT RESULTED IN A VIABLE PHYSICAL AND DIGITAL SOLUTION FOR BANG & OLUFSEN WITH THE POTENTIAL FOR MANUFACTURING AND PRODUCT LAUNCH
Although the problem statement was fictional, A valuable area of opportunity and market for the Bang & Olufsen brand was discovered
Outcomes
In the end, the physical solution wasn’t built but, its digital prototype accurately depicted the major features of the solution. In fact, the feature of a wireless phone charge was later added to Bang &Olufsen's Beolit 20. Overall this project was a success.
Lessons
This project taught me the appreciation of the time and effort that goes into the creation of high end products. It turned out to be a great project that can be a valuable asset to the Bang & Olufsen product line with the potential for market application.
