What's new in FlairBuilder 3.0
Jun 2, 2012
- Overhauled the entire UI:
- The application looks all new and shiny. Although haven’t dramatically changed the positioning of different elements, I’m sure you’ll love the extra simplicity.
- Rewrote the editor:
- The most important part of the application has been completely rewritten. From scratch. Now moving components around, resizing them, grouping, updating styles and properties will feel much, much faster and smoother.
- Page Layers: The most powerful new feature:
- This is really a big one. Dismissing the hard to use Floating Panels support, this version introduces a simpler and more capable way to create over-the-content elements like modal dialogs, popups, light box popups, tooltips, etc.
- Colored text support in components:
- All components that support some kind of text formatting syntax (labels, datagrids, trees, paragraphs, etc.) now also support text coloring using this syntax: {color:#0000FF}my blue text here{color}.
- Updated: Import from Balsamiq Mockups:
- It’s not yet 100% compatible (symbols support is not ready), but it’s almost there. The big step forward was adding a bunch of new components and the whole set of icons Balsamiq comes with. As a side effect, all of FlairBuilder’s icons have been turned to black and white.
- New components:
- Some of the components were added to match Balsamiq Mockups. The new components are not interactive (yet), but I don’t think this is a big problem. Wireframing is still one of the most common usages for FlairBuilder. New components worth mentioning are: scroll bars, volume slider, tag cloud, vertical/horizontal splitters, progress bar. Also, new shapes were added: diamond, parallelogram and arrow support for lines.
- Updated: New DataGrid component, faster and with support for column text align:
- The Data Grid component has been rewritten, too. It’s much faster now and more flexible. Just like in Balsamiq Mockups (Yes! I took a lot of inspiration from them in this release.), you now have a special syntax for column widths and alignment.
- Updated: Menu Bar behavior change. Now more like a web menu:
- I think it was silly to make the menu bar behave like a desktop application menu. Who wireframes a desktop application, anyway? Now no matter what item you click (if it has sub items or not), it will trigger an event. And it will open on mouse hover only, not on mouse click.
- Updated: Interactions editor:
- Much faster and easier to use. Now with drag’n'drop support (copy/paste temporarily removed) and with a faster and more intuitive way to add actions. Just click on one of the action icons and there you go, you assigned an action to a component event. With just one click. Also, in the case of “Go to page…” action, which most people use most of the time, FlairBuilder will automatically open the page selector for you. So with just 2 clicks you have set up the action.
- New: Visual multiple component selection:
- Now several actions support multiple components as targets. Well, instead of naming each of them and selecting them from a combobox or something, you’ll just hand pick them.
- Updated: Multiple targets actions:
- Show/Hide and Resize/Move actions now support multiple targets at once. This will save you from creating lots of actions for each component you wanted to target. The even more cool thing is that when setting up “Move/Resize” action, you’ll be able to simply drag’n'drop/resize the target component to their final position.
- Show page layer with visual aid:
- Displaying and positioning a layer is SO easy. Just add the Show layer action and you’ll automatically see the content of the layer and you’ll be able to position it after your heart’s desire.
- HUGE: Site map support:
- It’s been a long coming one, but it’s here.
- X-HUGE: Annotations support:
- You’ll now be able to comment on the side of your wireframe pages and leave notes for you clients or team members.
- Improvement: Quick component insert:
- There’s now a faster way to insert new component into the wireframe. Just hit / or + on your keyboard and see what I mean. (NB: You’ll have to first give the UI a click for the keyboard events to be properly detected.)