about

Hi! I'm Peter Cole. I am a developer/designer/digital marketer from the San Francisco Bay Area. I like to create innovative experiences for the web, mobile, social networks, retail and other forms of interactive media.

I have over 20 years experience in technology and digital marketing, and have had the opportunity of working with some of the most amazing brands in the world. Most recently, I spent 7.5 years overseeing the front-end interface development for apple.com. Among many projects, my team worked on award-winning web experiences for the iPhone, Apple Watch, iPad, Apple TV, The Mac, and much more. I'm particularly proud of championing the mobile optimization of apple.com that started during the Sept. 2014 apple.com redesign.

Prior to Apple, I spent about 4 years as Technology Director for R/GA, where I worked on digital projects for Nike, Microsoft, Verizon, HP and others. At R/GA I was involved in the design and development of new products that combined the desktop, web, mobile and social (including Nike FuelBand). Prior to R/GA, I was the Director of Creative Development for AKQA, San Francisco, where our clients included Nike, Microsoft, Xbox, Target, The Gap, Visa and others. While there, I helped Nike, Target and the Gap launch their first mobile experiences; worked on Nike's first Global website and campaign, for the Olympics; created one of the first SMS-controlled kiosks for Palm.

I'd love to hear more about your business and your marketing goals. Let's explore strategic ways of using technology to help your business grow.

Please email me and lets get started!

work

  • Apple.com
    Apple.com

    I've spent the past 7-8 years at Apple, so most of my recent work can be seen on Apple.com. While there, I got to work with amazing developers and designers to create beautiful and engaging experiences that are seen by the whole world every day. Some projects included the launch of the Apple Watch, the iPhone, iPad Air 2, Macbook, Apple Music and more. My team works closely with the design team, from the start, creating prototypes for user interfaces and motion designs, and ultimately, we built the final work that goes live on apple.com. As well, I championed and oversaw the mobile optimization of apple.com that started during our Sept. 2014 redesign. This effort optimized apple.com for mobile and tablet devices.

    Visit the site.

  • Find Your 7
    Hyundai: Find Your 7

    Responsive Website and Facebook Application. Dynamically Generated Video.

    Challenge: Create a mobile-first experience that extends a TV spot to the digital/social arena. The Super Bowl is the most social event of the year, with an audience that watches across multiple screens, usually with their friends.

    Solution: A responsive, mobile-first, HTML5-based experience that lets people draft their own “dream team” for a chance to go to next year’s Super Bowl. A custom algorithm looked at the frequency of Facebook friend interactions, educational background, activities and interests to create the ideal team. This data was then used to create a custom, dynamically-generated video to introduce the user’s dream team.

  • FJ App
    Foot Joy: FJ Clubhouse

    Native Mobile Application. Prototype, User Research and Validation Phase.

    Challenge: Provide a mobile utility for the existing FJ Golf community (currently limited to desktop.) Create new ways for community members to meet, often while traveling, and to share golf tips specific to FJ courses. Grow community membership and have FJ viewed as a forward-thinking, technology-savvy brand.

    Solution: Integrated elements of FJ's existing community into a concept for a native mobile application that focuses on the ability to Play, Meet and Share. During our initial discovery and design phase, we created quick prototypes to show the flow and potential features for the app. We then brought the prototype to the golf courses, and put it into hands of potential users to explore. We captured their feedback and used it to refine our application features and user flow.

  • Off the Grid SF
    Off the Grid: offthegridsf.com

    WordPress Website. Email Newsletters.

    Off the Grid began in June of 2010 with the idea to group Street Food vendors together to allow neighbors to connect with friends, and families to reconnect with each other. Currently Off the Grid operates 23 weekly markets in the greater bay area, and works with over 180 vendors weekly.

    Challenge: Redesign and build for OfftheGridSF.com, using WordPress as CMS. Create new look and feel, branding and clean-up existing interface. Integrate with existing services and allow for easy maintenance and quick updates by non-technical staff.

    Solution: Redesigned website, logo and other branding; created a custom WordPress template for Off the Grid SF website and new designs for their email marketing. Also consulted on tools for streamlining their current CRM workflow.

  • Microsoft Surface
    Microsoft: Launch of Surface Tablet

    Responsive Website and Online Advertising.

    Challenge: "Top Secret"" project to create a digital launch strategy, including a new website, as well as social media-related content, for the launch of Microsoft's first tablet hardware: Surface. Required that we integrate with existing Surface brand and products (their original table-top devices). We had to design and build most of the experience without knowing what the product looked like, until the last few days prior to launch.

    Solution: Designed and built a responsive website that lives on surface.com. We established a plan for content migration and a CMS, and we synced-up with the Windows 8 launch strategy (also led by our R/GA team in San Francisco). We launched at exactly the right time: during the press conference announcement for Surface.

  • Nike Fuelband
    Nike: FuelBand

    Website, Native Mobile App.

    Challenge: How to bring the Nike+ platform to a larger audience of non-runners.

    Solution: Created a wearable technology that tracks the regular activity that a user does throughout the day, and equate that to calories using "NikeFuel" (points). The R/GA tech team in San Francisco built the original prototype for FuelBand - using Android technology to start, to prove out the idea. We then continued on as part of the larger production team to build the final mobile app and website, as well as to test the full experience.

  • Nikestore
    Nike: NikeStore.com

    Website/ecommerce.

    Challenge: Create a website framework that supports interactive experiences ranging from marketing promotions, videos and product demonstrations to online applications (NIKEiD) and e-commerce. Allow high customization and let users “see, touch, feel” the product in real-time. Transform current Flash-based website into HTML(5).

    Solution: Rebuilt entire front-end in HTML (from Flash). Created robust framework of reusable design patterns and components that allowed for maximum flexibility in design, quick updates and direct integration with back-end. Created applications that made the experience more than just browsing shoes: NIKEiD is an online application that enables the user to design their own custom shoe.

  • hp.com
    HP: HP.com

    Website Redesign.

    Challenge: Redesign HP.com from the ground up. Integrate social applications as well as many existing HP systems and services. Create a tighter and more unified UX that allowed for animation and full-scale graphics. Maximize SEO and allow for easy content updates.

    Process: Iterative process with tight integration between ID, visual design, creative technologist, who would create prototypes and/or motion studies of the experience prior to production development, and the HP engineering team.

    Note: R/GA's work is no longer live. Screenshot here shows the design that we created and launched in 2011.

  • Tacobell.com
    Tacobell: Tacobell.com

    Website, CMS and Online Advertising.

    Challenge: Redesign and rebuild tacobell.com from the ground up. Recommend CMS, tech stack, architecture, workflow, hosting environment and maintenance and support. Integrate with existing databases and services. Allow for quick updating of key content areas. Reduce use of Flash.

    Solution: HTML-based website using R/GA's custom CMS2 content management system.

  • Outbid
    Outbid: Online Real-time Auction

    Product Design. Mobile, Web and Facebook Apps

    At R/GA we created a new product from scratch for a new online auction company: Outbid. We designed the logo and branding, product strategy, UX, visual design and all front-end and iOS development. On the technical side, we integrated our iOS and web application with Outbid's proprietary, real-time auction engine, and a new back-end service layer.

  • Outbid
    Target: Gift Finder iPhone App

    Native iPhone Application.

    Had fun with this one. This was Target's first iPhone release. We wanted to do something for the holiday season and take advantage of the iPhone's ability to recognize a user shaking it (accelerometer). The Gift Finder app makes innovative use of the iPhone’s built-in accelerometer by selecting gift ideas at random after entering information such as gender and age range. Gifts are presented via a snow globe-style interface, activated when the user shakes the iPhone. The Target Gift Globe application is free and designed to help shoppers make gift decisions for their friends and family in a very fun and entertaining way.

    Visit demo.

  • Halo Believe
    Xbox: Halo 3 Believe

    Website and online advertising.

    Challenge: Create immersive website to support the release of Halo 3. We filmed a camera fly-through of a life-size diorama (recreating a battle scene from the game). We wanted the user to “be inside the scene,” to explore every detail; to scrub through the fly-through (video) without requiring full video to download.

    Solution: The fly-through video file was too large - we couldn't use it. Therefore, to allow the user to start interacting right away, we draw each frame from the video into Flash (creating a buffer to account for the play head forward and backward). To account for performance, each time a frame was changed, the old one was destroyed from memory. The result was a smooth experience that loaded quickly and allowed the user to move forward and backward through the experience. It was not actually video - although it looked like it. It even fooled the CTO of Adobe, who showcased it during the Adobe MAX conference as an innovative use of web video.

  • Microsoft In-store kiosk
    Microsoft: In-store Kiosk

    Desktop Application.

    Challenge: Design and build an in-store kiosk in WPF (Window Presentation Foundation), to show off the features of the new Windows Operating System, Vista. Because Vista was not yet released at the time we were designing and building the experience, we had to develop for an OS that we could not test on. The experience would ultimately live in stores like Best Buy, and needed to support multiple languages

    Solution: For our experience, we recreated the 3D panel UI that was signature of the Vista OS.

  • Nike Genealogy
    Nike: Genealogy of Speed

    Website and Outdoor experience.

    Challenge: Demonstrate Nike’s rich, 40-year history of products. Trace the history (the “genealogy”) starting with the first “waffle” shoe. Show and maintain complex relationships between products, their assets and their “siblings” in the family tree. Allow for outdoor experience.

    Solution: Created dynamically generated family tree of Nike products. Entire interface was driven by database of products and drawn to screen at runtime - including the animation, colors, copy and visual effects - all showing the relationship between each product in the genealogy.

  • Nike Genealogy
    Nike: Presto

    Website and online advertising.

    Challenge: Promote the Nike Presto Shoe. Highlight the fun, artistic vibe of the brand that blends elements of street art.

    Solution: This one was a lot of fun. I had been experimenting with the ability to record a user's actions in the browser - specifically, recording an art performance: painting, playing with shapes, colors, etc. I also created the ability to playback the recording and save it to a gallery for others to see. I had done some prototypes in Flash, and we ended up using this concept as inspiration for Nike Presto. In 2004, this was an innovative first and went on to win a D&AD award.

  • Palm SMS-Controlled Kiosk
    Palm: SMS-Controlled Kiosk

    Outdoor/Physical application and accompanying website.

    Challenge: Demonstrate the features of the Palm Treo to users of any smart phone.

    Solution: Built a giant Palm Treo, using a LCD screen and a computer, and placed it inside bus shelters and other outdoor locations. Users could interact with the giant Palm by texting codes from their own smart phone. Our system intercepted the text message and routed it back to the correct location where the Palm would respond.

  • FIFA
    Prototype: Twitter-Driven WebGL Interface

    WebGL/three.js, Twitter App.

    Challenge: How to show the passion for your team via Tweets. The team with the most Tweets will have their team color the most prominent in the visual experience.

    Solution: I built a Twitter app that searches for Tweets for each FIFA team (eg. #arsenal). This data was then used to power various visualizations, including a 3D WebGL experience (using three.js), an iOS Native App and a physical device (a prototype built using arduino.) The team with the most social buzz, "passionate fans," would trigger the light for that team's color to turn on and pulse on the arduino board. Each 3D shape within the web experience represents a live tweet (for the prototype, I had to cache the results for performance sake); clicking on a shape will bring up the Tweet associated with that shape. For the prototype, I added in graphics for some Tweets that didn't have them.

    Visit the site. (Requires WebGL)

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17

services

It all starts with understanding your business and how digital application and/or experiences can help achieve your specific goals. Some things I can help with:

 

 

contact

Please email me at info@petercole.com if you have more questions or just want to say hi!