Visual Language

Hue, Brightness, and Saturation

The assignment said to do a mathematical composition, so initially I thought of the Golden Ratio which we'd discussed in class earlier. That lead to me to this sketch which I manipulated for my assignment: http://www.openprocessing.org/sketch/10274. I wanted to play with the light source created by the gradient background, so I created a staircase effect and wanted to get the color to go through each set of steps after a delay (this didn't work and I realized that I should probably have used pushMatrix() and popMatrix() maybe but I'm not too clear on how those work). What was interesting to me was the hue because depending on the hue you were at, the light source of the piece changed. 

Hue

When the hue is in the blue range, the white is emphasized...

When the hue is in the blue range, the white is emphasized...

...but with brighter colors it gets washed out.

...but with brighter colors it gets washed out.

Saturation

Saturation gave me a lot of white on white

Saturation gave me a lot of white on white

This kind of ended up being an exercise in contrast

This kind of ended up being an exercise in contrast

Brightness

This had the polar opposite effect of saturation...

This had the polar opposite effect of saturation...

instead of white on white, I got black on black

instead of white on white, I got black on black

So if I ever need to test which greys to use with what colors, I might actually use this to figure out contrast.

Color Hue Test Results

I've taken this test before and was at a 13 the last time I took it. My sight has gotten a lot worse since then but this is what I got the first time: 

WAT?

WAT?

I did it again just to check and got a 6

Hue Test Result 2

Made more sense since I thought the middle strip was the hardest one. 

That was far easier than logo design, WHEW.


Logos

It's hard to pick a logo I like - there are many examples of things I don't like, but to think of one that is memorable enough that I like it was hard. But when I thought about it a bit more, two logos immediately popped into my head: the logos for Random Acts and the Michael J Fox Foundation. 

I think the Random Acts logo is the more successful of the two, but I really love both of them. I tried to find out who designed both logos but there wasn't any information on it. I did find this link about why the Foundation changed to its current logo - according to that blog post, they wanted to bring the fox to the forefront and add 'For Parkinson's Research' to it.

So starting with the MJFF one, what I like is the simplicity of it. It's easy to drop out the text and still have an idea which association the logo is tied with with the fox. Though I'm not sure the addition of the 'For Parkinson's Research' was necessary, it's easy to read and I like the way the J interrupts the divider to give it some complexity. 

Random Acts is a charity dedicated to improving the lives of others by playing on the concept of a random act of kindness. It's a quirky and fun organization with a ton of cool events, which is reflected in the logo itself. The bright fun colors are eye catching and make me look at it longer, which is how I realized that the bright geometric shapes form an origami 'R'. I also kind of see a house in there, which ties to Random Act's Hope for Haiti campaign dedicated to building homes for the victims of the earthquake there. Origami is also used in the logos and headers throughout the site. 

As for my logo design... I believe I'd said a previous assignment had scared me. I was wrong. This was far scarier. I have never done logo design and it's quite safe to say that it's not my forte. 

Sketch

Sketch

I started by pulling together themes of ITP and came up with a few keywords I wanted to try and convey. Based on that I started my sketches. I only came up with two concepts. I built out the icon and ended up with this

Logo


Hammer designed by John Caserta from the Noun Project

The Business of Business Cards

The assignment for Visual Language this week was to design my own business card. What's that? Graphic design exercise? I'm not panicking, you're panicking.

Actually this was a lot of fun to think about. I already have a brand sort of established via my website and my logo (again, big thank you to Elaine Tai who designed the logo for me). This gave me a bit of a head start with my color choices, so the big questions were with layout and typography. 

And here's the result!

Front:

Back: 

Types of Type to Type

The fonts I use on this site are Futura and Adelle; having a serif and a sans serif font helps to create a distinction between headers and main text. Futura is one of the types I used to define myself with, but the rest are pretty different. 

Taking a look at my name, I have a lot of a's in it (four to be exact). There's also an interesting effect with the 'apa' part of my last name that I tried to play with as well.

  • Opficio Neue [sans serif] - this was a font where the bowls of the p and the a were the same shape; they also resemble the o so I get what looks like a series of circles if you look at it from a distance. This font also reduced the difference between the stem and the shoulder (?) of the h, so it reduced that up and down rollercoaster effect that the letters in my last name can sometimes have.
  • Futura (medium) [sans serif] - Classic and modern type. Even when I set it to medium Futura condensed the horiztonal width of my name, which can stretch out quite a bit. I also like the contrast of the sharp points on the w and the capital M with the rectangular strokes on the rest of the letters. 
  • Roboto (thin) [sans serif] - Also known as the Android font. I have Helvetica fatigue so I chose Roboto in homage to my phone nerd roots. I chose thin because it gave more definition to the letters, I found regular to be a bit too blocky so you could see the exaggeration in the bowl of the p versus in the a here. This was another font where the ascender height was reduced so you can read my name without having to jump up and down visually
  • Supernatural Knight  [serif] - The serifs here are slanted in a variety of ways. What's interesting about this font is that all the letters are technically uppercase, but the lower case letters are smaller which places an emphasis on my initials. 
  • Imperator [serif] - this font reminded me of history, which I really love. What interested me about this font was the difference in the height between the h and the t so while this font condensed my name horizontally, it played around with the cap height. 
  • Foglighten No 06 [serif] - this was definitely my whimsical font with the mix of upper and lower case fonts. Even though I typed in 'Sweta Mohapatra', everything has the same uniform height. The r is my favorite letter here though. 

Here they all are together:

Futura, Opificio Neue, Roboto, Supernatural Knight, Imperator, Foglighten No 06

Here are the creative words I made as well