Synapse Icon & Logo Design

The new Synapse icon and logo design

I feel there needs to be a little background story behind this particular design…

Around the beginning of November last year (2010, that is), OMG!Ubuntu reported on a “mystery launcher” that they had been given screenshots of. The images revealed a keyboard launcher app interface not unlike Do (formerly Gnome-Do), or Quicksilver if you’re more familiar with the Mac world. Was this finally evidence of a long-needed upgrade to the powerful Do app launcher?

As it turns out, no.

Not long after these screenshots were revealed, I was contacted by Zeitgeist developer, evangelist and uber-geek and coder Seif Lotfy. He asked if I wanted to be involved in a new “secret” project that the Zeitgeist team were working on. Well I was surely intrigued! It transpired that Seif wanted me to develop an icon design, and subsequent logo, for a new project of theirs called “Synapse”, explaining the screenshots of the new “mystery launcher” were Synapse in action.

I was super excited, largely because, not only did this new app launcher look very cool, but because I had been secretly desiring a Do-esque launcher using Zeitgeist technology for  a long time.

When I asked for a brief, however, I merely got the response “Surprise me.”

Sounds like a challenge to me!

Brief Research

Without having much of a brief to rely on, I had to fall back on what I already knew about Synapse. Well, it was a keyboard launcher, powered by Zeitgeist, and promised to find and launch the apps and files you wanted with great speed. “Synapse”, therefore, was a rather apt name; I had an inkling from my early Biology days of what a synapse was, so further research refreshed my memory.

The key concepts and imagery used as inspiration for Synapse

I liked the imagery of a neural synapse, of a junction, two connecting points between which information and chemical electricity passes at incredible speeds. This was a powerful image and metaphor. I was also influenced by the iOS icon specs; I liked the shape of an iOS icon and thought it was a good visual “container” to place the design inside.

It was about then that I started sketching out the design.

Developing And Simplifying

The early construction stages of the Synapse icon

Connecting the dots

The finished new Synapse icon

You can see where I was going with the new Synapse icon design. I wanted to show a flow of information from top to bottom, almost like a lightning strike. The “S” of Synapse is contained inside the two, simplistic, synapse junctions, but it also flows; you can trace the movement of energy from the top of the junction, through the “S”, all the way to the bottom junction.

The colour used was important as well. I wanted to reference the colour scheme used for the Zeitgeist Project itself, so a brighter, more vivid version of Zeitgeist’s turquoise was deployed. Subtle highlights and shadows were used to provide a more “etched” feel; like the synaptical junction and “S” were etched out of the icon, revealing this vivid aquamarine of energy and information.

There are two further benefits of this particular design. One was that the icon scaled very well with little or no modifications needed.

The new Synapse icon in various sizes

The other benefit was that the design lent itself very well to being used as a mono icon.

The simplified mono version of the new Synapse icon

This, in particular, would be handy for use as an appindicator for use in Ubuntu.

For the purposes of a logo, the icon was then juxtaposed with a slightly tweaked Aller Sans bold by the DaltonMaag type foundry.

Aller Sans also features, with quite a few others, in my post about excellent fonts for screen and print.

The new Synapse icon used as a logo

The new Synapse icon used as logo

In Context

The Synapse app and icon in the Ubuntu Software Center

The new Synapse icon design serves itself well in the Ubuntu Software Center.

The icon design is quite unique in an app menu as well

Looks quite good in the menu as well.

Synapse in action

Synapse in action

Synapse in action

Synapse in action

Synapse in action

Synapse in action

Screenshots of the app above courtesy of OMG!Ubuntu.

Want to play with the app yourself? You may as well, it’s totally free. If you’re an Ubuntu user, check out the instructions on OMG!Ubuntu’s review of Synapse.

Ian Cylkowski aka Izo

Logo & Brand Identity Design

If you liked this post, feel free to share with the buttons below!

I have a Twitter that you can follow as well.


Comments

2 Comments so far. Leave a comment below.
  1. Barry Davis,

    Sorry for the off-topic comment, but what is the menu you’re using in the second context screenshot?

Add Your Comments

Disclaimer
Your email is never published nor shared.
Tips

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <ol> <ul> <li> <strong>

Ready?
Required
Required