The new LCMS New Jersey District website

We recently launched a redesign and re-implementation of the website for the New Jersey District of the Lutheran Church—Missouri Synod (LCMS).  They had a district convention coming up in June and they wanted to overhaul their site in preparation for that event.  The project spec had three main objectives:

• A visual redesign with a more professional look
• An easy-to-use content management system to allow the district office staff to be able to easily add and update the site content
• The ability for the district staff to continue using their existing web-based tools on the new website: Picasa photo galleries, Google calendars, Constant Contact e-newsletters, email, etc.

The original LCMS New Jersey District website

We broke the project down into four phases:

• Site re-organization and information architecture planning: The original website, after years of organic growth, had inconsistent organization of its content.  Working with the district, we planned out a new top-to-bottom re-organization of all the site pages, divided by category.  For instance, “Missions,” “Stewardship,” “LWML,” and “Conferences & Conventions” were all moved into sub-pages of “Ministries.” We also planned out the major content and interface elements of each page type: Homepage, Menu pages, Body pages, Blog pages, etc.
• Graphic design, layout, and look-and-feel: We produced several proposed mockups of a redesigned homepage layout and discussed them with the client.  Once we had the homepage visual design finalized, we used it as a basis to design the other site pages.
• Building XHTML/CSS Templates: With the look-and-feel for all the site pages planned out, we built XHTML/CSS templates for each of the major page types, ready to be implemented into a content management system.
• Implement the site on a suitable content management system: We researched various content management systems that would be powerful enough to meet the needs of the client, but still simple enough for them to be able to easily pick up and use.  In addition, due to budgetary considerations, we also wanted to use an open source solution.  We ended up selecting SilverStripe, an open-source, PHP/MySQL-based system. Daniel Bergquist handled the development and implementation of the site, converting our XHTML files into SilverStripe templates, and building in all the functionality that the site needed.  We wrote additional CSS as needed to cover all content contingencies, and corresponded with the client during the process.

The design for the site's menu pages

The design for the site's body pages

The new site launched on June 3, 2009, just in time for the district convention.  It was the biggest site that we’ve worked on yet, both in size and functionality.  It included such things as embedded Picasa photo slideshows, an embedded calendar, a dynamically updated homepage news feed, and multiple blogs with RSS feeds.  You can see the finished website here:

www.njdistrict.org

Free e-Book: Search Engine Optimization Fundamentals

You have a website, but is it getting found? Find out what you need to know about search engine optimization in our free e-book.

Download Now

The finished ARMY360 logo

Recently we pulled out some of the doodles we had made as we was brainstorming the visual identity of the ARMY360 software application for InVisM and figured we’d share some of them on our website.

As stated in the project description, the design spec simply listed the product name and called for an ellipsoid, “360°” shape.  Given that this application was built specifically for the US Army, we turned to imagery of military crests, medallions and patches — such as these — for most of our brainstorming.  We also added in part of the application interface — the 360° directional marker — and added it to the center of the image.  The bottom center sketch below became the basis for the final logo.

Various sketches made while brainstorming

Free Download: Website Fundamentals

Download our free e-book to learn what you need to know about building effective websites.

Download Now

Peter Strom's official website

We recently launched the official website for Peter Strom, a Denver-area singer and guitarist.  The site’s main purpose is promotional, with a short introduction, Pete’s repertoire, client testimonials, and song samples, with a call to action to a contact form.  As it is a small site, we were able to spend some time making a more complex and visually interesting layout than would be possible for a large, content-heavy website.  In particular, we focused on pushing the CSS code to create higher-end typography usually only seen in print media.  The visual design is based off of the logo and color scheme we designed for Pete a few years back.  We were also able to take the time to build some nice illustrative effects on the navbar buttons as well.  It was a fun project and a good change of pace from some of the larger website projects that we’re currently working on.

The official logo for InVisM, Inc.

This past six weeks has brought a lot of big changes around here. In addition to some big projects such as the ClearPivot logo and accompanying website design and some other projects we haven’t yet talked about, the biggest recent news is that I (Chris Strom) have accepted a full-time position as Senior Graphic Artist at a company called InVisM.  InVisM (formerly called Intelligence Gaming) is a Denver-based startup company that makes simulation and training products.  Our clientele up to now has been primarily in the government and military, and now we’re beginning to branch out into the commercial sector. The company has very aggressive growth plans, and—despite the state of the economy right now—is actually well on the way to achieving those goals.

So what does my job as Senior Graphic artist consist of? Maybe a better question is: what doesn’t it consist of? Since I’ve started, I’ve covered the gamut of graphic arts and production: web design, print design, logo and identity design, video and animation design, branding, DVD production, Flash, HTML, XML, jQuery, licensing and copyright issues, you name it.  Heck, I even chose the colors for the wall paint (we are a startup, after all).

I’m still doing some side work that I’ll feature on www.cstrom.com; in fact, I’ll be launching two new websites over the next 4–8 weeks.  And I’ll still update this blog when I can—though, of course, the frequency of updates will slower than before.  In the meantime, come visit our newly launched InVisM website, designed by myself, of course.  I’ll have to write about the design and implementation process for the site—there’s a bit of story behind that.  Maybe in the next one or two blog postings…

www.invism.com

Free e-Book: Website Fundamentals

Download our free e-book to learn what you need to know about building effective websites.

Download Now

Wow, things have been busy around here recently.  Lots of work flying around these days it seems like.  One of our most recent projects was designing the identity, branding and website for ClearPivot, LLC, a Denver-based startup company that specializes in marketing metrics and analysis applications.

CLEAR = transparency in numbers, encouraging other parties to view and interpret the data, not hiding anything; open
PIVOT = swiveling from the data to the business (& back); the data provides information on the programs which in turn should align with the business goals; flexible; versatile
CLEAR + PIVOT= CLEARPIVOT

First part of the project was designing the corporate logo.  Working with ClearPivot’s CEO, Greg Davoll, we worked up many different possible logo drafts and discussed them with him.  During the creative process, we started out with rather complex logo design drafts but gradually began migrating towards more minimal, understated designs that concisely expressed the meaning of ClearPivot.  Finally we arrived at the current logo:

The final ClearPivot logo design

The clean simplicity of the logo illustrates the clear, open and transparent nature of ClearPivot’s product and business philosophy. The stylized “P,” of course, represents swiveling and pivoting, illustrating ClearPivot’s marketing metrics philosophy of aligning marketing data with business goals, which in turn pivots back to more marketing data.

After the logo was finalized, the next step was designing and building the website.  (As the web is increasingly becoming the foundation of companies’ marketing strategies, corporate websites are more and more the first priority when building a marketing campaign, second only to the brand identity itself.)

As with the logo, we increasingly focused on producing a clean, understated, yet still eye-catching site.  We decided on a color combination of predominantly white, gray and blue, (with a few other highlight colors for good measure) and a very organic feel in the visual forms.

The homepage for www.ClearPivot.com

The website is both visually and structurally flexible enough to grow with the company—as ClearPivot expands its range of products and services, so too can the website expand with additional content.  In addition, we paid special attention to the top banner on the homepage: focusing on bold marketing points, an attention-grabbing visual design, and strong calls to action (See It, Try It, Contact Us).

So come check out ClearPivot at www.ClearPivot.com.  As always, we’d love to hear some feedback: you can write to us on our contact form, or just leave a comment below.

Free e-Book: Search Engine Optimization Fundamentals

You have a website, but is it getting found? Find out what you need to know about search engine optimization in our free e-book.

Download Now