PREVIOUS BLUDOT.COM

Looking at the desktop and mobile experiences, it was evident that there was a fractured and inconsistent digital experience along with some usability issues and opportunities to improve site maintenance efficiency. The site also lacked structure in terms of a grid and UI patterns, which made the entire experience confusing and ineffective.

↑

Because the desktop and mobile sites both had their own CMS, it took twice the amount of effort to maintain and create content for the website. Also, the lack of a grid structure across the site lead to a lack of visual flow from page to page.

↑

Unfamiliar placement of elements created confusion, such as the e-mail sign-up form frequently mistaken as a search bar.

↑

Brand inconsistencies, such as different logos used between desktop and mobile experiences.

↑

Many ADA compliance issues, such as low-contrast color combinations and unreadable type.

↑

Lack of standards for selecting imagery created visual discord throughout the site.

↑

Unusual image crops lead to ineffective use of imagery.

FRAMEWORK

I began first with creating a system of grids for each breakpoint to create structure and to allow for quick wireframing for our executive leadership.

Homepage

The homepage features a modular interface of full-screen tiles that provides Blu Dot the flexibility to re-arrange and highlight content in a way that they weren't capable of before. 

Product Listing Pages

Through user-testing we discovered that users found our product listing pages crammed and difficult to navigate. Products are now broken up by furniture collections so it is easier to see where one style ends and another begins. The increase in white space also makes the pages more scannable and digestible. Reducing the number of products in each row and increasing the size of the thumbnails also allow for users to easily distinguish one furniture piece from another. 

Photo Style

Consistent photography was key for a uniform e-commerce experience. Products were shot at low angles to emphasize the form and to maintain a graphic appearance online.

Purchase Funnel

Pages within the purchase funnel are elegant while also utilitarian. Previous product detail pages were uninspiring and lacked Blu Dot's personality. The new experience shares the story behind some of the more iconic design pieces and leverages photography that are undeniably Blu Dot.

Throughout the design process, we made sure to maintain strong content parity so that all information is equally accessible regardless of what device a user may be using.

Brand Love

Engaging and content-rich pages articulate Blu Dot's value proposition and unique point of view in the furniture space. Included are Blu Dot's design process, history and list outlining what makes Blu Dot different from other furniture retailers.

visual Style

Blu Dot's slogan is "Modern, for the real world." Therefore, it was very important that the site be accessible to users who live in the real world. The visual language is high contrast for a modern look that also makes bludot.com accessible to users with disabilities. We utilized a simple type scheme and minimal color palette to elevate and enhance the experience on a site that now feels distinctly Blu Dot.