Web Giving Animation

Pushpay required a new thank you animation for their updated giving product church givers use to donate online to their church. The animation would appear once a payment was completed and needed to be seen as a visually appealing award for their generosity.

Utilizing Design Principles and front end coding

To ensure this animation would be as consistent as possible with our current products and experiences, I utilised the Pushpay design principles to ensure consistency and help guide the visual design of this task. The main principles I ended up applying to this animation were:

  • Make it memorable

  • Meaningful

  • Refined simplicity

Due to the limits of prototyping tools, I designed and built the animation out of HTML, CSS and SVG/XML code to push the boundaries and share how the animation would look.

designprinciples-posters.jpg

End result

The final design was positively received by stakeholders of the project and users of the product.

The animation is currently active online and continues to provide church givers a unique ending to their online giving experience.