
Minimal wireframing tool - for free - usaphp
http://wireframe.cc
======
duopixel
This is really cool! One suggestion: visual editors are probably the only
place where I don't mind my backspace button being binded to the delete
action. I tried deleting something with backspace and ended up back here
without warning, and my (useless) work was lost. I can imagine this causing a
lot of frustration in a real work setting.

~~~
danneu
This is why I unmapped Backspace -> Back in Firefox. It's just a source of
heartache.

Typical example is trying to backspace in a textarea -- whoops -- textarea
didn't have focus. Your progress was probably lost because most textareas
these days are actually some textarea-looking Javascript magic.

------
troels
Very cool idea to let the user mark an area before selecting widget, rather
than the reverse, which is more or less the standard way. It works well.

I would suggest that you save state in local-storage and/or hook into the
onunload event, to prevent people from accidentally abandoning a sketch.

------
dan1234
Very nice but I'd love to see the ability to snap stencils to a grid as I had
trouble lining them up.

~~~
__sb__
I'm going to second snapping, even if it's just snapping to other elements on
the page.

~~~
gk1
Seems as though this is already a feature. When I created a headline and moved
it close to a body of text, a guideline appeared and I was able to snap to it.

------
stefanve
very nice UI, I really like the idea of marking an area and than choose what
type it is. seems to be great for a tablet UI as well. For an opensource off-
line tool may I suggest pencil project. I'm currently using it for my work.

------
faramarz
How do I export the jpeg/png? If I can't share my wireframe, what good is my
work really. I guess I can capture the screen..

~~~
mistercow
You can also just save and then send the link.

------
rustc
Very very well done.

I wonder if there's anything comparable open source version? I'd like to hack
on it a bit.

~~~
zem
another comment mentioned pencil project [<http://pencil.evolus.vn/>], which
looks interesting.

------
aviswanathan
I might be alone here, but I've found that it's much easier to put together a
high-fidelity PSD that details every intricacy of a site or app before writing
a line of code. So, I end up spending more time designing the app/site than
actually coding (which I think is the way it should be). Nevertheless, this
project is really cool; been playing around with it for half an hour already.

------
Shank
Woah, I love how simple the editor is. I'm not sure how quickly it'd replace
something like a notebook for in-depth prototyping, but it's definitely a nice
tool for basic layouts.

I see you can save to the website, but is there a way you can output it as an
image or something and download it?

~~~
cwilson
Command-Shift-4 in the meantime.

------
laurentoget
i can see how this would be useful for requirement gathering or informal high
level design, but if I cannot export it to a format which i can version
control and/or access programatically it remains a toy.

now if i could have an open source version of it....

~~~
splatcollision
You may find Edit Room (my product) more useful then.

It's a visual web design application that lets you design all the way from
rough wireframes to detailed, precise designs. Full export of semantic HTML,
clean, usable CSS. Much more...

<http://www.edit-room.com>

~~~
kamjam
I just took a very quick at the demo's, that is really slick. I'm loving the
pallettes and the UI in general.

Couple of minor things: the font that you use ('Sorts Mill Goudy') really
isn't that clear or crisp, simply falling back to the default browser font
looks much better. Secondly, I'm not a big fan of your menu - it's very sparse
and blends away too easily (the one in the top right) and IMO 'features' link
should be more prominent and at the top of the page.

~~~
splatcollision
Cool, thanks for the good points. It's a good idea to emphasize the menu
slightly more perhaps.

------
JEVLON
Nice work. I have an unfinished project that is similar to this. It's neat
that you have made it so the shape is chosen after drawing. Consider either
not changing the cursor to a pointer, or remove the space between the buttons.

------
sprobertson
I'm glad it doesn't have those silly wavy I-can't-draw-for-shit lines. Also
the interaction is very intuitive, and it's great that you can dive right in.
Great tool overall. I'll be bookmarking it.

------
thomseddon
Brilliant, really really like it!

Would be good if you could "lock" the screen size as it's annoying when you
try and start/resize boxes to full width as your cursor changes to an arrow to
resize the screen..

------
d0m
Great interface, so simple.. With all honestly, I think it's _by far_ my
favorite UX interface to create wireframes. It's intuitive and gets the _shit_
done very fast. Congrats!

------
alagappanr
Really amazing tool. For someone who very occasionally does some small
wireframe designs which do not need a full blown wireframe software, this
website would be an instant help. Thanks!

------
romeonova
Trying to figure out how to edit text that you placed. Any pointers?

~~~
gk1
Double-click it, then select "Edit Text" (second from left).

------
joe_hoyle
THis is really nice! Not sure if this is intended, but the annotations show
underneath the other elements, I expected the annotation dotted background to
appear above everything else

------
csense
"Wireframing" isn't a good term. From the headline, I thought this had to do
with 3D modeling (3D is the context where you usually hear the word
"wireframe" used)

~~~
vedtopkar
"Wireframing" is an incredibly common term in the web development community
for drawing out rough layout plans. I think given the target audience, it's
perfectly appropriate.

(Though admittedly, I too thought the same thing for a moment when I first saw
this post)

------
aidos
Really really nice. I don't do a lot of wireframing so I'm not sure what it's
missing that's essential but it's definitely the easiest tool I've used. Well
done!

~~~
jmadsen
+1 I clicked on two things and was instantly convinced to bookmark - didn't
even have to read anything to get started, just dragged my mouse around a bit

------
sergiotapia
Tried to add a box within a box and I can only move the box when my mouse is
inside the bounds of the rectangle. I wish I could add boxes within boxes.

~~~
JasonFruit
I was able to by drawing the box outside its container and dragging it in. A
bit of a pain, but it worked.

------
WickyNilliams
Looks good, works well.

Would love to see some kind of "snap to grid" type feature for easy alignment.
Bonus points if the grid dimensions are user definable :)

~~~
code_chimp
I would also like this, and maybe the ability to choose 960 and/or Blueprint
overlays to help align the elements.

~~~
WickyNilliams
I think that's may be going too far into implementation for a wireframe? All
I'd want is to be able to request 16/12/9/x columns, with some kind of overlay
or BG to make it very apparent there's a grid in operation. Vertical rhythm
would be cool as well.

------
epaga
An excellent example of an MVP the way it should be - minimal, yes, but
definitely useful and providing great value. Bookmarked. Thanks!

------
saym
I have an odd infatuation with favicons. I must say your's is the coolest I've
ever seen. Awesome attention to detail.

------
thepumpkin1979
This is definitely minimal and yet useful. I started looking for a toolbar,
but there is no need for a toolbar. Slick!

------
mattquiros
I can't open the website right now. I wonder if it's getting too much traffic
and isn't optimized for it yet?

~~~
usaphp
It is working for me just fine.

------
OrdojanAndrius
Awesome, I've been looking for something like this for so long. Thanks to
whoever made this.

------
vbl
I hunger for a version of this that can use sketching mechanics on a tablet.

------
rco8786
I love that the widget options are based on the shape of the area I dragged.

Very cool idea!

------
benlower
cool demo. however a new reminder of how broken the web is becoming.
wireframe.cc doesn't work in IE. what technology is being used that won't work
in IE?

------
kevincennis
Holy global namespace pollution, Batman!

I do like the app, though.

------
flexie
Very nice! I like the demo - How did you make it?

------
lrock
That´s neat. but why wireframing when you also could make it real by using
<http://salon.io/>

------
vojant
Bookmarked. Great example of MVP.

------
joaomoreno
Excellent

------
olsn
Love it.

------
joshontheweb
pretty awesome. great ui.

------
joewee
pretty cool.

