Williams Sonoma Website Redesign
Context:
I redesigned the Williams Sonoma website, because I when I went on it I was struck by the feeling of it being cluttered and lacking character. Every time I walk into a Williams Sonoma store I am met with strong branding and get excited to look at all the new cookware. Logging onto the website I was met with a more overwhelmed feeling, and felt the user experience could be improved. I personally love the brand and therefore tried to redesign the website.
Challenge:
Williams Sonoma website look was bland and cluttered, but had great visuals that I wanted to put to better use. There was also over-repetition of their family brands.
Solution:
Create a new website design that would include all of the resources of the old one, but make it more organized and usable. I focused specifically on creating an item user flow and redesigning the look of their blog which was connected to the website. Redesigned parts include: header, font, colors, organization, and descriptions.
​
Scope: Self-led Project
Duration: One week
Tools: Illustrator, Figma
Role: Concept, Wireframe, Prototype
​
Wireframe
I started with two different homepage designs, because I knew that was one of the main pages I wanted to change. I wanted to simplify, modernize, and organize the entire website, so I drew these simple layouts to start.
Design Process
I created a web flow that includes how a user might find a product through the website, and then find their way to the blog for more details on recipes. The original website had an overwhelming amount of navigation actions at the top of the homepage so I wanted to improve that.
Original to Redesigned
Original Homepage
The original homepage was long, contained many different messages, and was cluttered. However, there were aspects I kept and reorganized, such as some of the visuals.
This new homepage includes: a new header and logo, royal blue page bar, new fonts, and reorganization of the entire page. It also includes simplified navigation at the top of the page, so a user might browse and find what they want easier. I brightened up the page with the use of more color and increased contrast with the letters.
Final Iteration
This hi-fidelity screen flow takes the user through the process of looking at a specific product. The final design also includes the blog that is connected to the main website and I designed this to create unity between the main shopping website and the blog. Users may now browse more easily through the products, recipes, and other services that Williams-Sonoma provides. There was also repetition of Williams Sonoma family brands throughout the website that I thought took away from the user experience by pulling in too many different directions. I added links to the other brands at the bottom of the homepage so a user can still find them, however now they are not taking up unnecessary space on the site.
