ForeUI is an easy-to-use UI prototyping tool, designed to create mockup / wireframe / prototypes for any application or website you have in mind.

All posts in Feature

ForeUI V2.62: Window Container and Improved Usability

Merry Christmas and happy new year!  Today ForeUI V2.62 is out, and it will be the last version in year 2010.   This version allows to use Window as container, and introduces some features/enhancements to improve the usability.

Window Container

The Window element becomes container now.  You can hold the right mouse button and drag other elements into it.

New Options for Tree Element

Two new options are added for Tree element.  One is to turn on/off the default icon display, and the other is to show/hide the handles for root nodes.  The animation below shows how they work.

Manipulate Embedded Element

Now you can cut/copy/paste/delete the embedded element directly from the floating tool pane.  These manipulations were disabled temporary because of technical reasons, now they are enabled again and you can feel free to work on the embedded elements.

What’s more, you can freely move embedded element in its container now.

Start Selecting from Outside

Another useful improvement is that you can start selecting content from outside of the editing plot area.

Hold SHIFT to Restrict Moving Direction

If you want to restrict the moving direction to horizontal or vertical, you can hold the SHIFT key while draging the element.

Other Enhancements:

  • Improve rendering performance.
  • Paint small expand/collapse button for tree nodes in HandDrawing theme.
  • Paint (optional) lines for tree in HandDrawing and Mac OS X themes.

Fixed Bugs:

  • Bug_0264: Embed Tree into scrollable container, Tree text become white. (IE only)
  • Bug_0265: Table does not layout properly in simulation if column widths conflict with table width.
  • Bug_0266: Change the padding values of ScrollableContainer, then select its embedded element.  The embedded element is in wrong location.
  • Bug_0268: Double clicking Balloon or Post-It element can not bring out the in-line editor when zoom is not 100%.
  • Bug_0269: Select an embedded element and define action for it, the selected embedded element is not show in element chooser.
  • Bug_0270: Embedded element that has smaller Z value than its container can not be selected in element chooser.

ForeUI V2.60: Enhanced Tree Element

1

Enhanced Tree Element in ForeUI V2.60Hello everyone, I am very excited to announce that ForeUI V2.60 is released today!  This version enhances the Tree element a lot, add two new events for Text Edit Box element and fix two bugs.

Enhanced Tree Element

Now the Tree element can be used as a container element, and it becomes interactive in the simulation!  Just like the Table element, the inline editor of Tree element also provides two editing modes.  The “Free Edit” mode allows you to edit tree content in a single edit area, you can use “t” and “n” to define the tree structure.   The “Row Edit” mode allows you to edit tree content row by row, you can also specify the row height or collapse the row respectively. Even in the simulation, you can collapse or expand certain nodes in the tree, fancy!  Here is a short animation to showcase the new Tree element.

“Focus Gain” and “Focus Lost” Events

This two new events are available in TextEditBox element.  Thank LittleRed99 to share the great idea!

The “Focus Gain” event will be triggered when the TextEditBox receives the input focus, while the “Focus Lost” event will be triggered when the TextEditBox lost the input focus.  These events will be very helpful if you want to create working wireframes for account sign up page:

Mockups for sign up page

Other Enhancements:

  • Allow selecting row of Table element in editing mode.
  • Show what’s new in version checking result.

Fixed Bugs:

  • Bug_0262: Should ignore embedded elements when selecting elements with add/minus mode (SHIFT/CTRL pressed)
  • Bug_0263: Text Label element will be enlarged after content editing.

How to Update?

When you launch ForeUI, you will be prompted to update, just click the “Yes, Sure” button to update to the latest version.  You can also download the latest version here.

The update is FREE if your license is for V2.xx versions, otherwise you may need to upgrade to V2 license here.

ForeUI V2.57: Enhanced Editors and ComboBox

1

Hello folks, ForeUI V2.57 is released today 😀  This version enhance the inline editors and ComboBox element, with many bug fixings.

Better Inline Editors

When you double-click to edit the content of element, the in line editor will show up.   In previous versions, the inline editor looks like a small window and is limited in a small area, this make it difficult to place more tool buttons on its toolbar.  Now we make some enhancements on it, the boundaries of inline editor have been removed and we can place more tool buttons arrow the editing field.

All inline editors will now select its content by default when it is invoked.  You can click the “Ok” or “Cancel” buttons to stop editing.   Clicking outside of the inline editor can also stop the editing.

Another important enhancement is the inline editor for Table element, it supports a new “Free Edit” mode.  You can switch the editing mode via the buttons on toolbar.  In free editing mode, you can input all text content of the table, columns are separated with comma, while rows are separated with ENTER key, and you can drag and drop embedded element to any place within the table.

What’s more, you can now use F2/ENTER to start table grid editing and use TAB/CTRL+ENTER to stop table grid editing.

Show/Hide Decoration for ComboBox

Now the ComboBox element supports a new option: you can show/hide its decoration.  Once the decoration is hidden, the ComboBox element will become fully transparent if you reduce its opacity to zero as well.   This feature is requested by Ulrich and it will be very useful to customize the ComboBox element.

Here is an example to customize the look of ComboBox with this new option:

Other Enhancements:

  • Do not close id editing dialog when previous input is not accepted.
  • Do not auto backup the plot until it is modified.
  • Remove the auto saved file when manual save is finished.
  • Prompt user to open the auto saved file when loading the original.

(Many) Fixed Bugs:

  • Bug_0251: Sometimes the cut command can not be undone.
  • Bug_0252: The floating tool pane for Arrow Line element is not shown from V2.47
  • Bug_0253: Move category up or down in the category management window, the tool buttons is not shown when mouse hovering on the custom element.
  • Bug_0254: Editing members in group will reset the Z value of the group.
  • Bug_0255: When dragging the embedded element within its container, should ignore the “Auto adjust Z Value” option.
  • Bug_0257: The spinner control in floating tool pane is not activated when focus is gained via TAB key.
  • Bug_0258: The spinner to adjust border thickness should not be shown when border is not painted.
  • Bug_0259: Text box element with thick border has incorrect vertical alignment.
  • Bug_0260: Text box element with thick border will be enlarged in simulation.

ForeUI V2.55: Search for Elements

Hello folks,  ForeUI V2.55 is released today.  This version includes a very useful “element searching” feature; some enhancements and bug fixings are included as well.

Search for Elements

Element searching feature is very useful when you are working on complex prototypes.  In this new version, you can find a new button titled “Find Element…” above the plot editing area.  You can press this button or press Ctrl+F (CMD+F in Mac OS) to bring out the element search dialog.

The element search dialog would look like this:

You can input keywords and press the “Search” button (or press ENTER on keyboard) to start the searching.  If you have multiple keywords, you can separate them with spaces or commas.  Please notice that if you input several keywords, they are actually combined with AND operator, which means the element will not be listed until it contains all keywords.  For example, you use two keywords: “Text” and “Edit”, then search in element Id, the search results will contain all TextEditBox elements, but no TextBox element will be listed.

You can also make the searching case sensitive or limit the searching within the current page by checking the corresponding option.

There are many options in the “Search in” area.  By turning on/off the options you can specify the fields to be searched.  It is not just a text searching, it can also find out the elements in certain area or with specific Z value etc.  The animation below shows the use cases of this search dialog:

When the element is listed, you can click it in the result table and ForeUI will select it automatically.  If the element does not belongs to the current page, ForeUI will switch page beforehand.

Other Enhancements:

  • Updater supports proxy now.
    This is requested by Kfir Dadosh.  Now the updater will use the proxy settings in ForeUI (under the “Misc” tab in settings window).
    Remarks: you will need to download the file from our website and install again, since the updater can not update itself.
  • Use toggle button to show/hide the tool window.
    Now ForeUI uses toggle buttons to show/hide the global properties window, element selector, element search dialog and display control window.
  • Auto insert the current file name (if exist) in the “Save As” dialog.
    Requested by Ulrich, very simple but handy enhancement.

Fixed Bug:

  • Bug_0250: Image box with small size (e.g.15×15) may be distorted when running simulation in IE. (Thank Mike H for reporting)

ForeUI V2.52: Rectangle Borders, Memory Monitor, Auto-Save etc.

2

Hello folks, ForeUI V2.52 is out today.  If you have installed V2.50, you can update to V2.52 directly via the updater.

Rectangle Borders

Now we have more control of the borders of Rectangle element: every border of the rectangle can be shown or hidden.  This feature is suggested by Mark D, and we appreciate his good idea 😀

With this new feature, the Rectangle element can be used to represent more complex shapes.  I found it is very suitable for custom tab creation.

Memory Usage Configure & Monitor

During our daily custom service, we realize some problems are caused by the insufficient memory.  Like other Java applications, ForeUI has to specify the maximum memory usage at the launching time.  The default maximum memory usage is set to 300 MB and it is enough for normal cases.  However if your plot is big and complex, and you have done many operations, the increasing Redo/Undo records may challenge the 300 MB limitation.  Once that happen, ForeUI may behave sluggish and sometimes can not execute your command.  Now the new version allows you to monitor the actual memory usage and configure the maximum memory usage.

The memory usage information will be shown on the top-left corner of the editing area:

The rightmost “300 MB” is actually a link and you can click it to bring out the configuration (which can also be found in the “Misc” tab in settings window):

You will need to restart ForeUI to take effect the maximum memory usage setting.

Auto Saving

To avoid losing your work, we implemented the auto saving feature, and it is now turned on by default.  It will try to backup your current editing plot (say Test.4ui) to “Test_autosaved.4ui” in the same directory for every 3 minutes.  When auto saving is performed, a message will be displayed for a few seconds on the top-left corner of the editing area.

You can change the auto saving interval in the “Misc” tab of the settings window, or even turn it off if you don’t want it.

New Element Property: visible

This is requested by Ed.  Now you can insert this element property into expression to check whether the element is visible during the simulation.

Improvements for Mac OS X:

From this version, ForeUI will use system look and feel by default in Mac OS X.

In Windows the Ok button is usually on left and Cancel button is usually on right; In Mac OS the order is reversed.  So we adjust the position of “Ok” and “Cancel” buttons for Mac OS X in this version.

Other Enhancements:

  • Do not show action indicator (small red flag) on embedded element that is hidden by container.
  • Remember the file chooser view type.

Fixed Bug:

  • Bug_0249: Tabs element has incorrect hotspots in “Mac OS X” theme (under editing mode).