Anthony Kongphan Twitch Design Case Study

CLIENT

Anthony Kongphan

SCOPE OF WORK

Animation, Logo Design, Stream Design, Emotes/Badges

DESIGNER(S)

Ruth, Ross, Julian, Tray, Lia

ANTHONY KONGPHAN: CUSTOM ANIMATED TWITCH DESIGN

November 2018. Talk dirty. Anthony Kongphan, the master of smooth, hit us up in private DMs. He was looking for a rebrand, and had heard of our success designing for some of the bigs on the Twitch scene. Was team VBI up to the task?

There was a lot on the line… Estimated project scale was massive, encompassing our full suite of design services – and requiring significant collaborations across our global team of artists. Anthony also had high expectations. He had a vision for his brand and wouldn’t settle for anything less than the best. Luckily, he came to the right place. Like finely tempered steel, our designers are honed in the fires of high-stakes, high-pressure environments. And we had something big in mind.

Anthony Kongphan Custom Twitch Design

Charm. Style. Sex appeal. Anthony Kongphan has it all. From the smile to the hair to the tattoos, he’s hard to miss. 6+ years and 400,000 Twitch followers later, the Kongphan renaissance is in full swing. Anthony has earned a reputation as one of the most engaging, community-oriented streamers in the game. His loyal fanbase, appropriately dubbed the ‘Ninjas’, is legendary for its eccentric, positive vibes. His charity streams have raised over $100,000 for organizations such as St. Jude and Extra Life. Oh, and did we mention he’s a Madrinas-sponsored streamer and moonlights as a model and actor? Mans after that bread.

Only one problem. While the Kongphan channel was seeing explosive growth, his brand visuals lagged behind. The Kongphan design felt dated and unfocused, and certainly didn’t reflect the Twitch celebrity status he had achieved. When he hit us up in late 2018, Anthony had plans to change all that. 2 short months (and a whole lot of caffeine) later we delivered one of our proudest, most impressive products yet. The final brand package spans from custom animation to logo design to stream overlays, social media art, and more. And when it was all completed, we were stoked to see Anthony as thrilled with his new design as we were. Here’s to many more collaborations in the future, you sexy ninja, you.

So join us as we take a tour of the complete Anthony Kongphan project, from first sketches to final delivery. Step into our designers’ shoes as we analyze the unique design process that went into each of Anthony’s stream elements. A peek behind the VBI curtain; an insiders’ look. So unsheathe those swords and sharpen your shurikens, it’s time to get down to business.

Anthony Kongphan Custom Twitch Stream Design

PROJECT OVERVIEW

First things first, we scheduled a roundtable call with Anthony to get a better sense of his design direction and brand vision. This first step is a crucial one, and a requirement for any new VBI custom project. These early discussions lay the creative foundation for each new design, allowing our team to identify client priorities and goals – and providing early warnings of potential obstacles. In many cases, they allow us to suggest new design alternatives the client may not have originally considered.

Unlike many clients, Anthony had a strong grasp of his creative vision; a dark, mysterious, ninja-themed stream design. This wasn’t entirely surprising. After all, Kongphan had been featuring ninja themes and dark color palettes on his stream for years now – if not informally. Now it was time to tie everything together with a sleek, one-of-a-kind look that matched his streaming persona and personal brand. In total, our team was tasked with the following commissions:

  • Brand Logo Design
  • Animated Twitch Overlays and Webcam
  • Animated Stream Intro
  • Animated Twitch Alerts
  • Twitch Emotes and Subscriber Badges
  • Custom Starting Soon + Outro Animation
  • Animated Stream Transition
  • Animated Stream Screens
  • Custom Twitch Panels
  • Social Media Art
  • Stream Giveaway Promo Media
  • [SPECIAL] Lorena Social Media Art

But how to best implement a professional ninja design theme? Considering the popularity of ninja imagery on the Twitch scene, we needed to make it feel unique and one-of-a-kind. We stepped back for some creative brainstorming and ran a design analysis…

Japan’s legendary assassins are rich in visual imagery – from their iconic black robes to the sleek katana to the deadly shuriken. The ninja is a master of stealth, infiltration, and precise, deadly strikes. They are NOT front-line soldiers, swinging their swords around in flashy displays as they cut through enemies.  To reflect this, Anthony’s design needed to be sleek, sharp, and stealthy – cleverly making use of ninja imagery without coming across as bright or gaudy. Subtle details were used extensively to add atmosphere and an ominous, deadly vibe. Patterns, lighting, and fog effects combine to take the design just a step above ‘minimal’ – not quite simple, but neither ostentatious. The perfect balance, just like a ninja’s blade.

Anthony Kongphan New Twitch Graphics

Color scheme was another important consideration. If you’re familiar with Anthony Kongphan, you know black is kind of his ‘thing’. From the spiky black hair to the inky tattoos to his personal wardrobe, the Kongphan brand revolves around a dark black color palette. Much as the ninja’s legendary black cloaks, Anthony wanted his new design to convey a dark, monotone vibe – accented by simple whites and grays. Just for fun, we originally pitched a few alternatives, retaining the primary black tones but contrasting them with blood-red and gold highlights. In the end however, straight-black was the clear victor. The monotone look provided a truly unique display not often seen in the Twitch community… and perfectly matched Anthony’s ninja branding.

Meanwhile, our motion designers began laying foundations for the upcoming stream animation. A master ninja moves with grace and poise – never expending more energy than is needed, but striking with precision. It’s a flowing art form. A dance of death. In much the same manner we wanted Anthony’s motion design to feel swift, smooth, and subtle. Reflections dancing off smooth metallic surfaces. Snakes slowly curling around kunai knives. The smooth rotation of a shuriken. All featuring extensive 3D modeling and animation. The end result is a dark, mysterious look that adds subtle movement and atmosphere, without being overbearing or flashy.

At this point, we had solidified the foundations of Kongphan’s brand design. The next step was to break into our separate teams and begin focusing on each element of his stream graphics. Our own team of ninjas had been assembled, and their mission was clear. Now it was time to carry out the deadly deed.

CUSTOM BRAND LOGO DESIGN

First up, new logo design. It was critical to get this first step right. Not only was a new logo one of Anthony’s highest priorities, the design would also serve as a foundation for the stream design to come. Its color scheme, angles, patterns, and textures would be reflected in everything from his webcam to his alerts, social media design, and more.

For years, Anthony had been using an old logo. If you’re a long-time follower of his, you may recognize the design: two shuriken merged together to form almost a ‘wave’ shape. The logo and accompanying logotype (ie, text) – featured in gold and grey – was certainly a unique design, but didn’t capture the sleek, mysterious brand look Anthony was after. The old logo conveyed more of a mechanical, industrial feel, and the design itself suffered from a number of technical flaws. It was time for a change. An upgrade that reflected both his brand vision and the professional, celebrity status he had achieved.

Anthony Kongphan Logo Concepts

Luckily, Anthony knew exactly what he wanted. A sharp, sleek kunai knife. One of the ninja’s most legendary weapons, equally deadly from a distance and at close-range. The design is iconic. Forged of dark, sturdy iron, with a rounded pommel for easy transport. An extended hilt, often wrapped in bandages or cloth for grip. The short, leaf-shaped blade ending at a sharpened tip. A simple, unassuming weapon, but lethal in the hands of a trained assassin. Like any good ninja, Anthony Kongphan wanted one of his own. We gathered our top logo designers and began sketching out concepts.

In the early stage of logo design, we often find it useful to offer ‘twists’ on a client’s ideas – taking their ideas in a new, unexplored direction that they may not have originally considered. One interesting approach that we initially pitched to Anthony Kongphan was a close-up of the kunai blade itself, with his ‘A.K.’ initials engraved in the dark iron. In concept, this idea carried more of a ‘traditional’ logo feel; placing more focus on the text and brand name, as opposed to the icons and mascots more commonly-seen in the esports and gaming scenes. Anthony liked the approach, but wanted the kunai featured more prominently to reinforce his ninja theme.

In a similar vein, we also pitched a few alternative options featuring bold color highlights. The dark black-gray color scheme still carried most of the weight, but was now accented with blood-red and gold outlines. Once more, Anthony enjoyed seeing the contrast provided by fresh new colors, but held fast to his monotone-black theme. Anthony’s conviction only made us more confident we could deliver a design that achieved his brand vision.

Anthony Kongphan Logo Design

The next step brought the iconic kunai to life. In a series of concepts, the legendary knife was displayed in various orientations and shapes. Some of our original sketches featured a shorter blade, with the kunai standing upright. We chose a color palette of steely, ashen gray for the blade’s surfaces, contrasted by midnight-black outlines and highlights. Later concepts featured an extended blade, providing additional weight and verticality. Gradients were incorporated to add detail and achieve a subtle metallic finish. The final few concepts featured the kunai in all its glory, now flanked by aggressive circular accents to inject weight and character to the design. We pitched a few different orientations to Anthony, but both he and our team agreed the upright, vertical position projected the most power and mystique. Konghphan had found his legendary weapon, at long last.

For extra versatility, we created four separate versions of the logo. This would give Anthony the flexibility to use his new design in a variety of situations, whether for merch, print, stream overlays, etc. We included both a gradient version and a single-color version – both including two variations for use over light and dark backgrounds.

Anthony Kongphan Custom Brand Logo

Finally, we turned our gaze to the typeface, or ‘text’ logo. Anthony Kongphan’s name is featured in bold, capitalized text, left-adjusted for style points. Both his first and last name are displayed in a clean, professional Montserrat font. We used a thicker, beefier font style for his last name to add weight, personality, and a ‘foundation’ feel. And as with the kunai, his typeface logo was provided in both clear-white and dark-black, for use on multiple design surfaces.

The last step of Anthony Kongphan’s logo design was to construct a 3D model, for use in his stream design and upcoming animation. This third variation would compliment the single-color and gradient versions, again providing more versatility for Anthony’s branding. The 3D model slowly came together, as weighty, sleek, and shiny as can be. This new version introduced unique reflections and dimensions, while still remaining true to the core 2D design. And it would come in handy, for the action that was soon to come.

CUSTOM TWITCH OVERLAYS AND STREAM WEBCAM

With kunai in hand, our team of design warriors approached their second task: custom Twitch webcam and overlays. And we had big ideas here.

Anthony Kongphan and our team of designers agreed – the final overlay design should be sleek and sharp, with subtle, minimalist touches. Much as a ninja relies on stealth and avoids flashy displays of power, we wanted Anthony’s overlays to have a tight, ‘out-of-the-way’ feel. Keep things lightweight and nimble, to match the agile, shadowy grace of a ninja warrior. This meant focusing on only the essential stream elements, opting for a ‘simple’, condensed look and dispensing with the extra bells and whistles. It also meant that what overlays we DID include needed to carry their weight.

Anthony Kongphan Custom Twitch Stream Webcam

We started with the webcam frame, and we approached this element with a revolutionary strategy… How many times have we all seen the same webcam frame across Twitch? The iconic rectangular border that’s become predominant across all streamers, big and small. Sure, the designs change, but the traditional ‘shape’ almost always remains static. We wanted to push the boundaries on this project, and Anthony was fully on-board.

Take a quick look and you’ll note Kongphan’s webcam breaks the mold with a mix of rounded and cut-out corners. It’s a unique, artsy look that challenges the status quo and instantly marks Anthony for the trendsetter he is. Not only that, but each of the webcam’s corners were designed to complement the angles found in his new kunai logo – cleverly matching the mascot’s circular discs and interior blade patterns.

 

Meanwhile, the webcam frame itself conveys the dark, sleek look Anthony was seeking. Silky-smooth curves and metallic textures, with gradients designed to match the color palette of his logo. Beams of light dance and reflect off the border’s surface, mirroring the look of his 3D logo. Currents of energy swim across the frame, driving momentum and energy. Pinned at the bottom of the frame is the legendary 3D-modelled kunai itself, silently guarding the action above. In a slow, subtle animation, the logo’s encircling discs silently rotate the blade, adding momentum and atmosphere to the design. And as you’ll see below, we decided to incorporate some of Kongphan’s animated stream alerts directly into his webcam overlay. A nifty trick – stay tuned for the full details.

The last step was to add in Anthony Kongphan’s stream indicators. To keep things tight and minimalist, we originally included two unique icons and small shaded text boxes. The icons represent recent subscriber and total # of new subs since the Twitch stream began. Later, we would add a third icon for Anthony’s top stream donator. By creating these separately, we gave Anthony the option to place the tickers above or below his cam box.

Anthony Kongphan Custom Stream Overlays

With overlays complete – for the most part – it was time to step up our animated game. Our motion designers were just getting warmed up… and they were out for blood.

STREAM INTRO ANIMATION

The big kahuna. Anthony Kongphan’s sleek new animated stream intro. The final product would surpass even our own expectations, quickly becoming the shining jewel of our 3D design portfolio. But let’s not get ahead of ourselves…

From day 1, our team was sure about one thing: When Anthony Kongphan hits that big red ‘GO LIVE’ button, we wanted him to make one hell of an entrance. Like a stealthy squad of ninjas, our animators had been working in the shadows on something truly special. A custom stream intro that would play a critical segue role between Anthony’s ‘Starting Soon’ intro loop and that moment when the camera starts rolling. The design needed to be sleek and adrenaline-pumping; an intense animation that would drive up energy and momentum before Kongphan’s appearance. The big moment before the deadly assassin reveals himself from the shadows…

Anthony Kongphan Stream Intro Animation

Remember that 3D model of Anthony’s new kunai logo? Well, now was its time to shine. As the centerpiece of his new branding kit, we wanted to put the kunai on full display through a series of sleek close-up shots.

The scene opens mysteriously, as the first rays of light fall and reveal the legendary weapon – signifying the early opening moments of Anthony’s stream. As the animation proceeds, the close ups move from the kunai’s hilt, to the encircling rings, to the blade itself. As if stirring itself from a deep slumber, the animation slowly increases in velocity and the light source becomes brighter. Reflections dance off the blade’s metallic surface for a sleek, polished look – much as a ninja sharpens and hones his blade before combat. The kunai slowly rotates as the camera encircles the logo in a series of dramatic shots.

Momentum continues to build until suddenly, the blade fades into a suspenseful darkness. Moments later the kunai reemerges, as the circular rings swoop in from both sides and twist around the blade. The logomark is fully-revealed in all its glory, alongside Anthony’s new logotype branding – displayed in a clean white to contrast from the dark background.

The end-product is a crowning achievement for our animation team – and a major boost to Anthony Kongphan’s stream presentation. Every great assassin has a story to tell… We just gave Anthony his great opening act.

ANIMATED STREAM ALERTS

Meanwhile, our motion designers were busy constructing Anthony Kongphan’s new Twitch stream alerts. This was an opportunity to add some extra flash to Anthony’s on-air presentation, both through professional animation and innovative designs. It was time for us to gear up Kongphan with a new arsenal of weapons.

To add a dynamic feel to Anthony’s alert setup, we split his new stream alerts into two categories. First, there were the common, everyday stream alerts; a new sub here, a resub there, smaller donos and bits. To reduce clutter on Anthony’s stream layout, these were incorporated into his webcam frame. These incoming ‘common’ alerts are displayed with unique animations on his cam overlay, as you saw earlier. Panels emerge from beside his kunai logo, displaying incoming information in bright red and green font.

Anthony Kongphan Webcam Alerts

The second stage of Anthony’s stream alerts are reserved for those special occasions; long-time resubs plus large donations and bits. To reward these followers and drive chat hype, we designed unique animations to celebrate the occasion. And once again the legendary kunai would be featured front and center.

First up, SNEK. This gorgeous viper appears for especially large stream donations. Why a snake? Well there are the obvious visual connotations; snakes convey stealth and rapid, deadly strikes – much akin to a ninja. More importantly however, the main inspiration for this design came from the snake tattoo Anthony has on his finger. We’re not stalkers, we promise.

The alert design began as a simple sketch, with the serpent coiled around the kunai logomark. This concept evolved into a 3D model, which would be adapted into the final alert animation. In the final product, Anthony’s kunai spins into view, as the snake slithers around the blade. It bares its fangs, glows a menacing green, then descends once more as the alert fades into view. The concept is one-of-a-kind, and Anthony loved it so much he would soon incorporate it on his next round of merch (coming soon).

Anthony Kongphan Snake Subscriber Stream Alert

The second alert type is reserved for special subscriber notifications. In this animation, Anthony’s dagger soars into view, as if held my some invisible assassin. The blade proceeds through a series of combat moves, leaving traces of bright, menacing red in the air. It slashes at incoming discs – once again inspired by the circles that surround his new logo. As the blade slices through the disc, each piece rejoins the kunai – until both are defeated and regroup to assemble the full logo design.

The final alert type is specially-crafted for large bit donations. This alert takes the form of a rotating shuriken. Multiple copies of Anthony’s kunai assemble to form a menacing throwing-star, which spins swiftly across the screen. As they circle, the blades leave traces of bright, neon blue in the air.

The final designs are sleek and sexy, tightly-branded to Anthony Kongphan’s ninja stream theme. The combination of subtle and flashy alert styles adds versatility to Anthony’s stream presentation, for a unique, one-of-a-kind look. The arsenal had been assembled – now it was time to move to the next stage of Anthony’s project.

CUSTOM TWITCH EMOTES & SUBSCRIBER BADGES

Coming Soon!

(ㆁᴗㆁ✿)

ANIMATED STREAM TRANSITION

In the meantime, our animators had turned their sights to the next target: Anthony Kongphan’s stream stinger animation. A swift, eye-catching transition Anthony could use when swapping between stream screens or switching from game to IRL chat.

Anthony Kongphan Custom Stream Transition

But how best to approach the new design? A master ninja acts with lightning-fast speed, dashing in for the quick kill then exiting just as quickly. We wanted Anthony’s stinger to reflect this, combining velocity, agility, and style. And to keep things closely tied to the Kongphan brand, the kunai logo would once again play a pivotal role.

The stinger starts off with a bang. Once triggered, the kunai suddenly comes flipping towards viewers, as if hurled by an unseen assassin in the distance. The knife soars through the air, passing through metallic rings and loops with pinpoint accuracy. Suddenly, the blade retracts and settles back into the familiar Anthony Kongphan logo – as beams of light reflect off its shiny surface. Within moments, the blade slides horizontally off the screen, bringing viewers back to the on-air action.

Its an aggressive 3D animation which we think captures the sleek, deadly vibe Anthony was looking for. By combining speed and intensity, it builds adrenaline and carries waves of energy into the next scene. Overall, a well-deserved weapon to add to Kongphan’s growing stream arsenal.

ANIMATED STREAM SCREENS

Next up, stream screens. We wanted to hook Anthony up with a trio of screens that would capture the mysterious, midnight-warrior vibe he was looking for. In total, our stream screen package would include a ‘Searching for Game’ animation, in addition to Intermission and Offline Screen variants.

Anthony Kongphan Animated Stream Screens

Perhaps the best example of the Kongphan screen design is his new ‘Searching for Game’ animation. The dark background is textured with carbon patterns, while eerie fog effects float through the air. Spotlights arc across the screen, illuminating the sleek, slim text. The massive kunai logo stands proudly to the left, glistening as light dances off its metallic surfaces. Its encircling discs slowly revolve in an impressive 3D display, nearly touching the viewer as they complete their rotation. Below, a revolving carousel displays Anthony’s various social media handles, shifting between Twitter, YouTube, Instagram, and Facebook.

Similar backgrounds and visual effects were used in Kongphan’s intermission screen, now featuring an enlarged version of his new webcam frame. Above, the kunai logo looks on at the action below. Meanwhile, the Offline Screen features a still variant of the design, making use of large circular patterns and dark, mysterious lighting.

 

The trio of stream screens offer Anthony flexibility for any stream situation, while remaining highly branded and stylish. Pogs.

CUSTOM TWITCH PANEL DESIGN

Next up, our stream designers went to work on Anthony Kongphan’s Twitch panels. It was important for us to maintain the sleek, streamlined look that was beginning to identify Anthony’s brand. Much like the tip of an assassin’s blade, his panel design needed to be sharp and compact. Nothing flashy, just simple and effective.

Anthony Kongphan Custom Twitch Panels

To keep things minimalist, we went with a short, condensed design, keeping panel height minimal to resemble a long, thin blade. A simple, clean background of midnight black allows text and icons to ‘pop’ into the forefront. Meanwhile, fog effects and hazy lighting add depth and a mysterious, nocturnal atmosphere. Unique, under-lighting signifies panel purpose, such as subtle pink lighting for Instagram, red for YouTube, etc.

It’s a silky-smooth design that adds new elements of professionalism and style to Kongphan’s profile. A stealthy, ominous look, fit for a master of the shadows.

SOCIAL MEDIA DESIGN

Now it was time to gear up Anthony’s social media channels for battle. No small task, considering his Twitter, YouTube, Instagram, and Facebook channels each boast tens of thousands of followers.

In terms of approach, we wanted any new visitor to the Kongphan channels to instantly get a sense of his brand. And in order to keep branding tight and focused across all of his design, we once again chose to feature his logo front & center. Now however, the kunai logomark is accompanied by his sleek, bleached-white logotype, combining symbol and text for one ultra-branded look.

Anthony Kongphan Social Media Design

The banner background is inspired by the similar look in Anthony’s new stream screens, featuring the concurrent circles, dimmed logo, smoky visual effects, and eerie background lighting. Bright white symbols underneath Anthony’s logotype indicate each platform where he is active. And once again, the dark-black background colors provide the perfect launching pad from which the white symbols and text emerge into the foreground.

PROMO DESIGN

By now, it’s pretty common knowledge that Anthony is one of the most giving streamers in the game, raising hundreds of thousands of dollars for charitable foundations. This past December, our team wanted to lend a hand in his latest charity stream: an auction event where viewers bid for a chance to play with Anthony – with all proceeds donated to charity. The idea was to create a sleek new promo design, which Anthony could use on his social media and PR outreach.

Anthony Kongphan Custom Ad Promo Design

The final design is playful and energetic, with a sleek, polished look reminiscent of his personal channel branding. The legendary kunai logo is there, while promo font was selected to closely match Anthony Kongphan’s style. Thin lines race across the midnight-black background for an intense, active look. And as with Anthony’s Twitch branding, the design features a unique monocolor black-white scheme, with subtle shades of gray mixed in.

Who knew cold-blooded ninja assassins have hearts too?

LORENA_KAY SOCIAL MEDIA DESIGN

With things coming to a close, we wanted to offer one final gift.

Much of Anthony’s day-to-day operations and project management are run by Lorena, his younger sister and biggest fan. In fact, Lorena was our primary go-between with Anthony, often relaying information back-and-forth, while offering unique insight of her own. As a thank you for being such a fantastic client, we started working on separate social media branding for Lorena’s personal social media channel.

Lorena_Kay Custom Social Media Design

We wanted to make sure Lorena’s banners mixed elements from Anthony’s branding, while also feeling unique to her personal style. The kunai logo is back (now in monocolor white), displayed with patterns reminiscent of Anthony’s personal social media banners and stream screens. The remainder of the design features Lorena’s favorite colors – purple, pink, and red – in shadowy gradients. Subtle, faded pictures were placed in the background, featuring IRL photos of Lorena, Anthony, and their family.

A special touch for a special person. Because every ninja warrior needs a trusted partner-in-crime.

View More Case Studies

CouRageJD Twitch Design Case Study

View

FaZe Yelo Twitch Design Case Study

View

Nadeshot Twitch Design Case Study

View

FaZe Attach Twitch Design Case Study

View

GoldGlove Twitch Design Case Study

View

Hogman Twitch Design Case Study

View

Nameless Twitch Design Case Study

View

Giveaway Promotional Design

View

ORDER YOUR CUSTOM DESIGN

Looking to work with us? Click below and tell us more about your stream design project. Your design could be featured here next!