Oizo is a Danish streamer—and one of the reasons why I wrote my articles about native language. He actually streams in Danish and is an Twitch Affiliate streamer. Luckily I understand Danish so there we’re no issues in understanding the VOD’s that I watched to get a better understanding of who Oizo is as a streamer and what would become the OizoGG Twitch branding.
As I started to work with Oizo I of course talked to him and asked questions. All to get even more insight into who he is a streamer—all to get a better OizoGG Twitch branding.
Oizo shared a few images that he liked and even suggest a specific color that he liked. I took a few images and started to build a larger moodboard around that.
To me it’s important to filter everything that that the streamers says/wants. Then to create the optimal outcome from that.
The moodboard that I put together for the OizoGG Twitch branding was airy, modern and clear. There’s of course elements that breaks that up to create a juxtaposition. Giving it more of a editorial, book, magazine feel than a website. At the end of the day a steam isn’t a website it has a lot more freedom and possibilities—and should be treated as such. With that said it doesn’t mean that we can take inspiration from UI/UX and websites. Both rings true for the OizoGG Twitch branding.
For the OizoGG Twitch branding we both wanted to gravitate more towards a realistic look. Started to sketch a few different things to get started. However the first reference images was at an odd angle and it was hard to really translate it over.
Once I got a head on image I we’re able to draw something that looked a lot cleaner and modern. After all that’s more my style than anything else. When the sketch was completed I showed to Oizo for final approval.
You can see the final image right here and as you can see it aligns itself with the overall look and feel of the OizoGG Twitch branding. To me, and of course the OizoGG Twitch branding, it’s important to have these two things align.
When the avatar were approved by Oizo I transfered the sketch into Adobe Illustrator. Using Adobe Illustrator makes sense for the style that I use since it’s compiled using mathematical shapes and not brush strokes. Not to say that you can’t emulate brush strokes in Adobe Illustrator but the basis for it is shapes.
Once that was all approved I started to work on a few of the initial things that would be the OizoGG Twitch branding. I do this to give a proper representation of what the OizoGG Twitch branding would look like once it’s done.
On the starting screen you can see that I’ve put an entire schedule. When I’ve done this in the past I’ve created it with HTML only. In this case I wanted to take it one set further and create a static API. I’ll explain that in more detail below.
In this preview you can also see the alerts and panels. All of these together of course gives a great overview and they also give something for me to pull from with the other overlays.
When that first Preview was approved and talked about with Oizo. I did exactly what I mentioned above, and started to transfer over what I had already made to the rest.
As you can see there were a few modifications and animations. Additionally we added a few more changes afterwards. Since this is a project that has a lot of moving parts it was important to see it all action before being 100% done. For instance we noticed that a few of the animations didn’t play well on stream. So some things were moved over or changed in that process.
Since the whole OizoGG Twitch branding had that clean and modern look to it. I wanted to bring that over to the alerts both in style and in animation.
Static API Schedule
Finally we have the schedule that you’ve seen in some of the images above. Instead of having Oizo go through the HTML and find each entry I decided to craft a static API.
What’s static API? It’s basically a very simple database. In this case it’s a database that outputs three things. Firstly it outputs the time for the stream and the game. It does this by pulling from the API and pushing it into the overlay. Nothing that’s overtly complicated to understand.
Where it becomes a bit more interesting is that in some cases Oizo’s stream is offline. Days where he’s not streaming and those days needs to show an offline message instead. Instead of having to edit the input to say offline in the time input and remove the input for game. I created a if statement—that allows Oizo to set the value to either true or false.
If that statement is true it means that Oizo is offline that day and a offline message is shown instead of the text. If the statement is false then he’s not offline that day and the values entered under time and game is shown.
This allows Oizo not to have to constantly keep track of where things were entered. Instead all the data is still there in the database even if the day is set to offline.
I hope you liked this Twitch branding! If you want your own Twitch branding you should take a look at my Twitch branding services and get in touch.