Birth of an icon: Peerio
December 4, 2018

Birth of an icon

The lack of design identity and representation in end-to-end encryption

The most exciting part about working for a startup company with a niche service product is that I often have to build my own tools in order to do my work. And tools, either digital or IRL (in real life), have always fascinated me. For an app that functions in a completely end-to-end encrypted (E2EE) environment, the time came at Peerio when we needed to put a (tiny) face on this most important feature. Recently, I was tasked with designing icons for our security page. I will walk you through the process of how I distilled the sign that represents the backbone of Peerio.

Why not just use the generic “lock” or “shield” icon associated with digital security?

Like any experienced designer out there, the first thing I did was to look up the icon on popular, open source asset libraries. To my surprise, searching “encryption” didn’t return any results in any library. Searching more widely did return a few interesting options but they were still generic and unremarkable. Plus, none of them were designed for E2EE specifically. They were described as “cyber security” or “encrypted data” but didn’t convey the reliability and complexity I was looking for.

The cryptographic design E2EE uses is where its strength lies so I thought it was highly inappropriate to use a generic icon of a lock or shield. We all know that 99% of the time a lock only needs one key to be opened. On the other hand, the shield icon makes me think of one person holding the shield thus offering protection which really does not inspire trust or that it is indestructible. That this cybersecurity gem (E2EE) doesn’t have its own recognizable icon indicates how little it is understood. This is not only a shortcoming on the side of the app users, but also on the side of those working with it (i.e., developers, designers, product strategists, etc). I concluded that an E2EE icon was long overdue so I started working on it.

The E2EE icon was one of eight icons I designed for our security page. Some of the icons already existed as standard (e.g., Open Source icon), some incorporated commonly used signage (e.g., the use of location pins for Geo-redundant), and others appealed to more straightforward designs (e.g., the shrug gesture for No Knowledge, or the ID card for Public Key Verification).

Each one of these icons portrays a very important feature that our app uses to ensure full security for our users. But out of the bunch, E2EE is the hero. Without it the other specs wouldn’t matter or even exist.

For a designer, E2EE expresses an entirely abstract concept, the kind of idea that is very hard to convey visually, like “truth”, “morality”, or “life”. It does not have a physical world parallel, an object that can be transmuted into the visual world of design. E2EE is advanced cryptography.

How is End-to-End Encryption (E2EE) different from other encryptions or cybersecurity practices?

Short answer: in lots of different ways. E2EE is the most secure way in which data and information can be exchanged between individuals over the internet. You can read an overview about it here.

Although E2EE is slowly becoming the standard for online privacy, it is still a very niche part of cybersecurity. Most people have never heard of it, let alone use it. Given the political and social climate of the last few years, and the huge rise in cyberattacks on companies and government institutions, I believe it is more important than ever that internet users become as familiar with E2EE as they are with using antivirus software and VPNs.

The actual design

It is hard to explain to someone how E2EE works. It took me a while (working at Peerio) before I became comfortable with the concept (granted, my background is in architecture and design, not in programming). With E2EE your data is encrypted the moment you hit the send or share buttons and is decrypted the moment the recipient opens it. This is what the end-to-end part stands for: encrypted from one end to the other end and all the way through. Your data is indecipherable to anyone other than you and the recipient. But the best part is that in order to decrypt your message the recipient needs to use 2 keys to open your package: their own computer generated private key plus the other user’s public key and vice versa. Therefore, for messages and files “to exchange hands” you need minimum 3 keys at all times. It’s definitely more complicated than that so if you have brain power to burn you can check out our whitepaper. This is what I wanted to make clear in the icon design: the magic of a pair of 3.

Internet users are not familiar with the mechanics of E2EE compared to regular digital security. That is why the value E2EE has to offer an individual or company is often missed. This is also why using a generic security icon for it is inappropriate and misleading – anyone interested in internet privacy should know there is a difference between “secure” and E2EE.

I designed this icon with the intention of making it free and open source. Feel free to download the assets below if you believe this is an appropriate icon for E2EE.

Download the icon now! Icon licensed under CC-BY 4.0 Creative Commons License