Archive for the ‘Example Designs’ Category

« Older Entries

Collaborative GUI Design Patterns Site Launched

Friday, March 26th, 2010

GUI Design Patterns SiteRight from the start, GUI Design Studio was built with the ability to link in libraries of common design components so that you can reuse them within different projects. This has been extended in version 4.0 with custom elements within libraries and the new templates feature.

This is also a really useful way of sharing your designs. If you work in a team, or in an organisation that creates multiple products, you can share complete designs, templates of multi-page design patterns or individual components. Not only does this help save lots of time, it also promotes consistency and best practice in your designs.

What’s been missing is an easy way for you to get access to design libraries and to share your own.

So we’ve just launched www.guidesignpatterns.com where you can download libraries, templates, samples and patterns, and make your own contributions to the community. So, even if you work on your own, you’ll be able to benefit from the work of others and to share your work with them.

Our aim for this site is to build up an extensive resource of common design patterns and elements to help you create your prototypes as quickly as possible.

(more…)

Tags: , , , , ,
Posted in Example Designs, Prototyping, User Interface Design | No Comments »

Styling Calendar Controls
- Are 33 colour options enough or too many?

Thursday, February 4th, 2010

Version 3.6 of GUI Design Studio included a new element for creating Calendar controls.

When we started designing this feature, we looked around for examples of different calendars in desktop and web applications. We found a wide range of different designs; some with one month, some with 3 or 4, some highlighting “today”, others highlighting a particular day or a range of days. Of course, each application had quite a different visual design to its calendars as well.

In the past, we’ve tried to simplify elements and minimize the number of settings and options they have but, with this new element, we felt we had to provide for the increasing demand on design flexibility.

The problem, as all of you designers of great user interfaces will know, is that with flexibility comes complexity. We didn’t want to give you a tool which is hard to learn or slow to use because it has so many options and special cases, but we did want to give you a tool which will let you create the calendar design you need, quickly and simply.
(more…)

Tags: , , , , , ,
Posted in Articles, Example Designs, GUI Design Studio, Usabilty, User Interface Design | No Comments »

Short Demo on How to Create Scrolling Regions in GUI Design Studio

Tuesday, May 12th, 2009

Following 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:

  1. Create a large design.
  2. Create your container design.
  3. Drag and drop your large design onto your container design as a ‘component’.
  4. Double-click the component to edit its properties, as follows:
    • Check the “Maintain size when component changes” option on the Style tab
    • Uncheck “Fixed Width” and “Fixed Height” on the Position tab
    • Set an arbitrary small size to make it easier to work with, say 300 for “Width” and “Height” (Position tab)
    • Hit “OK”
  5. Resize the component to the actual desired size.

That’s it!

Tags: , , ,
Posted in Example Designs, GUI Design Studio, Prototyping | No Comments »

Web Application Design Walkthrough Video

Tuesday, January 29th, 2008

The walkthrough video for the Internet Banking Web Application design is now available to view in the Gallery. This gives you a brief (2-minute) tour of the design and points out a few of the key features.

You can download the entire project (only 86 KB) to see how the whole design was put together. The project files can be opened in GUI Design Studio or the free Viewer that can be downloaded from the Gallery.

Tags: , ,
Posted in Example Designs, GUI Design Studio, Prototyping, User Interface Design | No Comments »

Web Application GUI Design Example In The Gallery

Thursday, December 6th, 2007

Internet Banking Web Application GUI DesignMost of our design examples so far have focussed on Desktop applications but GUI Design Studio is also highly suited to Web Application design.

From the many requests for a Web Application sample, and the dozens of different kinds of application requested, we’ve put together an Internet Banking example.

We chose Banking because it would be familiar to most people and we also had easy access to a few real examples to crib ideas from (not that we’re lazy – we just didn’t want to spend too much time re-inventing a good design).

This new sample demonstrates:
(more…)

Tags: , ,
Posted in Example Designs, GUI Design Studio, Prototyping, User Interface Design | No Comments »

« Older Entries