Web Development
Web Design
Logo Design
Print Collateral

JHM

Summary: I worked with Kenny Morgan of Counsel Creative to develop the new JHM site. Using Webflow, we bypassed a lot of the miscommunication that can happen between designers and developers to create a website that matched Kenny's original vision.

The designer/developer relationship.

Before talking about JHM, let's talk about how custom websites are built. They're created in two main phases: (1) design and (2) development.

In the design phase, a designer works with the client to create what the site will look like. Then, it's up to a developer to interpret the design into the code that will make the website work. I used the word "interpret" purposefully. That's because designs are flat images with fixed sizes. But, websites don't work that way.

I'm hinting at the idea of responsiveness. A website will be accessed by desktops, laptops, tablets, phones, and even watches. For each one of those devices, there's varying sizes. An iPhone X is 375px x 812 px. But, a Galaxy S5 is 360px x 640px. Quite a bit shorter. 

Then there's the content. Designers will often use dummy content in their designs. But, once the client starts adding their own content, how will the website respond?

A developer has to take the design file and use it to approximate how the website will behave in different contexts. That dymnamic has created a tension between design and development. Designers sometimes resent developers for not following their designs strictly and developers often resent designers for failing to anticipate how their designs can be implemented in the real, practical world.

A screenshot of the design file for JHM.

Working with Counsel Creative

Kenny Morgan (CEO of Counsel Creative) and I have had conversations about this dynamic. So, when the JHM project came up, we knew it was the perfect opportunity to collaborate and use Webflow to develop the website.

Webflow is a tool that lets you create a custom website visually. So, instead of writing the website's code in a text editor, the developer uses an interface to accomplish the same thing. The end result is the same, but one approach is text-based and one approach is visual.

The angled header section of the JHM website features a background video.

In collaborating on this project, Kenny and I followed the same phase cycles. He created the website design. When it was approved by the client, he sent the final design to me and I started developing the website in Webflow.

Here were our takeways:

  • As a designer myself, I understand how each design decision -- the spacing between elements, the size of text, where a sentence breaks into a new line -- are all purposeful and important. At the end of the project, Kenny said it was a relief to work with someone who thought like he did and tried to realize his vision.
  • I could see in real-time how content responds to the design. Take staff names. Once I added every staff member to the content management system (CMS), I could make sure that the website had adequate space for everyone's names.
  • JHM can easily edit and add content by using the Webflow editor and CMS. If they need to change a photo, change out some of the copy, add a new teammember, or upload a new blog, they can do it all without having to wait on Kenny or I to make the change for them. Kenny and I have both used Wordpress' CMS and found Webflow's system much more user-friendly.
  • I could implement Kenny's feedback with him in person so that he could see the impact of changes he wanted to make. This one is important. There's always a difference between how a website looks in a design file and what it looks like live. On almost each web project I've been a part of, once I see the site live, there's changes I want to make to make the website look and function better.
Kenny's design called for a hover state on each cell of the services grid to guide your focus.

More Work | View All

Counsel Creative Website Development - Home Page Desktop
Counsel Creative
Feb 11, 2019

After growing from a team of 2 to a team of 11, Counsel Creative was ready to elevate their website from a Squarespace template. I developed a fully custom experience based off of the design they provided.

Logo Design
Web Design
Web Development
Print Collateral
The Truth Project - Website Design - Mobile Hero
The Truth Project
Jan 23, 2019

Ruth Samuelson was a remarkable woman, Christian, wife, and mother who served in the North Carolina House. After her death, the Truth Project was built to honor her legacy and to encourage and edify others through the examination of her impactful life.

Logo Design
Web Design
Web Development
Print Collateral
Elizabeth's Moving and Storage - Website Design
Elizabeth's Moving and Storage
Jan 18, 2019

Elizabeth's emphasizes high quality care. They wrap and inventory every item they move. But, their website didn't match that brand value. We designed and developed a new website that elevated its professionalism.

Logo Design
Web Design
Web Development
Print Collateral
The Truth Project - Website Design - Mobile Hero
The Truth Project
Jan 23, 2019

Ruth Samuelson was a remarkable woman, Christian, wife, and mother who served in the North Carolina House. After her death, the Truth Project was built to honor her legacy and to encourage and edify others through the examination of her impactful life.

Logo Design
Web Design
Web Development
Print Collateral
T-shirt design for the Chattanooga Fellows
Chattanooga Fellows
Apr 2, 2018

The Fellows needed to expand their branding. Their logo, a wordmark in a lovely serif typeface, was simple and it needed a little more presence for marketing. I created a suite of badges and a simple monogram to expand the brand.

Logo Design
Web Design
Web Development
Print Collateral

Start your project.

Every project starts the same way. I ask questions, get to know you, and delve into the challenges you face. My crticial thinking roars to life and I envision what we will accomplish together.

Send a message