Austin & Elkins Website Redesign

The Goal:
To highlight the strengths of the jeweler and to reach out to a younger client base by redesigning the UI.
My Role:
Data Analysis, Information Architecture, Wireframing,
Prototyping, User Testing

Tools Used:
Google Suite, Adobe XD, Figma, Miro, Photoshop, WordPress

The Problem

Austin & Elkins is a well-respected and established Alexandria-based jewelry company. Being around for the past 30 years has allowed them to maintain a solid client base, but there has been an increase in business with a younger generation. With this new growing client base and the pandemic, Austin & Elkins realized their website was unresponsive and did not reflect their business’ branding or their high-quality presentation standards. 
How might we improve the Austin & Elkins' website so that the site drives more conversions, including the number of inquiries about products and/or scheduling appointments via phone or email?

The Solution

Creating a responsive website redesign with a focus on a clean, elegant design that drives users to make appointments with Robin Austin, the business owner. 

Research

Stakeholder Interview

Right away, we scheduled a meeting with Robin not only to set up times frames and define deliverables, but to also take the time to get to know her, her business, and her goals for this project a little better.

Robin made it clear what she wanted and did not want for her site. She wanted a clean, warm, and elegant design that highlights her jewelry and services so more prospective clients would contact her. She also wanted to use the site as a way to showcase the jewelry as if in a gallery and not an e-commerce site. All this had to be done on a platform that leaves room to accommodate her growing business, as well as simple for her to navigate and edit in the future.

User Interviews

Understanding what Robin wanted for her website, we continued our research with user interviews with a few people from Robin's actual client base and other jewelry aficionados within the target demographics. A lot of information was given, but we were able to synthesize it all to a few key insights.

Likes: personal experience, clear explanation of custom design process, and details about the jewelry.
Dislikes: inaccurate photos of the jewelry, text-heavy sites, poor time estimates, and confusing navigation items.
Needs: a trustworthy jeweler, unique jewelry, and an a site that is easy to navigate.

Definition

User Persona

We analyzed the information from all of our interviews, and then combined them to create a user profile that we believed would match a potential client for Austin & Elkins. Joan Smith was created with all of the needs, wants, frustrations, and goals Robin, her clients, and other jewelry aficionados had, and visualizing her would help us further down the process.

Ideation

User Journey Map

Now that we combined everything into one person, Joan, our team created a user journey map to help visualize Joan's process of interacting with the website. It also allowed us to discover any hidden opportunities that would help us design the website more clearly.

Wireframe & Prototype

Lo-Fi & Hi-Fi Wireframes

The team decided to each sketch out different pages of the website, keeping in mind all of the information we collected and analyzed. After going through each design, we selected different layouts and sections we wanted the website to have (ie. testimonials, z-pattern layout for text-heavy pages, "What Matters to Us" section, etc.). Then I applied all those ideas to a low fidelity wireframe, and they were tested with a group of five users.

Testing

User Testing

Our team was glad we tested the wireframes, because we received a lot of good feedback on how to improve it. Users told us that having two CTAs on each page made it seem too "pushy," thought the hierarchy of the homepage should be rearranged to better showcase the values of Austin & Elkins, and the "Jewelry" page title was confusing since it was only a gallery and no option to make a purchase.

With the feedback we received, another team member and I set out to create a high fidelity wireframe. Designing a layout with all of the feedback we received was its own challenge, but trying to also incorporate the client's wishes of keeping it "clean, simple, and elegant" made it a little more difficult. The team wanted to respect the wishes of our client, yet keep the website from looking too "flat" or "dull." After creating a few versions and with the feedback of other designers, the final prototype was complete.

Final Product

Looking Back,
Moving Forward

Having the opportunity to work with an actual client was nerve-racking, yet so rewarding at the same time. The whole project felt like a balancing act with what the client desired and the data collected from our research. We learned quickly enough that in order to create the best product for both sides it was important to consistently communicate with the client and to advocate for the users using the research to support our choices. The few weeks we were given to complete this product from the first client meeting to building out the website for publication helped reinforce the tools I was taught.

If provided with the opportunity to continue this project, our team had some great ideas we would like to pursue.

1. Update the galleries with more pictures of jewelry.
2. Add details about each jewelry piece on the website.
3. Create more interactions on the site.

©Aileen Nam