Environs Development

Design, Content, Execution : Website

I was hired to update the website and ensure the overall brand and message appealed to incoming clientele seeking a developer who would build their dream home.

My Role

I managed the project, overseeing everything from research to production; this included assisting in photo shoots, selecting site photos, and writing the copy.

Research Overview

To kickstart the project, I needed to understand Environs's process and industry, so I did the following:

  1. brand analysis
  2. competitors' site audit
  3. top industry sites style review

Research Step 1

INTERVIEW QUOTES

This analysis included conducting interviews with the employees and employers of the company to gain an insider's view of who they were and what they wanted to be for their clientele.

Here's what they had to say:

BRAND ANALYSIS

What I gathered from the original website:

From first glance, I could see that the site was outdated, but before I get into what didn't work, let me tell you about their branding. They were going for an elegant yet contemporary look. They used different brown hues, a sans serif font, and simple page structure. Their MVP was their gallery, and they wanted their site to speak directly to their clientele.

THE ORIGINAL WEBSITE

  1. The website was made of locked pages and was incompatible with mobile devices.
  2. The sidebar menu occupied space best used for main content. Its hierarchy was counter-intuitive, and its wording was funky (specifically the Gallery titles.)
  3. The header (including company name, description, and logo—made up of the company title and the three squares) was misleading. The logo was the home link; user intuition is to click on the company name.
  4. The home page broke down company work but failed to explain the company’s mission.

Research Step 2

COMPETITOR SITES

Competitor sites had similar problems.

  1. Their branding lacked inspiration and clarity.
  2. They had poorly organized menus.
  3. Their copy was either insufficient or wordy.
  4. Many of their galleries were poorly curated.

Research Step 3

EXEMPLARY SITES

I sought out similar companies with superb websites which appealed to Environs' brand, and repeatedly found the following features to be responsive design practices:

  1. Excellent flow from their branding statement into the breakdown of their company
  2. A strong portfolio or gallery
  3. A clean overall presentation

I picked a multitude of features I thought could work for Environs' new site, and set them aside while I moved into design.

Design

GOALS
  1. Compel clientele through a story.
  2. Elevate company brand.
  3. Keep site structure simple and straightforward.
  4. Promote gallery (portfolio).

SITE MAP

I began with a primary navigational menu and the breakdown of necessary web pages.

SKETCHES

I then sketched a variety of frames and added site flow indicators. I considered mobile compatibility while playing with different features and functions.

I discussed the frames with the client and allowed him to select his favorite combinations. (Due to technical capabilities of Squarespace, we did not go with some of the features initially chosen.)

User Flow 1

User Flow 2

As you can see, I created several variations of each page, testing out what would offer the necessary information without a boring presentation—such as, large blocks of text.

User Flow 3

CLIENT PRESENTATION

I put together the following deliverables:

  1. Research Highlights
  2. Goals
  3. Competitor Analysis
  4. Brand Analysis
  5. A quick breakdown of new design practices
  6. Site Outline
  7. Mock Pages with explanations
  8. Research breakdown for extra information

Knowing my client was a visual learner, I created some mockups.

Final Product

The new website can be viewed through the following link: https://www.environsdevelopment.com/.

Here's a sneak peek though.

Conclusion

My happy is more than pleased with this project, so I am excited to share it with you.

This website was my very first web design job and a significant learning experience, as I started it with because of my interest in copywriting, sans web design knowledge. It is thanks to this job that I found my passion for user-centered design.

Other Work