GUI Design Patterns

GUI Design Patterns

Caretta Software  //  Download GUI design libraries, templates, samples and patterns for the GUI Design Studio prototyping tool.

Aug 3 / 7:51am

iPhone Library v1.1

Contributed by Caretta Software

Library:     iPhone Library
Version:    1.1

This is an updated version of the library containing an extensive collection
of custom element widgets and components for prototyping Apple iPhone and
iPod Touch applications.

New in v1.1:

  • Custom element grouping (for v4.1) 
  • Rotate buttons added to devices for prototyping purposes 
  • Landscape keyboards and selectors 
  • Additional Form elements and buttons 

The Rotate buttons on the Device components appear as icons near the Home
button and are intended to be used as a trigger to emulate rotating the
device from Portrait to Landscape and back. This lets you design interfaces
for both orientations and see how they inter-play. There's a simple rotation
test design included to show how this might be used.

 

(download)

Click here to download:
iPhone-Library-v1-1.zip (195 KB)

Filed under  //  Libraries   iPhone   iPod Touch  
Apr 12 / 7:54am

iPhone Alarms Application Prototype Sample

Contributed by Caretta Software

Requires:             iPhone Library

This is a very simple iPhone “Alarms” application prototype, based on the Alarm mode of the built-in Clock application. It demonstrates use of the iPhone Library.

There’s a few things worth noting with this sample:

  1. It includes a Quick Concept screen flow, using the Tiny screens, that was put together in about 10 minutes (see screenshot).

  2. During design, it was useful to copy and paste parts into new custom element widgets (in the “_Widgets” sub-folder) to speed up duplicating areas.

  3. As of GUI Design Studio version 4.0, there’s no way to turn off the scroll bars of scrollable components (otherwise there’d be no way to scroll them). So we had to cheat a bit for the scrolling “Change Sound” screen where a “Windows” scroll bar appears in the prototype (see screenshot). The trick here is to nudge all of the scrolling region content further over to the left than they would normally be to make room for the wide scroll bar. The scrolling component ‘part’ design should be 306 pixels wide rather than 320.

 

(download)

Click here to download:
iPhoneAlarms.zip (25 KB)

Filed under  //  Samples   alarms   iPhone   iPod Touch  
Apr 12 / 7:18am

iPhone Library v1.0

Contributed by Caretta Software

Library:                 iPhone Library
Version:               1.0

This library contains an extensive collection of custom element widgets and components for prototyping Apple iPhone and iPod Touch applications.

The components are intended to be used as-is. In contrast, the custom element widgets are, of course, intended to be edited once they’ve been added to your own designs, to change text, colours, icons, etc.

We’ve also included an experimental set of “Concept” widgets. These are simply mini (half-size) and tiny (one third size) versions of a few common screen layouts. The idea is to use these up-front on a storyboard design to figure out what screens are needed and how they flow, before getting into detailed design for each screen.

Version 1.0 skimps on landscape copies of many elements but there should be enough to get started. We’d also like to add many more colour variants of buttons and title bars for future versions of this library.

(download)

Click here to download:
iPhone-Library-v1-0.zip (153 KB)

 

Filed under  //  Libraries   iPhone   iPod Touch