design portfolio - jonathan bates - online senior creative + new media developer

39
Jonathan Bates (612) 578 0222 [email protected] Jonathan Bates (612) 578 0222 [email protected] Jonathan Bates Presentation of Design Work, Site Architecture & Branding Revised December 2008 More portfolio and client information at www.jonbatesdesign.com Creative & Design Direction User Experience Development Site Architecture Design / Production Management Commerce Integration

Upload: jon-bates-design

Post on 15-May-2015

1.189 views

Category:

Technology


0 download

DESCRIPTION

Portfolio of Senior Online Media Creative Jonathan Bates, designer and developer of innovative rich media, dynamic content and multi-platform products. More at http://www.jonbatesdesign.com or [email protected].

TRANSCRIPT

Page 1: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] Bates (612) 578 0222 [email protected]

Jonathan Bates

Presentation of Design Work, Site Architecture & Branding

Revised December 2008

More portfolio and client information at www.jonbatesdesign.com

Creative & Design DirectionUser Experience Development

Site ArchitectureDesign / Production Management

Commerce Integration

Page 2: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

My Background

6 years experience at CNET Networks 1996-1998, Director of Multimedia 2001-2003, Design Director

(Commerce, All Network Sites)

Roles/Responsibilities Manage creative + production staff (4-30+) Oversee sub-brand designs, redesigns &

daily production for 13 properties worldwide Develop & design new commerce systems

Page 3: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

My Background

@Home Network Senior Producer, Multimedia

Roles/Responsibilities Produced daily broadband video content for

1.2 million subscriber portal Managed production staff and

videographers Responsible for content syndication

relationships with CNN, Bloomberg, NBC…

Page 4: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

My Background

Jon Bates Design Creative Director

Roles/Responsibilities Multimedia/Dynamic Flash content Silverlight & Adobe AIR rich media content Commerce integration Production systems integration and training Content planning & site architecture

Page 5: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] Bates (612) 578 0222 [email protected]

Web user experience / UI / design

Designs, concepts and projects by Jonathan Bates

Page 6: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience

eCatalog Best 100 Products

eCatalog is a product directory system viewable on- or offline.

Tight page load restrictions

Vendor-maintained product required intuitive content production tools

Commerce solution for CNET allowed vendors to distribute and maintain product while delivering click-through revenue back to CNET

Page 7: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience

Apple eMac Retailer Toolkit

The Retailer Toolkit was an online system for sales team product training

Watch-and-Quiz format highlighted selling points, specs and more

Test results sent to store manager, then sent for aggregation by Apple

Apple was ensured greater consistency in sales practices and retail proficiency

Retail managers able to measure staff proficiency and target re-training

Page 8: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience

CNET Reviews site redesign

‘Reviews’ is the primary commerce engine and revenue producer for CNET

Redesign included new commerce back-end, new ad system & new network-wide common templates

Needed to improve user & vendor experience without confusing them

Business-critical redesign: failure in UI or back-end would have impacted revenue significantly

Page 9: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / User interface (application)

Solonis Portal redesign

The Portal is a total-business interface for sales, inventory and reporting

Existing product was clunky and unintuitive, causing user complaints

New UI and architecture used familiar icon and common UI tools

Introduced new ‘Help’ system and running ‘Tips’ footer to educate user

Main navigation stayed consistent, allowing users to feel grounded

Page 10: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / User interface (application)

Solonis Portal redesign

The Portal is a total-business interface for sales, inventory and reporting

New contact management and logging environment

Account Executive customizable toolset to fit individual needs and methods of work

Page 11: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / User interface (application)

Solonis Portal redesign

The Portal is a total-business interface for sales, inventory and reporting

Integration of features like Instant Messaging encouraged interaction between team members

IM conversation logging saved to blog-like space for internal review and sharing of practices, ideas and concerns across organization

Page 12: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience

HP Change internal promotion

HP staff worldwide needed to be included in the roll-out of HP’s new ads

Online web format replaced previous print brochure approach, resulting in significant budget savings

Tracking system gave HP metrics on internal awareness, which brochures did not offer

Online format allowed tweaking and revisions; brochure required 6-12 weeks advance for printing

Page 13: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience

ZDNet worldwide redesignCNET acquired ZDNet in 2001, requiring the rebuild of all properties worldwide to work with ad, content and analysis systems at CNET

Conversion of 5+ years static pages to dynamic publishing system pages

Conversion of unmanaged sites to common network-wide templates

Integration with CNET ad & analysis while keeping previous ZD ‘buys’ online

3 month timeline, business critical

Page 14: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience + Brand development

HotGigs site launch design

Contract staffing site needed new brand, site design & marketing campaign

Wide range of visitors required UI with ‘fast-track’ tools for savvy users and simple tools for newer users

Formidable competition meant HotGigs had to offer unique tools, services and approach

New product launch included publishing system and analysis integration, all during development

Page 15: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience + Brand development

HotGigs site launch design

Contract staffing site: new brand, site design & marketing campaign

Wide range of visitors required UI with ‘fast-track’ tools for savvy users and simple tools for newer users

Formidable competition meant HotGigs had to offer unique tools, services and approach

New product launch included publishing system and analysis integration, all during development

Page 16: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience + Brand development

G2 HomeWorks, Inc.Branding, collateral and web site

Wide range of visitors required UI with ‘fast-track’ tools for savvy users and simple tools for newer users

Formidable competition meant HotGigs had to offer unique tools, services and approach

New product launch included publishing system and analysis integration, all during development

Page 17: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience + Brand development

Lipservice Agency site design

Top national agency for voiceover talent in television and radio

Designed site in newsletter format, as old static site was rarely changed

Content focused on personal aspects of talent, to add depth to client perception of the actors

Page 18: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience + Brand development

Mark Farina record release

Site to accompany release of new album by major San Francisco record producer and musician

Created ‘Air Farina’ concept as homage to old-style airline safety guides

Client was so pleased with concept that album was renamed ‘Air Farina’ and new song written with same name

Page 19: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + rebranding

Sabri Properties rebranding

Property developer with ‘image problem’ needed to rebrand & educate

Refocused site content around community involvement and donations, which had not been widely publicized

Many images from communities where Sabri developed, to give current residents sense of ownership

Press section revamped and included photos and bios highlighting good

Page 20: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience + Brand development

ChickFlick Productions site

Site for independent film release “See How They Run”, a documentary about the mayoral race in San Francisco.

Page 21: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Portfolio / Site design + User experience + Brand development

Jiwire.com site design

New launch site for provider of high-speed wireless Internet information, products and services

Page 22: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] Bates (612) 578 0222 [email protected]

Presentation design / print projects

Designs and concepts by Jonathan Bates

Page 23: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Presentation design

Walker Art Center /HGA ArchitectsPresentation for donors and foundation

Page 24: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Presentation design

The Good ShepherdFundraising presentation for non-profitorganization

Page 25: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Presentation design

Entry House, Inc.Presentation for non-profit human services organization advocating education, self-sustainability training, employment aid, and achieving stability to reduce need for public financial assistance and reduce the extended use of other social services programs

Page 26: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Presentation design

Sabri PropertiesNew construction presentation for city review and community impact meetings

Designed in Adobe AIR as dynamic animation

Page 27: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Presentation design

Sabri PropertiesNew construction presentation for city review and community impact meetings

Designed in Adobe AIR as dynamic animation

Page 28: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] Bates (612) 578 0222 [email protected]

Identity design & brand building

Designs and concepts by Jonathan Bates

Page 29: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Identity & Brands

Echezeaux RestaurantTotal identity system

Page 30: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Identity & Brands

Foreign Cinema RestaurantLogo design and ad campaign

Page 31: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Identity & Brands

ChickFlick ProductionsLogo design and identity system

Page 32: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Identity & Brands

101Blu restaurantLogo design and identity system

Page 33: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Identity & Brands

101Blu restaurantLogo design and identity system

Page 34: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] Bates (612) 578 0222 [email protected]

Other design and ad development

Designs and concepts by Jonathan Bates

Page 35: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Advertising design

California Freedom Coalition2002 campaign for bus-stop ads by anti-Iraq war organization for worldwide protest

Page 36: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Advertising design

3M CorporationAd campaign for new industrial fire barrier product line

Page 37: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Brand design

IMPOSSIBLE FABRICSRebranding, ad campaign & corporate collateral system

Page 38: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] 2008

Broadcast design & production

Fox TV 1999 Emmy AwardsSegment for Emmy Awards show

(Concept producer; designer; motion graphics supervisor)

Page 39: Design Portfolio - Jonathan Bates - Online Senior Creative + New Media Developer

Jonathan Bates (612) 578 0222 [email protected] Bates (612) 578 0222 [email protected]

Jonathan Bates

[email protected]

www.jonbatesdesign.com

(612) 578 0222

Thank you for your interest!