Scale – Graphics Design the New Basics

The author explains the concept of scaling and how scaling affect the images and letter forms. The vector images and letterforms can be enlarged to any size without losing the quality where as bitmap images get pixelized when enlarged. The concept of relativity applies to scaling as well. We expect certain object to be of certain size and scale and it is important to represent the scale ration on the web as well. the main three concepts that make a graphics resemble with the real world is the scale, depth and motion; and the combination of these three will make a graphics look more realistic.

As a user experience designer it is important to have an eye for scales and use them wisely. One of the way to use the concept of scale is to place the objects and scale them with respect to the importance of that object in that particular scenario. The other way is to use the realistic scales related to the other objects around. For example a big flower with a mountain as a background may not fit well in terms of scale. As human relate the things we see on a graphics to the real world it is important to have the right scale related to the other objects around.

Source: http://hcc710.files.wordpress.com/2013/03/scale.pdf

Designing print materials of different scale

Robin Williams talks about the design guidelines for print media and Identity system in whole. One of the important features of identity system follows the principle of repetition. There must be an image or a typeface or a style that is consistent across different graphics in a system. He also explains where the objects need to be placed in print media; for example do not place the text in extreme corners of a business card. The other important thing that matters is the alignment of the contents and being consistent with the same kind of alignment across different print formats like business card, letterhead, booklets etc.

Though the principles of alignment and consistency holds good for both print media and electronic media, print media has the limited real estate compared to the electronic media and also it is not as flexible in terms of changing the design whenever required is considerably week in print media. One of my favorite is the power of cropping; cropping can give a different perspective to an image and it can also create its own identity. As a graphics designer it is very important to be consistent in using the typefaces and shapes across different materials and hence building a unique identity system.

Source : http://hcc710.files.wordpress.com/2013/03/print-design-compressed.pdf

Cafe James staff menu – V1

Cafe James template menu for staff. This is improved from the earlier designs made for Cafe James

staff menu v1

Cafe James Grid Idea – V2

Cafe James – one page V2

Cafe James – multiple page V2

Food art – Inspiration #7

When food stylist Anna Keville Joyce’s pet bird died, she mourned for its loss in a tangible way. She utilized her professional creative skills to aid in the healing process, and the results are beautiful. A Tribute to Budgie is a series of elegant birds comprised of food and arranged on plates. Joyce came up with the images and crafted the illustrations while photographer Agustín Nieto documented the series. We see crushed-up Fruit Loops cereal in the body of a flamingo and carefully-peeled carrots that act as feathers for the other birds. Surrounding each plate are the foods that were manipulated in the production of the series. Seeing the raw materials of these intricate illustrations makes you appreciate Joyce’s handiwork even more. Food art clubbed with graphics can inspire a designer to produce a great piece of  graphics. In an interview with the website First We Feast, Joyce explains that she begins an illustration by gathering references of interesting food details. Afterwards, she creates a sketch and purchases ingredients based on what she thinks will work for a particular piece. Joyce tends to buy more than she uses, because like a painter, she needs a palette with options. From there, she starts with the longest-lasting ingredient and works backwards to the most delicate until she completes the incredible pieces we see here.

Cafe James Grid Idea sketches and PPT – V1

 

 

 

 

 

 

 

cafe James – one page

Cafe James – multiple page

Grid photo essay

 

 

 

 

 

 

 

 

 

 

 

The use of grid varied from one column grid to multiple row and multiple column grid based on the type of media it was used. A car sale hand out had many rows grid where as a form had single grid layout. One of the main trend I noticed is that Magazine where less picture was used had two grid layout where as picture intensive handout had mixed grid. It is interesting to see that in the magazine article the placement of image, the main article and a sub articles are placed on the same page with wise use of grid layout.

Inspiration #6 – Clever Minimal Logo Designs

 

 

 

 

A blog I came across is a compilation of highly clever minimal logo designs. The logos show a concept or an object through figure-ground principle(foreground – background) or symbolic representation of an object. Example: the picture of “Ross Poultry” has a chicken carved in white space inside “O” which looks a very well crafted creative piece. The other interesting design is “Horror Films” logo where single figure represents multiple things; the circle with three dots in it is a film roll as well as “Oh My God” expression. The logo of “Upside down productions” uses placement of serifs to cheat our brain to think like it is upside down. It is a good example showing how our brain associates things and how we look at object as a whole than looking at each part individually.

The learning from this set of great design is a lot can be done with letters and squeezing in an object in between to make a great looking still simple logos. In logo design simplicity matters a lot and it should be clear enough to be comprehended at a  glance. In these examples seamless blend of text with object to showcase a concept is a good technique to observe and learn. After seeing these designs I have more respect for background than before 🙂

Source:

http://www.stumbleupon.com/su/20YcOt/bluefaqs.com/2010/04/60-highly-clever-minimal-logo-designs/?_nospa=true

Gestalt principles applied in graphics design

The blog is a well crafted explanation of gestalt theory with respect to web design. Gestalt grasp the “totality” of something before worrying about the details. following are the principles related to gestalt.

• Proximity

The concept underlying the concept of proximity is grouping. When we have a group of objects, we tend to see them as forming a group.

• Similarity

Group things perceptually if they appear similar to one another.

• Prägnanz (Figure-Ground)

Difference between foreground and background to differentiate the object from background.

• Symmetry

Symmetrical objects are easy to comprehend and  the principle of symmetry tells us that when we look at certain objects, we see them as symmetrical shapes that form around their center.

• “Common Fate”

We assume the related things do the same and hence fate of one of the entities applies to all in the group

• Closure

comprehending the meaning of incomplete object by closing the incomplete objects which themselves doesn’t have meaning themselves.

As Michael Tuck  points out the best design comes when proven theory works in harmony with art. The concept of “totality” is so relevant to graphics designers since a real world is recreated on a two dimensional screen with all properties of a three dimensional world. I can relate to how we remember faces and places; we remember as a whole picture and part by part. though the above principles are widely used in web pages today, Applying them correctly and building web pages for humans does require good understanding of gestalt theory.

 

Source :

http://sixrevisions.com/web_design/gestalt-principles-applied-in-design/

Related Programs Survey

 

 

 

Ray Graham Association – Empowering people with disabilities.

http://www.ray-graham.org/

————————————————————–

 

 

 

 

The institute of abundant living

Adult education for people with learning challenges

http://www.discoverabilities.com/

——————————————————-

 

 

 

Horizons School

Preparing young adults with learning difficulties for an independent life.

http://horizonsschool.org/home.html

——————————————————————

 

 

 

Options for college success

http://www.optionsforcollegesuccess.org/

———————————————————————–

Dual Enrollment with Individualized Supports

http://www.cds.hawaii.edu/deis/

If a child can’t learn the way we teach, maybe we should teach the way they learn (http://www.optionsforcollegesuccess.org/). This is why understanding what they learn and how they learn is important and this applies to graphics design in general.

The common theme I noticed is hope and motivation in all the logo designs. The first design has butterfly as the logo and the color of the web page compliments butterfly colors. The other ones varied from vibrant color to just white background and a line drawing of buildings. It looked like more than half of the websites did not really consider color schemes seriously and there was nothing that was related to color theory. But there is a pattern exists across these website logo color selection where they used primarily blue/green/yellow. In most of the cases the concept was shown mainly using logo shapes and not with the combination of both. the color mostly resembled the organization/college website color.