CipherCat

CipherCat is an encryption text messaging application focused on user security and anonymity.

  • Client: CipherCat

  • Role: Product Designer

  • Tools: Figma, Illustrator, Balsamiq

  • Team: Investor + Engineer + Me

The Problem

The original Application handed to me was focused on the technology of encryption and lacked the empathy for a non-technical new user. The design, branding, and all the UI/UX needed a clean start. I was tasked with creating their MVP.

The Original Design

These are the screens of the application given to me to work on. My client and co-application creator is an engineer who was looking to improve their application's designs, both UI and UX. It was called "SipherCatta".

Confusing

Many actions to complete task

Lots of text

Unclear UI

Very long instructions

Competitive Analysis

Signal

Signal is extremely popular. People trust them because of their open source code. It has feature issues around using real names, user's not setting a pin or passcode, and messages not being set to delete after a certain time. 

Telegram

Works across many devices. Imports your contacts and uses real names. Can save messages. Have to invite someone to a secret chat for increased privacy. Very customizable interface. Doesn't delete messages after a certain amount or time.

WhatsApp

Only works on phones. Widely adopted, especially outside of America. Does not have self destruct features. Very easy for people to share and save messages, not ideal for users hoping to maintain private identities or conversations. 

User Interviews

I interviewed people who used encryption messaging applications. Here are some of the things users told me. 

What I learned from talking to people

Many people don't set a pin code to get into their messaging applications.

People use their real names, even when using encryption applications. 

People who typically use encryption applications want to be able to talk

freely about things they don't want certain people to read. 

Users take the easiest route and don't set advanced security features immediately.

Wireframes

I use Balsamiq to create these simple wireframes. These would help me visualize which features are needed and how we can iterate off that basic messaging application into a more unique product that will set itself apart. I wanted it to be as simple as possible and not be feature heavy.

Changes from the original product to the MVP

 

 

 

Completely removed the encryption/decryption screen from original product. Users didn't understand it and it was extra steps that could be integrated into the chat application itself like Signal does.

Changed names to nicknames to encourage users to not use their own names, this will increase security.

Added a pin number which so users have a forced level of security. Some users won't like that but many will know that the person they are messaging is under the same restrictions, adding an extra level of security from all users.

Messages auto self destruct based on a globally set time which can be altered individually by the user that sent them.

Added security Tooltips that the user must click out of that recommend avoiding using a real name or picture of themselves.

 

Added on/ff settings for message's preview & notifications displaying on your phone. So that is someone peering over a user's shoulder cannot see snippets of messages. 

Contact favorites added, via a star method.

Ability to block contact added

No phone numbers shown in application, can add a user by screen name or phone number but phone number is not required and does not display with contact. This will increase anonymity. 

Logo & Style Guide

I created these to set CipherCat apart, using futuristic styling to denote a technologically advanced application that is also stylized for a user friendly feeling.

Clickable Prototype

The prototype I delivered was simple, clean, branded, and had everything it needed to meet the specific need for hyper security. 

I used a combination of Adobe Illustrator and Figma

What I Learned

Sometimes an app needs to help its users by making certain features mandatory.

Higher fidelity prototypes are easier to test with non-technical users.

In non-experienced teams, advocating for the importance of UX is a skill in itself. 

 

Figma is great for 85% of my prototype needs, but software for prototypes still has a ways to go to make it feel more organic.