Project Overview
Keeptrack is a project management platform designed to streamline workflows for service providers. The portal includes a suite of tools to make communication, timelines, delivery and payments easy.
For this project, Keeptrack wanted an animated Facebook ad that showcased their milestone invoicing feature. I worked closely with the client and was able to complete the project in 2 days.
Research
Something the client stressed to me was that they wanted to make sure the audience could easily recognize the milestone payment process. I received Figma files from the client that were very helpful in understanding the different parts of the UI, but we needed something more focused on the timeline portion. So, I headed over to LinkedIn's Ad Library to see some best practices in other successful examples.
I found that in a lot of the ads where they are focusing on a feature, it doesn't have to be a completely accurate representation of the UI. It can be broken up and adapted to fit the features you're highlighting.
Concepts
With this in mind, I started exploring different ways I could break up the existing dashboard that would still feel true to the app.
I decided to display the different milestones in a vertical format and bring in the payment toggle switch from a different part of the portal to make it clear how the process worked.
Design
In designing the visuals for this project, my goal was to keep it in line with the established look. Keeptrack's website has a modern and sleek feel, featuring a dark/bright green gradient.
Similarly, for the custom milestone graphics, I wanted to keep the clean look seen throughout the portal, utilizing rounded corners and soft shadows. This design fit well with the established brand and was exactly what the client was looking for.
Execution
I aimed to make the animation simple and quick, so they were in service of demonstrating the functionality of the app and not distracting from it.
We also decided on two different introductions. One that showed the full portal and one with a simple text animation. This allowed us to address a common pain point and offered Keeptrack’s milestone payments as the solution, while the other version integrated the full dashboard.
That's all folks!
This project was an exciting opportunity to demonstrate the functionality of complex software in an engaging and accessible way. The client was blown away by the final product, and I had a great time working with them!