Plain Writing

View Original

Bringing an Animation to Life

Client: Flexport, Toaster

Designers/Animators: Julie Aubrey and Ali Burney

Project: Website Redesign, About Page Animation

Capabilities: Content Strategy, Storyboarding, Copywriting


One of the benefits of working with a strategic copywriter is that they can help you bring abstract ideas and concepts to life. Here is one such example.

When working on the Flexport website update project, my role was to help them define the objectives for their pages, create a rough wireframe/content model, hand off to a designer, and then write all of the copy.

Identifying the need for an animation

For the About Page, it became clear that a simple animation was needed to help the audience quickly understand the business — creating a connection between Flexport’s mission and their product. This connection could have been attempted through words, static images, or maybe even a 1-2 minute video, but in this case, I felt an animation would make the biggest impact.

I’ve included the process below.

  • Image One: I noted the need for an animation in my page wireframe

  • Image Two: I storyboarded a quick outline of the content

  • Image Three: I wrote the copy for the design to support the animation

  • Image Four: The final design with the static animation

Click on the thumbnails below to expand.

No more black box

Here is the final animation which pays off the headline, “No More Black Box.” The user will need to click to open the box, and then they will see this animation, demonstrating the role Flexport plays in connecting all the dots within the global supply chain.

The project was a team effort and I’m really happy with the results.

See this content in the original post