Peepchat 

The IM + Selfie App

Role: Lead UX/Visual Designer, Developer

 

I like to create nights and weekends projects for myself, something that will excercise my design muscles and push me out of my comfort zone. While figuring out a way to integrate video into my Framer prototypes I was able to use HTML5 to access the camera on my laptop. I got this idea to insert the camera preview into a previous project I was working on, a texting app. 

 

Prototyping

 Framer.JS has been such an instrumental part of my process for designing software that I was able to create a rough prototype and get feedback from friends. 

 

Additional UX/UI Work

Incrementally I put together the functionality and design assets with some branding concepts. I went for a much cleaner look and minimized the physics with the chat-bubbles as they felt unnecessary and awkward when built out.

 

Peepchat beta in XCode/Swift

This inspired me to learn a little Swift and build a more hi-fidelity prototype in XCode, so it was time to jump into my first attempt at coding an iOS App.

I leveraged the Facebook API and Parse to do the heavy lifting of profile creation and tokens. This was beyond me in the beginning, so I could focus on the data structure as well as the functionality and interactions.

Along the way, I realized the size of the images captured were incredibly large so I was able to snap photos and compress them on the client, so a raw capture was 1.2 megs and it compressed to about 11 kb, still large but good enough for the prototype.