This overview will introduce the use of Sketch for design, Marvel for prototyping and Lookback for feedback.
If you would to discuss your app design process, please contact me.
No More Xcode
This is the last mention of Xcode in this article because it’s not necessary for prototyping. It’s too cumbersome, restrictive and final. Storyboards seem to be a good fit for this purpose but fall short when compared to the following tools.
Speedy Sketching
Sketch is a user interface design tool. It’s been designed that way from the ground up and it has a healthy ecosystem of plugins and resources.
It’s intuitive use means that the learning curve is low. Although there are a ton of tutorials and guides out there if you get stuck.
iOS App Prototyping
Amazing iOS 9 design resources have been provided by Facebook and Meng To. These contains elements of all levels of app design from entire tableviews to single icons. Each of the resources can be broken down to a granular level. With each one having customisable settings for size, colour, opacity, tint, border, blur, anything, ever.
This means that prototyping becomes a matter of arranging existing elements on screen rather than designing from scratch.
By reusing existing UI elements a design can evolve very quickly.
Building Blocks
Through the use of Symbols and Text Styles is possible to build resuable blocks of elements. These can then be updated in one central library with the change being reflected throughout the design.
(This is the first step in ensuring that the design has been structured correctly and a cohesive style guide has been applied).
Marvelling with Marvel
Marvel is a prototyping tool. It allows you to upload your designs and create links and transitions between screens. A project can then be viewed on the web or via the Marvel iOS app.
Using a third party plugin it is simple to publish your Sketch design in Marvel.
When adding hotspots to a design to link to another screen you also specific the transition type. These settings are stored in Marvel and are kept when a new version of the Sketch design is uploaded.
There is something very powerful about the lack of effort required to deploy your prototype to a device for feedback and testing. The reduction in time so drastic your project feels successful immediately. With early stage feedback from a design preview on device you’re cutting costs and adding value at the same time.
Feedback with Lookback
Lookback is a user testing tool that records a test session in the prototype, including a video of the users reactions.
Through an integration in Marvel, you can watch users testing the design you created in Sketch.
The session is initiated from within Marvel. Users can be invited via a shared URL or by email. They are asked to install the Marvel app and then start the test. It’s a seamless experience for the user.
The results of the testing are presented in a very powerful way. The timeline, app recording and user video recording are all synced to show the route the user took through the design.
It also archives all the user testing for future reference.
Winning Combination
This simple workflow is amazingly powerful. The number of steps are minimal. The value is unfathomable.
From creating a design in Sketch, animating it in Marvel to watching recorded user feedback sessions in Lookback.
Any app design process can benefit from this workflow. If you would to discuss your app design process, please contact me.