Interaction Design – Web
Porsche 718 Microsite
How do we move away from one page long scrollers but maintain a good mobile experience?
Cramer-Krasselt has done a lot of compelling work for Porsche, from television, to print and direct mail, to digital work including microsites and mobile apps. I was excited to have an opportunity to make my mark for Porsche, and our team concepted the experience extensively looking for a modern approach that supported Porsche's technology story.
My role in the 718 microsite was threefold: I helped our creative team develop the original concept, I blew that concept out into a site (really state) map and series of wireframes which I presented internally and externally to our account and client teams, and then worked side by side with the art director and copywriter to translate those wires into a dynamic, compelling experience.
After years of long scrolling parallax marketing sites being the norm, we decided to push the boundaries of our supported browsers and do a more "flash-like" single page site, with lots of attention to hover states, builds, and animations. Knowing that in 2016 mobile and tablet support was critical (with around 40%-50% of visits coming from mobile), we created a similarly branded but stripped down mobile experience.
Development, deployment, and beyond.
Once we established the overall interaction language of the site, I worked with our art director and designer to work out detailed interactions page by page, and then codified these into an interaction spec document for our development team. Because of the dynamic nature of the site, solely handing off static page comps may have held the experience back.
Although I was primarily involved for the definition and design phases of the project, I had weekly meetings with our development partners to brainstorm solutions to hairy technical problems, like reverse-engineering traditional, multipage analytics tags from our media department into a solution that could work on a lazy-loading site like the 718.