Case Studies Grafisk Formgivare

Case Study – Visual Identity for Kaitlyn

From sketch to outline to final version.

The interview

The very first thing I do when creating a visual identity is to actually have a interview, not about the design it self, but rather the reason for the change and to figure out what the personal brand is. There a lot more than just looking at the personal brand brand but it tends to shape my followup questions. These followup questions are to further get a understand the personal brand, in most cases when it comes to variety streamers on Twitch they tend to not really understand their personal brand or target audience.  Luckily Kaitlyn actually had an idea about both herself and the target audience.

Kaitlyn has very bubbly, colorful and fun atmosphere around her channel on Twitch. Therefor I wanted this to be the very first thing you felt when you saw her visual identity. Didn’t want there to be any confusion over what the viewer is watching I wanted it all to be related able in an instance.

Moodboarding

Kaitlyn moodboard

Final moodboard for Kaitlyn

With all the information at hand it was time to make a moodboard. This, in my opinion, the best way to show your client the direction you want to take. I basically scour the internet for inspiration, I take both color, theme and typeface into account when adding my search terms. A lot of it is a knowledge of design trends and color theory, but constantly keeping the personal brand of Kaitlyn in the back of my head.

The image you see here is the final version of the moodboard. The first version had a few more images. However I like to go over the moodboard with the client to see what works for them and what doesn’t. We don’t really discuss design, but rather the feel and ff the feel is right the design concept comes next. I’ve found that this is the best process there is for both me and the client it will allow us both to be on the same page from the start.

Concept and logo

For those that have worked with me they know I’m both fast and good at what I do. It’s not about rushing out a project but rather that’s just the way I work the best. It allows for a free flowing initial design concept.

At this stage I have two things that I can fall back on as I design. It’s of course Kaitlyn’s personal brand but now I also have the moodboard. If I ever get stuck with anything I can look at the moodboard and take inspiration without leaving the the path we’ve already set for ourselves.

The logo was created in Illustrator using our main typeface and adding the illustrated cat ears that Kaitlyn already have in her current personal brand.

preview-2015-03-31

First version

Both the colors and the typefaces are very clear. I ended up not using Besom or Bizon but rather use Panton for headings and Aileron for all body text. As you can see in the first version there’s a lot of interesting aspects however this is merely a first draft. Everything is also organized in non-destructive way and colors are even easily interchangeable in my setup.

What’s important at this point is not to get stuck in your own design. Not to be afraid to go away from this but instead maybe even got the complete opposite. In the second you can see exactly this.

Second version

Second version

The pink is almost completely gone and there’s a focus on filling the space with gameplay and camera. Version three you can see that we’re now have almost mashed the two previous version together, taking the best parts from the first two versions.

This is the reason why take the risk to go in a opposite direction. You will most of the time find new and better ways to work out exactly what direction you want for a final concept.

Third version

Third version

Now there was still a few things missing that I wanted to add to really solidify what entire visual identity.

Sketch

Illustrations and sketching is a huge part of my work. I recently invested in a digital drawing board so I can do all my sketches directly on the computer. Kaitlyn is a professional StarCraft 2 palyer and I wanted to work that into the overlay in some way. I sat down with my drawing board and sketched a cartoon version of a Zergling and brought that sketch into Illustrator to give it color and make into vector graphics.

From sketch to outline to final version.

From sketch to outline to final version.

Final

preview-2015-04-05

Final version. Top one has a chat included on the left side that’s imported via a OBS plugin and don’t show up here.

When we’re done with everything we start to work on the finer details. It might be smaller things like moving things around, resize and add shadows but in large everything else is set. The very last thing is to zip up the PNG files, typefaces and write down a brief document on how to edit certain things and where to edit them. In this case (Kaitlyn is a member of Team RollPlay) we’re also able to do A/B testing with Kaitlyns viewer base. That way we can make changes according to how they react to the UI/UX, that will also give me better insight into viewers behavior on Twitch is developing and adapting.

(In the final version you will see that I’m following the rule of thirds to get a better composition. Kaitlyns reaction when I explained how this is used in movies and how I apply it to a stream overlay was solid gold.)

If you want to take part in the testing, you can visit Katilyn’s Twitch channel when she’s live.

About the author

Daniel

Daniel

Do you need Twitch branding done the right way? I've work with both partnered and non-partnered Twitch streamers and done so for over 4 years. For me this is full time and I'm dedicated to my clients and my craft. I do both branding, visual branding and brainstorming based on understanding you, your community and your channel. If that sounds interesting to you then you should check out my Twitch services/portfolio/client list and contact me right away. twitch.livespace.se

Leave a Comment

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close