A Look Inside FOSSA’s New Product Design

At FOSSA, we believe that open source software unlocks a world of opportunity and benefit for businesses, developers, and beyond. But using OSS at scale — while maintaining legal compliance and security — is often best accomplished with a partner to sherpa you through the complex and changing terrain of open source.

Our entire team at FOSSA is committed to filling that role and supporting the open source community as best we can. That includes everyone in every corner of the company, from engineering and customer support to me and my colleagues in product design.

That philosophy led us to a recent determination. To ensure our users benefit as much as possible from our recent product and feature updates, we needed to deliver an upgraded — and more consistent — experience across all parts of our  website and product.

So, the decision was made. It was time for a brand refresh.

We embarked on our brand refresh journey with three primary objectives in mind:

  • Be more focused, informative, and findable to deliver value for current and future customers
  • Ensure user experience (UX) quality across new and existing product features
  • Communicate security, trustworthiness, and accessibility for our next wave of growth through our brand

The project included a few main elements. One was a refresh of our marketing website, which my colleague Barbara chronicled in a recent blog. Another was a rebrand of our product itself, which is what I’ll cover in this post.

Highlights of Our Product Rebrand

Phase one of the product rebrand prioritized look-and-feel elements like our logo, color, fonts (typefaces for any designers out there), and buttons. We knew that the longer our product and marketing sites looked like unrelated siblings, the more customer confusion and brand erosion would occur, so project velocity was critical. We opted not to “move walls” but instead focus on creating greater consistency across our look-and-feel elements. We know that brand and UX consistency will help our customers smoothly transition between sites and intuitively understand product UX patterns: The more they use the product, the greater the increase in user confidence and workflow speed.

Our spartan team found strategic focus by aiming for a high-impact, low-effort sweet spot, sometimes referred to as the 80/20 rule. We cleared our calendars and launched a hackathon-style work cycle: audit product, re-design, implement changes, and start all over again. After many days, meetings, and commits, we brought our beautiful new brand and its principles to the product (peep the glory).

Here are some of the changes we made:

Buttons: We chose to highlight our CTA (call to action) buttons in green, our primary “color,” and use these green buttons only once per view so customers intuitively recognize them as the most valuable action.

Color: We converted hundreds of organically created colors down to a handful of newly minted brand colors, ensuring accessibility standards are met and exceeded for the highest percentage of our customers.

Logo: We removed the pictorial mascot from our logo to increase scale and legibility.

Typography: We began using the typeface iA Writer Quattro for all of our instances of project code because it's open source (👍) and monotype font, which is nearly universal to software code editors. This ensures engineers can intuitively identify code in the UI.

What Comes Next

We’ve completed the first phase of our product app design refresh, but our work is far from over. We’re focused on keeping a tight handle on product quality, listening for customer issues that may crop up, and continuing to bring greater customer experience quality to the app. We are also planning to update elements big and small in the near future with the aid of our new brand and customer feedback.

Speaking of which: We love feedback, so please feel free to reach out to our team, and we sincerely hope you enjoy the new FOSSA!