Creating a design that lives up to the quality of the course

Brief

My good friend Dominic Elm whom I work with at Bolt.new asked if I could lend a hand unblocking the creation of his WebAssembly course landing page.

I started by moodboarding some if the inspirations he had. Then once the vision was clearer, started exploring modern UIs.

Some early explorations

Finding a visual signature

After a few explorations, I found an interesting interactive effect playing with masks of binary motifs and blur shapes tracking the cursor movement. This created an interesting pattern to bring an element of surprise in an interface that had to be clear and put the content forward above all.

This pattern was then used with various opacity masks and lightning effects to keep the page visually attractive and interesting.

Try it for yourself

Dominic did a very careful responsive & interactive implementation of the designs. The result looks really great, check it out here.

Thanks for reading!