Relating Screenparts to Storyboards and Screens in Indigo Studio

Screenpart was always a critical piece of our prototyping vision for Indigo Studio. Ever since we decided to build Indigo Studio, screenpart was always there, sharing the stage with storyboards and screens. The following graphic tries to summarize the inter-relationship:

We love the UX process, and it exists for a reason. As designers, what we discover first is the story-of-use and stories that are desired. I tend to agree with Thomas Erickson's explanation. He explains it quite well, especially the part about story-gathering as an early step in the design process. Furthering this view, I have always seen stories as not bounded by the application, but more about how the application interacts in the real world. We design it such that the application (prototype) participates in this story, and in doing so contributes to a better overall experience. And the only way we know this happens is by evaluating the prototypes we create with users, learning and iterating. We need to validate whether we are indeed building the right experience, and hence Indigo Studio for Interaction Prototyping!

Storyboard

In Indigo Studio, storyboard is one way to represent a broad vision for your prototype. It blends UI prototypes (screens) inside a real world context (scenes). More literally, you can add UI screens that you designed as a step in your story or add it inside any scene that shows a device context. The toolbox on the storyboard designer shows two tabs consisting of scenes and screens to help depict stories.

Screen

Screens, as we have defined it, are used to design your wireframes, pages, windows, pop-ups--whatever you want to call your UI-Views. These serve as the building block for your prototype. And if you are familiar with Indigo Studio, you can also create states of a particular screen when you add an interaction. And by using screen states, you never have to re-draw or maintain all your UI-views. All you need is to design the changes you would like to see based on the user interaction. To support designing UI-Screens, the toolbox on the screen-designer shows two tabs, UI Elements and Screenparts.

Screenpart

Screenparts, as we mentioned before are reusable parts of your screens. These increase your efficiency, by letting you create custom UI elements once, and then reuse them on any other screen in your project. You can bundle up reusable interactions as well as visuals, and even use them as masters. The toolbox on the Screenpart-designer shows the UI elements, which you can use to create a Screenpart.

Learn more about using Screenparts

Prototyping using Indigo Studio

To summarize, Screenparts can be added inside screens, and screens can be added inside of storyboards. And once this is done, you can continue to make changes to the screen to automatically update the storyboard, or make changes to the source Screenpart and automatically update the Screens.

Indigo Studio does not force you use to adopt a particular design workflow. By this we mean that you can take any of the three paths offered in the NEW menu. You can start designing any of the three--storyboard, screen or screenpart. Even better if you create these just when you need them in your workflow. As you design screens, these automatically show up in the storyboard designer toolbox. As you design screenparts, these automatically show up under the screenparts tab in your screen-designer. We aspire to help keep you focused on your design story and your prototype. Design bits when you need them!

I hope this explanation along with the graphic above helps relate the three members in Indigo Studio, and their reason to exist. Now go design something!

How to Get This update?

Here's how to update the version of Indigo Studio installed on your machine:

• If you have the option to automatically check for updates on startup checked, you should see a dialog box pop up when you launch Indigo. Simply click update, and Indigo Studio will do the rest. This is the easier approach.
• If for some reason you chose not to automatically check for updates, go to MENU > HELP & ABOUT and use the "CHECK FOR UPDATES" option.

About Indigo Studio for Interaction Prototyping

Don't have Indigo Studio? Download a free 30-day trial which will let you try all of the prototyping goodness.

Download Indigo Studio

Looking to suggest improvements and new ideas for Indigo Studio?

Submit a new idea

If for some reason you are having trouble with Indigo Studio, check out our help topics, forums or contact support.

Get Support

Follow us on Twitter @indigodesigned