Context:

Capterra did a minor brand refresh in 2018. However the leadership and brand team were not satisfied with the direction. Therefore they wanted to explore ideas and work internally. Although I am UI designer, I have always been interested in graphic design and illustration so I volunteered to be the main designer on this project.

Concept 1: tangrams - putting the pieces together

The brand team, UX/UI team, and leadership came together to decide on a direction. The brand and UX/UI teams presented their initial concepts. Amelia, the other UI designer on our team, and I came up with the idea of tangrams.

Why we liked the concept:

• Can easily incorporate our colors

• Gives a nod to our logo, which also consists of flat triangles/geometric shapes

• Many opportunities for animations

• Mike Ortner (the founder of Capterra) created Capterra because he discovered that the process for finding software was confusing and time intensive. We can use the tangrams to show that there can be overwhelming number of pieces to put together but we’re here to help you make sense of it.

The different figures are supposed to represent the different software categories that we have on Capterra. For example, we have retail POS (t-shirt), horse (horse), and realty (house) categories.

Concept 2 | all in one place

Stakeholders also wanted to increase brand recognition and wanted to emphasize how Capterra is the one stop for everything related to software search. As a UI designer, I thought it’d be cool to slowly train our users to look for certain colors for our tools, like comparison, search, and reviews. So for reviews I used orange, comparison I used red, and search I used light blue. All these colors can be found in our logo.

Concept 3 | Isometric

We initially explored this concept and look because we liked how modern it looked. However after testing it out, we ultimately didn’t go with this concept because we didn’t want to make it seem like we were a factory and treating our users like machines.

Animations:

Static illustrations:

Concept 3 | Rube Goldberg

One of our crucial stakeholders really liked the idea of Capterra helping users bypass an unnecessarily complicated software searching process. We really resonated with using “Rube Goldberg” machines as inspiration. However, we ultimately didn’t go with this concept because it was difficult to translate successfully as icons and still images. Since Rube Goldberg machines are complicated in nature, we didn’t want to make it seem like Capterra was making things more complex. Also, since the machines tended to be big, it was hard to make it work on mobile.

Various iterations:

concept 4 | Fun and Simple shapes

We wanted to create a fun, yet simple illustration style that most designers would be able to re-create. One of our stakeholders really wanted to add more personality and have more of our brand colors on our site.

Icon/Illustration explorations:

I really liked how there was a lot of room for customization and personalization. The geometric shapes of the icons and illustrations still gave a nod to our triangular and colorful logo.

Background explorations: