bg_visual_workspace.jpg
bnr_monsters.jpg
bnr_batman75.jpg
bnr_poster.jpg
bnr_cap.jpg
bg_visual_workspace.jpg

Visual Design Case Studies


A designer's main responsibility is to go beyond the simple graphical and copy elements of a wireframe and bring them to life visually. Though most people perceive design as just pretty pictures, as designers, we take into account a number of things including the user's experience, various calls to action, and overall look and feel to portray a cohesive message whether it's selling a product or educating users.

The case studies I've chosen are mostly partnership promotions I've worked on around a favorite subject of mine, comic books.

SCROLL DOWN

Visual Design Case Studies


A designer's main responsibility is to go beyond the simple graphical and copy elements of a wireframe and bring them to life visually. Though most people perceive design as just pretty pictures, as designers, we take into account a number of things including the user's experience, various calls to action, and overall look and feel to portray a cohesive message whether it's selling a product or educating users.

The case studies I've chosen are mostly partnership promotions I've worked on around a favorite subject of mine, comic books.

Man of Steel Promotion Landing Page

 

The Request

Every year, a large movie promotion comes along where I get to put my design skills to good use on a subject that I truly enjoy: comic books. My first superhero promotion was for Marvel's Captain America: The First Avenger.

 

The years after, however, the managing designer assigned this promotion to other colleagues in order for all of us to get the chance to work on a variety of work. That didn't stop me from creating a landing page experience of my own to practice the craft and design something fun.

The Strategy

I took a simple 3-product layout structure and incorporated the provided Warner Bros. assets, taking into consideration the correct usage of the visual materials and the look-and-feel of other Man of Steel promotional collateral.

Since my design wasn't the final live version, it did not go through Warner Bros. legal review, but I always gather feedback from the original designer and perform my own legal and visual critique with my peers.

The Result

Doing partnerships with large movie studios is a benefit to my job. Not only was Symantec included in the movie, in some form or another, but I was able to create something connected to them. Though my landing page experience wasn't coded and pushed live, I relished the opportunity to practice putting my skills into practice.

The Delivery

Man of Steel Landing Page

Man of Steel Landing Page

bnr_monsters.jpg

Visual Design Case Study #2


Visual Design Case Study #2


Monsters University DVD Promotion

 

The Request

An eBusiness regional requester in EMEA wanted to provide an online experience to a retail promotion in the Netherlands. The promotion provides a free DVD copy of Monster's University to retail customers who purchased Norton™ 360 Multi-Device. A special sticker on the product box instructed purchasers how to redeem their free DVD.

The requester wanted to do something similar for online customers; therefore, a landing page experience was requested, along with promotion banners, and redemption information on the order confirmation page.

The Strategy

During mockup creation, the requester wanted customers to opt-in to the legalese before proceeding, so a simple checkbox was included; the lead web developer suggested hiding the purchase button until customers opted-in.

Our reporting department would provide a list to the DVD fulfillment company to verify the participating customers and their addresses. If customers wanted the DVD sent to another shipping address, information was provided on the order confirmation page to update their address.

The Result

Since the promotion ran in the Netherlands, much of the data wasn't shared on how many orders were fulfilled. The collaboration efforts with our team and the EMEA team helped this project run as efficiently as possible.

In addition, this was the first project attempting to extend the retail promotion to the online landscape. The team successfully provided a creative solution that mimicked the easy redemption process for retail customers.

The Delivery

Monsters University Landing Page

Monsters University Promotion Banner

Monsters University Promotion Banner

Monsters University Confirmation Page

bnr_batman75.jpg

Visual Design Case Study #3


Visual Design Case Study #3


Batman 75th Anniversary Logo

 

The Request

First off, I'm a fan of Batman but he isn't my favorite DC superhero; that honor goes to the Green Lantern.  But when I first saw the logo that DC released for Bat's anniversary, I wasn't convinced it embodied what he stood for; what he meant to comic book readers of all ages.
 

So I saw an opportunity to create a version of my own. It wasn't in response to the official one being badly designed or anything like that. I think it's a good logo. But I wanted to add my own flavor to the pot. And that's what I did.

The Strategy

My starting point was researching the current Batman logo that was being used in the comics. It was as simple as opening up my comic book reader app on my iPad Mini. I discovered it was the same one that was used for the various Batman video games. I also found a chart of all the Batman logos used in the last 75 years and found my favorites: the logo used in Christopher Nolan's Dark Knight movie, my first Batman's logo, Michael Keaton, and the iconic Adam West Batman logo.

Once I had all the various logo shapes, I started to experiment with negative space and placement of the numbers "75". The official logo has the "75" on the right side of the Bat wings but it created a larger area that gave the design an unbalanced feel. My version has the "75" in the middle of the emblem, giving it a simple yet grounded feel.

Next, I starred to think about after all these years what hasn't changed in the Batman universe. Even with different people portraying Bruce Wayne/Batman, the one thing that never changes is Gotham. The city continues to be a place of injustice  requiring a mask vigilante to fight for all Gothamites. So, I incorporated the Gotham skyline within the different Batman logo shapes. 


The Delivery

 Here are various versions of the logo with my centered positioning of the "75":

Here is the version of the logo with the Gotham skyline incorporated in the current Batman logo and the Dark Knight logo:

I also put together something totally different with the main focus on the numbers "75" and incorporating the various Batman logos to tie the entire design together:

bnr_poster.jpg

Visual Design Case Study #4


Visual Design Case Study #4


Creativity & Culture Posters

 

The Request

Working on an in-house design group has its many benefits, but most of the departments we work with still turned to outside agencies for any creative solutions. A majority of the time, the funding for these agencies would run out and my team would have to complete the work that the agencies started, with a severely reduced timeline.

I wanted to create a poster series that we could post around the offices reminding my colleagues that Symantec has an in-house design group. And as a second benefit, putting a face to a name of the designers that work on the team.

The Strategy

I was inspired by some advertising I came across reading some comic books. Image Comics took quotations from their artists and writers and presented them in a artistic way. My posters were influenced by these advertisements and provided a great template to begin putting these posters together.

The Results

Unfortunately, I wasn’t able to create more posters of my colleagues due to the ending of my tenure at Symantec. I do believe it’s still a good idea to create more of these posters to help remind my colleagues of the creative team among them. And maybe I will continue working on these as time permits. But I’m happy with the set of posters I created.

The Delivery

Creativity poster - Brian Kwa

bnr_cap.jpg

Visual Design Case Study #5


Visual Design Case Study #5


Captain America: The First Avenger Promotion Landing Page

 

The Request

During my first year contracting as an Image Production Specialist, I didn’t get too many opportunities to do much design. As an Image Production Specialist, I  supplemented the visual and UX designers and acted as a liaison between them and the development teams.

Designing new things wasn’t part of my responsibilities. However, I got my chance to put my design skills into practice when the entire creative team attended a conference that contractors weren’t permitted to attend.

There was a partnership in place with Marvel Studios that required a landing page experience to be created and the development team needed the final design ASAP.

The Strategy

Working with the copywriter who provided the necessary copy and product information, I put together a landing page mockup by end of day. We agreed to use a 3-module structure that had been used in the past emphasizing the 2 products and a free Captain America comic book. To tie in the design, I utilized elements of the banner for the modules.

The Results

The landing page experience was created and pushed live soon after final approval from Marvel. I don’t have any reporting or data on how well the promotion did, but it did prove to my colleagues that, in a pinch, I can be relied upon to execute.

This was my first taste at designing for Symantec and I couldn’t ask for a better first project than a comic book superhero. Getting the opportunity to not only design but collaborate on a project, though a quick turnaround project, motivated me to seek out more opportunities to design long with my typical responsibilities. 

The Delivery

This is the layout structure I used for the design

This is my landing page experience