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 2 months ago

ianjmacintosh commented 2 months ago

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

ianjmacintosh commented 2 months 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 2 months 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 2 months ago

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

ianjmacintosh commented 2 months ago

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

ianjmacintosh commented 2 months 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 2 months 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 3 weeks ago

kdghadlkghk I forgot to push my changes 🤦‍♂️