Sitemaps

Questions

UX Design

What tools do designers use to produce usage animations when a mobile app is still in infancy (i.e., mockups, composites, prototyping)?

We're looking to produce some short clips so our audience gets a better idea of real world usage. Can you advise on any good applications that designers use at this stage to produce these types of videos? Our compositions are produced in Photoshop. Is there a type of prototyping kit for mobile apps that does this? Treading on new territory, thanks for any input!

Answer This Question

5

Answers

Duncan Hopkins

UX and Design Director

I second invision for showing quick online prototypes, but for something more versatile, i use AxureRP (www.axure.com) . The ability to build a sketchy wireframe or a pixel perfect app is amazing. I love it. Great for mobile gestures and animations. Go check it out - they offer a free trial. Contact me if you want more info but they have awesome tutorials on the site. I taught myself everything.

Answered about 11 years ago

Tom Williams

Clarity's top expert on all things startup

I would suggest a clickable prototype rather than video. You can then easily screen record a walkthrough of the app to a video but it's so much more compelling and convincing to put your phone in someone's hands and let them click.

FluidUi is a great rapid prototyping tool that is very easy-to-use and is pretty much drag & drop to make interactive (clickable) prototypes.

I've used it to demo to customers for feedback and raise funding.

There is also HotGloo and Proto.io (neither of which I've used).

Answered about 11 years ago

Scott Magee

Business Builder at Thinktiv

I'm a big fan of InVision for clickable prototypes. You can string together static screens with hotspots that can look and feel like a mildly interactive site depending on the level of fidelity you're looking for. I've built many demos using this service. Clients respond well to the interface and developers understand what happens when you click different links. Let me know if you'd like to know more.
http://www.invisionapp.com/

As for quickly mocking up a video, you can hack together a quick version using Powerpoint (set timed transitions for slides) and add music or voice overs using iMovie.

Quicktime also has an out of the box screen recording option that can supplement the above options.

Above all, be sure you have use case defined in a script with linear flows articulated via screens.

Scott

Answered about 11 years ago

Bryan McAnulty

Founder of Heights Platform and Velora

Why not go one step further and produce something that can actually be used? My team uses our own frameworks to prototype in HTML/CSS, but when you don't have that I'd say the next best thing is Proto.io (http://proto.io). You can create interactive prototypes to test directly on the device in minutes without code.

If you really need video of interactions, I'm sure you can capture that from what you create with the tool. Even better, now you also have something tangible that you can hand to a potential investor or user to let them experience for themselves.

I'm not affiliated with Proto.io in any way. Since I prototype with code, I haven't actually used the product yet, but I've heard many great things about it. Hope this helps.

Answered about 11 years ago