Environmental Defence

A company based on defending clean water, a safe climate, and healthy communities. Environmental Defence's design aimed to bring the real issues to light.

Professional Informative and Clean Cut

Our goal with this design was to create a user interface that is not only contemporary and professional, but also easy to navigate and explore. Instead of using dull bulleted lists and blobs of text to communicate Environmental Defence's message, our designer has created a dynamic layout that feels uncluttered while also providing an informational resource for their clients.

Colour

For this mock up we opted for a simple scheme utilizing the current branding of red's with subtle grey's and white's. However, colour is very flexible and Geek Power would be happy to try some other colour schemes too. Colour can very drastically change the mood of a design, so we advise to consider it.

Typography

We have selected a grounded and simple sans-serif typeface for all the type on the design for a terse look. This font is web safe and will render correctly across all browsers and platforms.

The Responsive Advantage

A responsive design allows Project Remedy's interface to be more accessible to their visitors. The design stretches and forms itself to every screen size, so that every user gets the best possible experience.

Actionables

One of the most important functions of the home page is to direct the user where to go. This is why much of this design is dedicated to this purpose. Actionable Items in the form of content boxes and the jQuery rotator help to inform the user and entice them to explore the site further to create conversions.

Styled Form

Getting into the page there is a styled form. This form allows Environmental Defence's clients to feel more informed and secure while also being a good way for Environmental Defence to collect information for sales.

Footer Menu

In the footer is a secondary navigation to further improve the usability of the website.

Tablet

The tablet version of the design is similar to the desktop version, except that all the graphics get condensed to fit much better at the smaller resolution.

Mobile

For mobile devices, all the content moves in to a one column layout so that all the images and text can remain large enough to be seen on a much smaller screen. Also many functionalities have been simplified for a touch interface, such as the main navigation.