Utter app splash screen
The logo design was inspired by the gestalt images where people can see different things at once — a “U”, a smiley face or two people connecting.
Let it out
During the early stage, I explored several concepts to express the idea of “let it out” – this animation was used for the recording screen in one of the first iteration.
Some of the screen designed for the iOS app
The user interface was designed by using Figma its responsive components to make it easy to scale for each scree-size and switch between Android and iOS.
User Story documentation for the product sprint plan
One of my responsibility was to organise both the product roadmap and sprint planning. I always tried to document as much as possible in each user-story, sometimes attaching wireframes and user-flow.
A screengrab of the design library and some of its UI components
We used the Figma design library as UI/UX repository and to keep all the screens up to date. Each component in the design library had a master-component and a series of instances as documentation for the developers.
Screen-flow for the "send an Utter" feature
Features were often documented with screen-flow highlighting logical conditions and decision made by the user.
App prototype designed with Facebook Origami
This prototype showcases how the user could record and send an Utter.
A screengrab of a prototype project created with Facebook Origami
I used different prototyping system depending on what we were trying to test. Facebook Origami was the right choice for high fidelity interactive prototypes.
A screenshot of a usability results
Remote usability testings were part of the design process; we ran usability testings before and after a feature release. Some product testings were made only using surveys or with Whatsapp groups.