How To Put Together A Website Project Plan

Over the past few years, I’ve put together website project plans for National Councils and committees that details our path to a successful website build and launch. I worked on the designs for the current Kappa Kappa Psi and Tau Beta Sigma national websites. Through those experiences, I have discovered a process that works well for me. Creating a plan and presenting that plan is important to do before starting any massive project. It is especially crucial when working with multiple people. The general 5 steps that I typically lay out are the following: setup/strategy, content gathering, design, testing/approval, and launch.

Setup/Strategy

First and foremost, it is paramount that everyone involved know the purpose of the website and the target audience. None of the remaining steps can even begin until everyone is on the same page. Here is where the north star is established. The particulars will need to be discussed. What content will the user need to be able to access? What content is of highest priority? We need to create and agree on an initial sitemap. The sitemap establishes the hierarchy within a website. This helps in creating the menu and information structure. Speaking of structure, I usually suggest setting up a Content Management System (like WordPress, for example) at this stage.

Content Gathering

Once we are all on the same page, we can begin gathering content. You know what you want to display on the site. Now, it’s time to get all that information. Making content gathering its own stage allows you to do inventory and double check the accuracy of the information. It’s much easier to correct any mistakes here before getting lost in the fully designed website. Also, content doesn’t just refer to the information but also any visual assets that need to be gathered or created.

Design

This is where we finally populate the site when all the content that has been collected. We’ve set the table. Now, it’s time to put the food on it. You’ll be designing the website with the sitemap in mind as the structure and populating it with the content collected. Obviously, outside of launch, this is my favorite stage. It is here where the aesthetics and functionality are put together to create something great.

Test/Approval

After everything has been designed, it’s at this stage we test everything. We’ll need to click all the links, make sure everything works properly, and make sure nothing crucial is missing. At this point, we may show additional parties the website to see if it works as it should. At this stage, it’s often necessary to get fresh eyes on the site. You’ll want some people who haven’t been looking at this project for months to give it a look. It might be good to get a sample of your target audience to see if it works for the user you had in mind.

Launch

We have finally arrived! This starts the official countdown to releasing this thing into the wild for the world to see. For the Kappa Kappa Psi national website & the Tau Beta Sigma national website projects, this is where we transferred our work from development to the live server. Once we confirmed everything was working to our liking, we took off the countdown/dev splash pages and went live!

The best way to lay out this process is to work backwards from the desired launch date. Give each stage more than enough time to be completed. It’s always better to finish early than to be scrambling late. Laying the entire plan, with dates attached to each, is great for tracking progress and accountability. Plan, prepare, and present like a professional.

~b.

Case Study: Tau Beta Sigma Coda Program

Last week, I broke down the Kappa Kappa Psi Centennial Logo. Today, I break down the logo design for the newest Tau Beta Sigma National Program, the Coda program.

Have I mentioned I love my job? The opportunity to brand various initiatives of the Fraternity and Sorority is one I cherish.

Tau Beta Sigma National Honorary Band Sorority is an organization dedicated to the service of collegiate bands and the promotion of equality and diversity.

The sorority operates primarily as a student service and leadership recognition society whose chief aim is to assist the Director of Bands in developing the leadership and enthusiasm that they require of their band. Our goals are not only to provide the band with organized and concentrated service activities, but to give our membership valid and wholesome experiences in organization, leadership, and social contacts.

-from tbsigma.org

The Coda program of Tau Beta Sigma encourages sisters to work with the elderly population through music. It is similar to the Crescendo program but the Coda focuses on the elderly rather than youth.

Coda is a common musical term for the concluding passage of a piece or movement, typically forming an addition to the basic structure.

The program’s purpose is to focus on cultivating and continuing musicianship and music appreciation during the “concluding passage” of life.

from the Coda webpage on tbsigma.org

With the Crescendo logo, I analyzed the crescendo symbol on sheet music and thought about applying that inside the logo.

The final approved logo referenced the musical term, “a gradual increase in loudness in a piece of music”, by making each letter larger than the next. With this project, I took inspiration from the name Coda and immediately analyzed the coda symbol in music.

I recreated the general shape in Adobe Illustrator and added custom laurel leaves on the shape. On the inside, instead of just having 2 straight lines intersecting, I played with the idea of placing a baton in the middle. The baton is seen throughout the official Tau Beta Sigma visual brand identity, which I also worked on.

I was right on the money with the direction I went, according the National Council! They asked me to extend the axis of the lines to mimic more of the traditional coda sign and try the baton pointing up instead of down.

 

Making those changes really enhanced the overall visual. Extending the axis of the lines made the reference to the musical coda symbol more concrete. The baton is now pointing up from a more active perspective. The text below the logo is in the Playfair Display font, one of the official fonts chosen by the Sorority for use. After all the adjustments were made, the logo was approved!

Purpose driven design will always be my favorite thing to see and do.

~b.

How To Create Visual Brand Identity Guidelines

I have written about why organizations and companies have brand & style guidelines and the steps to building your own visual brand identity. Now, I would like to take you through a recently finished identity project for Tau Beta Sigma National Honorary Band Sorority.

Tau Beta Sigma is a co-educational national honorary band sorority dedicated to serving college and band programs.

Tau Beta Sigma operates primarily as a student service and leadership recognition society whose chief aim is to assist the Director of Bands in developing the leadership and enthusiasm that they require of their band.

Crafting a visual brand identity is not an easy task, especially when you doing it for a large national organization rich in history, relevance, and influence. These visual assets will help tell an important story and must resonate with sisters (active and alumni), the band community, and the public at large. Getting to this point involved conversations, directives, and insights from the National Council, Board of Trustees, and the Alumni Association. This playbook will educate sisters on how to properly communicate the mission, message, and personality of Tau Beta Sigma.

Continue reading “How To Create Visual Brand Identity Guidelines”