Get in Touch (Coming Soon)

North Country Door

Branding, Design, Development, Content Strategy

About North Country Door

North Country Door is a custom cabinetry component manufacturer in Cornish, New Hampshire. They have been operating since 1985, and chose to make themselves a website using a no-code-required service online. The result worked for them for a while, but they began to realize that the long, cumbersome fill-in order form they had to use was getting in the way of customers easily placing their orders.

This order process was their main motivation for a custom redesign. It was very important to them that their customers be able to make informed, meaningful decisions while customizing their orders. They also wanted a clean way to show off examples of their products.

Contact Form

An embedded Google Map with a pin on their building provides a more visually interesting background.

Arriving at the Aesthetic

In terms of branding, anything was fair game - this was their opportunity to re-envision themselves. Because of the medium in which they work, I chose to go with colors found in nature, namely blue and green to match the natural woodtones of their imagery. I chose Bebas Nueue, a font that evoked a sense of craftsmanship and sturdiness for the headings. For their logo, I played with a few options and settled on a bold yet simple outline of mountains to play off of "North Country."

Their target audience is made up of general contractors and builders who would make use of being able to place their orders from the job site or while otherwise on-the-go. Because of this, making the order process work down to smartphone size was a must.

Placing an Order

The order form is built of large button choices to limit the number of text entry fields and increase efficiency.

Organizing the Content

Site organization could be fairly simple because the website had only a few main tasks - to tell about the company, to show a gallery of their work, to take orders, and to be contacted. Each of these became their own pages. The order form involved more organizational attention, because some selections affect future options.

The Order Form

This page involved roughly 75% of the total project time and work. It was very important that customers be able to easily choose what they wanted to order and make an informed decision on each of the customizable parts. With their old order form, they were limited to fill-in fields, dropdown selections, and radio buttons. While there is nothing wrong with these types of inputs, it became clear early on that an entire page of these would be too daunting for a customer who wants to type and click as little as possible and be done.

Line Drawings

Using simple drawings instead of photographs makes choices more objective and understandable.

For this reason, I converted dropdowns to galleries and limited the number of text fields that were necessary. This transformed a boring form into a helpful, visual experience. This made it easy to base decisions upon appearance and not require the customer to remember (or leave the form to reference) the codenames for individual options.

To clarify customization options without confusing too many variables at once, I created a number of line drawings to help illustrate shapes without also involving species, camera angle, and other attributes that would get in the way with photography.

I also moved the customer information to the end of the form so that from the get-go there was nothing in the way of customizing the perfect product. Then, after completing the customization, the customer would be more likely to take the time required to fill in the fields required to take billing information.

Billing Information

Allowing the customer to build their product before entering their information makes this necessary step less of an obstacle.

Content Management

Being able to add wood species, door styles, panels, and other customizable options over time was also a part of the project specification, and North Country Door could not rely solely on my availability to make updates for them. To solve this, I implemented the SilverStripe CMS, which allows them to log into their site at any time and edit all of the text, images, and other options on their own.

What I Learned

This project was full of learning for me. This was my first time using the SilverStripe CMS, and there was a fairly steep learning curve involved which caused a delay in the completion of the project. I had some great mentorship from Zachary Lincoln, a SilverStripe guru. This was also a terrific learning experience for both jQuery and PHP to integrate the CMS as well as make the order form functional.

Like what you see?

I'm available both for hire and contract work.

TwitterGoogle PlusLinkedInForrstDribbble

© 2013 Teagan Atwater. All rights reserved.