Notes

In this episode, we worked on the progress element that will display in every step of the onboarding flow. I added some labels and styled the banner using Tailwind CSS. At the end of the stream, we boxed in the shape of the welcome page with some placeholder elements.

The very first thing I did was insert a top bar that was unstyled to the top of the welcome page. We added some placeholder text for each of the steps in the onboarding flow. After that, I started styling the UI until it took shape.

We talked about design elements like color and spacing and some aesthetic qualities that help make a user interface feel better.

After completing a first cut of the top bar navigation, I shifted to the welcome page and added vector art and placeholder text to give the page some life.