Kelly Ioerger

DEFIANCE

Responsive template site design | Print design | Marketing goods

http://www.trionworlds.com/defiance/en/

WIREFRAMING

After sketching and removing a bunch of ideas, I moved forward to creating the detailed wireframes. During this stage in the process I was able to feel the flow of the site without being bothered what the site style would need to look like. The Developers were able to see how the site would be built. Once they started we were able to make any needed design adjustments.

PIXEL POLISHING

The next step in the process, I moved onto styling the user interface of the site. The main creative direction I was given was that the site needed to be sustainable and responsive. Beyond that I was given free reign over the site's look and feel. The scope of work consisted of design approach, social engagement, digital advertising, responsive design and cosistantancy.

PRODUCTION DESIGN

After all the pages for the site were designed, I prepared all the localized assets for the remaining pages of the entire site.

KEY ART & PRINT DESIGN

After the game and site launched the next step was to promote Defiance. I moved onto designing Print Marketing good such as; Packaging materials, OOH materials (pull-up banners) and apparel.

• Trion Worlds: Kelly Ioerger
• Category: Marketing

CLOSE PROJECT

Taco Bell - Always On

Rich Media Interstitial Ad Unit

USERFLOW

Working with the brand team in New York City was difficult to transcribe the user flow. I designed specs and screenshots for the Account Manager so they would be able to translate the user flow with the client.

LAYOUT | PIXEL POLISHING

When users tap to expand the animated banner, this full page interstitial ad presents a micro site of a custom menu for Taco Bell. Similar to the ta.co menu page this full page interstitial allows the user to customize their own taco and order directly from the ad unit. As the user selects ingredients, the image of the taco in the upper half grows with the selected ingredients. Once the user is finished building their taco, a CTA directs the user to the ta.co checkout page.

• InMobi: Kelly Ioerger
• Category: Mobile Advertising

CLOSE PROJECT

Nike Training Club

Rich Media Interstitial Ads

USERFLOW

Working with the brand team in New York City was difficult to transcribe the user flow. I designed specs and screenshots for the Account Manager so they would be able to translate the user flow with the client.

PIXEL POLISHING

When users tap to expand the animated banner, this full page interstitial presents a Gamification Ad for Nike and their new series for women. Similar to The Yoga Deck card game the main objective is for the user to shake their device to determine a workout for the day. The first frame displays a quick popup with instructions. Once the user taps “Go” or shakes their device the first card is revealed. The user will continue collecting more cards till all four are selected. When all four cards are selected the next frame displays video instructions for each of the cards. The user will have guided video instructions for each workout. A CTA at the bottom of the screen will allow the user to subscribe to the new series on YouTube.

INTERACTIVE VIDEO INTERSTITIAL

Interactive Video Interstitial Concept and Design

This ad is a video interstitial unit. What makes this video special is that it is an interactive video. The purpose of the interactive video is to engage the user and show how Nike Training Club works. How the interactive video functions; is that it allows the user to make a choice based on their curiosity of each workout.

Once the user clicks the “Play Now” button the video will start playing. Listed below are simple directions for the user to interact with the video. The user also has the option to click “Download Now” button. The “Download Now” button will direct the user to the Apple App Store or Google Play Store based on their device.

• InMobi: Kelly Ioerger
• Category: Mobile Advertising

CLOSE PROJECT

RIFT

Web Deisgn, Marketing Goods & Print

http://www.trionworlds.com/rift/en/

Download RIFT and enter the vast, magical MMORPG world of Telara. Experience an unprecedented class system, massive dynamic battles, and player housing like you've never seen before – all for free.

MICRO SITE RE-DESIGN

As a designer, I generally have to accommodate when working on large scale web sites like this. Appearances sometimes get implimented by Developers without being designed at all.

EXPANSION SITE DESIGN

As the game advanced, the Marketing team wanted the web site to complement the game update and expansion. As the game became exhausted, it was important to the Marketing team to keep our client base and produce fresh content.

PRINT

An addition to the Expansion Pack I designed the packaging for the game. Other print projects included assets for gaming conventions. This Pull-Up banner was designed for the Trion Worlds booth at GDC.

• Trion Worlds: Kelly Ioerger
• Category: Marketing

CLOSE PROJECT

Next Generation

Web Template Design

• Mkap : Kelly Ioerger
• Category: Web Design

CLOSE PROJECT

Game Of War

Rich Media Interstitial Ads

PIXEL POLISHING

I have a strong passion for game art and design so this project was really fun. The client provided all the art assets and allowed me all the creative freedom. It was very successful in the end, the client was surprised and overwhelmed with the amount of work I put into the Ad units.

• Client: InMobi
• Category: Mobile Advertising

CLOSE PROJECT

ArcheAge

Micro Site Deisgn | Responsive Template Design | Marketing Goods & Print

http://www.trionworlds.com/archeage/en/

WIREFRAMING

The Marketing team presented a creative brief for an e-commerce one-off page. The most challenging part about this project was strategizing the information architecture. The first phase, I did a lot of research. After sketching the concept and layout the wireframes were created.

PIXEL POLISHING

Collaborating with the concept artist, and Capture Artist the Key Art was designed to fit within the 960 grid aspect. Once I collected all the asset from the Capture Artist I was able to visually layout the design. Inspired by the in-game UI, I translated the same style to the Founder's Pack Page.

RESPONSIVE TEMPLATE DESIGN

Based on the DEFIANCE concept and wireframes I was able to move onto the look and feel of ArcheAge. Researching the in-game aesthetics I started playing with color. After two rounds of color and imagery the Marketing team and I came to an agreement.

PRODUCTION DESIGN

I pulled out all the assets for the developer and saved them into a Style Guide Photoshop document.

• Client: Trion Worlds
• Category: Web Design

CLOSE PROJECT

Travel Texas

Rich Media Interstitial | Interactive map

USERFLOW

The client requested that this Rich Media unit would compliment the Travel Texas mobile site. After researching the mobile site I created a quick userflow for the Sales Team to use.

PIXEL POLISHING

After illustrating the Texas map I collected the all the assets from the client and began the lay out. Based on the clients request I created the userflow and UI to relate with the mobile site.

• Client: InMobi
• Category: Mobile Advertising

CLOSE PROJECT

Springr

App Wireframing

SKETCHING & WIREFRAMING

Springr is a very small start-up. The team approched me to create a wireframe. The next step I worked collabatively with the developer to build out a prototype.

• Client: Freelance
• Category: App Wireframing

CLOSE PROJECT

Wake Up Your Phone

Production Design

WIREFRAMEING & PRODUCTION DESIGN

I worked with a team of Art Directors and Designers to help launch this site for Sansdisk. My main position in this large project was Production Designer. After all the content was localized I pieced together all the assets for the Developers into one Photoshop file.

• Client: Sansdisk
• Category: Web Design

CLOSE PROJECT

Pandora

Rich Media Interstitial Ad

USERFLOW

Presenting this idea to the sales team was a challenge. I created a simple userflow presentation for the Account Manager to perform to the client.

PIXEL POLISHING

The Interactive Art Direction for this project was, the user taps and holds their thumb in the middle of the device, a new screen will appear presenting the user's mood. Depending on the mood, a suggested genre of music will appear. Relating to the user, (young millennials) a charismatic avatar will also be assigned to the user's mood. A CTA directs the user to the Google Play store or Apple App store depending on the user's device.

• Client: InMobi
• Category: Mobile Advertising

CLOSE PROJECT

Saks Fifth Ave

Rich Media Interstitial Strand Unit

USERFLOW

To show the client how Strand Units interact I created a presentation to explain the user flow.

PIXEL POLISHING

As the user progresses within the interactive Look Book, the next screen shows the available products from the Editorial images. Icons around the page function as Hot Spots for the user to interact with. Once the user taps on a Hot Spot they are able to view details of that product. A CTA is provided to purchase that product directly from the Interstitial Ad. As the user is viewing the product in detail, a optional 360o rotation of the product is available.

• Client: InMobi
• Category: Mobile Advertising

CLOSE PROJECT