Jonathan BatesCreative & Design DirectionUser Experience DevelopmentSilverlight / AIR /Flash Dynamic ContentSite ArchitectureDesign / Production ManagementCommerceIntegrationWeb design, creative direction & rich media developmentby Jonathan BatesRevised January 2009More portfolio samples, resume and more online at jonbatesdesign.com
My Background6 years experience at CNET Networks1996-1998, Director of Multimedia
2001-2003, Design Director (Commerce, All Network Sites)Roles/ResponsibilitiesManaged creative + production staff (4-30+)
Oversaw sub-brand designs, redesigns & daily production for 13 properties worldwide
Developed & design new commerce systemsMy Background@Home NetworkSenior Producer, MultimediaRoles/ResponsibilitiesProduced daily broadband video content for two million subscribers worldwide
Managed production staff and videographers
Responsible for content syndication relationships with CNN, Bloomberg, NBC…My BackgroundJon Bates DesignCreative DirectorRoles/ResponsibilitiesMultimedia/Dynamic Flash content
Silverlight & Adobe AIR rich media content
Commerce integration
Production systems integration and training
Content planning & site architectureWeb user experience / UI / designDesigns, concepts and projects by Jonathan Bates
Portfolio / Site design + User experienceeCatalog Best 100 ProductseCatalog 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 CNETPortfolio / Site design + User experienceApple eMac Retailer ToolkitThe Retailer Toolkit was an online system for sales team product trainingWatch-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-trainingPortfolio / Site design + User experienceCNET Reviews site redesign‘Reviews’ is the primary commerce engine and revenue producer  for CNETRedesign 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 significantlyPortfolio / User interface (application)Solonis Portal redesignThe Portal is a total-business interface for sales, inventory and reportingExisting 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 groundedPortfolio / User interface (application)Solonis Portal redesignThe Portal is a total-business interface for sales, inventory and reportingIntegration 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 organizationPortfolio / Site design + User experienceHP Change internal promotionHP staff worldwide needed to be included in the roll-out of HP’s new adsOnline 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  Portfolio / Site design + User experienceZDNet worldwide redesignCNET acquired ZDNet in 2001, requiring the rebuild of all properties worldwide to work with ad, content and analysis systems at CNETConversion 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 criticalPortfolio / Site design + User experience + Brand developmentHotGigs site launch designContract staffing site needed new brand, site design & marketing campaignWide 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 developmentPortfolio / Site design + User experience + Brand developmentHotGigs site launch designContract staffing site needed new brand, site design & marketing campaignBrand and logo development process involved multiple ideation stages
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 identityPortfolio / Site design + User experience + Brand developmentG2 HomeWorks, Inc.Branding, collateral and web siteWide 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 developmentPortfolio / Site design + User experience + Brand developmentLipservice Agency site designTop national agency for voiceover talent in television and radioDesigned 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 actorsPortfolio / Site design + User experience + Brand developmentMark Farina record releaseSite to accompany release of new album by major San Francisco record producer and musicianCreated ‘Air Farina’ concept as homage to old-style airline safety guides

Design Portfolio - Jonathan Bates

  • 1.
    Jonathan BatesCreative &Design DirectionUser Experience DevelopmentSilverlight / AIR /Flash Dynamic ContentSite ArchitectureDesign / Production ManagementCommerceIntegrationWeb design, creative direction & rich media developmentby Jonathan BatesRevised January 2009More portfolio samples, resume and more online at jonbatesdesign.com
  • 2.
    My Background6 yearsexperience at CNET Networks1996-1998, Director of Multimedia
  • 3.
    2001-2003, Design Director(Commerce, All Network Sites)Roles/ResponsibilitiesManaged creative + production staff (4-30+)
  • 4.
    Oversaw sub-brand designs,redesigns & daily production for 13 properties worldwide
  • 5.
    Developed & designnew commerce systemsMy Background@Home NetworkSenior Producer, MultimediaRoles/ResponsibilitiesProduced daily broadband video content for two million subscribers worldwide
  • 6.
    Managed production staffand videographers
  • 7.
    Responsible for contentsyndication relationships with CNN, Bloomberg, NBC…My BackgroundJon Bates DesignCreative DirectorRoles/ResponsibilitiesMultimedia/Dynamic Flash content
  • 8.
    Silverlight & AdobeAIR rich media content
  • 9.
  • 10.
  • 11.
    Content planning &site architectureWeb user experience / UI / designDesigns, concepts and projects by Jonathan Bates
  • 12.
    Portfolio / Sitedesign + User experienceeCatalog Best 100 ProductseCatalog is a product directory system viewable on- or offline. Tight page load restrictions
  • 13.
    Vendor-maintained product requiredintuitive content production tools
  • 14.
    Commerce solution forCNET allowed vendors to distribute and maintain product while delivering click-through revenue back to CNETPortfolio / Site design + User experienceApple eMac Retailer ToolkitThe Retailer Toolkit was an online system for sales team product trainingWatch-and-Quiz format highlighted selling points, specs and more
  • 15.
    Test results sentto store manager, then sent for aggregation by Apple
  • 16.
    Apple was ensuredgreater consistency in sales practices and retail proficiency
  • 17.
    Retail managers ableto measure staff proficiency and target re-trainingPortfolio / Site design + User experienceCNET Reviews site redesign‘Reviews’ is the primary commerce engine and revenue producer for CNETRedesign included new commerce back-end, new ad system & new network-wide common templates
  • 18.
    Needed to improveuser & vendor experience without confusing them
  • 19.
    Business-critical redesign: failurein UI or back-end would have impacted revenue significantlyPortfolio / User interface (application)Solonis Portal redesignThe Portal is a total-business interface for sales, inventory and reportingExisting product was clunky and unintuitive, causing user complaints
  • 20.
    New UI andarchitecture used familiar icon and common UI tools
  • 21.
    Introduced new ‘Help’system and running ‘Tips’ footer to educate user
  • 22.
    Main navigation stayedconsistent, allowing users to feel groundedPortfolio / User interface (application)Solonis Portal redesignThe Portal is a total-business interface for sales, inventory and reportingIntegration of features like Instant Messaging encouraged interaction between team members
  • 23.
    IM conversation loggingsaved to blog-like space for internal review and sharing of practices, ideas and concerns across organizationPortfolio / Site design + User experienceHP Change internal promotionHP staff worldwide needed to be included in the roll-out of HP’s new adsOnline web format replaced previous print brochure approach, resulting in significant budget savings
  • 24.
    Tracking system gaveHP metrics on internal awareness, which brochures did not offer
  • 25.
    Online format allowedtweaking and revisions; brochure required 6-12 weeks advance for printing Portfolio / Site design + User experienceZDNet worldwide redesignCNET acquired ZDNet in 2001, requiring the rebuild of all properties worldwide to work with ad, content and analysis systems at CNETConversion of 5+ years static pages to dynamic publishing system pages
  • 26.
    Conversion of unmanagedsites to common network-wide templates
  • 27.
    Integration with CNETad & analysis while keeping previous ZD ‘buys’ online
  • 28.
    3 month timeline,business criticalPortfolio / Site design + User experience + Brand developmentHotGigs site launch designContract staffing site needed new brand, site design & marketing campaignWide range of visitors required UI with ‘fast-track’ tools for savvy users and simple tools for newer users
  • 29.
    Formidable competition meantHotGigs had to offer unique tools, services and approach
  • 30.
    New product launchincluded publishing system and analysis integration, all during developmentPortfolio / Site design + User experience + Brand developmentHotGigs site launch designContract staffing site needed new brand, site design & marketing campaignBrand and logo development process involved multiple ideation stages
  • 31.
    New offering requiredextensibility in brand identity for future growth
  • 32.
    Logo and brandwere ultimately designed to accommodate ‘Hot-’ as a future franchise
  • 33.
    Inclusion of taglinehelped solidify product identityPortfolio / Site design + User experience + Brand developmentG2 HomeWorks, Inc.Branding, collateral and web siteWide range of visitors required UI with ‘fast-track’ tools for savvy users and simple tools for newer users
  • 34.
    Formidable competition meantHotGigs had to offer unique tools, services and approach
  • 35.
    New product launchincluded publishing system and analysis integration, all during developmentPortfolio / Site design + User experience + Brand developmentLipservice Agency site designTop national agency for voiceover talent in television and radioDesigned site in newsletter format, as old static site was rarely changed
  • 36.
    Content focused onpersonal aspects of talent, to add depth to client perception of the actorsPortfolio / Site design + User experience + Brand developmentMark Farina record releaseSite to accompany release of new album by major San Francisco record producer and musicianCreated ‘Air Farina’ concept as homage to old-style airline safety guides