A great way to improve your website’s user experience is by choosing one element of your website design and customizing it with something delightful. 

Here are three examples:

  • Body copy. Get a copywriter to write out-of-the-ordinary copy that will make the user laugh or maybe even move them in a powerfully emotional way. It doesn’t have to be a large paragraph. Even a well-written three word Call-To-Action in a button can make a big difference.
  • Imagery. Hire a professional photographer who is capable of giving your photos a certain style or mood. When the imagery on your website is cohesive, it makes the design look professional and thoughtful.
  • Interaction. Have your website respond to the user’s behavior in some way. As they scroll, an image appears. Or, when their mouse scrolls over an image, the image rotates to face the direction of the mouse.

Unique buttons for a Chattanooga Church’s Website

Recently, I’ve been working on a website design for my home church, New City East Lake. When I first started developing the website, I made two standard buttons for the header section. They had a color fill and, when you hovered over the button, the colors would darken slightly. Although the colors of the buttons were fun and lively, there wasn’t anything new or exciting about the hover state interaction.

So, I started thinking about ways that I could make the buttons more unique.

My mind wandered to the large sign that sits on the front lawn of the church. The sign features a pattern of staggered rectangles at the bottom. With its prime location on the corner, anyone who has driven by the church has seen this sign. Members will likely have seen it dozens if not hundreds of times.

The sign on the corner of NCEL's lawn

I created a button that appears to be a standard button. But, when your mouse hovers over it, it breaks up into 5 different rectangles with staggered heights, mimicking the pattern on the church’s sign. 

The button on the right shows the "hover state"

  

This interaction is just a small part of the website design. But, it’s something unique that will hopefully engage the user and excite them about exploring the rest of the site.

Don’t take my word for it. Visit the site yourself and try hovering your mouse over the button. Interested in how I created this interaction? Watch the video below that details the process.

 
Why a turkey?