After over 4 years I decided to start working on a new personal site. The last time I made updates was back in 2009 and since then I haven't been paying too much attention to it, however I feel it's time for me to try some different things with it in terms of web design, responsive, mobile first and other such trends. The first thing I needed of course was a logo. Today, I share with you the creative process behind the logo.

Inspiration/References

The logo is inspired by a college team logo, I wanted it to have this reference because the idea is that the site will be a creative laboratory of things I want to learn and experiment within the realm of HTML, CSS and Javascript.

Another reference is the San Francisco Giants logo, I love the angularity and the way the letters have been super imposed.

Sketches

Some explorations for fun

Illustrator

Once I had some sketches I started creating the digital version. The logo is basically made of rectangles and triangles and as you can see the images below, I started adding basic shapes and improving upon them.

Grid

Negative space shadows

Using the same triangles from the corners of the "S", I created basic shadows, and then made them as negative space.

Compositions

Colors

Final Symbol

After an afternoon of fun I ended up with a nice symbol, very aligned with the design principles I had in mind, especially to have the look and feel of a college sports team. I still want to make some optical adjustments to make sure the proportions are right. The next step then will be to show you the web site :)