Using Pixate
Probably the best mobile prototyping tool around
This past week I’ve been exploring transition and animation prototyping with a new app on the market, Pixate. It seems there’s a new one of these every week so it was with some skeptiscm that I decided to give Pixate a go. I couldn’t exaggerate the frustrations of trial and error I’ve been through to get versed enough in this long line of protyping tools, from flinto, easel, marker, origami et al just to find them fizzle out of fashion or get bought out and close doors. Many a time I’ve just wished I’d stuck with learning to code properly. But hey, I’m a lazy man and thats exactly the type of customer these faddy interaction design tools were made for!
So what exactly is Pixate?
Its a mobile interaction design and prototyping tool that allows you to design for Android and iOS devices through their in browser or desktop app.
Ok, so why’s it different?
Well, the intelligent bit is that by downloading the app to your mobile device as well, you can see, and play around with, live updates to your prototype which you can then pop in your pocket and carry around to your pitches or user testing sessions.
Any examples?
Heres an example of a prototype for an app that I’ve been playing around with recently. It has proved extremely useful in communicating ideas to stakeholders and developers. Although I maybe need to pull back the spring animation a tad!
What else is it good for?
Realistic animations
It’s amazing how native the animations and transitions feel when you hold your designs in your device. There are quite a variety of animations available from scale, to fade to colour changes. All based on interactions such as drag, swipe, pinch or tap. Which makes it really easy to replicate the transitions we’ve grown accustomed to on our mobile devices.
Ask for help functionality
In the top right hand of the app sits the help functionality which lets you send an S.O.S. to Pixate staff. This is a great addition that actually works, within a few hours I’ve received a response everytime I’ve used it. Of course some of these simple problems could have been resolved through an FAQ or user guide that I’m assured is coming soon.
Easy to update with sketch exports
After recently adopting Sketch 3 which I love for its easy exporting of layers, its great to see the ability to drop in and refresh PNG layers within Pixate is relatively easy.
Free for a month
Need I say more, then $100 for a year (I think I’ll be investing)
Ok but what about the bad?
Server problems
On a few occasions it has seemed there are server problems their side as certain tools become unavailable, prototypes don’t save, or the auto-refresh on your mobile device seems to inexplicably stop working. This is most likely due to teething problems through an overwhelming take-up since launch, but it is still very frustrating.
Quite a steep learning curve
The process of applying animations is a confusing process at first, especially when trying to add conditions to animations. But after my first day of tinkering I had my first parallax scrolls and springy transitions up and running so it can’t be that overwhelming.
No documentation on various tools, yet…
Aside from a few video tutorials the documentation and support network isn’t quite established yet. This has resulted in me not knowing what half of the controls mean. Image animation anyone?!
Missing reverse animation functionality
Annoyingly when you apply an animation to a layer which relies on a tap for example, you have to then apply another animation to the same layer and manually ascribe the conditions needed to return it to its former position. For example opening a help box and then wanting to close it would require two manually made and carefully calculated animations. It would be great addition if you could have an automatic, undo or back animation that could be selected with a single click.
Peculiar higher level interface
There are a few apparent dead ends within the apps structure and its hard to find your way back in the architecture of projects, mainly due to there being none of the traditional controls usually found in menu bar, for example the duplicate functionality.
Stock animations effect design choices
Library animations often reduce your willingness to explore new avenues and style of animation, it is very easy to just default to a standard ease in or spring motion, instead of trying something more daring. Of course this is also a point for the positives, as it is these standard library of animations that most apps and sites on iOS and Android use and which result in your designs being a believable prototype.
So should I give it a go?
If you require a tool to convince stakeholders or communicate to clients your ideas of mobile interaction, and you don’t want to get bogged down by code, and you want it to feel realistic and native, and you want it to be up to date on your device automatically…
...then look no further.
To see examples of my experimentations on pixate, follow me on dribbble.
For more of my musings, follow me on twitter.
