
FlairBuilder - Interactive Wireframes and Software Prototypes - tortilla
http://www.flairbuilder.com/
======
aston
There's a rule-of-thumb when it comes to prototypes that this sorta toes the
line on:

Don't make the prototype pretty when the backend isn't done.

Ken Arnold has an at-length discussion of the effect
(<http://www.artima.com/weblogs/viewpost.jsp?thread=52241>).

Balsamiq is great in that regard, since all of the UI controls have a
handdrawn look that lowers expectations and keeps people focused on the mockup
as an early-stage proposition.

~~~
zaidf
Totally agree!

One of the most annoying things is when you see a design that is called a
"prototype" but it looks like a BADLY done final design.

A prototype needs to CLEARLY be a prototype and that is where balsamiq is
awesome. If it does not look like a prototype, then I won't know what elements
of the design are bad because of your TASTE in design and which are bad
because this is a PROTOTYPE.

In general, EVERYTHING in a prototype should be up for judgement IMO. Don't
want people to be judging the colors? Don't put it in the prototype! Don't
want people debating how the checkbox should look? Don't spend time delicately
designing the perfect checkbox!

~~~
ccpascu
Hey, Cristian here, developer of FlairBuilder.

It's true that early in the process is not OK to spend to much time on
details. You'll just want to grab a pencil and a sheet of paper (or a digital
equivalent as Balsamiq Mockups) and sketch down as many ideas as you need.

However, there is a point/stage where you'll need to dig down into the
details, as many as possible to make sure, again as much as possible, that you
got the requirements right.

Another thing: IMHO there is a clear difference between an wireframe and a
prototype. With both you can go from plain, or even sketchy look'n'feel up to
a polished design.

FlairBuilder aims to bring the amount of interactivity that coded prototypes
have (for proper usability and user feedback ), with the plain simple
look'n'feel of wireframes.

Cheers, Cristian

------
gits_tokyo
Workflow that has worked for me in the past: 1) Brainstorm on paper 2) Roll
out in HTML w/ CSS, mix in light scripting in areas that need them (repeaters,
design direction A/B, ...etc) 3) Writing code is easy that's not the hard part
of any project. So... Don't develop any backend code till it's real -- concept
has been realized fully in HTML & CSS w/ relevant content and images -- by
relevant content I mean something a test user would actually sit and read.

With all that in mind, I don't see the value in introducing a new tool in my
workflow. Perhaps I'm outside of the targeted market as I've only seen a
reference for bloggers via the info on the start page.

Here are a few critical things I'd be incorporating if I was developing
flairbuilder.

1) Export to HTML. 2) Export to CSS, perhaps even utilizing one of the many
CSS framework.

~~~
ccpascu
I plan to offer support for grid based design, but since positioning is
absolute in FlairBuilder, I wonder how could you generate CSS based layout.
I'll keep this in mind as it's definitely an interesting idea!

------
alexkearns
It's a pretty cool app. However, I would advise the developers to put text
descriptions under all the icons, because it is not clear what the the icons
do, and it is a pain to have to hover over them to find out.

~~~
ccpascu
Labels for each component is a good idea and I'll consider it.

As the set of components will grow, it may become easier to just enter a few
letters in the search box to filter down the options. I am also thinking about
putting in the front somehow the most used components.

~~~
alexkearns
Apple do something similar with interface builder. If you have a mac, check it
out.

Good luck with the project. It looks like a really cool bit of software.

------
coopr
How is this better or worse than Protoshare?

~~~
ccpascu
Thanks for your question, coopr!

FlairBuilder is more than a simple drawing tool, or than a tool that lets you
add simple navigation to your wireframes.

Every component you put on a page in FlairBuilder is a fully functional
component. Buttons, text boxes, checkboxes etc. are working like real
components (as they are in fact real components). FlairBuilder aims for the
same interactivity as coded prototypes, but providing you the means for
creating prototypes faster, in a visual manner, and with no coding.

In the future, I plan to offer the same collaborative workflow that protoshare
has to offer.

