Contacta Eyewear
School project for Contacta Eyewear.
With the competition situation, we need to ensure a good web design that leads to visitors.
Customers book appointments for eye examinations or orders in our webshop. with the website and digital marketing, the current version of the website was launched about a year ago.
The question that prevails, have we been delivered a website that is good in the sense of UX? What can be improved to achieve a higher conversion rate of the organic traffic?
After receiving the client's brief and holding an initial meeting to gain a deeper understanding of their problems, our design process began with research.
We conducted surveys and interviews with people close to us who have visual impairments. Our goal was to gain better insight into the primary factors that drive a person's choice of optician.
Based on Contacta's brief and their online presence, we believe their key differentiators are personal service, experience and competence, along with high-quality products.
We wanted to investigate how important these factors are for people who wear glasses/lenses and how we could potentially leverage this knowledge to generate more customers.
In addition to surveys and interviews, we performed some shorter usability tests on Contacta's current website to get a picture of how the website is perceived by a potential target group.
We received some mixed responses, with some testers liking the design, but others finding it cluttered and information-heavy. the booking flow was also not intuitive and one test subject barely managed to book an appointment.
We also chose to do card sorting sessions where users were tasked with segmenting the different tabs currently on Contacta's website. This decision came after we identified navigation as an area for improvement.
Our goal was to understand what type of information users considered most important when visiting an optician's website, making card sorting a logical choice. We performed both digital and analog versions, with users following these steps:
Divide all the cards into groups (as many or as few as desired)
Rank all cards within each group
Give each group a heading
Remove five cards
Remove five more cards
Test subjects were asked to think aloud during the process, and we continually asked them about their reasoning to gain a deeper understanding of their choices.
In order to define and prioritize the client's challenges, we collectively brainstormed various Points of View (POVs) and How Might We (HMW) statements. Initially, the task seemed broad, and we encountered challenges in pinpointing the most relevant issues. However, through formulating POVs and refining our focus, we found clarity for the direction of our work. Ultimately, we settled on two distinct problem formulations:
1. Customers Need an Intuitive Website for Easy Appointment Booking: How can we enhance website navigation to streamline the appointment booking process?
2. Customers Require a Design that Evokes Trust and Personal Connection: How can we maintain a personal and trustworthy tone in our design while ensuring simplicity and competence?
In essence, we aim to create a design that is both clean and simple, yet exudes competence and fosters trust. For each problem formulation, we developed two corresponding HMW statements:
1. For Easy Appointment Booking: How can we optimize website navigation to facilitate smooth appointment scheduling?
How can we incentivize more bookings through our website's design?
2. For Trust and Personal Connection: How can we infuse the design with a personal touch and maintain a reassuring tone?
How can we attract more customers to the store through our website's design?
Additionally, we constructed a customer journey map to comprehensively understand user interactions and experiences throughout their engagement with our service.
To progress in our design process, we conducted internal workshops aimed at ideation and visualizing concepts more clearly. We employed the "Top Five" method, where each participant generated five ideas linked to the two problem formulations identified in the previous design phase. Subsequently, we collated and clustered these ideas to identify recurring themes.
Through this exercise, we quickly recognized three primary factors that require adjustment on the website:
1. First Impressions/Emotional Appeal: Crafting the desired feelings and impressions through the website's design.
2. Reservation Process: Streamlining the appointment booking system.
3. Navigation: Enhancing the user experience by optimizing website navigation.
Once we defined these areas, we applied IDEO's framework to distill insights and formulate new How Might We (HMW) statements for further exploration and refinement.This process enabled us to pinpoint key focus areas and generate actionable insights to guide our design efforts effectively.
Based on the insights gathered during the Ideate phase, we proceeded to develop rapid analog prototypes as a foundation for our design exploration. Each team member produced quick design sketches aimed at conveying the desired emotional tone. Through collaborative discussion, we identified commonalities in our envisioned designs and highlighted key elements for inclusion. Subsequently, we transitioned to building a digital prototype using Figma, based on our analog sketches.
In refining the digital prototype, we made several strategic decisions. Recognizing the importance of conveying Contacta's personalized service and extensive expertise, we replaced generic homepage images with visuals showcasing employees, the company's history, craftsmanship, and inviting store atmospheres. We also simplified the menu structure based on card sorting, ensuring clearer headings. To streamline the appointment booking process, we prominently featured the "Book Appointment" button on multiple sections of the homepage. Additionally, we optimized the booking flow following feedback from empathy tests and heuristic evaluations, identifying areas for improvement.
These adjustments aimed to enhance the user experience, emphasizing Contacta's unique offerings and facilitating seamless interaction with the website.
We aimed to create a prototype quickly for testing, prioritizing insights from users over achieving perfection. Given our focus on altering the initial impression and emotional tone of the website, our usability tests were not task-specific. Instead, we sought to gauge users' overall impressions and the emotional resonance of the design.
During the tests, participants reviewed the prototype and provided feedback on its design. They were asked to select five words each from a list of positive and negative adjectives, derived from the Microsoft Desirability Kit's extensive word bank, to describe their perception of the website.
The adjectives most frequently chosen by participants included:
Professional
Serene
Trustworthy
Competent
These insights guided our understanding of how users perceived the website's initial impression and emotional impact, informing further adjustments to refine the user experience.
Through a collaborative design process, we refined Contacta's website to convey professionalism, trustworthiness, and competence. Using analog and digital prototypes, we optimized navigation, highlighted key services, and streamlined the booking process.
Usability testing confirmed our success in evoking the desired emotional response from users, resulting in a polished final product that effectively communicates Contacta's unique value proposition.
