Completely broken on mobile.
Works for me on iPhone.
UI elements with a hand-drawn, sketchy look
41–50 of 123 posts
Re: UI elements with a hand-drawn, sketchy look
#42Reminds me of Balsamiq, which was the rage about 10 years ago.
Yes, was about to say the same, then saw your comment. IIRC, Peldi, Balsamiq founder, had blogged about it at the time. I like it too. Also reminds me vaguely of the Comic Sans font, which was the rage even earlier.
Perhaps more like Tekton, which was like a classier crisper comic sans
Re: UI elements with a hand-drawn, sketchy look
#43Reminds me of Balsamiq, which was the rage about 10 years ago.
It's still my go-to tool for mockups. I find it to be the most powerful tool to convey product behavior to stakeholders
Re: UI elements with a hand-drawn, sketchy look
#44rough.js is great. It is also powering excalidraw.
Ah that makes sense now. I nearly said it was like excalidraw, which is really nice for architecture diagrams more than for ui/ux I find.
Re: UI elements with a hand-drawn, sketchy look
#45Doesn't seem super accessible tho', tab focus leaves me wanting.
Re: UI elements with a hand-drawn, sketchy look
#46Firefox's "Enhanced Tracking Protection" seems to break their React demo. Turning that off though and things seem to load ok, even with UBlock Origin and Privacy Badger running.
Strange. It works here with "Enhanced Tracking Protection". Maybe I'm using a different version of Firefox?
I'm using FF 126.0.1 on Debian Linux x86_64, if that helps. :)
Re: UI elements with a hand-drawn, sketchy look
#47I personally like the look of this kind of thing enough I would want to use it for a real product, or maybe for the beta version of the product and then switch it up when official release. Probably too much extra work though.
There's good reason to use it for a beta build (or an alpha) - it changes the type of feedback you get.
While my google-fu is failing me as I write this, there was a blog post I read long ago about a making things look not done (I want to say it was in the context of an AWT look and feel). Related: xkcd-style Plots https://mathematica.stackexchange.com/questions/11350/xkcd-s... ( https://news.ycombinator.com/item?id=4597977 ) and https://www.chrisstucchio.com/blog/2014/why_xkcd_style_graph...
If the product looks done then the feedback you will get assumes that it is done.
I made the mistake of using a nice looking header (it looked better than the existing ones that were used which were stretched gifs and I had a CSS gradient) while working on the innards of some JavaScript. While I was trying to get feedback on the "is this workflow the right sequence of pages? Are these the UI elements that need to be on the page for this functionality? For that matter, am I missing some functionality?" .... and I got feedback about the color blue and if it should go from dark to light or light to dark in the gradient.
...
And with some digging I remembered the look and feel - https://napkinlaf.sourceforge.net
Which has the links to the blog post:
Don't make the Demo look Done - https://headrush.typepad.com/creating_passionate_users/2006/...
Re: UI elements with a hand-drawn, sketchy look
#48I love the sketchy UI elements. I hate the sketchy text font. Do normal sans-serif fonts and sketchy UI not fit together stylistically?
Re: UI elements with a hand-drawn, sketchy look
#49Last commit is three years ago
Re: UI elements with a hand-drawn, sketchy look
#50My favorite tool for this is Balsamiq Wireframes: https://balsamiq.com/wireframes/
Having to write code loses the point of quick and dirty.