Amanda Conlon's profile

Prototyping in Principle

Prototypes Using Principle
This was my first attempt to use Principle or any kind of interaction design prototyping tools. I found this article on Medium with great instructions for creating simple interactions and here are the results. I enjoyed it so much that I continued to create more interactions to add on to what the instructions described (my interaction is the last one). 
Hamburger Menu
Drop Down
Click Into Profile
Tabs
Vertical Scroll
Horizontal Scroll
Horizontal Scroll that Snaps to Middle 
I was really enjoying this so I decided to try to add on to this to create the next steps in the interaction. Since this looked like a profile page, I decided to continue the flow to change the profile photo. 
Changing Your Profile Photo
In the interaction above, my intention was to have someone look at their profile -> click the image to enlarge it -> click the plus sign to open the camera -> save the photo to their profile. In each step there is an option to go back or to close out the whole thing. 

What I learned
This was really fun and I want to keep playing around with this for the rest of the 14 day trial. I learned that there is a lot involved in simple actions on an app and it's easy to forget a detail in the process. I tried to keep in mind having a way to back out of every screen and also a way to close it out completely since the profile is probably not the main feature of the app. Overall, I found this really satisfying and super fun! 

Future Considerations
I started with someone else's design which was very helpful but I also had to guess at what they intended to use this for. I also realize that it is kind of awkward having the hamburger menu close out to a blank page so I should have built another screen for a newsfeed or something like that. Looking back I should have used the template with the yellow button for clicking into the profile since it had a newsfeed already. I still need to figure out how to create the prototype layers (in Sketch I'm guessing) and how to import them into Principle. Just trying to create an arrow was pretty frustrating but guessing this should be done in Sketch first to make it a ton easier. I'm also not sure it is great to move stuff around on the screen like the X to +. It kind of looks cool because it moves but it's not very useful and could be confusing. This makes me curious to learn more about how to use Principle and other prototyping tools. 

Prototyping in Principle
Published:

Prototyping in Principle

Experimenting with Principle to create Prototypes using UX concepts

Published: