Show HN: A drag drop webpage builder in 10k HTML/JS/CSS

http://10k.aneventapart.com/Entry/Details/659

by nrkn • 15 years ago

69 17 15 years ago

10k.aneventapart.com

geuis• 15 years ago

Very interesting. While I think there are some UI issues (a bit confusing to figure out how to change styles initially, how to save/open needs better explanation, etc), I believe these are simply attributed to the limited space available to the app.

Very good job, and I would love to see this fleshed out a bit outside of the contest.

nrkn8• 15 years ago

Thanks, definitely agree on there being some issues. I would have liked to have spent more time on polishing it but I submitted it literally 1 minute before the deadline. There's a link to the mailing list on the app if you want to follow progress :)

happyfeet• 15 years ago

Nice. The part I like the most is that I liked playing around with your app to know what it can do.

It does require changes to make it more intuitive and will be looking forward to see how it evolves. Good luck.

nrkn8• 15 years ago

Thanks, I have a todo list longer than my arm, a lot of which is UX related. There simply wasn't time, I expected to run out of bytes before I ran out of time but it turns out that 10k is a lot when you throw in zip compression - especially if you're coding with the way zip compression works in mind from the start

spiralganglion• 15 years ago

It's fantastic that you've tackled something so ambitious for 10k Apart. This is a super cool project, and the outcome is fun and inspiring. But it also offers a great benefit to me, personally. Lately, I've been heavily considering building a drag-drop, intuitive-as-possible editor for some of the content my company develops. I've never built such an editor before, so it's great to see some of the design decisions you made in putting this together.

On one hand, the system you've built feels limited. It's so easy to make the snap judgement, "Anything I could make with this tool would be trivial to code by hand — what use is it to me?". But that's a dangerous line of thinking to fall into, when evaluating such a tool as this. Maybe it's not supposed to be a replacement for code. Maybe it's a fundamentally different approach to content design.

I'll need to be mindful of this difference, when I build my editor. I'll be compelled to dream big, to attempt to make it both simpler and more powerful than what we can do with our hand-coded content. But it's an awful lot harder than one may expect, to capture the general ability to design something systematic in a very simple symbolic interface. I'd be wise to look for unique advantages that can come from visual/spatial interaction, and not just try to recreate the processes of coding with GUI tools.

Thank you for sharing this. Contest or not, you've made something that's inspired at least one fellow hacker.

nrkn8• 15 years ago

Thank you very much for your kind words. The paradigm that I have in mind is fundamentally different to how web dev tools are usually done. This is just a very rapid prototype of some of the most basic elements done rather crudely but I hope it gives some idea of the direction we're going :)

karl_nerd• 15 years ago

Love the snapiness and complete lack of fancy animations!

nrkn8• 15 years ago

I actually had some transitions etc. but I found they made it feel slow on anything but a desktop machine

PeterMcCanney• 15 years ago

Bravo!

Lovely bit of work for just 10K. The only criticism I would make is about the zoom. Not sure that the controls should enlarge as well.

Is there a betting pool where I can put a few quid on you winning the contest?

nrkn8• 15 years ago

Yeah the whole thing around that is a bit iffy, it was a compromise I made because it's a little fiddly on very small screens (my phone) and I didn't have time to think about it properly.

yannis• 15 years ago

Is the code open sourced? The UI needs some work and so does the css, but overall is very good for the amount of code.

nrkn8• 15 years ago

Hi there, not at the moment but I may be releasing something at some point depending on time etc., keep an eye on https://github.com/nrkn

geekytenny2• 15 years ago

I was dragging onto the grey area, i think the 'canvas-like' div should have a min-height even if it contains nothing. What do you think?

geekytenny2• 15 years ago

Great job though..

nrkn8• 15 years ago

Agreed. You're not the first person to say that.

gavinpc• 15 years ago

Note that you need cookies enabled for the site for the app to work.

Having said that, as Freud observed, "sometimes 10k is just 10k."

nrkn8• 15 years ago

Curious, as I didn't touch anything to do with cookies in the code. Perhaps browsers use the user setting for allowing cookies to also allow/disallow html5 localstorage, which the site does make use of.

Show HN: A drag drop webpage builder in 10k HTML/JS/CSS

Related Stories