Blog

The Door Logos

A few variations of logos for The Door Church.


Walking Along

20110915-073736.jpg

The Door Church

I just finished up a redesign for our church, The Door. They asked me to design the first one based on a design concept already in place, but this time all I got was this picture and a request to make it feel more like a church in the suburbs. Based off of the image, I came up with a color palette and then wanted to give the site a little texture to complement the one found on the walls in the picture.

The site still runs on WordPress and the theme is modified from the HTML5 Reset Theme. The upcoming events are handled through a plugin called Events that turned out to be very flexible and will come in handy on future sites. The font used in the navigation and headlines is FF Tisa Web Pro with Helvetica Neue for the body text. There is also a dash of media queries thrown in to make it work on all screen sizes.

I used a few inset graphics as design elements to help balance out the content. the banner image of the door went through several different looks and sizes before I settled on this one. I wanted to feature it on the home page, but I didn’t want it to take up so much vertical space that you had to scroll to get to actual content. Unfortunately the trade off there was that it couldn’t stretch the width of the site.

One of the things I recommended and they agreed was to keep unclear language out of your navigation. For example, the small groups at our church are called Gospel Communities. We didn’t want to use that as the text for the navigation because if someone comes to the site looking to get involved in a small group, they have to guess what a gospel community is since there would be no link for the more commonly-known term — small group. Could someone figure this out on their own? Probably, but forcing your users to guess is never a good usability decision.

The site is still a work in progress when it comes to content as you can see by the small groups page. They are working on a few more things to add. The important things are present and I think/hope well-placed. My most important rule for designing a church website is to make sure the worship service times and directions are prominent and clearly explained. After all, that’s why the majority of people visit a church’s website site.

Check out The Door Church’s Site

Camp Life Application

On September 1st we launched sign ups for 2012. We first started taking applications online when I joined in 2008 and each year I have tweaked the application a little as time has allowed. This year since I didn’t spend the entire summer in Zambia, I had some time to really rework the application. It is a really important part of our site, because most people are introduced to our ministry by going to Camp Life. That means this application is often their first real interaction with us so it needs to go well.

Application header
The header is from a picture taken by one of our ambassadors in 2010. I love the colors and it represents the overall feel of camp: Americans working with Zambian partners to minister to children. I had the idea to extend the picture infinitely by repeating a blank portion of the wall. It took quite a bit of Photoshop tweaking in order to make it not entirely obvious that it was the same thing over and over. It does still need a little bit of work as you can see under the F.

Icons
There are a ton of icons used throughout the application to highlight and break up the sections. The main reason is because people don’t read. The icons tend to draw people’s eyes to the text which explains the next section. Even with this, we have still had people run into problems that are plainly explained.

Steps
The application is pretty long so it’s split into four steps. There is a home page that you go back to after each step in order to see your progress. This page actually is the same page that you see after your application is approved, except it looks completely different. The page is a monster and takes quite a while just to re-acquaint myself with each year. The php document is 1106 lines according to BBEdit.

This is the the video you see on the final submission page. The application can take quite a while especially for a family of five or more. This is their reward…besides a week in Africa this summer working with orphans of course. See the application at camplife.familylegacy.com.