Designing Fan V Fan

A while back, Dorkshelf.com published a little internet review show I created called Fan V Fan. Designing a simple aesthetic was a fun challenge and I’d like to share my thought process..

Fan V Fan is a entertainment review show. Right now, we’re reviewing CW’s new series The Flash. Check out the intro:

I planned for the overall design to be unspecific and minimalist so that we could transfer it to review other series (other than The Flash) without having to redo the work.

Once we had our rival fans (a comic book geek and television writer), I started thinking about the intro and how to best to explain the show’s concept in the shortest amount of time.

comic book colour horz

I decided to put the hosts faces in the intro and I wanted a simple visual way to represent their areas of interest. For Diana, I took a page from a comic book and covered the frames with colour. Even without any characters or dialogue, the layout of the shapes suggests that this is a comic book.  For our writer, there is a similar arrangement of colourful rectangles that many of us still associate with television.

color_bars_1121

Because the backgrounds were so colourful, the hosts’ headshots were made black and white and I added a bit of noise.

Diana cutout

I wanted the intro to not feel as cheap as this show is so I added some movement: the background moves left to right, Diana moves against it from bottom right to top left, and the text provides a reference point by remaining stationary.

Diana intro all elements

The last image of the intro is the title of show. I wanted the title to make an impact and after all those colours, monochrome seemed to be the way to go.

White on black was too boring and I decided to break up the two FANs with a little pop of red.

intro-fvf-red

Adding red was a small but impactful choice in a very sparse design. I really liked the colour scheme and used it for the chapter cards that you see throughout the episode.

All title cards

I still wanted a logo, something to break up the names on the intro banner. Combining the Fs and V was my first idea but it still took some time to figure it out.

FVF LOGO early

Should there be lines separating the letters? Should it be slanted like the text in the show? Should there be a circle or some other shape around it? Ultimately, I decided simpler is better and discarded most of those ideas after trying them. This is the final logo:

fvf logo on black

I love how simple this is and how many levels it works on: it’s a logo; it has the initials of the show in it; it still looks mostly like a V (sometimes the abbreviation for versus); and it’s actually functional on the banner, reading like ‘Diana McCallum V Ian MacIntyre’.

LOWER THIRD NAME BANNER

A question that fans of FVF sometimes ask is, what is the music used on the show? Except for the intro which is stock music, they’re songs from The Presidents of the United States of America.

The clip used for the Pro and Con title cards is the guitar scrape from Kitty (the Cons clip is reversed). The clip used for all other segments, including the credits, is from Kicked Out The Jams. At the end he’s saying, “We done kicked ’em out!’

Why? I like the band and I was looking for something to pick up the energy since the show was mostly two talking heads.

It was a fun challenge and there are a few things I would change  were I doing it again (There should not be an S in the show title; the font near the headshots is different from the show font; I wouldn’t make it generic at all, but incorporate design elements from The Flash).

Regardless, I was proud of how it turned out. It’s simple but interesting and people compliment me on it without knowing I put it together.

Thanks for reading!