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 by xavier

Operate Multiple Elements in Simulation

When we define the behavior of element, we can operate on selected element in the event handler.

operate_on_elem

After we click the “Operate on Element…” menu item, we can create a new action that operate on selected element.

three_steps

We can click the “Browse…” button to choose the element to be operated on, but we can only pick one element at a time.  What if we need to operate on multiple elements?  Should we repeat creating actions for those elements?  Can we work on multiple elements at a time?

The first solution in my mind is to us the grouping, as we all know that in ForeUI we can group multiple elements as a group, which will be regarded as one element.  So we can group multiple elements together and operate on the group.

select_group

There is another workaround, some actions (such as change location, change visibility etc) provide the option to include other elements in the area.

include_others1

What does this option mean? let’s take a look at the figure below:

include_example1

We can see element B and C are located within the area of element A, while element D is not in the area.  When we create the action to hide element A and checked the “Include elements within the area” option, element A, B and C will all be hidden in simulation.  

What if we don’t have such kind of element like element A? There is an interesting skill: we can create a transparent element A (can be a rectangle element, without border, set its opacity to zero), and operate on the invisible element A.

invisible_elem

ForeUI V1.25 Released!

2

ForeUI V1.25 is released!  What’s new in this version? Here it is:

  • New Feature: Support loop in workflow simulation.
  • 3 New Customized Elements: Hyperlink, Title Text and Radio Button Group.
  • Enhancement: Simplify the action editing process.
  • Fixed Bug_0052: Create customized element with a group, the behavior on members can not work (lost target).
  • Fixed Bug_0054: Should show customized elements in “All Elements” category.
  • Fixed Bug_0055: Inserted property should replace the current selection in expression.
  • Fixed Bug_0056: Cancelling element selection should recover the previous selection.

From now on, we can use loop in the workflow simulation.  This feature is very useful when designing an interactive prototype.   Now we have event handling, flow control (loop and branching) and actions, we can really make something that works on the web browser!

loop

Three new elements are added: Hyperlink, Title Text and Radio Button Group. 

new_elem

There is an important enhancement in this version.  In the previous version, when we create an action the operate on the element, we need to work on 2 popup windows, that’s really confusing:

old_version2

Now we have put them together (see figure below), much more clear, isn’t it?

new_version

Now the latest version can be downloaded here.  You can also launch the online demo.

ForeUI V1.22 Released!

This is a minor update version, providing 3 new features:

Dynamically change the text of label supported.
Now we can change the content of text label during the simulation.

set_text_action

Allow setting select state of multiple check boxs within a group.
We can put several check boxes into a group, thus we can set their select state with one action.

select_check_box1

Allow unselecting sibling radio buttons within a group when selecting on of them.
We can also put several radio buttons into a group, thus we can uncheck other buttons when clicking on one button.

select_radio_button

We have also fixed four bugs in this version:
[Bug_0048] Double click customized element to add, some elements are moved to incorrect location.
[Bug_0049] Double click customized element to add, new elements should be selected.
[Bug_0050] The color of text label should be changed when it is disabled.
[Bug_0051] The action to change Text Edit Box value should support multiline editing.

Some Tips for ForeUI Simulation

In ForeUI, we can define the behavior of elements and run the simulation in web browser.  Here are some tips about running the simulation:

If you have defined multiple pages in a plot, you can use “Page Up” and “Page Down” key to switch the pages, even if you havn’t defined any behavior of elements.

If you are running ForeUI in Windows VISTA and your are not using an administrator account, you may meet a “Page Not Found” error in your web browser when launching the simulation.  That’s because ForeUI need the right to create a folder for storing DHTML files.  The workaround is to run ForeUI in administrator account, or to assign the right to ForeUI application.

If you meet any problem in using ForeUI, please feel free to contact us, we are making an FAQ page for ForeUI.

ForeUI Online Demo Available!

2

From now on, ForeUI has its online demo! That means you don’t have to download and install the package if you just want to take a tour;   You can just click the link to launch the demo and try all features of ForeUI.

Actually the online demo is a Java applet, usually your browser already has its running environment.  In case your browser does not support Java, you can try this link, it will auto-detect and install the Java environment for you.

The online demo has almost 100% the same features than the native installation, except the URL visiting:   In native installation, if ForeUI need to visit a URL, it will bring up a browser window and browse the URL in it;  In online demo, when ForeUI try to visit a URL, it will pop up a small window, showing the target URL and allow you to copy the URL to the clipboard, which can help you to paste it to your browser.

visit_url

Another difference between online demo and native installation is the prototype examples:  the native installation include some interesting examples and customzied elements;  the online demo has no example though.  We may provide a download site for the example resource latter.