EXPLORATION / UX RESEARCH - This is early stage of design process: researching, taking notes, understanding competitors, sketching rough mock-ups, no idea is a bad idea, thinking out side of box, pushing boundaries and be creative.

EXPLORATION / UX RESEARCH - This is early stage of design process: researching, taking notes, understanding competitors, sketching rough mock-ups, no idea is a bad idea, thinking out side of box, pushing boundaries and be creative.

Project overview timeline; having clear break-down of tasks and review dates. Project Planning, resource allocation, online scheduling, reporting. Identifying and detailing activities required in each phase of a project and lead teams with…

Project overview timeline; having clear break-down of tasks and review dates. Project Planning, resource allocation, online scheduling, reporting. Identifying and detailing activities required in each phase of a project and lead teams with members of your staff to carry out each phase.

Design Process + Case Study

It is very important to have a design process, it helps to set clear expectations; it allows us to establish realistic project deliverables. Design process should be flexible so it can fit for different projects and clients.

DESIGN PROCESS FRAMEWORK

Have clear user goals of the product before using any creative tool. Understanding end user needs, better user experience. The outcome is how end users are going to benefit from it.

(1) EXPLORATION / UX RESEARCH

The goal of the exploration is to collect information at an early stage of the project process.

(2) FOCUS ON RESEARCH FINDING

(3) INVESTIGATING OPTIONS

(4) DEFINE INTERFACE, INTERACTIONS AND USER FLOW

- Sketching, whiteboard sessions

- Wireframes

(5) VISUAL DESIGN

- Conceptual design

-Visual design

(6) USABILITY ANALYSIS

- Prototype

- Usability testing

(7) PRODUCTION DESIGN

(8) REVIEWS

(9) DELIVER

Wireframing mock-ups with different user cases. This is the early stage of project process, start exploring all possibilities, applying user centered design as foundation.

Wireframing mock-ups with different user cases. This is the early stage of project process, start exploring all possibilities, applying user centered design as foundation.

CASE 1 / GREE GAMING

 

Highway billboard 

RESPONSIBILITIES: Art direction / design

TEAM: D/C Agency

PROJECT BRIEF:  2 SF north/south highway billboards, 12 months contract, re-fresh billboard very 3 months.

GOALS: promoting new games and hiring

 

Brainstorm idea - example 1

Brainstorm idea - example 1

Brainstorm idea - example 2

Brainstorm idea - example 2

Brainstorm idea - example 3

Brainstorm idea - example 3

Gree_BBoard.jpg
Sketching out ideas by using game characters to create a story arc. 
Tagline brainstorming:
- Where gaming is going. Now in SF.
- Twinkle, twinkle cool new job
- Ultimate Future Opportunity
- Take your career to the final frontier 
Final_Billboard2.jpg

Final billboard on SOMA south highway 101.  

/ Final illustrations by GREE in house art team /

 

 

 

 

DINO LIFE Official trailer

RESPONSIBILITIES: Art direction / mock up animation keyframes and story boarding 

TEAM: Off site contract animator

PROJECT BRIEF:  Create promotional video trailer, 90 seconds or less with attention-grabbing into and in-game footage.

GOALS: Promoting new game

Storyboard mock-up for video key frames.

View Dino Life Official trailer

 

 

 

banner promotions

RESPONSIBILITIES: Art direction / design production

TEAM: Gree in house marketing creative team

PROJECT BRIEF:  Create various size of banners (IOS/Android)

GOALS: Installs, CVR, Engagement

 

Banner ideas sketch with animation concept.

Understanding data / Data driven creative team. Brand marketers know more than anyone that an effective creative is equal parts data and design effort. Reviewing all banner performances: total impressions, CTR, total number of installs and CVR.

Understanding data / Data driven creative team. Brand marketers know more than anyone that an effective creative is equal parts data and design effort. Reviewing all banner performances: total impressions, CTR, total number of installs and CVR.

 

 

Good creative strategies can improve banner efficiency and performance

 

The best banner ads are eye-catching, timely, and personalized. And the key to improving our own banner success rate is creative testing. 

 

key creative principles behind successful campaigns:

(1) Banner ads have to be eye-catching enough to attract attention. (2) Banner ads tend to be relatively small, don't try to say too much, the ad may just end up looking cluttered, less is more. Communicate a single marketing message about a single product. (3) Design for mobile micro-moment; viewer acts on a need. (4) Dynamic creative, creative that changes automatically based on information about the end users, whether this is related to their behaviour, location or context. Here are few different scenarios: traffic driving (ex: changing the product based on a user’s location), conversion (ex: feed of daily offers for strong deals and highlight your top sellers, or use creative to show categories the user has visited)

 

Engagement metrics:

Beyond the impressions and click-through rates of standard banner ads, engagement metrics can offer a clearer picture of audience engagement.  The tracking capabilities are now in place to measure when, where and for how long someone interacts with an ad. 

 

Understanding of how each creative element in a campaign is performing and how they perform in combination.

 

5 phases of data-driven creative:

One - (1) Understanding types of people we are trying to target. (2) keyword content on page where the ad is running. (3) Type of the device the person is using (4) location (5) Event information

Two -  All-hands kick-off (1) Who is your target audience? (2) Types of messaging (3) Assets (4) Data/background for previous campaigns (5) Type of formats (6)  Campaign schedule

Three - Creative template (1) Setting variables for character counts for copy, length of animations, size and location of images (2) A/B, testing two or more variables. A/B testing no more than one variable at a time, with equal sample sizes for each. 

Four - QA

Five - Optimize

 

 

 

CASE 2 - WRAP TEMPLATE SOLUTIONS

 

 

Understanding of data and analytics, can craft a more effective marketing strategy and give better directions.

Data driven age - optimize brand engagement by delivering the right message to the right person at the right moment. Synthesizing data with design decisions to produce measurable results.

Wrap authoring tool - monitoring ad campaign performance with break down of each cards; total views, CTA clicks, CTR rates, bounce rates, avg. time in wrap.

 

 

 

 

 

 

TEMPLAES

 

Template structure; we started with single wrap with 1 story arc. In this particular case, we had limited space to cover all different user cases. 

 

Afterwards, we used a traditional marketing funnel concept to showcase different stages of the campaign. I will use the Equinox sales pitch as an example. * All images are copyright by Equinox.

 

Here are the 6 steps of the campaign wraps:

(1) Awareness (2) Discovery (3) Consideration (4) Conversion (5) Customer Service (6) Retention

 

PHASE 1:

- Creating template with different fonts, mood, styles, different user cases

Mapping out all marketer user cases with all possible built-in component widgets.

Mapping out all marketer user cases with all possible built-in component widgets.

PHASE 2:

- Creating template funnel with marketing funnel user cases, using different fonts, mood and styles.

Example of marketing funnel, small business, service with font style - billboard and Condensed.Post eventEvent recap

Example of marketing funnel, small business, service with font style - billboard and Condensed.

Post event

Event recap

Example of marketing funnel, small business, retail store with font style - elegant modern serif.Public bikePublic bike 2Wrap example, Retail consumer goodsWrap example

Example of marketing funnel, small business, retail store with font style - elegant modern serif.

Public bike

Public bike 2

Wrap example, Retail consumer goods

Wrap example

Example of marketing funnel, artist, design, life style product with duotone modern magenta.Energy Water

Example of marketing funnel, artist, design, life style product with duotone modern magenta.

Energy Water

PHASE 3:

- Creating template follow with Marketing funnel user cases, using few font styles, but all focusing on modern look and feel.

Example of Apigee pitch with user story and outcomeUser story: I don't know Paris that well. I am pleasantly surprised that I got this sharing hotel text. Accorhotel group has some great hotels. I love Sofitel! "I love how this experience seems to p…

Example of Apigee pitch with user story and outcome

User story: I don't know Paris that well. I am pleasantly surprised that I got this sharing hotel text. Accorhotel group has some great hotels. I love Sofitel! "I love how this experience seems to pop up just at the right time."

(1) Solution space - give user enough interest to lead user to web check out

(2) Preferred path: Have the full mobile experience

(3) Entry point - The Wrap

 

Outcome: "I got what I needed. It was easy and I felt everything was well thought out for me during my stay."

Wrap-4.jpg

PHASE 4:

Richness of template categories:

- Commerce: companies bring revenue by offering “buy now” capabilities through a partnership with Stripe.

- Digital companion: digital receipts, providing relevant information and up sale more products

- Lead Gen: focus on CTA, get user information. 

- Landing pages: with a rich content delivery experience, you can craft a story or extend your brand’s presence

- Events: connect with your attendees, during and post event with RSVP capabilities, ticketing, real-time updates and post event communications

- Business publishing: empowers businesses to easily share information in a format which is easy to consume for their consumers or their employees with front cover personalization card to increase viewer engagement

- Real estate: real estate agents can customize templates or create one from scratch to market themselves and offers

- Sales enablement: empower team with quickly executed collateral that can be shared effortlessly via mobile

- Content publishing: marketers can easily create and share listicles or provide a personalized daily feed to stay connected with users and keep them updated with branded content.

Example of Awareness Wrap.

Here we are focus on the brand background and high level information about the brand to get user interested.

Example of Discovery Wrap. We added more details on all classes and CHAT widget.

View this wrap