New Team Colors Format: Behind The Scenes

As most of you have seen by now, I have been completely revamping the entire team colors sections of my site. Within the last couple of weeks, I have reloaded all of the professional leagues in all sports, and have made hundreds of changes to the way color palettes are now being displayed.

1994 MLB Pantone Textile Physical Color Swatches

1994 MLB Pantone Textile Physical Color Swatches

Collaborating with the developers at Mad City Coders (madcitycoders.com), I was able to incorporate a custom WordPress plugin for my site that allows me to simply insert the desired color elements into HTML using short codes, and alleviating the need to generate and maintain thousands of images. For years now (at least since 2001 or so), I have been spending hours upon hours just generating all of these color swatch images for each individual palette; the professional franchises alone had over 8,400 of them! Now, I had created a fairly decent method of maintaining and tracking all of these images – which palettes had been generated, which ones were needed, which leagues required a site update, etc., but it was still quite a daunting task. Not to mention the headaches that would ensue when I changed something in the format of the swatches – especially something that was a global change to the overall look. My OCD would require me to start all over and regenerate them again.

For the most part, the actual displayed data is the same – I am still just displaying Hex and RGB information for most leagues – but in my mind, the data is much cleaner now (at least visually), and it is now easier to compare palettes on the same page. For example, here’s an example of a color change that was sometimes difficult to see with the previous format:

New Orleans Hornets - Color Swatch Compare

New Orleans Hornets – Color Swatch Compare

As you can clearly see here, between the 2007-2008 and 2008-2009 NBA seasons the Hornets changed their Teal color to something called “Creole Blue”…however, this color was often still referred to as Teal (a lot of people didn’t realize it was a different color), but when you see it side-by-side with the previous palette, the difference becomes fairly obvious. (Not to mention the darker Purple.)

Some of the other advantages to this new format are the following:

  • The flexibility of how the data is displayed – I can run these for any number of different ways – just display the Hex and RGB, or generate them to include Pantone and CMYK information if desired. The USFL and XFL pages both reflect this alternate format that includes the Color Description, plus the Pantone/PMS value, Hex value, RGB values and CMYK values. I have been displaying Pantone info on these two leagues for a long time now, and am still using the two of them to showcase this more detailed view of the data. I can also now easily run off an entire league showing the colors as they would look on uncoated or matte paper stock…or, using process values (coated or uncoated)…or even textiles (if provided). AND…I could have separate pages showing the custom RGB values a number of leagues tend to use as well. (NBA, NFL, MLB.)
  • The “cleanliness” of the presented data – because I have been using Microsoft Access reports combined with the use of SnagIt to capture the Print Preview of the resulting report run, the text was badly pixelated, and not always very easy to read – especially if I needed to include some descriptive text for an individual swatch. In addition, those of you who want to use the Hex values in a concept, you can simply copy-and-paste the value into whatever graphics package you’re using.
  • The aforementioned ease of updating – since it is so much easier for me to make changes and update the site, I now have more time for all of these other projects I keep promising and never seem to have time to deliver. I plan on addressing them (again) in the near future. However, the process now requires me to flag any record that has been changed, and then a utility I built tracks each league requiring an update. Since I now generate whole leagues at a time, I can generate the HTML code for the league, copy in the code to the site, and run an update on my database to “unflag” the updated records. In most cases, a league update takes 2 or 3 minutes to complete.

I should also mention that I have updated a couple of other pages using this new plugin – the “Pantone’s Color of the Year” page, which displays the color information for Pantone Textile colors, including the color value and color description along with Hex and RGB values, and the “Tiny PMS Match – Color Palettes” project, which now uses the new format and includes Pantone/PMS values, Hex, RGB and CMYK values.

As a reminder, here are some of the things to keep in mind about these color palettes:

  • All colors are based on actual Pantone/PMS values (unless designated as a “custom” color). If a color is an estimate (now, indicated by an asterisk – * – preceding the Hex and RGB values), it is still based on an existing Pantone/PMS value, and the resulting Hex and RGB reflecting the corresponding color value.
  • A colors are reflective of the current Pantone standards for representing colors in the sRGB color space on coated paper stock. As I mentioned previously, I do have the ability to run entire leagues on other substrates (digitally speaking, that is), but by-and-large, coated stock is the standard I will be implementing.
  • Black continues to be represented using “RGB Black” – RGB: 1 1 1. I have mentioned this before, but for displaying the color Black on screen, using a “pure” or “rich” Black makes so much more sense than using PANTONE Black C or PANTONE Process Black C, since they show up much lighter when converted to digital formats. Certainly, one would be required to use Process Black (or another form of CMYK Black) for four-color printing! You would only want to use “RGB Black” for digital usage.
Los Angeles Kings (NHL) Brand Style Guide - Circa 1999

Los Angeles Kings (NHL) Brand Style Guide – Circa 1999

What about the College Colors & Nicknames section you might ask? Well, of course I am in the process of converting over to this new format, and hope to have it available as soon as I can get it ready, but I am also making a significant change to how the data is presented – I am going to begin to separate out all schools by Athletics Division (NCAA Division I, II, III, etc.) and by conference as well. (Getting rid of the “Four-Year Schools beginning with the letter ‘A'” kind of thing.) There’s a bit of data to clean up with that as well as writing a few new reports, but it shouldn’t take me too terribly long. I’ll provide updates as I go along.

I would also be remiss if I didn’t give a shout-out to the makers of the “Collapse-Pro-Matic” WordPress plugin that is so important in how this data is presented. This tool allows me the ability to incorporate the short codes in to the HTML in order have all of the palettes collapsed, and allow the user to open and close each one in whatever order is desired. I can’t imagine how each page would look if this plugin wasn’t used!

Please, please, PLEASE let me know what you think of all of this. Of course, I’m STILL not where I’d like to eventually be with presenting this data – it still needs to be dynamically generated from a database residing on the web server that I update with some sort of batch process, but I’m getting there. Baby steps I suppose.

 

SaveSaveSaveSaveSaveSaveSaveSave

SaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSave

SaveSave

SaveSave

SaveSave

SaveSaveSaveSaveSaveSaveSaveSaveSaveSave

SaveSave

SaveSave

SaveSave

2 comments

Leave a Reply