Ideapaint

Ideapaint

Ideapaint is an innovative product that transforms any ordinary surface into a canvas for creation and a space for collaboration. It was mainly the message, not the medium that informed the design of the site, down to the UI. The doodles and inspiration that are created on top of IdeaPaint’s products are human, relatable and inspiring.

My Role
Art Direction & Design Lead

Agency
Big Spaceship

Design Exploration

The Design Exploration is essential to my process and helps to define the visual language for the new project. This is something that I’ve evolved over the years, taking the philosophy of style tiles and adding context, interaction, user experience, tone of voice and brand story.

After talking to the client and understanding their product and their business goals, we can start exploring ways to bring the best out of the brand and get it onto the website. This gets us aligned on the big picture early and lets us make changes efficiently. 

Iconography

We created hand-drawn svg icons that mimic the quick doodles that happen on walls coated in IdeaPaint’s products.

Pattern Library

Once we iron out the visual language of the site, we start adding elements to a pattern library. A pattern library contains all elements used on the website, provides guides for interactions and helps the team maintain consistency and gain efficiency in front end development. Initially created in Photoshop, the patten library is handed over to front-end development to bring the elements to life. The pattern library is a living, breathing document that grows as the project continues.

Infinite Possibilities

How do you communicate all of the things that a plain bucket of white paint can do?

We came to one conclusion: It’s not about the product itself, but rather what the product can do that is inspiring to potential customers. We thought a lot about the ways customers use IdeaPaint so we could make those activities come to life on the site.

We reimagined the homepage as a continuous wall that the visitor can swipe through to explore the infinite possibilities that IdeaPaint can create. Instead of showing the product itself as the hero, the fun and collaboration that comes with the IdeaPaint experience became the hero.

IdeaPaint_Panorama_v01_r03IdeaPaint_Panorama_v01_r03

Shopping Experience

Buying paint poses some unique challenges.

How do we successfully show the differences between similar products? How does the customer know how much paint to buy for their space? We showed the differences between the different type of paints (Create vs Pro) with short copy and illustrations. We created a calculator and a guide to measure so that customers are reassured that they are buying the right amount.

UX & Design
Jeremy Belcher
Dave Chau

Technology
Nick Dandakis
Eric Willenson

Production
Sam Sally Cha
Joe Prota

NEXT UP

 

Google I/O

Event Design

[unex_ce_button id="content_vq8jwoj0z,column_content_foy8ya516" button_text_color="#ffffff" button_font="bold" button_font_size="15px" button_width="auto" button_alignment="center" button_text_spacing="2px" button_bg_color="" button_padding="15px 60px 15px 60px" button_border_width="2px" button_border_color="#ffffff" button_border_radius="0px" button_text_hover_color="#000000" button_text_spacing_hover="2px" button_bg_hover_color="#ffffff" button_border_hover_color="#ffffff" button_link="http://naimsheriff.com/work/google-io/" button_link_type="url" button_link_target="_self" has_container="" in_column="1"]VIEW PROJECT[/ce_button]