
Fluid: A UI Prototyping Tool - hye
https://www.fluidui.com/editor/live/
======
brian_cloutier
The tutorial is well done and fluid is very fun to use. I love how simple it
is to setup simple transitions and "play" the app.

Dragging a page into the trashcan is inconsistent with deleting an element by
hitting the trashcan button; it took me a bit of frustration to figure out.
There's no way to figure out what the buttons do short of clicking on them to
figure it out. Most features are intuitive but as evidenced by the "Actually
it looks to me like it's only for iPhone design." comment the UI could use a
little more explanation (there's no rule against using an icon /and/ text for
menu options).

I really don't understand why there are so many negative comments, this is
very nicely done and I can see it being useful. I'll definitely give using it
a shot on my next mobile project.

~~~
splatcollision
I too was impressed with the smoothness of the UI transitions, and the zoomed-
out view. Engaging to play around with. Same confusion about menus - they jump
around quite a bit, it's hard to re-focus on relatively small controls that
are in a slightly different spot each time. I'm somewhat guilty of this as
well, so take the feedback as you may.

Lots of templates, almost overwhelming. Looks great for detailed app interface
prototyping.

I wonder about the code it exports - One of my goals with Edit Room is to have
semantic, clean HTML and CSS that is as close to production-ready as needed,
with skilled developers picking up the design prototypes, in close
collaboration with designers using the app.

For more general communication designs, do check it out: <http://www.edit-
room.com> (my project). It is perhaps more suited to the web design and
publishing workflow. Edit Room takes up the task of complete visual design +
prototyping. Inspired by AE and PS, but streamlined and focused on building
high-fidelity, live, shareable prototype HTML/CSS documents. The visual design
and animation editor generates flexible, responsive layouts that look exactly
like what you've created on-screen. Etc... Oh, it works just fine with
Firefox.

Cheers, and good luck with Fluid!

~~~
IanHannigan
Thanks so much - The Edit Room looks very interesting, I like the immediate
connection - will check it out some more. If you'd like to talk, drop me a
line on ian@fluidui.com

Cheers, Ian

------
huhtenberg
> _Browser not currently supported_

Firefox that is.

~~~
daveKearney
Sorry to disappoint on the firefox front, we'd love to support it and we will
as soon as we can, but we're a small startup and sometimes we need to make
tough decisions about where we spend our time and resources. We'll get to it!

~~~
Osmose
You could at least let me look at the site with a warning that my browser is
unsupported rather than blocking me.

I can understand the view that this would make you look worse, but my personal
response is that I don't want to give your tool a second chance because of the
annoyance (if everyone says it is the best thing since vim, of course, I'll
get over myself and look :P).

If it was truly broken in Firefox I would've been curious enough to try it in
Chrome. Sorry.

~~~
IanHannigan
Fair points.

------
makmanalp
Nice. Needs more snapping. I hate pixel-perfect aligning stuff by hand.

~~~
IanHannigan
Completely agree - it's high on our list.

~~~
_sh
I'm just amazed you use divs containing data-uri images instead of, say, a
canvas element for drawing icons like the battery level and connection signal
bars. You must have fought hard with superhuman patience to do battle with the
DOM in this way.

I myself have neither the grit nor the will to endure what you must have
suffered, but I recognise this amazing achievement. As another poster has
said, you deserve your $29 a month for your effort. I take my hat off to you
sir.

~~~
daveKearney
Safari and Chrome might both run webkit, but there are still significant
differences in how fast they render and handle transitions for different
things. In this case, both draw on canvas initially as you suggest, but chrome
then uses toDataURI() to draw the canvas to an image as otherwise the
scale/zoom transitions run unacceptably slowly.

------
rwhitman
I'm getting overwhelmed by all these nifty browser based prototyping tools
coming out. Very cool stuff, but it seems like the market is starting to get a
little saturated

~~~
FuzzyDunlop
I'd actually prefer a desktop app that does some of these things, considering
I don't want to install Air for Balsamiq, and don't really want to do all my
work in a browser, on a service that could disappear at any moment.

Sadly, I'm not the person with the expertise to do it.

~~~
gingerjoos
There's a tool called Pencil[1] that runs on the browser, but works offline.
Haven't explored a lot, but does simple tasks well.

[1] <http://pencil.evolus.vn/en-US/Home.aspx>

~~~
bitcracker
That's awesome! I have searched for an offline tool like that and it looks
very good. Thank you!

------
k3n
> Fluid: A Clever UI Prototyping Tool*

* for mobile designs

~~~
risratorn
You can set any arbitrary size on a page (click the gear in the topleft corner
of a page) and almost all of the widgets are suited for any prototype, mobile,
desktop or anything else.

~~~
k3n
The widgets have an entirely mobile design to them, though.

I was really looking forward to something like this, but incorporating
elements from something like Twitter's Bootstrap.

------
thomaspun
Looking great! I love that 'clone' icon :) Does it generate a URL which I can
try on my own device?

You should check out <http://delight.io>

Maybe we can open up an API which your users can quickly get feedback on their
prototypes.

~~~
IanHannigan
Yes it generates a URL. ian@fluidui.com and we can talk some more.

------
fuzionmonkey
Reminds me a lot of Denim [1]. I like it.

[1] <http://dub.washington.edu:2007/denim/>

------
jeff_5nines
Clearly top-notch design and functionality, very impressive. I'm believe you
deserve $29 a month for all your hard work, but I could never justify this
expense. Again, the product probably is worth it, but out of price range for
some smaller companies. I'm not looking to start a flame war about being cheap
or not paying for quality work, I just want to give you a little feedback
about pricing. Do you have any other pricing schemes in mind - one-off or
limited functionality type deals.

~~~
biot
If you can't afford $29/month then you're probably not in their target market.
If you used this tool to do UI prototyping as part of a mobile development
project you could be charging companies $29,000/month which would justify the
0.1% investment.

~~~
andyjsong
Serious question: Where do you find companies that pay $29k a month? I'm
trying to start a mobile dev shop with a YC alum and we haven't seen budgets
anywhere near this.

~~~
biot
I know a company that's building a mobile app and they're paying $150/hour
(one developer plus project management) to a dev shop. At 8 hours a day and 20
days a month that's $24K/month. Put in an extra hour a day and you're there.
Of course, the trick is finding clients willing to pay full rate, but if
you're good they're out there.

~~~
andyjsong
> (one developer plus project management)

It's just 2 people, I'm guessing the dev gets around $120/hr and the PM
$30/hr? A Dev and Project Manager? Can you PM me their portfolio/website
please?

~~~
13hours
We're a mobile dev house (iOS and Android), and we charge around $60-$80 /
hour. www.polymorph.co.za . Sounds like we should get some US clients if $150
/ hour is realistic.

~~~
andyjsong
can you share any apps you have on the market?

~~~
13hours
Sure. Most of our work is actually for corporate clients, so not commercial
apps found on the market under our name, but a few examples of commercial apps
are:

iOS: Construct-O-Set : [http://itunes.apple.com/za/app/construct-o-
set/id373042556?m...](http://itunes.apple.com/za/app/construct-o-
set/id373042556?mt=8) Wining and Dining SA :
[http://itunes.apple.com/za/app/wining-dining-south-
africa/id...](http://itunes.apple.com/za/app/wining-dining-south-
africa/id401109007?mt=8) 22Tracks (Netherlands & Belgium only) :
<http://itunes.apple.com/nl/app/22tracks/id397202887?mt=8>

Android: ExpenZa (only available in South Africa at the moment):
[https://play.google.com/store/apps/details?id=coza.appositio...](https://play.google.com/store/apps/details?id=coza.apposition.finance.expenseza)
22Tracks (Netherlands & Belgium only) :
[https://play.google.com/store/apps/details?id=com.fonkmobile...](https://play.google.com/store/apps/details?id=com.fonkmobile.player22tracks)

------
zem
not sure how many people still use fltk [<http://www.fltk.org/>] but fluid is
the name of their visual ui designer.

~~~
Qworg
I was confused by this as well - we still use fltk on some of our robot
control stations.

------
IanHannigan
Thank you to everyone for the excellent comments and feedback about Fluid UI.
So many points of view and really excellent issues raised here - we _love_
feedback, good and bad.

Just as a note, if you want to log any issues/glitches or praise our support
forum is <http://getsatisfaction.com/fluidui> \- we are pretty active
following up there.

We will try to reply to as many comments here as possible.

Cheers, Ian

------
headsclouds
I love how the sheep icon clones the object. It literally made me smile.

~~~
IanHannigan
Seems to be the star of the show :)
<http://blog.sprawsm.com/post/27547701265/sheep-in-fluidui>

------
alan_cx
All I want to say is that I absolutely love the icon for cloning. I do
appreciate a clever sense of humour.

~~~
tijs
First thing i noticed as well, i wonder if that's a new idea. Once you get it
it's the perfect little icon for the action.

------
IanHannigan
Here is some sample output. This is a mockup that simply shows some of the
Android ICS phone library. This is an example of the URL that you can output
from the tool, including with a free account. QR straight to phone, email link
and one-click social sharing.

[https://www.fluidui.com/editor/live/preview/p_mcEkMTfZpIcMp5...](https://www.fluidui.com/editor/live/preview/p_mcEkMTfZpIcMp5l0Ai58zEAIVM1BrdtC.1342734679565)

Here's a similar one for the iPhone library.
[https://www.fluidui.com/editor/live/preview/p_m1TR9R6ag2rUag...](https://www.fluidui.com/editor/live/preview/p_m1TR9R6ag2rUagvWy3cKIMOMoi2fgn8k.1342734912884)

------
bunsenhoneydew
I have to say, I'm pretty impressed. Yeah there are a few wrinkles but it's a
great start. I can see myself using this. People seem upset that it isn't 100%
fully what they would expect. Personally I think releasing it and using
customer feedback to help improve it is the only really viable way to develop
a product that your user base will be happy with. An impressive tool that I'll
be keeping an eye on.

~~~
IanHannigan
Thank you

------
tcolliers
This is quite good.

One thing this is lacking for me is a way to display page hierarchy or flow
through the application. Just being able to connect pages with lines or arrows
would be great. Or as a bonus it would be nice to be able to connect page
elements to pages or elements on other pages.

~~~
IanHannigan
You can do this right now. Select a widget and click the link icon (circle) in
the little menu that pops up - you will see linking then.

------
Ryan_Shmotkin
Great tool, just tried buildin mockup for client.

Few issues: * There is a problem moving labels in buttons/tables using the
keyboard. Everything jumps * The labels in editing and preview don't look the
same * Please add "Undo/Redo" * Can't find a way to delete new window

------
blaines
Quick bug report...

I made two pages. They were overlapping (Not sure if this is intended). When
dragging elements onto the top page, they went to the bottom page. When I
moved them around the top page they went to the bottom page.

Chrome/OSX

~~~
IanHannigan
Thanks have logged that issue in our support forum:
[https://getsatisfaction.com/fluidui/topics/widgets_falling_t...](https://getsatisfaction.com/fluidui/topics/widgets_falling_through_overlapping_pages)
if you notice any other issues please log them there because we don't want to
lose any of this great info. <http://getsatisfaction.com/fluidui>

Cheers, Ian

------
sycren
Looks interesting. I'm very interested in the infinite canvas feel like
<http://news.ycombinator.com/item?id=4113866>

How did you do it here?

~~~
IanHannigan
We're doing a blog post on fluidui.com soon about the prototyping process that
we used to build Fluid UI - we have the first infinite canvas prototypes that
we made and we can include them in the post. That will explain it better :)
Thanks!

~~~
neovive
Wow! I'm really looking forward to reading that post. I've been reading up on
canvas and JS lately and am interested in seeing some full application case
studies.

------
mck-
Our attention span is getting shorter and shorter -- an instant try-out with a
"wow" moment is a necessity. Very well done, held my attention long enough and
will refer to for future use

~~~
IanHannigan
Thanks so much - we still have work to do on it :)

------
tsieling
Really excellent piece of work. I've been using Omnigraffle for almost 10yrs
and this is the first web-based tool that I've felt good about. Really great
work.

~~~
IanHannigan
Wow thanks - that praise is too high - Omni is a really amazing tool!

Ian

------
skyhook_mockups
Great job on the page linking UX. Very intuitive. I'm working on a similar
product so it's good to see what others have come up with.

Good Luck!

~~~
IanHannigan
Thanks - we still have a lot of polish to add there but the core of it is
working well.

------
sgt
I clicked on a circle I just created, then I hit backspace. The whole tab
closed! That's a bit problematic for me.

------
bherms
Be careful overriding useful keyboard shortcuts like cmd-d... Because of this,
I can't bookmark for later.

~~~
IanHannigan
Agreed - thanks!

------
medell
I second the wow. I love how quickly you've made it for someone to get started
using the tool. Bravo!

~~~
IanHannigan
Thanks

------
criveros
Why only for mobile?

~~~
joelhooks
It is (generally) necessary to start someplace.

~~~
IanHannigan
:)

------
BilalBudhani
Fantastic ... Exactly what I was looking for Thanx :)

~~~
IanHannigan
Great - thank you!

------
duaneb
No option to change DPI for iPad 3.

~~~
Groxx
Nor the iPhones. Probably because in theory you shouldn't be designing to the
DPI. Pixel values (frames, sizes, etc) are still the low-res values. It
matches everything else you do with iOS devices (IB works at the low res, for
instance), not sure why they'd need to differentiate them here.

~~~
IanHannigan
Exactly - it up-scales

------
BadassFractal
How does this compare to Pencil?

------
bbayer
just signed up. looks nice.

~~~
IanHannigan
Thanks

------
tretiy3
awesome!

------
asadotzler
Browser not supported is a bullshit cop-out that puts you in a lower league
than "Best viewed in Netscape".

~~~
IanHannigan
Sorry about that - we're working on it. Not supported yet is a better
description :)

