HTML Prototype Viewer Sneak Peek

So you've been using Indigo Studio for a while now, and you're thinking, "Wouldn't it be nice if I could run my Indigo prototypes without requiring Silverlight? I mean, that would be awesome! Then I could see and evaluate my prototypes on mobile devices." We agree!

I've got some good news. Today I'm sharing a sneak peek of the work we've been doing to make that a reality. Above you see our built-in, sample prototype called "Rove" running on an iPad mini!

What's that you say? You want to see it to believe it? Okay!

Run Rove as HTML Prototype

Rove is a tablet prototype, and if you're on an iPad, I suggest you add it to home screen. This will let you experience Rove as an iPad app (without the browser chrome).

Or maybe you have a phone? Well then here's our "FindFlix" phone sample prototype:

Run FindFlix as HTML Prototype

As with Rove, you can add it to your home screen on iPhone to experience it as an app without the browser chrome. Keep in mind this is a preview, so if you experience any issues/bugs, please let us know by emailing indigo at infragistics dot com.

I don't know about you, but the possibilities this opens up really get my designer juices flowing.

Say you're working on a new mobile app, maybe a tablet app, or maybe you're even starting with responsive Web design in mind. You've captured your stories from your low-cost user research, and now you're ready to roll your sleeves up and start designing. Maybe you start by sketching out ideas on paper or whiteboard, but you're ready to take it to the next level.

So you grab Indigo Studio. You open it up and toss your stories into some storyboards, or you skip that and jump right into the UI and interaction design. You sketch out your ideas in Indigo or just drop in some photos of your sketches and add some hotspots. Before you know it, you have a nifty, interactive prototype that you want to share and evaluate, so you flip to the project tab and click Share Prototype, copy the URL, and email it.

Now you grab your device, click the link, and voila--you're trying your prototype on your device! You walk down the hall, and hand your phone to a user-like substance (someone like your users, if not your actual users) and ask them to do what your story says users will wanna do. You watch them, and doh! they run into a wall. "No problem!" you say to them. "I'll be back in a few minutes."

You step back to your computer, tweak your design, click share, and you're back in a few minutes with your next iteration.

No hassling with code, setting up a dev environment, finding and installing the latest frameworks, figuring out how to make the code do what is in your head, failing, trying again, failing and just generally burning a bunch of design time and energy on fiddling with inconsequential technical details. No painstaking elaborate pixel-perfect static wireframes you are reluctant to change. No time wasted on tons of annotations explaining what your design will do, asking your potential users and clients to imagine what will happen--they can just see it; they can just use it! On the target device class you designed for. In no time, you made and evaluated several prototype iterations, and you're left with confidence in your design. This is Indigo Studio.

Okay, so you're probably wondering, "When can I take advantage of this on my own prototypes??" It's coming soon! Keep your eyes peeled. We will definitely blog and tweet about it, so subscribe or follow us if you're interested. You'll be able to use it on newly shared prototypes and prototypes that you already shared to our servers.

Have a great weekend!

About Indigo Studio

If you haven’t already, why not Go Design Something!? Version 1 is free forever.

If you are using Indigo, we welcome your ideas on how we can better apply and refine these and other good interaction design principles to help you to design awesome UIs. If you have any questions or problems, please don’t hesitate to discuss them with us in our forums. We’re also on Twitter @indigodesigned.

About the Author

Ambrose Little is principal design technologist at Infragistics and has worked on Indigo Studio as interaction designer and product manager along with an awesome team based here in Cranbury, NJ, USA and Montevideo, Uruguay.