In 2009, Flash was widely used by the audiences we were reaching with the websites we created at Dixon Schwabl so the Flash train wasn’t slowing down just yet. However, three things were happening that got us to start changing our solutions. The lack of Flash support on mobile devices meant that a user was shown a "Get Flash Player" button on their phone browsers, SEO and Google search was becoming more of a concern for clients and Flash sites were not crawlable, and it was becoming more popular for us to put a CMS behind our websites so our clients could update the sites themselves.
So while we still kept making Flash sites, we also added more work to account for all of these new changes.
Sample New York
The Sample New York website was a way to promote New York agriculture and exports all year around. It pointed to events and places where you can experience what New York State had to offer.
Most of the site was built in HTML and was driven by Drupal on the back-end. We wanted the homepage to have a WOW factor, so when you were on a computer that supported Flash, you would see the homepage animate in from all sides.
Here is what the homepage animation looked like:
The events would be pulled in from a calendar in the CMS. Clicking on a link on the homepage brought you to one of the interior pages.
My role in this project was to create the homepage animation and populate the Events area. It was really fun to animate the homepage, but the thing I liked the most were the animated bees in the top-right corner.
Finger Lakes Riesling Festival
For those who are unaware, Rochester, NY sits right above the Finger Lakes and based on its latitude, areas around the lakes are very good for grape growing and wine production. Because of this, the area is busy with tourism in the summer and our local wine and spirit stores usually stock 1-2 aisles of wine produced in the area.
Having relationships with many of the wine producers, Dixon Schwabl helped put on a large tasting event in Canandaigua, NY that featured all wineries who wished to participate.
We created a fully Flash website that featured hand-drawn and animated illustrations in a Where’s Waldo fashion. Starting on a splash screen with a blue background, clicking on "Enter Site" panned down to reveal the illustrated festival around a lake. When you hovered over a group of people, they would animate and then clicking the group triggered an animation of a column coming up from one side of the screen or another. The column displayed information about the event.
When left idle, animations would trigger. For example, a balloon might float up into the air or a plane would fly by with the logo of one of the event sponsors.
My part in this project was to do all of the programming and animation based on collaboration with our designers.
Riesling Festival Updates
While we loved the full Flash site, over the years we would address the problems with Flash in a few different ways. In 2010 we added HTML placeholders that brought you to a full HTML version of the site—reusing the same content and illustrations, but without the animations. If your browser didn’t support Flash, you could at least get to the content.
As an experiment, we partnered with a local app developer who created an iOS app that had a similar look and feel to our website. The app would mirror the information from the website and it would get updated year after year.
Finally, by 2013 we redesigned and re-developed the festival website as a fully responsive HTML/CSS website. While I don’t have a video of it in reach, one unique feature of the new site was that we had broken up the header image into layers and created a parallax animation for when you hovered over one of the main four buttons.
For example, when you hovered over Activities, the images in the header started slowly panning over to the left at different rates until settling into a new scene of images.
I believe this was created in JavaScript, using Greensock to help coordinate all of the movement and the easing effects in a performant way.
Fin
Both of these projects started to show that the needs of our clients were changing. The web was no longer only a novelty, but it could lead to a great impact on the success of a business, and our projects would begin to reflect that.
Looking back, I still loved working on these subtle animations and working with our designers to iterate until we got them all right. At the same time, I was the iPhone/iPad guy who championed Steve Jobs’ "Thoughts on Flash" article as a way to start looking towards a Flash-less future.