Semaphore

  • 2014–2017
  • UX, UI, branding, front-end

Semaphore required a UI full of patterns and visualizations that didn’t even exist yet. We helped them design and brand the platform that was one of the first CI SaaS products.

One of the main characteristics of this project was that we basically needed to invent a completely new way of visualizing the build and testing — and later the deployment — processes, as there were no design patterns for those things at the time. It was a really interesting task to tackle, but quite a daunting one as well.

While we were working on the project all the way though 2015, we were responsible for the complete UI design, user experience, as well as their branding and marketing assets.

When we started working on Semaphore, the biggest hurdle was to gain domain knowledge regarding software testing — and later continuous integration, because Semaphore started as a Ruby on Rails platform, and transitioned into a fully fledged CI service.

Test driven development (TDD) was still such a new concept, but luckily our client Rendered Text were excellent in their role of introducing and educating us about it.

How could we create a GUI for software testing, that was more appealing to the user than the command line.

And we all know how programmers feel about their command line… Additionally, we asked the question of how could we onboard the user through a third-party service account (at the time GitHub and BitBucket) in the most straight-forward way possible.

It was very important to us to us to maintain a friendly, relaxed tone of voice throughout the app, as we knew how sometimes testing can be a really frustrating, and anxious process — especially if things aren’t going well.

This tone of voice was replicated onto the website as well, where we tried our best to advocate for a new way to develop software, which wasn’t necessarily casual, but gone were the days of accumulating months and months of work into a release, and praying that you’ve covered everything. When you deploy often, that stress is gone.

The brand goal:

We used a relaxed tone of voice in the app as well as on the website and other communication channels because we wanted Semaphore to be the opposite of old-school, stressful, version-based way of building and releasing software.

As the last part of our engagement on Semaphore, we worked on the design and front-end development of their community section. It was a community-powered tutorials minisite, where the Semaphore team — and more importantly, everyone else — could could publish helpful articles on how to use Semaphore in various environments and scenarios, and other helpful development topics.

The goal with this minisite was to create a sense of belonging around the product, and to give back to the community in the form of free helpful information, and educational materials.

As a result, all this activity reflected positively on Semaphore and how it is perceived as a brand, as well as its positioning in the search engine results pages.