DesignAudit.net

Design Blog using Express Engine

My good friend and superb designer Kerry Layton wanted a nice, clean blog where he could dip his toes into the world of blogging. We had this site up and running within a day, and launched on New Years Day with a collection of calendars to start the year. Check it out.
» launch site | » click to close

Hollyberry Baking Shop

Shopping Cart using Magento

Just in time for the holiday rush, we launched a new, easy to navigate and use shopping cart for Hollyberry Baking. I found Magento a nice platform to work with and it has been a solid solution for Holly integrating closely with her shipping workflow. Design by Marcy Hawley.
» launch site | » click to close

Resa Design Shop

Shopping Cart using X-Cart (OSCommerce)

Resa's success overran her capacity to manage a PayPal shop, so we took her business to the next level with a full featured web store and SEO implementation. Unfortunately the store has exponentially increased Resa's business. Ooops, so sorry Resa. ;-)
» launch site | » click to close

Northstar Church

New Site Design, SEO Update, and News Blog

I stepped in and helped Northstar implement a fantastic design while also updating their SEO. The home page has a nice rotating feature leveraging some cool Flash and Ajax action. Wordpress powers their current news feed. The beautiful design is the handiwork of Becky Siegrist.
» launch site | » click to close

[AC] Advent Conspiracy

Site using Expression Engine

Advent Conspiracy wanted an easier and more flexible solution for their high traffic site. With Boxing Clever, we launched this EE website and tied into social networks such as Flickr, YouTube and Facebook to help spread the word about fresh water wells for impoverished people groups.
» launch site | » click to close

@xtyler pay attention and learn something! ;)  11:23 AM 03/10/2010

Case Studies

News Sites Launched This Weekend for DAWC and Blaine Bartel

image

Client: Dental Assisting of West County
Website: http://www.dentalassistingwestcounty.com
Design: Kerry Layton
Platform: Expression Engine
Notes: used the Freeform module from Solspace to handle info request, registration, and contact forms


image

Client: Blaine Bartel, Pastor of Northstar Church
Website: http://www.blainebartel.com
Design: C1Design
Platform: Expression Engine
Notes: used Better Meta and Social Bookmarks from Leevi Graham, Tags from Solspace, and the Twitter plugin.


Categories: Case StudiesExpression EngineGeneralPermalink

Case Study: Shape Shifters by Derek Vreeland

Client: Dr. Derek Vreeland, author
URL: www.derekvreeland.com
Design: Kerry Layton

Overview
The site promotes Derek's first book "Shape Shifters" which he is self-publishing and, of course, self marketing. The site introduces the book, provides a free chapter, showcases endorsements and speaking events, and sells. Search Engine Optimization was of primary importance, as it almost always is.

For the CMS of the site I once again used Expression Engine. This tool really is a huge time saver and has been able to handle every challenge I've thrown at it. I have to actually remind myself that I can code PHP with it if I really want to; I just haven't found many cases that warrant it.

What Expression Engine is doing:
- the home page features some news items which come from a custom weblog and is available via RSS or Atom
- the Speaking Engagements form is a Solspace Freeform form
- the Contact form is a straight forward EE email contact form
- templates are constructed in distinct template groups, and common elements are brought together via sub-templates using the {embed=template} tags

I haven't stressed too much about the templating strategy I've used so far, primarily relying on the use of the embed tag, but I still feel like I'm doing old school ASP include tags. I would much prefer a solution more akin to the master templates in ASP.NET. Like I said, this works so I haven't stressed to much about that.

Derek currently blogs via Blogger. In the future we may bring that in to Expression Engine also.

Paypal to Sell
Derek has one product. While the book is carried at Amazon, Derek stands to make a little more if he can sell the book directly. To that end we simply setup a Premier Account (which you may upgrade to from a personal account). This allows him to accept most any payment type. Within Paypal he generates a button for the book which goes on his product page. Paypal handles all the shopping cart and payment services as well as allowing Derek to easily generate shipping details for labels and tracking.

I've been doing quite a bit of e-commerce lately and I still love the simplicity of the Paypal model for this kind of thing.

Couple More Technical Bits
I took the opportunity to utilize a couple of new techniques that I have been finding to be very useful. I deal with each of those in subsequent, short postings.

Transparent PNGs
CSS Menu Image Rollover Menus
Scrolling Text Box


Categories: Case StudiesExpression EnginePermalink

Case Study: Advent Conspiracy

Client: Boxing Clever (agency) and Advent Conspiracy

URL: www.adventconspiracy.org

Design: Boxing Clever


Overview

Advent Conspiracy is an organization that promotes a spirit of giving during the holiday season; specifically giving to Living Water International, a group that digs water wells in impoverished nations providing fresh, clean water where dirty, diseased water is the norm.



The core call of the site is the "Enter the Story". The site promotes stories from contributors who are directly involved with this effort around the world. Theses people, whether individuals, churches, or organizations register on the site and submit their story with accompanying photos. Those stories are then plotted on a world map for everyone to share and from which to gain inspiration.



Here's a quick rundown of the functionality:



- Content Management (CMS)

- News blurbs on home page

- Video feature on home page and Videos section

- Membership with special registration

- Story display via world map

- Story management form

- Blog w/ RSS & ATOM

- Opt-in subscription



There are also some workflow issues pertaining to the user registration and story submissions that are handled by the site administrators.


The Tools

We chose to leverage the flexibility and extensibility of Expression Engine for the site, and I'm very pleased with how this turned out. EE, along with very cool modules, extensions and plugins that were employed to make this site work, powers the site itself, the news, the blog, the video section (which is Flash FLVs and/or YouTube), the story data, the registration and membership, and the CMS needs.

For the map and story syndication we ended up going with a Trippermap + Flickr mashup. We researched a variety of mapping solutions and considered Google maps as well as building something ourselves. While the developer in me would have loved to tackle a Google mashup or developed a solution more from the ground up, we just didn't have the time and resources in this project to tackle that. Adding a Flickr account and admin to the mix is an added level of management, but it works well with the necessary workflow at the client to approve and manage the story entries and photos.

So, that's the high level pass at this site. Check it out. [AC] has some great content, especially the videos and brochures in the resources section.

In upcoming posts I'll dig deeper into how these features were implemented.


Categories: Case StudiesPermalink

Case Study: Northstar Church

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.


Categories: Case StudiesPermalink

Add a Comment