Research
Product Research
As a frequent flyer, I observed my personal flight experience and identified the problem of distracting noise. I realized that noise-cancelling headphones could be a solution to this problem, but I needed to find the right product.
I conducted research on different noise-cancelling headphones, including the Bose 700, and analyzed their features and advantages. I converted these features into user-centric values and used them as unique selling points for my design.
User Interviews
To better understand people's flight experiences and habits, I conducted interviews with three people from diverse backgrounds. Through these interviews, I learned that users tend to delay purchasing expensive goods until they have enough information about the product's value and quality. They also prefer having all the necessary information in one place, and they value brand prestige and social proofs such as reviews and awards.
Persona Development
Based on the interview results, I created a persona portrait to represent the typical users who would benefit from my solution.
Problem Statement
Using the 5 Ws framework, I created a problem statement that describes the user's need that my design should address. The problem statement reads: "Natalie is a frequent business flyer who needs a reliable noise-cancelling solution because a noisy environment can reduce their ability to be productive."
Insights
Through the research process, I gained valuable insights into how to create a page that effectively communicates the value of the product.
I focused on incorporating strong proof of the product's values and using best marketing practices to build the page's logic. It involved creating a pitch that spoke directly to the needs of the target audience, highlighting the unique value proposition of the product, and making an emotional connection with potential customers.
Additionally, I incorporated confidence-building elements, such as social and business proofs, to help potential customers feel secure in their decision to purchase the headphones.
Ideation
Text prototype
Before beginning the wireframing process, I carefully considered all the information and materials I had gathered and created a preliminary text prototype for the future promo page. Using established marketing practices, I developed a logical structure for the page, including its headings, subheadings, and content.
.png)
.png)
Wireframes
Once I had the text prototype ready, I began testing different composition layouts to identify the most effective way to highlight the product features. It involved exploring multiple wireframe designs to find the best layout that would effectively showcase the product's features and benefits to the user.
Design Process
Grid and spacings
Once I had selected the composition layout, I created a grid system and carefully planned the spacing between elements. As a brand like Bose emphasizes reliability, it was crucial to ensure that the design was consistent and organized, helping to establish a sense of trustworthiness in the product.
When it came to selecting the color palette for the design, I carefully considered the message I wanted to convey to users. As the product is focused on technology and has a premium positioning, I aimed to create a visual language that conveyed these qualities. After exploring several options, I ultimately decided on a black-and-white color palette.
There were several reasons behind this choice. Firstly, the simplicity of a monochrome scheme provides a clean and sophisticated look that emphasizes the content and functionality of the interface. This approach helped to minimize distractions and guide users' attention towards the most important elements.
Additionally, the contrast between black and white elements helps to create a visual hierarchy and aids in the organization of content.
Furthermore, the classic and timeless aesthetic of black-and-white visuals appeals to a wide range of users, ensuring that the design remains relevant and engaging over time.
.png)
I utilized square forms throughout the design to create a cohesive interface. The symmetrical and uniform nature of squares also conveyed a sense of stability and security, promoting user confidence and trust in the product.
Overall, the combination of a black-and-white color palette and square forms provides a simple yet effective design solution that prioritizes functionality and user experience.
Testing
After completing the design, I tested the product to find potential issues. Some users said they didn't like scrolling back to the top of the page to buy something. They wanted the buy button at the bottom of the page instead.
To fix this, I put the buy button at the bottom of the page, which made it easier for users to buy things without scrolling back up.
-min.png)
Results
The final mockups showcase the results of the design, including a visually engaging and intuitive layout that effectively highlights the key selling points of the product. The design utilizes a sleek color palette, modern typography, and dynamic graphics to create a cohesive and impactful promotional page.
.png)
Metrics
To track the success of the project, I used several metrics to evaluate the user experience. Firstly, to measure user emotions, I conducted surveys and user testing both before and after users interacted with the product. The most common feedback from users was that they felt the information was presented in a more structured and organized manner, leading to a decrease in feelings of confusion or overwhelm.
Secondly, to measure user reflections, I asked users if all their questions were answered and if any possible objections were addressed. The majority of users responded positively, stating that they found all the answers to their questions during the user testing phase.
Finally, to assess user retention, I asked users if they would return to the page and potentially purchase a product. The majority of users indicated that they would indeed return and make a purchase, demonstrating the effectiveness of the design in engaging and retaining users.
UI kit
Selected color palette, typography, and graphic forms should reflect the product's unique qualities and brand identity. As per the justification above, I opted for a black-and-white color palette to convey a sense of elegance and sophistication, given that Bose is a premium product with a calm, rational, and secure tone of voice,
To ensure that the texts were visually consistent and easy to read, I chose the Helvetica family as the typography base. This classic and versatile font is highly legible and adaptable to different design contexts, making it an ideal choice for a premium product like Bose.
.png)
Finally, I selected squared buttons to support the overall visual style of the composition, which features squared photos and horizontal and vertical alignment. This design choice reinforces the product's premium and sophisticated qualities and makes the UI elements easy to use and visually appealing.
.png)
Reflections & Future Steps
Undertaking the Bose project has taught me the importance of having a comprehensive understanding of the product before designing a webpage for it. As someone who previously had little knowledge of noise-cancelling products, I realized that extensive research was necessary before starting the ideation process.
Furthermore, this project emphasized the importance of designing from the user's perspective. It is not enough to simply list the features and benefits of a product; we must also consider the user's needs and ask ourselves, "What's in it for me?" By designing with the user in mind, we can create truly user-centered products and provide a meaningful experience.
As I look to the future, I recognize that there is still room for improvement. One potential solution that I plan to explore is regrouping the website's functionalities by creating header buttons for related sections. In addition, I am considering adding a light theme in white to align with Bose's traditional language. These improvements will help to build a better user experience and create a product that meets the needs of users. Moving forward, I will continue to gather user feedback and data to inform further refinements and enhancements to the design.