Designer
Utter app splash screen

Utter Mobile Product Design (2018)

From November 2017 to February 2019, I worked as Head of Product and Brand Design at Find Circles building Utter. Utter is a voice messaging app aiming to help people to say what really means to the people who really matter. During this time I've been in charge to transform ideas into a product roadmap, test assumptions and design user interfaces for a mobile app built with React Native.

Utter app splash screen

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

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

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

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

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

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

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.

Marketing website design

Marketing website design

Utter-product.png