Simplyprofound.com
Flash, Flex, AIR, ASP.NET, PHP, AJAX, whatever it takes...

Case Study: Northstar Church

June 2, 2008 03:02 by dave

Client: Northstar Church
URL: www.northstarchurch.cc
Design: Becky Siegrist @ C1 Design

Overview

Northstar Church has fantastic design and needed to translate that to their outdated website. Currently, they maintain their content with Adobe Contribute. They didn't want to do a complete overhaul of the site implementing a new CMS, and figured a skin refresh would give them legs to make it until next year before pursuing a a bigger project.

Task 1 - Reskin
The old design was circa January 2007 and thankfully was pretty nice box model CSS. The new design matched up well, and with minor tweaks to the template I translated Becky's wonderful design from Photoshop files.

The major addition to the layout was a link laiden footer to provide sitemap-esque access to all content on the site.

Task 2 - Homepage Spotlight
Part of the revamped home page design is a rotating feature section. For this I leveraged Flex to build the flash player that transitions the features, triggers the ajax call that refreshes the matching sidebar content, and provides a controller for the user to toggle between features.

Task 3 - Video / Photo Features
Northstar Church also has fantastic video production and needed a way to present them consistently from anywhere in the site. This is a perfect scenario for SlideShowPro and SlideShowProDirector. SSP not only delivers the content in a skinnable, beautiful interface, but SSPD makes updating and maintaining the content very accessible for Northstar.

Users can browse the entire gallery of media albums, and peppered throughout the site are links directly to specific media. So, if Northstar wants to launch the video popup and play the Vision video bypassing the rest of the content, then they can do just that. I LOVE this tool because it has the APIs that I need to milk the technology, and it has the easy to use interface for my client.

To see this in action hit the Vision Video feature link on the Northstar Church home page

Task 4 - RSS News
As with most churches, you have an abundance of news and events. Northstar Church is located in Frisco, Texas and caters to a tech saavy crowd, so adding an RSS feed was a no brainer. The current hosting supported PHP, and we really needed just a simple blogging solution that could be easily skinned to match the new design. Enter the all famous WordPress. Just like SlideShowPro, WordPress is easy for non-techy use.

Installing WordPress is generally a snap, but each webhost has its quirks. WordPress installation is basically a simple 2 step dance: 1) create a blank mySql database, 2) upload WordPress and hit it. WordPress walks you through the initial config and you've got your blog. This webhost is PowWeb and the problem was that WordPress couldn't connect to the database - bad server address. The control panel didn't have the server address visible and suggestions in the forums were wrong, but after a few emails back and forth with support we had this resolved. I'm so glad I stayed away from the hosting business.

Since we had the main site at the root, it made sense to setup WordPress in a sub directory: http://www.northstarchurch.cc/news/

Task 5 - Spread the Word
With a young, tech strong congregation, Northstar wanted to provide a way to their members to "spread the word" on MySpace, Facebook, YouTube, Flickr, Eventful, and anywhere else they might drop a badge of the appropriate size and shape. 

In addition to website banners, Northstar offers downloads for desktop wallpaper, instant messenger icons, and email banners. When you have great design, why not.

Conclusion

SEO is a key component to any website's life, and we've also done plenty of that. For a simple redesign, I'm very happy with how this has turned out. I'm always evaluating tools to find the best options not only for myself as developer, but for my clients. In this instance WordPress and SlideShowProDirector fit very nicely.