Add some visual interest elements

ianjmacintosh / wifi-qr-code

An application to let anyone share the wifi with a picture

https://whatsthewifipassword.com/

0 stars 0 forks source link

Add some visual interest elements #26

Open ianjmacintosh opened 1 month ago

ianjmacintosh commented 1 month ago

https://www.learnui.design/blog/spice-up-designs.html

ianjmacintosh commented 1 month ago

Things to try (NOT NECESSARILY TO SHIP -- THEY MIGHT SUCK):

[x] Background highlight shape on the QR code generator box (example)
[x] Subtle lines as a background (make sure the text is legible)
[ ] Big words in the background ("Make a QR code for guests")
[ ] Thick transparent border around QR generator box. Should I use a different border around the QR code itself?
[ ] Some icons to show that we're talking about wifi and passwords
[ ] Offset border example

ianjmacintosh commented 1 month ago

I'm thinking the headline should be in a handwritten font. The "Modern Font Stack" option for handwritten is ugly; I may lean into Google Fonts here and suck up the performance hit.

I'd also like a cool "handwritten"-looking highlight swash in it

ianjmacintosh commented 1 month ago

https://heropatterns.com/ for cool SVG background patterns

ianjmacintosh commented 1 month ago

https://anthonyhobday.com/sideprojects/saferules/ is nice

ianjmacintosh commented 1 month ago

Subtle lines looks alright, need to make text legible. Diagonal lines looks OK, not sure if I should go with a more intense pattern or if super subtle is better

ianjmacintosh commented 1 month ago

The offset circle thing doesn't do much for me The "topography" background seems too noisy The highlight looks cool but I'm not sure what to do when the headline breaks to multiple lines Icons might look alright, I just gotta figure out where to insert them

ianjmacintosh commented 5 days ago

kdghadlkghk I forgot to push my changes 🤦‍♂️