Proto.io stage 1

I have started exporting my high fidelity screen states in the proto.io over this past week. I have found Proto.io quiet easy to use, once you figure out all the little tricks, but it quiet self-explanatory. I started by animating the opening progress page, I wanted the progress wheels to turn instead of being static, adding some movement to my app. After playing around with all the features Proto.io offers I figured I could do this using screen states and containers. I wanted each separate progress state to be changed in a carousel.

I copied each state and animated it so when the user wipes left on the current state on the page it will trigger the animations for the next state. For example, when the user is looking at today's progress page when they swipe to yesterday's progress, they will trigger the animation.

I have also created an alert that is triggered by clicking on today's interruptions. The reasoning behind this is to get the users to engaging with the diary function of the application. The best way to deconstruct irrational thoughts is to write them down and see what you were thinking on paper. 

The user will fill in where they were when they used the interruption, and this will lead them to the diary page. This is where they fill out the information about the interruption and gets the user to think rational about what they were thinking at the time. I have added the ability to save these entries, if the user experiences a similar situation they can reflect what they felt at a different time.