My Digital Bliss

This week we discussed the ideas of line and shape.

Line at first glance is fairly obvious. However, there are some things I hadn’t considered to be a line, at least consciously. The main part I had not considered to be a line would be the invisible line created by either the edges of several objects in a row, or the line created by an arrow or perhaps the direction a person’s eyes are looking.

I cannot immediately think of any websites I have recently been to that employ an invisible line with an arrow or eyes, but I have certainly been to many sites that create lines with the edges of many boxes. Often times this is done with the buttons that compose a navigation menu.

Moving on the topic of shapes, we defined shape as a line and the area enclosed by that line. Then if a third dimension is added to the shape, volume, or imaginary space, is created. We discussed the many different ways you can present shapes and the effect that will have on the audience.

Things like making buttons on a website all the same shape will help the viewer understand that each shape represents a button, even if these buttons have different text or graphics on them. Another element we talked about was that humans generally prefer an image with the light source coming from the upper left portion of the picture. I found this particularly interesting as I remember reading an article a year or so ago talking about website layout and where to place “action” buttons.

Both of the lighting of an image, and placement of “action” buttons seem to stem from the way we read, left to right, top to bottom. These “action” buttons I am talking about refer to buttons that the designer would like the user to click. This could mean the user is purchasing an item, filling out a form, clicking a link to another website, or other things. The article I read that you should place these items in the lower-left portion of a webpage because that is where a readers eyes will naturally end up, and also the portion of the page they are most likely to read.

I feel the use of shape on a website is a very tricky topic, as too many unnatural shapes can easily overwhelm the viewer. A good example of a website that makes appropriate use of shape in my opinion is newegg.com. They keep a pretty straight forward design, but subtly work the “egg” into many places.

I cannot immediately think of a website I have recently been to that displayed an annoying amount of shapes, mainly because I do not stay at websites like that for long. The only thing that immediately comes to mind are the websites of the early 2000s, where animated FIFs and ridiculous word-art was displayed everywhere. Websites such as those try to use a variety of shapes and colors to impress the viewer, yet all that is created is confusion, whereas websites today that are much more complex can be presented in a much more pleasing way when design elements are kept constant throughout the pages and subtle accents are used.

That’s all I have to say this week.

One of our assignments this week was to create a line drawing and a shape drawing of a face.

Due to assignment requirements conflicting with width of my blog, I have only included links to the full size images.

I chose someone special to me for my drawings, here is the original image:

Here is the line drawing.

And the shape drawing.

Here are my answers to the following Chapter 5 and 6 review questions:
Chapter 5:

1. Shape can be thought of as a combination of what two design elements?

A line, and the area enclosed by that line.

2. What is the term for the shape of a three-dimensional object?

Volume.

Chapter 6:

4. What is chiaroscuro?

The word used in art and design to describe the use of value. It describes more than just the variation of light and dark between areas of an image, it also described how light influences the appearance of an object’s shape in a three-dimensional space.

6. What is the preferred direction of light in an image?

Most people prefer light to come from the upper-left corner of an image.

This week we focused on the use of space in design. Talking about both positive space and negative space. Negative space was stressed heavily, as many people do not consider negative space as much as positive space.

I think I have at least subconsciously been aware of negative as it relates to web design for quite some time. I always prefer to go to websites that are well organized and laid out well. This is one of key reasons google became my favorite search provider early on. Well before I used gmail, googledocs, etc… I used google simply because there was not an overwhelming amount of junk to annoy me.

Whenever I have been designing a website, I always try to keep this in mind. People like to keep things simple, so the simpler you can make a website the better. This is not to say websites cannot contain a large amount of information, they just simply must display that information in moderate amounts and with good organization.

A great example of this is two tech-related stores, newegg.com and tigerdirect.com. These sites offer nearly all the same products, at nearly the same prices, yet I never ever use tigerdirect because of how their website is laid out. To me it comes off as cluttered and annoys me to view, newegg on the other hand does not overwhelm the user on the homepage. In a world where you have a select few seconds to capture a viewer before they go to the next site, I think it is extremely important to have a welcoming homepage, and not one cluttered and confusing.

So while I think I have always been aware on some level of space as related to web design, this chapter really helped me solidify those thoughts.

Here are my answers to chapter 4 review questions 1, 3 and 4.

1. What is a contour drawing?

One that focuses mainly on the outside edges of an object, a silhouette is a good example.

3. What are the three types of lines in regard to composition?

• Actual Line – A drawn line, solid with a defined beginning and end.
• Implied Line – Composed of other elements than an actual line, such as the edge of several objects.
• Imaginary Line – Subtle, and often created without any part of a line at all, an example would be where a person is looking or pointing in a picture.

4. What is hatching?

The use of a series of lines, drawn close together, to create a darker area on an image or to imply volume through shading.

Here are my answers to chapter three review questions for our book Design Fundamentals for New Media by James Gordon Bennett:

2. What is positive space?

Elements that are understood to have an implied volume, such as an object.

3. What is negative space?

Everything else. Not what is leftover, but everything that is not positive space.

6. Would an object closer to a viewer normally appear lower or higher in an image?

Lower.

7. Would objects in the distance usually appear lighter or darker when compared to objects that are closer to the viewer?

Darker.

8. Would objects that are closer to the viewer appear to have sharper focus than those in the background?

Yes.

One of our assignments in class was to represent 6 emotions using only 3 black squares on a 300×300px white background. Here is what I came up with:

Anger:

Most of my images tried to simulate faces. I believe this one shows angry eyes in the top two boxes and then a screaming mouth for the third box.

Contentment:

This is my only image that doesn’t represent a face. I think this shows contentment because it shows equilibrium.

Excitement:

I believe this image shows big eyes and a big mouth, thus expressing excitement.

Fear:

This is similar to anger, but the way the eyes are positioned indicates distress to me. Again the mouth would indicate screaming.

Frustration:

The focus of this image is the mouth, which appears to be very wide open and screaming, thus showing the frustration.

Joy:

This image keeps with the face theme, but left out the eyes and instead only has a smile of joy.
Overall, this was sort of fun to try and express these emotions with such limitations, but at the same time I think the emotions could certainly have been expressed better with additional colors or shapes.

During our first week of class we discussed creativity. We covered such topics as where does creativity come from? And what do creative professionals do to be creative?

We listened to a podcast by the Design Guy (designguyshow.blogspot.com) on Wednesday where he covered creativity. I found it very interesting that he points out that creativity does not just “happen” to us, but is a process we can actively pursue.

He talks about a common problem had by many people is that they feel a need to create a completely new idea every time they try to create something. Whereas in reality, creativity is just combining old elements in a new way. What this effectively means to me is that I do not have to try and think up something I’ve never seen before in my life, but rather take a few things I have seen before and combine them in a unique fashion.

To encourage this type of thinking, I need to try and begin looking at life around me in a different, I need to notice things I see every day in my life in a new light. I need to think about how they could be combined with other elements to create a new idea. An example of this was covered in my last post where we thought up combination of band names and book/movie names. I think is something major design professionals do, they observe the world around them and see not only what is, but what could be when combined with something else.

To increase my creative thinking I am going to strive harder to notice things in a new way, to make mental note of old elements that could be combined in a new way to create something new. Specifically as related to my web design degree, I am going to try and observe websites that have elements I like and think about how I could integrate those elements into websites I may design.

Now it’s off to work on some other homework.

Once again I will resurrect this blog so I can update it weekly for my Fundamentals of Visual Literacy Class where I will be learning about design elements.

Today we talked about combining band names and either book or movie names.

Some I came up with were:

• Deja Hollywood Un-Dead
• The 3Oh!3 Musketeers
• Taking Back Any Given Sunday
• 300 Seconds to Mars

I may see if I can come up with more later.

I recently have recently began completely overhauling my website. Complete with new URL: theBrandonSchmidt.com.

I know some other people that have some very impressive looking personal websites and decided it was in my personal interest to really up my presence on the web.

Hopefully, having this fully functional website will also increase how often I update this blog.