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

ForeUI Blog

Use MockGen to Generate Mockups from Website

4

Several months ago, I had post a review of Looksie, Looksie can generate detailed reports for ForeUI plots.  This morning Xemware just announced the beta version of their brand new web service: MockGen, which can generate (ForeUI or Balsamiq) mockups from existed website online!  It sounds very promising so I try it immediately and write down my experience here 🙂

The web page of MockGen is very simple (as shown below).  There are just a few input fields to accept the parameters for mockups generation.  Some fields have a blue question icon on the right, and you can click the icon to show the explanation of the field.

There are just two required fields: one is your email address and the other is the URL of the existed website.  Other fields can control the pages included in mockups, and you can choose the output format (ForeUI plot or Balsamiq mockups).

I decided to generate a ForeUI plot from LinkedIn website:

So I input my email address to receive the plot, and then input the target URL as “http://www.linkedin.com”:

After clicking the “Generate!” button, I can see a message as below.  So I cross fingers and wait for my plot 😀

It is better than my expection, an email arrived within one minute and it contains a ZIP archive.

The plot file is just in the ZIP archive.  After extracting the file and open the plot in ForeUI, a prototype for LinkedIn website is ready.  The first page is a navigating page and it can bring you to any page within the plot when running the simulation.

This page is the front page in real website.  It is almost perfect, even the hyperlinks are converted to actions in plot.  However the background color is changed to light gray:

After changing the plot background color to white, the final result is very good:

What if we run the generated plot in web browser?  I can’t help trying this and below is the comparation.

As you can see, there is a little offset between real website and the generated plot.  But it is not a big problem and I believe it can be improved in the future, as it is still in Beta state for now.

Dear friends, if you plan to create a prototype base on an existed website, the MockGen service will save you lot of time!  You can click here to try the service, please feel free to leave your comment here if you have any feedback on it.  Tim (the developer of MockGen) will be glad to hear from you 🙂

Goodbye to 2010, Look Forward to 2011

Dear friends, year 2010 will elapse soon and year 2011 is coming.  I must, on behalf of ForeUI’s R&D team and EaSynth company, say “HAPPY NEW YEAR” to you all 🙂

Year 2010 really meant a lot to ForeUI.  The summary below shows what we did in year 2010:

Summary of Year 2010

Official Releases: 28 (V2.00 ~ V2.62)
New Features: 82
Enhancements: 86
Fixed Bugs: 141

Now let’s review the great updates in year  2010:

Windows 7 UI Theme

The UI theme to simulate the Windows 7’s UI is available from V2.00.  This theme is very helpful for creating high-fidelity prototypes for Windows 7 apps.

User Community

V2.00 also introduced a brand new user community site for ForeUI resource sharing.  The community site is fully integrated with ForeUI software and provides the easiest way to download more interesting examples, elements and libraries.

German Language Support

From V2.15, ForeUI supports German language.  We should give the credit to Marcus Barkhahn since he translate all text scripts to German voluntarily, thank you Marcus 🙂

Zoom In/Out

This handy feature is implemented in V2.20.  You can zoom in to see the the details of a region, or zoom out to preview the entire page.

Container Support

From V2.22, ForeUI supports a new “container” concept.  You can embed other elements into a container, thus they are tightly joined and can be moved together.  Table became the first container element, and then we have Scrollable Container (V2.32), Tabs (V2.37), Vertical Tabs (V2.37), Tree (V2.60), Window (V2.62) joined the containers family.  You can hold the right mouse button and drag elements into container.

Online Updater

This feature is shipped with V2.50.  With its help you can upgrade your ForeUI to latest version without visiting our website.

I just listed the most important updates in year 2010.  Of course there are still many great updates remained, you can find them here.  However the items above should not be missed.

We must thank you all who report bugs or share ideas with us.  Thank you all for the help!

Forecast Year 2011

Year 2011 is coming and we have started to think about the roadmap of  2011.  In year 2011, we will use more time on polishing the current features, providing more documents and tutorial videos.  The V3.0 may be launched at Q4 of 2011.  We are also considering the development of ForeUI server side application, which will integrate version control, prototypes management, resource sharing and feedback collecting platform.  What’s more, we may release mobile version of ForeUI in year 2011.

If you have any idea on ForeUI’s roadmap, please let us know your great idea, thanks!

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 Special Offer: 20% OFF

Dear friends, we have a good news for you!

Now you can buy ForeUI license with 20% discount, that is $79 per user.  The license grant you the lifetime usage and one year free upgrade.  This special offer will last to December 31st (included).

You can find the new pricing list and order form in this page.

If you prefer to use RegNow to checkout, you can use the “FUI-77PD” coupon code to save 20%.

ForeUI Special Offer: 20% OFF

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.