The first iteration of the site logo, or the favicon, has a few problems.
- It is monochrome black, meaning that it looks horrible on dark backgrounds. And for many situations, such as the favicon or an iOS/Android desktop shortcut, I cannot even control the background color.
- The two parts forming the asymmetrical brackets have very different widths.
I do not want to completely abandon the idea yet. So let me start a second iteration of the logo.
This round of experimentation started with a comparison. Since the widths of the vertical bar and the parenthesis do not match, which one should I change? I decide to use a real “D” letter to compare with them.
And from there comes new idea. What if I simply draw the “D” letter? Nope. Having two letters of vastly different size and weight simply looks wrong.
But a silhouette of the letter D looks about right…
To make it slightly more interesting, a silhouette of the counter of the letter D is used. The shape of the counter is slightly more angular than the outline. And since the bar and the parenthesis are supposed to be the boundary, they still lie outside the silhouette.
With the addition of the silhouette, it is natural to introduce a new color. I am lazy, so I stick to the prime site color. The dark shade asks for a white text, so the letter “F” gets a color flip as well.
And with the letter D as a comparison, I think I figured out that it is the parenthesis that is too thick, rather than the other way around. Let me give it a try and see how it works.
So here is it. I think the motivation is clear and the execution is mostly natural. The only original and creative stuff is the idea to add the silhouette of the counter. Everything else is tinkering and logic.