GUI Design Studio Professional Edition

GUI Design Studio is a graphical user interface design tool for Microsoft Windows that you can use to rapidly create demonstration prototypes without any coding or scripting.

Draw individual screens, windows and components using standard elements, connect them together to storyboard operational workflow then run the simulator to test your designs.

GUI Design Studio can be used whenever you need to draw what an application should look like or show how its parts connect and flow together such as:

• documenting product ideas
• creating project proposals
• requirements capture
• creating screen mock-ups
• producing detailed specifications for developers
• suggesting enhancements to existing products
• + many more uses

Create presentations to users and stakeholders or even just to yourself to:

• verify designs
• explore alternatives
• evaluate different usage scenarios

Features:

Create User Interface Designs Quickly and Easily
Whether your screens are representing application windows, Web pages, sub-panels or custom controls, the fully featured screen designer will let you create them quickly and easily.

• Drag and drop positioning of design elements
• Edge and specialised snapping that allows elements to just 'click' together
• Smooth pan and zoom using the mouse (with extra support for scroll and tilt wheels)
• Unlimited undo/redo
• Cut, Copy, Paste and Duplicate commands
• Automatic parenting of elements
• Alignment and spacing tools

Access Over 120 Built-In Design Elements
Create screens using standard Windows controls, Web elements and other generic elements. Variations are provided in many cases to speed up construction. Combine elements to create custom controls and further variants.

• Frame Windows and Dialogs
• Toolbars, Menu Bars and Popup Menus
• Text Boxes, Edit Boxes and Combos
• Buttons, Radio Buttons and Checkboxes
• Scroll Bars, Sliders and Spinners
• Lists, Trees and Tables
• Tabs, Tab Bars and Panels
• Progress Bars and Rulers
• Ribbon Bar Tab Panels, Menus, Buttons and other elements
• Web Pages, Panels, Buttons and Text Lists
• and more...

Custom Elements (New in 4.0)
Create your own set of commonly used elements, and groups of elements

• Turn any design file into a custom element for reuse.
• Specify folders containing custom element designs.
• Drag and drop to add a custom element to a design and edit as required.
• Obtain or create your own project libraries of custom elements and link them into your working projects.
• Package custom element libraries for sharing with others.

Project and Design Templates (New in 4.0, Professional edition only)
Turbo boost your productivity by starting from a design template instead of a blank canvas.

• Create new projects based on a template.
• Insert design pattern templates into an existing project with all the files that are needed.
• Inserting always creates unique files so it's safe to use for repeating patterns within the same folder.
• The browser displays thumbnails to help you choose and lets you find templates by category or select from your most recently used templates.
• Create templates from entire projects, folders within projects or individual design files.
• Import templates and share your own templates with others.

Include Icons and Images in a Variety of Formats
Add background and foreground graphics to your designs and adjust their layout as easily as with any other element.

• Drag and drop images from the Project file tree
• Popular image formats supported including BMP, GIF, JPEG and PNG
• Transparent GIF and PNG files supported
• Crop, stretch and tile images
• Fast access to categorised palettes of icons
• Common icons are shared between projects
• Projects may also have their own icons
• Uses standard ICO files that may later be used in production
• Scale icons to test them at different sizes and avoid having to create multiple versions while prototyping
• Over 150 basic icons included to get you started
• Create your own icons using the integrated Icon Express icon editor
• Integrate with a different icon editor if preferred

Annotate Your Design with Overlays and Side Notes
When you need to add further explanations to your designs, you can add annotation elements right on the page or keep them out of the way in side notes.

• Add floating text boxes, curly brackets and markers directly to designs
• Add formatted notes to describe an entire design
• Add formatted notes to describe each individual element
• Element notes appear in a popup tool tip during design and when running the prototype
• Show or hide annotations on a design with a single keypress

Create Reusable, Modular Design Components and Masters
Break your projects down into smaller component designs that can be reused on any number of other designs.

• Create background and foreground masters
• Share component design parts such as panels and custom controls across multiple designs
• Components may be used within other components to any level of nesting
• Changes to the original component are instantly reflected wherever they’re used
• Override component element properties on specific design instances
• Reuse common designs across multiple projects by placing them in libraries

Storyboard Your Designs to Create a Dynamic Prototype
Creating individual screen designs is useful but GUI Design Studio also lets you connect them together in different ways and bring them to life as an interactive prototype.

• Graphically describe application workflow
• Instantly run and test your design as an interactive prototype
• Create navigations to show or hide windows, panels and modal dialogs, etc.
• Use anchors to position them precisely where you want
• Tabbed interfaces supported with ease
• Navigate from hotspots within bitmap images
• Produce right-click context menus
• Scenarios let you change navigations based on chosen conditions
• Use message boxes to describe processing or complex behaviour
• Change the effective screen resolution to see how your design might fit a different screen size
• No scripting or coding is involved

Enhanced Interactivity (New in 4.0, Professional edition only)
Take advantage of interactivity features that bring your prototype to life and make your design ideas more realistic.

• Element interaction allows for item selection, check box state changes, data entry and other behaviours, with keyboard control.
• Assign data variables to elements to use their values elsewhere in the prototype.
• Text on many elements can contain dynamic content by embedding data variables.
• Control navigation automatically through the use of business logic expressions containing variables and various functions.
• Conditional panels display different content depending on any number of expressions and data values.
• Change the visibility and enabled state of elements according to rules based on data values.

Generate Specification Documentation
Demonstrating a navigable prototype is the most powerful way to get a feel for an application and elicit feedback but sometimes you also need to produce more traditional static documentation to share with colleages and users.

• Automatic generation of full specification documentation
• Includes all designs, screens within designs and all notes and annotations
• Create full documentation or include only the latest changes to save paper, ink and review time
• Choice of formats include:
  o HTML
  o PDF
  o RTF (for direct editing)
• Full template styling available for HTML to match your specifications
• HTML also provides fully cross-referenced hyperlinking of component (master) design usage

Export Designs for External Review
In addition to creating specification documentation, designs may be exported for review in a number of other ways.

• Create a single distribution file containing all of the referenced files no matter where they are stored
• Include the whole project, a single folder section or just an individual design
• Distribution files are very small and can be sent to anyone with the free Viewer application
• Optionally allow the Viewer to launch straight into running the prototype so that the distribution 'acts' like a real application
• Distributions allow different visual styles to be applied within the Viewer
• Export individual designs to a number of different image file formats
• Copy an entire design as an image for pasting into another application such as a Wordprocessor

View Your Design in Multiple Visual Styles
Present your designs in a style that's appropriate for your audience. Sometimes you need high fidelity for acceptance and sometimes you need low fidelity to encourage feedback and change. GUI Design Studio allows you to change your presentation without having to change your designs.

• Choose your visual style from a Preference setting
• Design using your preferred working style and run the prototype for presentation in a different style if desired
• Visual style options for:
  o Windows Vista
  o Windows XP
  o Windows NT/2000 (Windows Classic)
  o Outline / Sketch Styling
• Over 20 basic colour schemes available to all Windows styles (4 for Outline), plus custom colour schemes can be created

Collaborate in Teams on Your Design Projects
GUI Design Studio allows teams of designers to share design files and work on the same project at the same time.

• Special support provided for Subversion (SVN) control of projects
• Repository servers may be on the local Intranet (LAN) or on the Internet
• Re-organise projects by deleting, renaming and moving files with references maintained and changes transfered to other team members
• Have the freedom to modify design files without locking them and merge changes made by other team members (automatically in most cases)

GUI Design Studio Benefits

Physical products from performance cars to electric toothbrushes benefit from the creation of prototypes before final production. They significantly lower risk on a project and produce better results. Software is no different.

When it comes to software prototyping, you’re probably in one of two camps:
  
1. You know that prototyping your applications will greatly benefit your projects and you’re looking for the best tools and methods for the job, or
   2. You’re new to the idea of creating a software prototype and need to be convinced of the benefits.

In either case, the information below should help you understand why creating initial mock-ups or prototypes will give you an advantage and how GUI Design Studio lets you get the job done with ease.

Save Time and Money when Gathering Requirements

• Starting with the right set of requirements is very important. Even agile methodologies with incremental development cycles need a basic set of requirements to work from.
• A user interface mock-up or prototype will allow everyone to visualise the application and quickly expose missing requirements and unnecessary complexity.
• Special cases and critical design factors can be identified early in the project lifecycle.
• GUI Design Studio provides the missing ingredient to complement and augment traditional functional requirements.
• Because the mockups are very visual and lead to quicker understanding, agreement can be reached sooner and costly misunderstandings can be avoided.

Save Time and Money by Eliminating Development Rework

• With a clear user interface specification to follow, developers can spend less time thinking about layout and other details at the implementation stage.
• With a pre-approved design, there’s no second guessing the requirements so developers can focus on getting it done without the worry of having to change it later.
• By getting it right first time, change requests will be minimised and a high proportion of rework that would otherwise occur will be eliminated.
• The result is shorter and more predictable timescales, allowing projects to be delivered on time and on budget. Unpredictable overrun costs can be wiped out completely.
• GUI Design Studio makes the designs available to everyone.

Have Happy Users That Love Your Software

• Deliver software that actually meets the needs of users and exceeds their expectations.
• By involving users early in the design process, where possible, you can identify important workflows and test them with a software prototype.
• Ensure that terminology is consistent throughout the application and find areas of confusion early in the project, before it's too late.
• GUI Design Studio prototypes are so quick and easy to create that you can test and tweak to streamline the most important tasks and produce far more design iterations than with other techniques.

Reduce Project Risk and Increase Confidence

• When you don't know the full scope of a project, you risk failing to meet proposed deadlines. A GUI Design Studio helps you to better visualise the whole project.
• A better understanding of scope will allow for more accurate timescale predictions and reduced risk of costly overrun.
• Be confident that you can deliver within your specified timescales - on time and on budget.
• Design within a high-speed, low-risk, throwaway environment that encourages revision until the design is right and keeps the implementation options open.
• Avoid the risk of a prototype built with development tools where there may be resistance to change due to the effort already spent and pressure to turn it into the final system when the underlying code has been produced for speedy availability rather than robustness.
• Discuss implementation issues with developers before the code is written to identify areas that will require further investigation or an alternative approach.
• Catch design errors and inconsistencies, find critical factors and explore special cases early in the project lifecycle, before it's too late.
• Build confidence with your clients and users by presenting a clear vision of your project or application.

Improve Understanding Within the Project Team

• User interface mockups and interactive prototypes you can see and play with provide far superior understanding of a project than words alone within a requirements specification document.
• GUI Design Studio keeps design notes and annotations where they belong; with the screens they describe.
• A user interface specification document can be generated automatically where necessary to present the design in a more static form with all of the associated information bound together.
• Because rapid prototyping of your application without coding is very accessible, everyone in your project team (that you choose to allow) can contribute ideas and annotate designs.

Improve Software Usability and Eliminate Frustration

• A key advantage of building a user interface prototype is the ability to test workflow with multiple scenarios to ensure that they're usable.
• Check that the most common scenarios are optimised for minimal effort during use.
• Check for consistent naming and layout rules throughout the design.
• Engage with users early in the process and eliminate areas of frustration within the design.

Increase Productivity and Unleash Your Creativity

• If you’re already creating application mock-ups or prototypes using image editing tools, development tools or paper then you’ll find GUI Design Studio to be a much faster way of working, with features that are designed to help you and not hold you back.
• Treat the screen like a freeform canvas to place design elements wherever you want – just like on paper but with a practically unlimited canvas size and all the advantages of computer editing.
• If you want to incorporate paper sketches and whiteboard sessions, you can scan them in and use them too, scaling the images to fit where necessary.
• Use your creative skills to produce new interface elements if required. Construct them from other elements or draw them in a graphics package or on paper. The development toolbox is no longer a restriction. If you can draw it, you can use it!
• Since there’s no coding involved, efficient product design becomes accessible to everyone, especially the user interface designers and specialists that need it.
• Quickly prototype multiple alternatives for evaluation and use the design duplication feature to make this even faster.

System Requirements:

• Microsoft Windows 7 / Vista / XP / NT / 2000
• At least 20 MB hard disk space
• At least 512 MB memory recommended