For those that don’t know N3RDFUSION is here’s what it says on their website “N3RDFUSION is a company made of content creators (Broadcasters, YouTubers, etc) who share a passion for turning their job of entertainment into a life-long career”. LobosJR is one of those content creators and this is the case study on how I created the LobosJr Twitch branding.
The first thing when working with any client is to ask questions. We had a group with with Sevadus, LobosJr and me where I ask a few follow up questions before starting the moodboard. I have a few standard opening questions but as I get answers I base my follow-up questions on that. This serves as the first steps for the creation of the LobosJr Twitch branding.
What you can see here is the second moodboard that was created. The reason being that we decided to move forward with a few more things that initial intended. One of those things was to have a logo created for LobosJr.
In the moodboard you can see a darker, sharper and more ominous look. This is the direction that I got from those initial questions that I asked LobosJr. He also posted a few images of things that liked, and to be clear none of the things that he posted had any relation to Twitch. It was more so to give an idea over what he had in mind. That’s something that always welcome since it really allows me to dig deep into the mind of the streamer to really craft something great for the LobosJr Twitch branding.
Sketch & Logo
I knew that LobosJr liked a more pointed and aggressive look combined with the gold and black. So during the sketch stage I started by sketching the right side of logo. Then flipping that over to mirror it to the other side. You might think that it’s done there and then but I actually went in and used transform to correct a few sizing errors. Then I kept fine tuning the final look before sending the sketch to Sevadus and LobosJr for approval.
One that sketch was approved for the LobosJr Twitch branding I brought the sketch into Adobe Illustrator. Using the pen tool I started to create the final look.
I knew that using certain aspects of the pen tool I could get that pointed look with the right settings. I had to carefully go over the entire thing to get those points to show up correctly. It’s not as simple to just point and click since every step comes with it’s own smaller issues in calculations by the program. However having that initial sketch allows me to work a lot faster in this stage than doing it freehand.
As you can see in the logo preview image I added a golden texture to it. That golden texture was an important step to get LobosJr and Sevadus to see the potential but also to see what it might look in the right context. If I only would have shown the white or black version it might not have given the same impression.
When the logo had been approved by LobosJr I started to work on a few on the things that would later become the final look.
As you can see I’ve added a lot of layered textures and depth to it. Later on in the final version I did end up adding slight animations to it as well. This to get it a bit more life than a still image. Nothing that’s over the top but rather something to move it along with slight movement.
I did keep up with the black and gold color theme and using a distressed look combined with the sharp edges of the logo and the text. There’s of course more than one text object. One for the headline and more display type situations. The other one is a more standard looking serif font that could add more readability when needed for the LobosJr Twitch branding. There is always a balance there that you have to think about, no matter if it’s depth, textures or typography. With that said it’s not a 50/50 type of balance but rather a understanding that there’s different type of balances for every situation.
Once the first preview was approved for the LobosJr Twitch branding. I moved on to the second preview and that also turned into the final version. As you can see I did a few minor changes (the spelling error was also fixed) but overall I took what was created in the first stage and crated the rest with that in mind.
The big changes are the addition of social media. Something that I noticed that was missing from the first preview and felt that could be a great addition to the LobosJr Twitch branding.
You can also see that there’s a very minimal in-game overlay. All it really has is the social media and border with a back plate (that can be modified) for different type of type or images that LobosJr might want to put there.
Finally I wanted to talk a bit about the CSS animations that I added to the cards. Since I knew that without a little bit of movement the cards would look a bit static. At the same time I didn’t want to add something that would overpower anything since that would sort of go against the feel of the LobosJr Twitch branding. What I did was to add a bit of movement to the logo. Having it slowly pulsate back and forth.
This was all of course created with simple HTML and CSS. There’s no video magic and there’s no green screen tricks. Don’t get scared of HTML and CSS just because it’s all text. Trust me that once you get a hang of it you no longer see the text but instead you start to visualize it all in your head.
I hope you enjoyed reading or at least checking out the process behind the LobosJr Twitch branding in this article.
If you’re looking for your own Twitch branding then you should check out my Twitch branding services and get in touch.