Shameless Self Promotion: Synchrony Farm

Julie from Synchrony Farm wanted a website to advertise her services, share her photos, and give her clients a way to communicate with her. She also wanted a place to show off testimonials from her many happy clients, as well featuring some of her other projects.

The Wireframe:

The project started with a wireframe, showing the general layout of the site. A wireframe is a very basic design, showing only the structure and rough functionality of the final site. Wireframes are quick and easy to produce, allowing the designer to try out a variety of layouts for the client without much cost. Some items that are missing from a wireframe are color, texture, imagery, and actual content.

For simple websites, the wireframe might be only a single page. But for larger, more complex sites, multiple wireframes might be required to show the different functionality.

A wireframe showing the rough structure of Synchrony Farm's website

The Mock-Up:

Once Julie was happy with the wireframe, I worked up a mock-up on the site’s design. A mock-up is a more in-depth creation. It demonstrates things like color schemes, textures, imagery, and content.

In this case, I used Synchrony Farm’s color scheme: green and dusty rose. I didn’t have access to their logo yet, so I used a simplified, text logo and kept the background texture generic. Otherwise, the site’s design was exactly what I planned to produce.

A mock-up of Synchrony Farm's new website

The Final Synchrony Farm Site:

With the mock-up approved, I got to work work on the actual website. Since Julie wanted a simple site that wouldn’t be updated frequently, we decided against a Content Management System (CMS) like WordPress.

Now that I had the logo, I integrated it into both the background and the main header image. Julie also decided she wanted to show off more photos from her site, so I created photo mosaics for the hero shot, showing off four or five different photos on every page. We also decided that social media wasn’t for Julie, so those buttons were removed and replaced with recommended links. Below is the finalized site:

Synchrony Farm's new website

Both Julie and I are quite happy with how her website turned out. Please check it out live at

Leave a Reply

  • (will not be published)

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>