We originally intended this blog to stand alone but we’ve decided to move it to our main site here, where you can read the latest articles: http://www.carettasoftware.com/blog/
The existing content on this blog will remain to keep external links valid until we can redirect all the page URLs.
GUI Design Studio version 3.4 is now available for immediate download. This is a maintenance release with some important changes based on customer requests, and is a free upgrade for all registered users.
For customers using any prior version of GUI Design Studio, simply install the new version and your existing licenses will continue to work.
(1) Project Organisation
Now you can re-organise your projects with ease. In previous versions, we restricted the ability to move and rename design files to ensure that references remained intact and to help with project sharing.
In version 3.4, you can rename files and move them around using drag and drop. GUI Design Studio will track the changes and keep those references working.
New projects will automatically get this functionality but you’ll need to enable this feature for existing projects using the “Project | Enable Move and Rename…” menu command. This is a precaution to ensure that team members synchronise project files first.
(2) Enhanced Team Collaboration
Version 3.4 also brings new collaboration features to allow multiple designers to work on the same project simultaneously using a shared Subversion (SVN) repository. Move and rename are fully supported and changes by different team members to the same file can be merged automatically (in most cases).
For full details on how this works see the Team Collaboration with GUI Design Studio and Subversion section on our main Website.
(3) Image and Component Replacement
Have you ever wanted to change an icon or bitmap image, or replace a design component? Well now there’s a new “File” tab that allows the associated file to be changed. If the replacement component is compatible, such as a duplicated variation, then all navigations from within the component will be maintained.
When files are deleted, we’ve made it easier to work out what’s missing by displaying the filename in the placeholder box and we also now include the placeholders in simulation, printing and image generation where they were previously ignored.
(4) Other Changes
In order to make the simulation of Browser mode more realistic, Back and Forward now restore the view position (scroll bar states) instead of always jumping to the top of the page.
To help you edit elements more quickly the F2 key can now be used as a shortcut key to edit text for the selected element. You can still just start typing if you simply want to replace the whole of the text.
We’ve also fixed a number of bugs such as making GUI Design Studio use less CPU time on certain machines when idle and transferring project options to distribution files for use in the Viewer.
Download
Download GUI Design Studio version 3.4 now, and let us know how you get on with it.
Happy designing! Feel free to leave a comment…
Tagged GUI Design Studio, releaseFollowing on from the GUI Design Studio v3.3 release, here’s a short video (05:52) that demonstrates how the scrolling region shown in the previous post was constructed:
For best viewing quality, click on the HD and Full Screen icons once play has started!
Here’s a quick summary of how to produce a scrolling region:
That’s it!
Tagged example design, GUI Design Studio, software prototyping, video
GUI Design Studio version 3.3 is now available for download. This is a further maintenance release with some changes based on customer requests. It sees the start of some of the more interactive features we’re working on.
For customers using any prior version of GUI Design Studio, simply install the new version and your existing licenses will continue to work.
(1) Active Scroll Bars
For all those cases where it’s important for you to demonstrate the entire contents of your edit boxes, lists, tables and trees, you can now work those scroll bars when you run your prototype in the simulator!
By selecting elements first, you can also scroll them within the design editor if you want to and set default scroll positions.
(2) Expand / Contract Tree Nodes
Judging by the number of customer designs we’ve seen where tree node expansion and contraction has been simulated using overlay panels, this is clearly another important feature that sits nicely alongside scrolling.
As before, you can set up the default expansion and contraction of each node within the property editor where you create the nodes. You can now also change these within the design editor itself by selecting the tree element then clicking the expand/contract buttons.
(3) Connect From Tree and List Items
Thanks to all of the requests for this feature, you can now make navigation connections directly from tree nodes and list items instead of having to use navigation overlays.
This is especially important now that trees and lists can be scrolled. Links remain with the correct item after rearranging the content.
For trees, you can expand a node (in the editor), create a link from a child node and then collapse the node again.
All links to hidden items are shown from the nearest location that makes sense. Try it out and I’m sure it will make sense.
(4) Scrolling Regions
With version 3.3, you can now take a large design section and place it within a smaller, scrolling region. Anything from a simple bitmap image to an intricately designed, custom list, or even complex document content can now be represented with ease.
The trick is to place the large section within a component design, resize the component (you might need to change its resize options first) and then check its “Maintain Size” option.
(5) Other minor changes
We’ve fixed a couple of bugs related to infinitely nested, self-referencing component designs that occur in rare circumstances, and added a useful Alt+F4 shortcut key to toggle between normal selection mode and component item selection mode. F4 (or Shift+F4) still toggles between either selection mode and make connection mode.
Download GUI Design Studio version 3.3 now, and let us know how you get on with it.
Happy designing!
Tagged GUI Design Studio, releaseGUI Design Studio version 3.2 is now available for download. This is a maintenance release with a few important changes.
For customers using any prior version of GUI Design Studio, simply install the new version and your existing licenses will continue to work.
(1) Project Options
The most visible change is the introduction of new Project Options (from the “Project” menu). These allow you to:
This last set of Project Options will be welcomed by all those customers who’ve been requesting this for some time. Here’s a few examples:
There are a number of reasons why you might want to change the background colours and text but it’s particularly useful if you want to grab a screenshot of the running simulation. A solid white background with no text, for example, will make it much easier to use the images in other documents, on Web pages or for printing.
(2) Bug Fixes
There are a couple of bug fixes in this release. One removes the limit that was placed on the amount of data that could be pasted into a Table element from the clipboard and the other fixes some serious issues with Simulator scroll bar operations. It also improves the calculations of scroll bars, especially when simulating different screen resolutions.
(3) The Secret New Feature
This actually represents the bulk of changes in the version 3.2 release but we want to keep it under wraps for the moment. It’s a significant feature that we are continually asked about but it’s still just a seedling.
Before we reveal what this feature is and make it generally available, we want to test it with specific customers that asked for it and work with them to develop it to a more useful level. From what I’ve seen it do so far, that hopefully won’t take too long.
Watch this space for further news!
Tagged GUI Design Studio, releaseHow often have you created a user interface layout and found that you need to change the order in which the elements appear?
It happens to me all the time!
The usual way to do this involves creating (or finding) a bit of space somewhere, moving one bunch of elements and controls into the space, shuffling all the other elements around and then closing up the space again. It can be a bit of a hassle sometimes.
Even a simple task of exchanging the positions of two elements can be fiddly when you need to get them properly aligned in their new places and they’re in each other’s way.
So we created the “Swap Element Positions” feature in GUI Design Studio v3.1 to address this common need and save a ton of time and fiddling about.
It’s easiest to demonstrate with this contrived dialog example but the technique is equally suitable for panels and icons in toolbars, on Web pages and anywhere else you need to quickly re-arrange things.
To swap the Middle and Bottom control groups, the 2 Group Boxes are selected (in any order) and after applying the “Swap Element Positions” command (Alt+S), this is what happens:
All of the control elements within the groups have also been moved. Crucially, though, the positions of the Group Boxes themselves have been adjusted to take account of the difference in heights of the groups. Job done in two steps and about 3 seconds!
But what happens to the Middle group when we want to swap the Top and Bottom groups?
As you can see, the groups have all been correctly re-arranged to take account of all the height differences and what lies between the elements being swapped. The same rules apply for horizontal re-arrangement and combinations of the two.
In some cases, you might need to use the feature a few times to ‘bubble-sort’ your elements for the ordering you need but even this will be much faster than manual re-arrangement.
It won’t solve every case but it’s a very handy tool to have at your side and, if things do go wrong, there’s always the Undo command that will leave you no worse off than having to do it manually anyway.
Let us know how you get on with the “Swap Element Positions” feature and if you find cases that don’t work for you, send them to support and we’ll see if we can improve the feature.
Tagged Features, GUI Design Studio, Productivity, User Interface DesignGUI Design Studio version 3.1 has now been released and is available for immediate download. This is a minor update with some small but very useful changes. Meanwhile, we are continuing to work on some major new features and further tweaks.
For customers using any prior version of GUI Design Studio, simply install the new version and your existing licenses will continue to work.
If you’ve been using a trial version that has expired, this new version should reset your trial period. If it doesn’t then please let us know and we’ll sort something out for you.
So here’s what’s changed in version 3.1:
(1) Navigation Type Selector
After much demand, we’ve finally put a Navigation Type selector onto the toolbar.
When you connect elements together to define application workflow, GUI Design Studio normally sets the navigation type based on the elements being connected. It gets this right about 80% of the time (or maybe 20% depending on who you ask).
But when you’ve made lots of connections and none of them are of the type you wanted, it can be a little tedious to change them all, though the Format Painter feature introduced in version 3.0 helps a lot here.
So now, you’ll be able to set the type of connection you want to make using the selector. Where connections have to be of a certain type, the selector will be ignored. You can also set it to ‘Automatic’ to let GUI Design Studio decide what type of navigation to create. This basically reverts to the previous behaviour without the selector.
The next two new features should help to navigate around a large design.
(2) Fit Elements to View
The “Fit Elements to View” command does exactly that. The view is changed so that the selected elements are all displayed. If possible, it keeps the current zoom factor. Otherwise, it will zoom out to make sure they’re all made visible.
With no elements selected, the whole design is made to fit within the view.
If you have a numeric keypad on your keyboard, you can use the ‘/’ key as a shortcut. This makes a handy combination with the existing ‘*’ key to set 100% zoom, ‘-’ to zoom out and ‘+’ to zoom in.
Of course, you can still use the Alt key with the left and right mouse buttons to pan and zoom the display. And, if you have one, the middle button will pan directly and the scroll-wheel can be set to zoom (according to preferences).
(3) Follow Connections
If you’ve ever found yourself zooming in and out or panning (scrolling) a large design to see where a connection takes you, or where it’s come from, then you’ll like this new feature.
Just select a connection and use the “Go To Connection Target” (Alt+T) or “Go To Connection Source” (Alt+R) commands to scroll them into view.
(4) Swap Element Positions
The last of the new features in the “Swap Element Positions” command. This started life as a very simple idea to just swap the positions of two selected elements.
However, once we’d implemented that, we realised that it really ought to do a bit more. Although it has other uses, the main reason for its existence is as an ‘element re-arranger’. So that is what it now does. After a fair few iterations, we think we’ve got it about right and it works like magic!
Because this ’small’ feature could be of great importance, there’ll probably be another post soon to look at it in more detail.
(5) Split Toolbar
On the very minor size, we’ve made the toolbar split in two if the application window gets too narrow to fit the whole thing on one line.
While this may not be too exciting for you when you always run GUI Design Studio full screen (as you should), it’s extremely useful for us as we start to create size-restricted video tutorials (yes, we’re finally getting them done!).
From a design perspective, note that the toolbar doesn’t just wrap in the middle. Instead, it splits into two, more appropriately arranged bars. Also, there’s no faffing with having to re-position the bars yourself, as you might with other styles of split toolbars, especially when returning to full screen mode. It automatically pops back onto one line again whenever it can!
(6) Check Box States
Another (seemingly tiny) change is that Check Boxes now have a 3-State option rather than just assuming that all Check Boxes are 3-state (for design flexibilty). The default is unchecked unless the Check Box has already been set to an intermediate check state.
This change might only save you the effort of a click or two when changing Check Box properties, but it will become much more significant when interaction features are fully enabled. Watch this space!
Bug Fixes:
We’ve fixed a couple of small bugs related to the application title bar when closing projects and keeping the Project panel open after creating a new project (ooh, that was an irritating one).
Of more importance, though, a few customers had discovered that dragging a component design onto itself could freeze the application, especially if the design was blank.
While this is not normally something you would want to do, it is quite easy to do by accident, especially if what you really wanted to drag was an image of the same name in the same folder.
If you’ve ever pointed a video camera at a television or screen that’s showing the live feed from the camera, you’ll understand the problem here! Although we had some protection against this, we’d managed to miss a test case. Oops. This has now been fixed but sorry if you got caught by this bug.
That’s about all of the changes for this 3.1 release. Download it now, give it a whirl and be sure to let us know what you think by leaving a comment on this blog or by contacting support.
Happy designing!
Tagged GUI Design Studio, releaseIn the middle of 2008 we released version 3.0 of GUI Design Studio. This was a major step forward for creating user interface mockups and prototypes with the introduction of the Windows Vista visual style option, Ribbon Bar elements, better Web application support and a bunch of other enhancements.
You may have noticed our new Website redesign and, while we’ve been planning a lot of new product developments, we’ve realised that we didn’t release nearly enough versions of GUI Design Studio in the year as we’d intended. we aim to fix that!
So we’re taking a different approach for 2009. Our new plan is to make a new release of GUI Design Studio roughly once every month so that you can benefit from all the latest updates sooner or upgrade whenever it’s convenient.
With this new, incremental development plan, you’ll be seeing regular small improvements with major new features thrown in, every once in a while, as they get completed.
I don’t want to reveal too much detail at this stage about the biggest new features we have planned (you’ll find out about them in due course) but, to give you a taster, here’s a few of the things we’ll be looking at:
Our goal has always been to ‘help you produce software that better meets users’ needs’. Keep sending us your suggestions and feedback to let us know what’s really important to you and help shape the tool for everyone.
We’ll certainly be keeping busy in 2009 and we wish you a very happy and productive year!
Tagged 2009, GUI Design Studio, plans, software prototyping, User Interface DesignPatrick Kennedy has released the slides from his presentation at the “Enhancing Online User Experience” conference in Melbourne Australia.
His Documenting Interactive Websites blog post contains the slides (also below) along with some great notes that he took after the session. Note that the link below is for the slideshare copy (without notes).
There are some nice sitemap, wireframe and storyboarding slides in the presentation to enjoy:
Patrick discusses the inadequacies of traditional documentation for the design of interactive Web 2.0 sites and makes the case for prototyping as an appropriate way to describe them. This is clearly a view that I share.
As tools like GUI Design Studio become more widely known and fully mature, I think that prototyping will become a common part of Website design as the ease and simplicity of using the tools will remove all barriers and the advantages become apparent.
Take a look at Patrick’s presentation and see what you think!
Tagged documentation, interactive design, Prototyping, websitedesignGUI Design Studio version 3.0 has now been released and is available for immediate download. If you’ve already tried a previous version or subscribed to our newsletter then check your email for download instructions, otherwise please request a trial.
With GUI Design Studio version 3.0, you can design and prototype a broad range of applications.
Rich Desktop Applications
In addition to the 40+ common controls included in GUI Design Studio, you can use a variety of other generic elements and add graphic images and icons too.
And with extensive support for tabbed interfaces, modal popups, dialogs and a whole host of other features, you can design almost any application.
Ribbon Bar Applications
Love it or hate it, you can’t ignore the Ribbon Bar interface that Microsoft introduced in Office 2007.
Now you can try out a Ribbon Bar design for your application without having to commit to any particular implementation or toolset.
Then you can evaluate it against a more traditional menus and toolbars design to see what works best for your users. All without coding of course!
Web Applications
There’s a complementary set of elements specifically designed for Web applications that you can use with some of the common controls.
Using components, GUI Design Studio makes it easy to deal with the complex Web sites containing common sections such as navigation menus on multiple pages. It even allows each instance to be customised while retaining a common master.
Rich Internet Applications (RIAs)
Modern Web applications are approaching the power of desktop applications.
GUI Design Studio provides for this with its support for components, dynamic panels, rollovers and tabbed interfaces.
Multiple Visual Styles Supported
Whether you’re designing for Windows Vista, XP, NT or the Web, you can change the look of your design with a couple of preference settings. Design in one style and present in another.
And if you need more of a lo-fi wireframe presentation that says “hey, this is just a quick prototype” then you can use Outline styling options or unusual colour schemes. Ever seen XP in orange?
Easy Access To Icons
No application is complete without icons. We’ve included over 150 common icons to get you started but when you need to create your own, you’ve got instant access to Icon Express, our simple to use icon editor.
And if you need a more powerful icon editor, you can configure GUI Design Studio to use your favourite editor instead.
Customer Upgrades
If you’ve already purchased GUI Design Studio licenses then version 3.0 will continue to work with your existing keys and your existing projects will be 100% compatible. Simply download and install version 3.0 over your current version and enjoy the latest features.
Evaluating GUI Design Studio 3.0
If you’ve previously tried version 2.4 or below, then version 3.0 should provide you with a new 30-day free trial period. If, for any reason, it reports that your license has expired then contact our support team and we’ll happily provide you with a new trial license key.
