Your SlideShare is downloading. ×
0
Jonathan Bates<br />Creative & Design Direction<br />User Experience Development<br />Silverlight / AIR /Flash Dynamic Con...
My Background<br />6 years experience at CNET Networks<br /><ul><li>1996-1998, Director of Multimedia
2001-2003, Design Director (Commerce, All Network Sites)</li></ul>Roles/Responsibilities<br /><ul><li>Managed creative + p...
Oversaw sub-brand designs, redesigns & daily production for 13 properties worldwide
Developed & design new commerce systems</li></li></ul><li>My Background<br />@Home Network<br /><ul><li>Senior Producer, M...
Managed production staff and videographers
Responsible for content syndication relationships with CNN, Bloomberg, NBC…</li></li></ul><li>My Background<br />Jon Bates...
Silverlight & Adobe AIR rich media content
Commerce integration
Production systems integration and training
Content planning & site architecture</li></li></ul><li>Web user experience / UI / design<br />Designs, concepts and projec...
Portfolio / Site design + User experience<br />eCatalog Best 100 Products<br />eCatalog is a product directory system view...
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 ...
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</li></li></ul><li>Portfolio / Site design + User ...
Needed to improve user & vendor experience without confusing them
Business-critical redesign: failure in UI or back-end would have impacted revenue significantly</li></li></ul><li>Portfoli...
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</li></li></ul><li>Portfolio / User interface (applicati...
IM conversation logging saved to blog-like space for internal review and sharing of practices, ideas and concerns across o...
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  </li></li></ul><li>Portfo...
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</li></li></ul><li>Portfolio / Site design + User experience + Brand development<br />H...
Formidable competition meant HotGigs had to offer unique tools, services and approach
New product launch included publishing system and analysis integration, all during development</li></li></ul><li>Portfolio...
New offering required extensibility in brand identity for future growth
Logo and brand were ultimately designed to accommodate ‘Hot-’ as a future franchise
Inclusion of tagline helped solidify product identity</li></li></ul><li>Portfolio / Site design + User experience + Brand ...
Formidable competition meant HotGigs had to offer unique tools, services and approach
New product launch included publishing system and analysis integration, all during development</li></li></ul><li>Portfolio...
Content focused on personal aspects of talent, to add depth to client perception of the actors</li></li></ul><li>Portfolio...
Upcoming SlideShare
Loading in...5
×

Design Portfolio - Jonathan Bates

465

Published on

Jonathan Bates is an experienced creative director specializing in design of web content, rich media, UI for web and applications, CMS dynamic publishing and more.

His common cause: measurable, business-aligned creative that gets results in ways understood in corporate operational analysis: maximum return on investment, with measurable and significant results.

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
465
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Design Portfolio - Jonathan Bates"

  1. 1. Jonathan Bates<br />Creative & Design Direction<br />User Experience Development<br />Silverlight / AIR /Flash Dynamic Content<br />Site Architecture<br />Design / Production Management<br />CommerceIntegration<br />Web design, creative direction & rich media development<br />by Jonathan Bates<br />Revised January 2009More portfolio samples, resume and more online at jonbatesdesign.com<br />
  2. 2. My Background<br />6 years experience at CNET Networks<br /><ul><li>1996-1998, Director of Multimedia
  3. 3. 2001-2003, Design Director (Commerce, All Network Sites)</li></ul>Roles/Responsibilities<br /><ul><li>Managed creative + production staff (4-30+)
  4. 4. Oversaw sub-brand designs, redesigns & daily production for 13 properties worldwide
  5. 5. Developed & design new commerce systems</li></li></ul><li>My Background<br />@Home Network<br /><ul><li>Senior Producer, Multimedia</li></ul>Roles/Responsibilities<br /><ul><li>Produced daily broadband video content for two million subscribers worldwide
  6. 6. Managed production staff and videographers
  7. 7. Responsible for content syndication relationships with CNN, Bloomberg, NBC…</li></li></ul><li>My Background<br />Jon Bates Design<br /><ul><li>Creative Director</li></ul>Roles/Responsibilities<br /><ul><li>Multimedia/Dynamic Flash content
  8. 8. Silverlight & Adobe AIR rich media content
  9. 9. Commerce integration
  10. 10. Production systems integration and training
  11. 11. Content planning & site architecture</li></li></ul><li>Web user experience / UI / design<br />Designs, concepts and projects by Jonathan Bates<br />
  12. 12. Portfolio / Site design + User experience<br />eCatalog Best 100 Products<br />eCatalog is a product directory system viewable on- or offline. <br /><ul><li>Tight page load restrictions
  13. 13. Vendor-maintained product required intuitive content production tools
  14. 14. Commerce solution for CNET allowed vendors to distribute and maintain product while delivering click-through revenue back to CNET</li></li></ul><li>Portfolio / Site design + User experience<br />Apple eMac Retailer Toolkit<br />The Retailer Toolkit was an online system for sales team product training<br /><ul><li>Watch-and-Quiz format highlighted selling points, specs and more
  15. 15. Test results sent to store manager, then sent for aggregation by Apple
  16. 16. Apple was ensured greater consistency in sales practices and retail proficiency
  17. 17. Retail managers able to measure staff proficiency and target re-training</li></li></ul><li>Portfolio / Site design + User experience<br />CNET Reviews site redesign<br />‘Reviews’ is the primary commerce engine and revenue producer for CNET<br /><ul><li>Redesign included new commerce back-end, new ad system & new network-wide common templates
  18. 18. Needed to improve user & vendor experience without confusing them
  19. 19. Business-critical redesign: failure in UI or back-end would have impacted revenue significantly</li></li></ul><li>Portfolio / User interface (application)<br />Solonis Portal redesign<br />The Portal is a total-business interface for sales, inventory and reporting<br /><ul><li>Existing product was clunky and unintuitive, causing user complaints
  20. 20. New UI and architecture used familiar icon and common UI tools
  21. 21. Introduced new ‘Help’ system and running ‘Tips’ footer to educate user
  22. 22. Main navigation stayed consistent, allowing users to feel grounded</li></li></ul><li>Portfolio / User interface (application)<br />Solonis Portal redesign<br />The Portal is a total-business interface for sales, inventory and reporting<br /><ul><li>Integration of features like Instant Messaging encouraged interaction between team members
  23. 23. IM conversation logging saved to blog-like space for internal review and sharing of practices, ideas and concerns across organization</li></li></ul><li>Portfolio / Site design + User experience<br />HP Change internal promotion<br />HP staff worldwide needed to be included in the roll-out of HP’s new ads<br /><ul><li>Online web format replaced previous print brochure approach, resulting in significant budget savings
  24. 24. Tracking system gave HP metrics on internal awareness, which brochures did not offer
  25. 25. Online format allowed tweaking and revisions; brochure required 6-12 weeks advance for printing </li></li></ul><li>Portfolio / Site design + User experience<br />ZDNet worldwide redesign<br />CNET acquired ZDNet in 2001, requiring the rebuild of all properties worldwide to work with ad, content and analysis systems at CNET<br /><ul><li>Conversion of 5+ years static pages to dynamic publishing system pages
  26. 26. Conversion of unmanaged sites to common network-wide templates
  27. 27. Integration with CNET ad & analysis while keeping previous ZD ‘buys’ online
  28. 28. 3 month timeline, business critical</li></li></ul><li>Portfolio / Site design + User experience + Brand development<br />HotGigs site launch design<br />Contract staffing site needed new brand, site design & marketing campaign<br /><ul><li>Wide range of visitors required UI with ‘fast-track’ tools for savvy users and simple tools for newer users
  29. 29. Formidable competition meant HotGigs had to offer unique tools, services and approach
  30. 30. New product launch included publishing system and analysis integration, all during development</li></li></ul><li>Portfolio / Site design + User experience + Brand development<br />HotGigs site launch design<br />Contract staffing site needed new brand, site design & marketing campaign<br /><ul><li>Brand and logo development process involved multiple ideation stages
  31. 31. New offering required extensibility in brand identity for future growth
  32. 32. Logo and brand were ultimately designed to accommodate ‘Hot-’ as a future franchise
  33. 33. Inclusion of tagline helped solidify product identity</li></li></ul><li>Portfolio / Site design + User experience + Brand development<br />G2 HomeWorks, Inc.<br />Branding, collateral and web site<br /><ul><li>Wide range of visitors required UI with ‘fast-track’ tools for savvy users and simple tools for newer users
  34. 34. Formidable competition meant HotGigs had to offer unique tools, services and approach
  35. 35. New product launch included publishing system and analysis integration, all during development</li></li></ul><li>Portfolio / Site design + User experience + Brand development<br />Lipservice Agency site design<br />Top national agency for voiceover talent in television and radio<br /><ul><li>Designed site in newsletter format, as old static site was rarely changed
  36. 36. Content focused on personal aspects of talent, to add depth to client perception of the actors</li></li></ul><li>Portfolio / Site design + User experience + Brand development<br />Mark Farina record release<br />Site to accompany release of new album by major San Francisco record producer and musician<br /><ul><li>Created ‘Air Farina’ concept as homage to old-style airline safety guides
  37. 37. Client was so pleased with concept that album was renamed ‘Air Farina’ and new song written with same name</li></li></ul><li>Portfolio / Site design + rebranding<br />Sabri Properties rebranding<br />Property developer with ‘image problem’ needed to rebrand & educate<br /><ul><li>Refocused site content around community involvement and donations, which had not been widely publicized
  38. 38. Many images from communities where Sabri developed, to give current residents sense of ownership
  39. 39. Press section revamped and included photos and bios highlighting good</li></li></ul><li>Portfolio / Site design + User experience + Brand development<br />ChickFlick Productions site<br />Site for independent film release “See How They Run”, a documentary about the mayoral race in San Francisco.<br />
  40. 40. Portfolio / Site design + User experience + Brand development<br />Jiwire.com site design<br />New launch site for provider of high-speed wireless Internet information, products and services<br />
  41. 41. Presentation design / print projects<br />Designs and concepts by Jonathan Bates<br />
  42. 42. Presentation design<br />Walker Art Center /HGA Architects<br />Presentation for donors and foundation members prior to construction of major addition to Walker Art Center facitilty<br />
  43. 43. Presentation design<br />Entry House, Inc.<br />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<br />
  44. 44. Presentation design<br />Sabri Properties<br />New construction presentation for city review and community impact meetings<br />Designed in Adobe AIR as dynamic animation<br />
  45. 45. Presentation design<br />Sabri Properties<br />New construction presentation for city review and community impact meetings<br />Designed in Adobe AIR as dynamic animation<br />
  46. 46. Identity design & brand building<br />Designs and concepts by Jonathan Bates<br />
  47. 47. Identity & Brands<br />Echezeaux Restaurant<br />Total identity system<br />
  48. 48. Identity & Brands<br />Foreign Cinema Restaurant<br />Logo design and ad campaign<br />
  49. 49. Identity & Brands<br />ChickFlick Productions<br />Logo design and identity system<br />
  50. 50. Identity & Brands<br />101Blu restaurant<br />Logo design and identity system<br />
  51. 51. Identity & Brands<br />101Blu restaurant<br />Logo design and identity system<br />
  52. 52. Other design and ad development<br />Designs and concepts by Jonathan Bates<br />
  53. 53. Advertising design<br />California Freedom Coalition<br />2002 campaign for bus-stop ads by anti-Iraq war organization for worldwide protest<br />
  54. 54. Advertising design<br />3M Corporation<br />Ad campaign for new industrial fire barrier product line <br />
  55. 55. Brand design<br />IMPOSSIBLE FABRICS<br />Rebranding, ad campaign & corporate collateral system<br />
  56. 56. Broadcast design & production<br />Fox TV 1999 Emmy Awards<br />Segment for Emmy Awards show<br />(Concept producer; designer; motion graphics supervisor)<br />
  57. 57. Jonathan Bates<br />Thank you for your interest!<br />jonathan@jonbatesdesign.com<br />www.jonbatesdesign.com<br />(612) 578 0222 Revised 10 Jan 2009<br />
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×