Happy Monday everyone - just wanted to share what I managed to get built, using the “Vaulty” design for inspiration.
(oh, the PIN is 4242)
I started off by getting the functionality that I wanted. I knew that all the components would need to be restyled so at this stage I was just focused on where they were positioned.
I chose to place the button and the slider towards the bottom of the screen for ease of use, with the switches further up the screen as my feeling here was that they’d be used less often.
After that I wanted to get an image with a gradient for the button background. This was the second result that came up when I Googled “Gradient Generator”. It looks great and more importantly it allowed me to download a .jpg image so that’s what I went for.
Being able to see the screens side by side was really helpful. I opted to place the “Continue” button and the “Generate” button at the same height on the screen for a more consistent experience.
It’s not 100% perfect, but I managed to get the password generator working in 99 blocks!
Take a look at my project page if you want to have a closer look at the blocks or to remix the design,