Design Process: The Trinidad and Tobago Energy Conference Website

October 26th, 2009 • 2

The South Trinidad Chamber of Industry and Commerce approached me earlier this year to begin working on the website for the Trinidad and Tobago Energy Conference 2010 website, having successfully worked on the 2009 website. This year the process was much more involved because they were rebranding it from the “Trinidad and Tobago Petroleum Conference” brand that was used for the past few years.

New Branding

I worked with the STCIC on the rebranding process. They felt that having Petroleum in the name was a throwback to a few years ago when oil and gas were the only energy sources covered by the conference. However, more recently, alternative energy sources were included in the various workshops and represented at the Tradeshow, so they needed to raise awareness of these areas.

We thought about branding it the “Caribbean Energy Conference” in the early stages as it is the largest regional gathering of energy and energy-related professionals, but, among other things, felt that changing it from “Trinidad & Tobago would be too much of a departure.

We decided to work with nocturn, a Romanian design agency, for the visual side of the new branding. They have an inspiring portfolio and we were confident that they’d be able work with us to create something attractive, suitable and effective for the conference. We wanted to give them as much room as possible for their creative work while giving them enough of an idea to guide them along the process. After passing on the 2010 Conference Rationale, we gave them some ideas of what we were looking for in the new logo:

  • Clean.
  • Modern.
  • Technological.
  • No national branding. A lot of the identity work for Trinidadian firms use the red and black national colours and we felt that that visual style was becoming overused. We wanted something a bit more unique.
  • Should have a Caribbean-like feel to it.
  • Green is the focus: sustainability and good business practices
  • The delegates also come from all over the world and we want to showcase this a bit more.

We also pointed out some of the previous work that they had done that we liked to give him a good idea of what we were looking for, but advised him not to stay within those boundaries.

While I wouldn’t be able to show you the entire work in progress and how we arrived at the final decision, here are two earlier iterations:

cec

This is one of the earlier versions, when we were still considering the “Caribbean Energy Conference.” While we felt that the typeface used was a perfect fit, we had by then decided to continue using “Trinidad & Tobago” in the name.

cec2

This iteration saw nocturn using a very fitting phoenix analogy for the conference, clearly referencing the new alternative energy sources that had become part of the conference in the recent past. However, this gave us some ideas which led to the final version:

ttec

At this point we decided to use an idealized image of the hummingbird which is closely associated with the Caribbean and Trinidad & Tobago. The various colours represent both the different sources of energy that are discussed and the diverse backgrounds and nationalities of the delegates.

The new website

The online strategy for the conference had 3 facets:

  • Registration and other forms
  • The website itself, offering information about the conference, the tradeshow and the workshops.
  • A newsletter

Registration forms

A large number of delegates are usually members of the STCIC, so to make the registration process more streamlined and to avoid them having to re-enter information that the STCIC already has on record we needed a highly customized registration process. None of the existing solutions for event management offered this capability so we had to build it ourselves and sync it with the STCIC’s database. I used Wufoo to get the layout and structural markup for all of the forms that we needed and Tom from 47ideas did an excellent job syncing with the STCIC database and working his javascript magic to make the forms as intuitive as possible and easy to work with.

The website

While this process was going on I was working on the design of the website itself. Having worked on the previous year’s site, I was already quite familiar with what was required, but that didn’t stop me from doing some more research on best practices when it comes to websites for conferences.

I’ll take a moment to add that Elliot Stocks‘ book Sexy Web Design: Creating Interfaces that Work is based around creating a website for a fictional conference, so this would be especially valuable to anyone working on this type of project. However, I wasn’t able to do much more than brush through it before I started work on this project. I’ll finish it soon and post a review.

We figured out that conference attendees, and more importantly for our target market, companies that pay for their employees to go to these conferences, are interested in the Speakers that will be there and the Schedule of activities. They also needed to know the date of the conference from very early on for budgeting purposes and scheduling of other activities. With this information in mind I quickly made a very rough sketch with pencil on paper of what I thought it would be suitable, and then moved to Photoshop to finish a basic wireframe using Jason Santa Maria’s excellent Grey Box Methodology and a 12 column grid.

wireframe1

One thing I thought that could be improved from the previous year’s site was the highlighting of the three different aspects of the conference: the Conference itself, the Workshops and the Tradeshow. So I gave this information much more prominence along with the dates for each and links to learn more.

Another big highlight for the conference is the Featured Speaker so this information had to be presented very clearly and I gave it a bit more prominence than the other speakers.

I had a pretty solid idea of the colour scheme that I wanted for the site – something a bit more informal and less corporate-looking than the website for the STCIC itself which I had finished a short while before, but still professional. So with that in mind I quickly moved on to the final design:

ttec_site

I just made a few additions:

  • Highlighted the Register button to make sure no one misses it.
  • Added the dates to each part of the conference
  • Removed the little blurb from the masthead as it was going to repeat some of what was in the description for each part of the conference, but more importantly, to reduce the vertical height of the masthead to that users could get to the res of the page much more quickly.

The Newsletter

I then designed and built a similarly branded newsletter for the STCIC to use in their email marketing efforts:

newsletter

So that’s about it, turned out to be a bit longer than I anticipated. If anyone has any questions about any aspect of the project feel free to ask in the comments.

Filed under Design.

Follow me on twitter and subscribe to the RSS feed.

2 Responses to “Design Process: The Trinidad and Tobago Energy Conference Website”

  1. lesemu April 7th, 2010 at 2:22 pm

    Nice of you to share your design process. I really like the idea of not using the cliched and overused local instrument ‘the pan’ and the red and black but still including something local.

    Again great job.

  2. tony April 7th, 2010 at 3:12 pm

    Thanks Leon!

Subscribe to RSS Feed

RSS feed