Mendix tutorial: making it rain

In this quick tutorial, I am showing how to use Mendix to build an animated login page with slow-motion rain.

This is part of a larger demo I worked on for a fictitious insurance product called “STUFF”, which uses Mendix and blockchain to let users turn on and off their insurance policies in a single click.

I take you step by step, so you can code along and learn to build animations yourselves.

I will cover the following:

• Creating a new Mendix app
• Installing and using Gulp to re-compile SASS in CSS enable seeing the results of our work in real-time in the browser
• Embedding images into your design
• Creating animations using CSS

References to get you started:

• Get Mendix Studio Pro
• Find great free images
• Find PNG images for raindrops and more here. We used this one.