Show HN: Wired-elements – UI web components with a hand drawn, sketchy look • Hacker News Board

Re: Show HN: Wired-elements – UI web components with a hand drawn, sketchy look

#91

Post by donmatito » Fri, May 25, 2018, 9:13 AM UTC

I am not a designer but THIS IS SO AWESOME

Re: Show HN: Wired-elements – UI web components with a hand drawn, sketchy look

#92

Post by Naushad » Fri, May 25, 2018, 9:20 AM UTC

I love it. I am a Designer and its on my list to re-design my portfolio site, which i want to look like a wireframe. I will definitely explore this.

Re: Show HN: Wired-elements – UI web components with a hand drawn, sketchy look

#93

Post by shihn » Fri, May 25, 2018, 9:28 AM UTC

myguysi wrote: post #39

Tijdreiziger wrote: post #38

Earlier quoted context omitted.

FYI, the slider doesn't work at all on Chrome Android.

Same on Safari iOS

Slider is fixed now.

Re: Show HN: Wired-elements – UI web components with a hand drawn, sketchy look

#94

Post by shihn » Fri, May 25, 2018, 9:28 AM UTC

mirimir wrote: post #63

asdsa5325 wrote: post #26

Looks nice, but I have a bug: The sliders don't work properly, when trying to move them they will always start back at 0. (I'm using Firefox 60).

Also on Firefox (in Debian). It's not exactly that the slider starts at zero. It's that, when you grab it, the starting position becomes a pointer offset. You can set it wherever you like, accounting for the offset. It reminds me of capture failure in VMs.

Slider is fixed now.

Re: Show HN: Wired-elements – UI web components with a hand drawn, sketchy look

#95

Post by shihn » Fri, May 25, 2018, 9:28 AM UTC

bonoetmalo wrote: post #76

Slider handle doesn't work on Chrome Android 66.0

Slider is fixed now.

Re: Show HN: Wired-elements – UI web components with a hand drawn, sketchy look

#96

Post by Vinnl » Fri, May 25, 2018, 11:10 AM UTC

That's brilliant! One suggestion I have is to prevent rerendering when changing states, e.g. when checking a checkbox, draw a checkmark without changing the shape of the actual box it's in, or when selecting a dropdown item, to not change the edges of the dropdown even if the label displayed in it changes. Probably a lot more work though :)

Re: Show HN: Wired-elements – UI web components with a hand drawn, sketchy look

#97

Post by ergo14 » Fri, May 25, 2018, 11:43 AM UTC

swyx wrote: post #42

spankalee wrote: post #15

Earlier quoted context omitted.

These are web components and work fine within React already. We shouldn't need to port every interesting UI component to every single framework anymore.

i know and it was more just an exercise for myself. polymer and react interop still isnt very nice as far as i can tell. calm down :)

Those elements don't use polymer, they use lit-element - it is from polymer team and uses one polymer mixin, but its not polymer base element.

Re: Show HN: Wired-elements – UI web components with a hand drawn, sketchy look

#98

Post by roddux » Fri, May 25, 2018, 12:31 PM UTC

Reminds me of back when people used to make hand-drawn controls in Adobe Flash! Good memories. Nice work.

Re: Show HN: Wired-elements – UI web components with a hand drawn, sketchy look

#99

Post by fredley » Fri, May 25, 2018, 1:00 PM UTC

roddux wrote: post #98

Reminds me of back when people used to make hand-drawn controls in Adobe Flash! Good memories. Nice work.

Flash was a wonderful era for the web. It's sad that nothing equivalent ever really came along to replace it.

Re: Show HN: Wired-elements – UI web components with a hand drawn, sketchy look

#100

Post by 131012 » Fri, May 25, 2018, 1:07 PM UTC

shihn wrote: post #93

myguysi wrote: post #39

Earlier quoted context omitted.

Same on Safari iOS

Slider is fixed now.

There are still minor issues. The roughness slider disappeared when I slid it all the way to the right (on Firefox 60).

But good work anyway, the results are really nice!