search

jncraton / box-line-text

Simple virtual whiteboarding
Other
455 stars 27 forks source link

Hand drawn effects #3

Open mkarliner opened 4 years ago

mkarliner commented 4 years ago

It's a very nice concept!

I feel that as it's a whiteboard, it could use a little more of an informal feel, as in: https://codepen.io/tmrDevelops/pen/NPXodB

I've had a go at including this, and the boxes work fine, but I suspect that the lines may need a different technique than a zero height box.

also, a more informal font would be nice.

jncraton commented 4 years ago

Thanks for this feedback. I'll certainly give it some thought.

Right now, this would be challenging to implement, as the architecture is currently very simple and assumes that everything lives on a 64px grid. If that assumption is broken, elements would have to become aware of their neighbors in order to make everything connect properly. That can certainly be done, but it unfortunately isn't as simple as a style change.

mkarliner commented 4 years ago

Yes, I think svg would be the way to go, but obviously at the cost of considerably more complexity. However, the idea is so attractive that I think it deserves the makeover. You may look at https://github.com/pshihn/rough I'm not really a front end person, but I'd be willing to help.

jncraton commented 4 years ago

I've been playing around with implementing this. Here's the current state showing the curved CSS border concept:

https://hand-drawn--box-line-text.netlify.app/#;f1133Hello;9422;e6133World