Moodboard

With the rare opportunity to make a site completely independent of our corporate brand, I made sure to do my research and gather examples so our CTO and CMO could buy into the vision throughout the process. Using InVision’s board tool, I pulled examples of sites that were immersive, elegant, and featured video and motion. I did a walkabout the Sherpa studio and found inspiration in a SMTP color test screen on a monitor. I took a risk would use that color bar as a motif and palette throughout the site. The color bar served to unify the many scenes where CXO films would be shot.

Wireframe

With a small budget and timeline, I kept the screens and interactions to a minimum. Besides, we would use the Sherpa Platform’s playlist API’s to bring in all the content, so for each speaker I had a cover photo and the videos to work with. I made do with what I had and focused on creating a polished experience. If the user had to wait for the images and videos to load, they would see a pleasant animation.

Motion Design

This was my first time using After Effects to pass animations off to developers and it was really fun! I produced this short video to demonstrate the parallax and transitions between loading and ready states for videos. In retrospect, I could have slowed down the example a bit. I also produced button transitions and the loading animations in After Effects and exported them with Body Movin’ so they could be loaded as SVGs by the developer.