Reflection: Week #4 – Prototypical Prototyping?

Last week I spent a lot of time learning Sketch so that I could use a new tool to effectively turn my wireframes into something digital. This week was more of the same as I imported my Sketch files into Proto.io to try to create a very basic, first draft of the prototype that I will eventually test. What followed was a long week of trial, error, frustration, recreation, and tweaking.

The first thing I encountered with Proto.io was the Sketch upload and Dropbox sync feature. This was very useful to putting items into the prototyping program. However, the screens I had created were not the correct size and would not scale appropriately. So I ended up moving items to new, appropriately sized artboards in Sketch for export. I had to delete any previously loaded assets, since for some reason the resized ones didn’t update correctly.

After that, I naively assumed that I could take the assets I created in Sketch and create something interactive with the tools given. In the past, I’ve used Axure so the wireframing and prototyping were all handled in the same program. I realized quickly that I would have to either create multiple versions of my assets (inactive, active, non-tappable states, etc.) in order to try to create a more seamless experience, or recreate the screens in Proto.io to assure interactivity with the pre-built assets in their library. I decided that I would try to create more general items in Sketch, but then use interactive elements that Proto.io provided.

The final thing that I struggled with was similar to my issue with Sketch – learning how to use the program effectively to do all the things that I wanted to implement for my prototype. It took some time, but I was able to create something I am proud of that utilized different states, transitions, and even variables. While I mostly enjoyed this process, trying to get everything just so was hard when bugs arose or certain items didn’t work the way I was expecting. You can see my progress here: http://proto.mattd.me

Over the next 2 weeks I will be further iterating and adding interactivity to the prototype, including some micro-interactions and accelerators for experienced users. With feedback from my classmates, I’m sure I’ll have a more fully functional prototype soon.