Skip to content

Commit

Permalink
[post] Rector logo journey (#2744)
Browse files Browse the repository at this point in the history
* [post] rector logo

* cleanup sponsorships, over os funding budget for 2024

* gram
  • Loading branch information
TomasVotruba authored Dec 15, 2024
1 parent 13dee72 commit c292e8c
Show file tree
Hide file tree
Showing 17 changed files with 1,157 additions and 680 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/images/blog/2024/logo/logo-old.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/images/blog/2024/logo/making-01.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/images/blog/2024/logo/making-03.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
985 changes: 985 additions & 0 deletions public/assets/images/blog/2024/logo/rejected-04.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
668 changes: 0 additions & 668 deletions public/assets/images/new-logo/deprecated/rector-with-name.svg

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -63,24 +63,13 @@ In 2024, so far we've contributed:

<br>

## Launching Open-Source Scholarships

As of this article and September 2024, we're starting 3 PHP open-source scholarships and **give monthly**:

* [staabm](https://github.com/sponsors/staabm) - 800 $
* [peterfox](https://github.com/sponsors/peterfox) - 500 $
* [janedbal](https://github.com/sponsors/janedbal) - 300 $

<br>

Total of **18 663 $** to this day.

<br>
<br>


Is your company building on top of open-source? Do you want to enjoy more tools in the future to help our IT economy?
<br>

Here is how [to join Plege](https://osspledge.com/join/).

<br>
Expand Down
171 changes: 171 additions & 0 deletions resources/blog/posts/2024/2024-12-16-evolution-of-new-rector-logo.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,171 @@
---
id: 75
title: "Evolution of New Rector Logo"
perex: |
After 7 years since the first Rector commit, we have a new logo!
Today, we're proud to share a streamlined, smooth, and modernized version of the Rector logo. Similar to a project upgrade, the final version looks great, but the journey is the destination. Did you know it took 40 commits, 5 sketched paper pages, and 3 months to get there?
Today, I'd like to share the backstory with you.
---

Rector started as a pet project to ease my daily work. I asked a friend to make a logo, and he helped me.

The job description was "house, left part old, right part new". I wanted to show the main purpose of **rec**onstruc**tor** (original name) = a code reconstruction. I haven't told this to anyone, but it represents the house in Liberec where I grew up with my family. My father used to reconstruct it all the time. The result was the logo we all know:

<img src="/assets/images/blog/2024/logo/logo-old.png" style="width:9em; margin: 1em 0 2em">

It was good for the time being. But Rector grew, a pet project turned into full-time work, company, [a book](https://leanpub.com/rector-the-power-of-automated-refactoring) and regular conference talks. A logo with 30 colors+, gradients, and tiny details was impossible to use in printed material. The need for a new version was imminent.

We have been thinking of a new Rector logo since 2020. We wanted a new logo to land on [Rector 1.0 live release in Laracon 2024](/blog/rector-1-0-is-here), Amsterdam. But many of the new features presented in the talk had to be delivered first. After the Rector 1.0 release, we received a few offers from external designers, yet we could not find a good fit with any of them.

We joined [Open Source Pledge](/blog/rector-is-joining-open-source-pledge) this year to spread the "giving back to open-source is normal" message. A couple of weeks after joining the pledge, we got a surprise message: "Oh, your logo will be on Times Square." The only problem was that we had to stitch up a new, temporary, simple logo within a week.

"Just strip down every detail; make it simple". This was the result:

<img src="/assets/images/blog/2024/logo/rejected-01.png" style="width:9.3em; padding: 1em 0 1.5em">

Butter, but still not pretty to watch. It was the last nail in the coffin.

**We've decided to land a new logo before Rector 2.0 is out.**

<br>

## It's an Upgrade Time... of Logo

I wanted to keep the house, as it's a part of Rector's DNA. I wanted to keep the left "shady" and the right "modern" side.
The logo should represent modern, streamlined change as we do with legacy projects that are perceived as impossible to upgrade.

<br>

The logo must be:

* **simple = 2 colors maximum**
* **modern with curves**
* easy to print and spot in a tiny version (favicon)
* **A/B tested on users**, so we get the idea of how developers see our identity

<br>

We've decided to make as many iterations as needed until we're sure it's the right one.

<img src="/assets/images/blog/2024/logo/making-01.jpg" style="max-width: 30em" class="img-thumbnail">

<br>

<hr>

<br>

**2nd iteration** came up with an idea: "Let's use CI colors, the left for warnings, the right for a successful pass.":

<img src="/assets/images/blog/2024/logo/rejected-02.png" style="width:9em;padding: 0 0 1em">

What was the feedback?

* "The yellow/orange colors do not contrast enough."
* "There are too many lines and details
* "There are basically 4 colors."
* "What are those horizontal lines?"

<br>

<hr>

<br>

<img src="/assets/images/blog/2024/logo/making-02.jpg" style="max-width: 30em" class="img-thumbnail">

On **3rd iteration** we've found a great [color palette](https://colorhunt.co/palette/4d46465b56567fcd91f5eaea) we fell in love:

<img src="/assets/images/blog/2024/logo/rejected-03.svg" style="width:9em; padding: 0 0 1em">

What was the feedback?

* "Colors look much better"
* "When it's small, there are still many details"
* "Is the roof flying?"
* "remove windows, remove doors - people will get it"

<img src="/assets/images/blog/2024/logo/making-03.jpg" style="width:9em; padding: 0 0 1em">

<br>

<hr>

<br>

We've integrated feedback, and in **4th iteration**, we removed all the details but cracks:

<img src="/assets/images/blog/2024/logo/rejected-04.svg" style="width:9em; padding: 0 0 1em">

What was the feedback?

* "House looks neat."
* "What are these lines?"
* "Is that the homepage icon?"

<br>

<hr>

<br>

We don't want to make another homepage icon. We want to make a logo that represents **R**ector. We've removed the confusing lines and tested various "R" fonts.

On **5th iteration**, we felt we were getting closer.

<img src="/assets/images/blog/2024/logo/letter-voting.png" style="width:20em; margin: .5em 2em 1.3em 0" class="img-thumbnail">

What was the feedback?

* "2 in the middle"
* "2 and 5"
* "The roof is tiny, though."

<br>

<hr>

<br>

We added a roof testing for **6th iteration**

<img src="/assets/images/blog/2024/logo/roof-voting.png" style="width:14em; padding-right: .7em" class="img-thumbnail">

What was the feedback?

* "2 and 3."
* "3 or 4."
* "4 but with bigger chimney."

<br>

We went with version 3 and made the chimney slightly bigger. Time to test on production!

## Final Version

**We silently pushed the logo on our homepage to see reactions in the wild. It was great to see people noticing the change and giving us feedback.

Here is the final version:

<img src="/assets/images/blog/2024/logo/rector-logo-final-square-white-bg.png" style="width:7em; margin: 1em 4em 1em 2em">
<img src="/assets/images/blog/2024/logo/rector-logo-final-with-name-black.png" style="width:16em; margin: 1em 0 2em">

<br>

## New Rector Book Cover

While at it, we've designed a new cover for the [Rector book](https://leanpub.com/rector-the-power-of-automated-refactoring), so it runs Rector 2.0 not only inside but outside as well.

The 5-iteration journey looked like this:

<img src="/assets/images/blog/2024/logo/book-how-it-went.png" style="max-width:45em; margin: 0 0 2.5em 0">

It's been a long but adventurous journey. **Rector is built on the PHP community, so we've really enjoyed including the community in making the new logo** the best version possible.

We're proud of the final result, and we hope you like it, too.

<br>

Happy coding!

0 comments on commit c292e8c

Please sign in to comment.