Motion Graphics | May, 2019

WordPress Home Page & Slider

Corporate Branding

Created for OnScale, Inc.

My Role
Visual Designer
Tools
Photoshop, WordPress
Timeframe
4 Days

Problem

As the Visual Designer for OnScale Inc., I was asked to create a series of hero sections while I was developing the new WordPress website. These sections were meant to introduce people to the main features of OnScale's SaaS product and encourage them to scroll down and read more.

Solution

Design four hero sliders visually promoting the core concepts and features of OnScale to be displayed on the homepage of the company's website.

Background

OnScale was founded in 2018 by a team of scientists and engineers dedicated to delivering world-class Computer-Aided Engineering tools on next-gen High Performance Cloud Computers. I came onboard in February, 2019 as their sole Visual Designer.

In order to promote the company's online presence, I was asked to create a series of hero sections meant to introduce people to the main features of OnScale's SaaS product and encourage them to scroll down and read more.

For the first slide the CEO asked me to incorporate the Iron Man character rising above the Wright Brothers to symbolize how OnScale "blew away" the competition with it's technology. So I sketched out some ideas for a custom 'OnScale' Man:
The CEO explained he wanted to use an image of the real Iron Man figure, so I reached out to John Gallagher (@uncannyknack) who creates amazing fan art and asked his permission to use his rendition of Iron Man taking flight. The final composite is below:
I began by colorizing Iron Man's armor to match OnScale's company branding, then added the rocket trails, background clouds, and a stock image of the Wright Brothers. Here's a short layer breakdown:
Each layer was exported as a PNG and imported into the Revolution Slider WordPress plugin and then animated layer by layer to achieve the effect of Iron Man taking off above the Wright Brothers.
I used a licensed Adobe Stock video to create the second slide. The fourth slide was also from Adobe Stock with the OnScale logo photoshopped on the super hero's chest.

The third slide was an actual simulation of a motherboard created with OnScale software. The files was sent to me as an mp4 and I composited the 'OnScale' logo on the board using After Effects.
While I did develop the company website using WordPress, OnScale has since redesigned and redeployed their website since I left the company in November, 2019.

Conclusion

This project presented several challenging opportunities - giving me the chance to use my drawing skills as well as my technical Photoshop and animation skills to pull everything off. I had a lot of fun modifying the Iron Man image and really enjoyed getting in touch with John Gallagher - his artwork is amazing!

I also had fun using my animation skills in the WordPress Revolution Slider plugin as it presented new constraints and opportunities for animation on the web.