Video: HeavyJob overview
HeavyJob is a software by Heavy Construction Systems Specialists that helps project managers and construction workers track their constructions costs, materials, and work hours in the field and office. The overview video lives on the top of the product main page, and provides a brief intro explaining the benefits of the software.
The Problem: The previous product video was created many years ago, and has since become outdated. It heavily featured B-roll interchanged with screen recording of a user navigating the software. In the old version of the video, the full functionality of the product did not translate due to small screen details. This also affected the pacing of the video, with the screen recordings being slow and not exciting.
![]()
My Role: On a two-person team, I was responsible for designing all of the graphic elements. I sketched the storyboard, designed illustrations, icons, backgrounds, and text, and animated most of these elements.
Proposed solutions: To come up with the look of the video, I have conducted research into other software companies, and analyzed the flow of the videos and the stylistic choices of graphics. I developed a brief storyboard that included about 10 boards, detailing the angles and implied motions. After finalizing the storyboard, I sourced the images needed. Many of them, like people and icons, could be found in Adobe stock, and all that was needed was to pick the elements I liked, rearrange them into a new composition, and then recolor them to match the look of the video. The others, like the software interfaces, had to be created from scratch. While I had many screenshots available, the size of the text on each of them would be almost invisible when added into the video. To solve this, I had created a series of SUIs - Simplified User Interfaces, where I could enlarge the text, simplify some copy into lines and boxes, and make sure I show enough of the graph to drive the point across without overwhelming the composition. After I had all my design elements ready to be imported into After Effects, I moved onto animation. This part was pretty straightforward, and the most important thing was to keep the pace of the video consistent with the voiceover.![]()
Some of the simplified product interface graphics I designed in Adobe Illustrator. All of the boxes, shapes, and text were placed into different layers to be animated separately.![]()
How these solutions solved the problem: Updating the graphics and b-roll of the video helped refresh of the look of the website. It also provided a more user-friendly overview of the product.
Challenges: Every step of the project had its own set of challenges. The initial script had suggestions for visuals, and I had to look realistically at which of them would look good in the video, and which would stand out too much. For example, one of the wishes on the script was to have a bulldozer drive past the camera, and the puff of smoke after it would reveal one of the value propositions. While it sounds good on paper, an effect like this could easily look dated. Another challenging part of the video was showing how the software works in the field and in office. The first idea I had was showing the ipad fly horizontally from one location into another. This felt too literal, and too long. Instead, I used a match cut to use the downward motion of the central element (iPad) to quickly switch the background from field to office.
What I learned: This project gave me a great insight into the importance of a detailed storyboard. What I had was a series of loose sketches, and it would’ve been helpful to have them properly designed and even colored, because this would have allowed me to focus more on animation and less on the design.
The full Video
The Problem: The previous product video was created many years ago, and has since become outdated. It heavily featured B-roll interchanged with screen recording of a user navigating the software. In the old version of the video, the full functionality of the product did not translate due to small screen details. This also affected the pacing of the video, with the screen recordings being slow and not exciting.
My Role: On a two-person team, I was responsible for designing all of the graphic elements. I sketched the storyboard, designed illustrations, icons, backgrounds, and text, and animated most of these elements.
Proposed solutions: To come up with the look of the video, I have conducted research into other software companies, and analyzed the flow of the videos and the stylistic choices of graphics. I developed a brief storyboard that included about 10 boards, detailing the angles and implied motions. After finalizing the storyboard, I sourced the images needed. Many of them, like people and icons, could be found in Adobe stock, and all that was needed was to pick the elements I liked, rearrange them into a new composition, and then recolor them to match the look of the video. The others, like the software interfaces, had to be created from scratch. While I had many screenshots available, the size of the text on each of them would be almost invisible when added into the video. To solve this, I had created a series of SUIs - Simplified User Interfaces, where I could enlarge the text, simplify some copy into lines and boxes, and make sure I show enough of the graph to drive the point across without overwhelming the composition. After I had all my design elements ready to be imported into After Effects, I moved onto animation. This part was pretty straightforward, and the most important thing was to keep the pace of the video consistent with the voiceover.
Some of the simplified product interface graphics I designed in Adobe Illustrator. All of the boxes, shapes, and text were placed into different layers to be animated separately.
How these solutions solved the problem: Updating the graphics and b-roll of the video helped refresh of the look of the website. It also provided a more user-friendly overview of the product.
Challenges: Every step of the project had its own set of challenges. The initial script had suggestions for visuals, and I had to look realistically at which of them would look good in the video, and which would stand out too much. For example, one of the wishes on the script was to have a bulldozer drive past the camera, and the puff of smoke after it would reveal one of the value propositions. While it sounds good on paper, an effect like this could easily look dated. Another challenging part of the video was showing how the software works in the field and in office. The first idea I had was showing the ipad fly horizontally from one location into another. This felt too literal, and too long. Instead, I used a match cut to use the downward motion of the central element (iPad) to quickly switch the background from field to office.
What I learned: This project gave me a great insight into the importance of a detailed storyboard. What I had was a series of loose sketches, and it would’ve been helpful to have them properly designed and even colored, because this would have allowed me to focus more on animation and less on the design.
The full Video