Designing on my Terms

April 19th, 2013
4minuteread
#Design&Usability

What happens when you let a designer off the chain?

Coal bucket

Every once in a while I get an itch that I can't help but scratching. It could be a major brand that I see tons of potential in, like a Stanley Steemer home page refresh from a couple years ago or a local barber shop that I walk by every day. Whatever it is, I see it and all I can think about is how much better it could be. 

Diamond Springs Website Design

The current Diamond Springs website design.

The cool thing about projects like this is, no offense to my clients (I love you guys), the opportunities to design a website based entirely on what I think works is rare. Having said that, we have a water cooler here in the office, serviced by Diamond Springs. Our delivery guy is this super nice dude named Clarence. 

Last Christmas I was looking up the Diamond Springs phone number and pulled up their website. Now, I am sure they have wonderful people working on their site, and do a great job on it. But no one could look at it objectively and not think that the design is dated. I kept thinking about the potential for the site and how I would design the home page if I had free reign. 

So I designed it.

Full disclaimer here, I haven't had any contact with Diamond Springs at the time of this posting, this was entirely my own initiative (for better or worse :-).

Diamond Springs Website Design

As far as the actual design went, I knew I wanted to place an emphasis on nature. Not just place an emphasis on it, but really idealize it. This isn't just water- it is amazing pure water perfected by nature- at least that is the feeling I wanted to convey. I wanted it to be magical, so I worked on introducing little forest lights that strive to tie the water bottle to the background. 

Diamond Springs Website Design

So starting at the top we have a cleaned up navigation. It’s 2013 and all, so let’s abandon a navigation button dedicated to the home page, shall we? I also created a secondary navigation for e-com engagements. All in all I paired it down from nine navigation options to six, making for a more digestible menu. I also cleaned up the logotype treatment without much of a time commitment. 

Diamond Springs Website Design

After the navigation we have the main call to actions, these are defined by the current site, but I wanted to do it in a more intuitive fashion, thus the blue circles with the five main services. The sizes correspond with what I thought were their most important product lines.

Diamond Springs Website Design

After the main section we have the value proposition and then four more call to actions. Not all of the call to actions are legit, I would want to actually talk to someone at Diamond Springs to align the website actions with their business objectives- for the most part this is a user interface and brand study. This section is broken up in the layout by going underground in the main image, which I had a lot of fun with.

Diamond Springs Website Design

Next up we have the sub footer, where I included a ordering and delivery call to action, customer testimonial, and calendar of events. In the main footer we have the company contact information as well as social media engagements. The footer is executed in blue and includes a flat, hard edged shape that I think compliments the organic elements in the rest of the design.

Diamond Springs Website Design

Thanks for stopping by and checking it out. Part of the reason I screen recorded the design process here is to help our clients and other people interested in having a website built what exactly goes into a custom designed site from a behind the scenes perspective. Total design time on this project was about 10-12 hours. Keep in mind, this is for one page, and this is just Photoshop. Turning this design into a living breathing website is a whole different animal. It usually takes us about 150-450 hours to create a custom website from start to finish, typically depending on the level of functionality that the site requires.

So yeah, you can get a template based website design, or use a shop that recycles designs (check out their portfolio page, do most of the sites have the same basic layout?)- it just depends on what level of solution you are looking for. As in most things with life, you get what you pay for.

All in all I am pleased with the result. I would consider this a work in progress, like I wrote, I would need to talk to Diamond Springs to really make sure I understood their business objectives and design the site accordingly. 

Who knows, maybe I will?

Diamond Springs Website Design After

Before and after comparison. 

About The Author

Jason uses his 20 years of experience as a marketer for a wide range of companies and organizations daily in his role as the leader of Coalmarch. As CEO he plays a direct role in the...Find out more!