Week 6

It’s time to look at design! What a week here are the highlights.

I  learned so much about design from color and balance to proportion and rhythm. The best thing I learned is about the  5 lines of letters…because  in 3rd grade when you learn cursive, you wonder why you are give that big piece of paper with 3 lines on it… well know I know. I found so example of these design elements in my room!!  It was really cool to find how I subconsciously designed my room according to these principles.  Check it out for yourself!

Daily Creates for week 6 ended up taking a back seat to  my design assignments, so I tried to do them  in less than 10 mins which meant more time for assignments. Last weeks problem of embedding was fixed this week (hint – I customized my Flickr account a little too much). I pledge by UMW honor code standards they were posted and tagged on time to my flickr account, but it took me until today to figure out my embedding problem. :(

Want to know more about how the radio show project is going? Well here you go!

Speaking of radio show, I created a poster for our autumn themed show. WOOT DS106 Radio!

Now for my grand adventure in Designing…. 19 Stars (not including the radio show poster or the one that had no stars) . Although I found design to be the hardest week yet, I realized and appreciate all the work that goes into design. If I had 6 months to work on these assignments I could really make them something, but in one week… it was hard. Here is my best attempt at grasping the design concepts.

The main challenge in design is sitting down and thinking about it. How do you best convey a message- do you focus on color, positioning, can you do with less. There are so many things that go into design and half the time you put them in subconsciously. Example: you pick two colors because they look good together. Little did you know they look good because they are analogous or the same hue or the same saturation.  Design is in every single thing and you see it every day…. but you never register it. I know that nerd sitting a Seaco pointing out design elements to my friends (mind-blown) !

 

 

Week 6: Daily Creates

I found doing daily creates this week extremely difficult because the design assignments were so time consuming that I would forget about daily creates. I have a problem with my creates uploading up onto the website. Last week, I couldn’t figure out why embedding flickr photo automatically had stop working. Now, my photos were not embedding into the daily create. I tried to figure out what could possible be wrong. Then, I remember last week was customize your flickr account and I had changed my privacy setting.  I had to re-upload my flickr daily creates and refresh my blog, but kow that my settings have been made so “3rd parties” can upload my image all embedding works ! :) (what a silly mistake)

750305973_2672370177_0

Celebrating vegetarian day by eating celery. Celery and peanut-butter is on of my favorite snacks…healthy too. Here’s to the veggies that keep us strong and healthy!

floor plan

This is my main floor to the house I grew up in. I has a very open floor place between the kitchen, living room, family room, and dining room. The library is the only room that has doors and that helps when you are trying to study (quiet, secluded).

I took the sound “I Cry” by Flo Rida and edited with audacity. I raised the pitch even more than it already is.  I made the tempo faster. Then, I added a ‘paulscratch’ which is why it sound extremely slow. Hopefully, it sounds a little like alien is singing it. If not, it was still fun to play with sound. Audio is by far my favorite element.

floor plan

This picture represents a void or emptiness. It is a sad bare wall in my room. At UMW only 10% of your walls can be covered which leaves big areas  void of color in my room. Oh well, at least I follow the rules.

Radio Show- Individual contribution.

As a group we decided on doing a “soundscape” with an autumn theme.  Each person is responsible for editing together 5 mins of audio in the autumn theme – obviously keeping each other updated with the assignments we used (so as not to repeat). I will most likely be the final editor on this project because I enjoy audio the most. We all are contributing bumpers and posters for our show. We choice to work this way because as a group we have a hard time getting together whether in person or via google hangouts. This way everyone has a deadline and our project will come together nicely.

Minimalism Travel Poster ***

This assignment asked us to create a travel poster for a fictitious place, I choice the Gumdrop Mountains in Candyland.

gumdropmts

I used paint in order to create this poster. I used circle of various primary and secondary colors in order to create game board spaces / the road around of the Gumdrop Mountains.Then, I put gumdrops in the middle.  While I’m sure this picture could have less elements, I thought in order to understand the context a game board needed to be present.

I used color to a regular rhythm, much like the spaces of a board game.

Warning ***

Here is the Warning Assignment!

imaginarywarning

What is one thing that doesn’t exist, yet at some point everyone believes it does exist? – MONSTERS! I did this warning as if I were a small child who knows that if you turn off the lights, the monster will come out. I found a warning label and in GIMP, I edited and put in a clipart photo and text. I think this label has great design elements.

1. it is fairly balanced

2. Yellow and Black are eye catching and alerting colors

3. There warning symbol is next to the word “warning”

4. The picture of what is being warned is next to the warning words.

 

The label is able to be understood by a number of people do to the picture/symbols, colors, and text.

Computer Book ***

I am truly proud of this assignment!

ctrl F nemo

I did this project through Gimp 2.6.

1. I googled children’s book. I originally thought I was going to do “Goodnight Moon” and change “moon” to “CPU” or “modem”

2. I called my computer expert to make sure you could turn of a modem .. which you can. But he said he wishes I could do something a little more practical since its for children. He suggested doing “Finding [computer part]” based on “Finding Nemo”

3. Finding Nemo! How about “CTRL F” for Finding!!!

4. Found a book version of “Finding Nemo” and put it into Gimp 2.6

5. Color selected the water and painted over the “Finding”

6. Then, color selected the “Nemo”, open a text box and typed in “CTRL F”

Although I didn’t alter their design, I do think this is a great concept. I didn’t alter the design or color because I’m not changing the integrity of the story (it’s still about Nemo). I think it looks super realistic and I would be interest in reading the computer geek version of “Finding Nemo”. :)

 

Children’s Book Cover

This assignment was particularly challenging.. I don’t think I succeed as much as I would have liked.

dr.suess

 

Firstly, I used paint in order to create this book cover. I just used copy/paste and shapes as the assignment prescribes. I choice to dominate the cover with one color because I think the most iconic part of “The Cat In The Hat” is his red/white striped hat.  Otherwise, I tried to keep the design as minimal as possible.While its not as eye catching as the original text, I do find it visual pleasing. There is a symmetrical balance between the words and picture.I added the red board to help balance the red hat.

Bad Guy Business Card **

This is such a fun assignment! Business cards are super functional piece of design. It includes : your name, contact info, company, skills/occupation. What is fun is that there is a set formula for business card…so how do you make them stand out. You add color or change the organization – design! Bad guys would get so much more business if they just had business card… think of how all the “Disney Bad Guys” could win if only they outsources and teamed up?

This is the the business card for the evil queen in Snow White and the Seven Dwarfs. If you don’t know the story..click here.

evilqueenbusinesscard

In order to create this I used Microsoft Publisher! It is a great program that give you lots of template .. it like paint and word combined with some hand-holding when it comes to design. I did a variation of a template, but instead of having just a block of color on the right to balance the text, I put her picture. Then, I changed the color of the text so that they matched the pictures. :) Its monochromatic business card which says something about her business- giving it a wholesome or united feeling.

 

 

 

Design Elements/ Designblitz

Color

When I think of design elements color or the lack thereof is the first thing that comes to mind. Color is probably the most crucial element in fostering human emotion, by creating a mood. The color wheel is your best friend:

-Primary colors: Red, Yellow, Blue

-Secondary colors: Orange (R+Y), Green (Y+B), and Purple (R+B)

-Terceira colors: Red-Orange, Yellow-Orange, Yellow-Green, Blue-Green, Blue-Purple, Red-Purple

-Warm Colors: Red, Red-Orange, Orange, Yellow-Orange, Yellow, Yellow-Green

-Cool Colors: Green, Green-blue, blue, blue-purple, purple, red-purple

*Red, Green, and Grey can be warm or cool depending on saturation

  • Adding white creates tints (x-axis), adding black creates shades (y-axis)
  • Hue is what color, Saturation is how intense the color is, the value is how light/dark a color is
  • Color Schemes
    • Monochromatic – everything is the same hue, but different tints/shades
    • Analogous- colors that are next to each other in the color wheel
    • Complimentary – colors directly opposite the color wheel

Color doesn’t always mean childish, primitive, or wild color can actually display sophistication and elegant better than black and white.

Designblitz:

This is the color scheme carried out throughout my room and bathroom. I learned that it is analogous color scheme with brown & white as my neutrals.  They are also warm colors.. mmmm cozy!

color

Typography

Is simply the arrangement of type. However, typography can affect the mood or tone of one’s message. Remember when you were learning to write and you were given that big paper with two lines and a dotted line in the middle? You were given that paper to help guide your type… type has five line that help guide the text (you already know the Cap Height/Cap line aka the top, x height/midline aka the dotted line, and the baseline aka the stop line) from learning letter writing.  But, remember when you wrote “y” or “g” and the tail of that extend down off the baseline. Although there wasn’t an actual line there on your paper, that line is called descender height/beardline. Furthermore, you probably never distinguished this but the Cap line and the Ascender height/topline are very different. Cap height is for capital letters, while ascender height is for those tall letters like “k” “t” or “h”. You probably never had a distinguishing line because these lines almost sit on top of each other.

When you “double space” your paper you are increasing the space between your lines. This is called leading.

Maybe you have played around with word or paint and you put a space in-between you letter in order to make the letters more distinct? This is called kerning.

Alignment: normal right (default/most common), left, center, justified (it spaces out to fill the margins)

Two common typeface classification  are “Serif” and “Sans-Serif”. “Serif – these typefaces are the more traditional ones. They are distinguished by a short line or finishing stroke on the end of character” http://psd.tutsplus.com/articles/techniques/a-20-minute-intro-to-typography-basics/) . Sans- Serif means “without serifs” or without the strokes at the end of the character.

Top 5 fonts not to use:

  1. Arial – old, comfortable, blah sans-serif
  2. Times New Roman- boring, has Serif, old and overused (but if your teacher requires it, t   hen just grin-and-bear-it) If you want to be classic, choose Verdana.
  3. Papyrus
  4. Comic Sans
  5. Curlz- way too over the top

Metaphors/symbols

                Often used to explain something unfamiliar in terms of the familiar (it is like). I really like this example from http://www.slideshare.net/dansaffer/the-role-of-metaphor-in-interaction-design

 

Affection is Warmth

-My love for her still smolders

-They gave me a warm welcome

-He’s a warm person

-It took a while to warm up to the topic

Think about all the metaphors/symbol you see on a daily bases – aka sign in particular road signs

Designblitz:

Look how confusing these road signs are! The symbols are extremely similar, yet suggest two very different things.

confusing signs

This is a UMW t-shirt for “d.o,t challenge” or “do one thing challenge” from last year. It suggests that I pledged to do one act of kindness a day.

metaphor

Minimalism and use of space

This is the idea that less is really more. In the design world we see people push and push to add more, but sometimes not adding more makes the message so much clear. Other times, the message is so obvious, but we have to think about it. Let’s face it …it’s more fun that way. Here is the low-down on minimalism

–          Have very few elements incorporated in them

–          Designer has to pickier and purposeful

–          Don’t be afraid of white space.. it is necessary and helps the viewer focus on the important elements

 

Form/function/message

Questions: How well the design convey it meaning, potential use, or real world object?

Affordance- how the actual design gives instruction or hint on how to use the object

User-centered design – primary focus is on functionality not aesthetics

When design keep in mind the key focus or function, then run the design past a friend or few… did you find a pitfall,  think about all the ways someone could logically misuse the design. FIX it!! Make it idiot proof!

Designblitz:

Seriously, who designed this building? There are four sets of stairs…but only one goes down to the basement to the laundry.

Bad Design

This metal lap gets so hot! Not a very smart design… why would you make a swivel neck to the lap if you can’t touch it!

function

Balance

Two forms:

  1. Symmetrical- evenly distributed weight of a composition around the central vertical or horizontal axis
  2. Asymmetrical-weight is not evenly distributed around a central axis.  Object balan one another with their respective visual weight- dominant effect.

Designblitz:

At the beginning of the year, I put up wall stickers. Who knew I had balance them symmetrically? I just felt that it looked good- both color, size and number are balanced.

wall art

Rhythm

When you think of rhythm, think of intervals. It can create a sense of movement or pattern.

  • Regular: A regular rhythm occurs when the intervals between the elements, and often the elements themselves, are similar in size or length.
  • Flowing: A flowing rhythm gives a sense of movement, and is often more organic in nature.
  • Progressive: A progressive rhythm shows a sequence of forms through a progression of steps.

http://www.digital-web.com/articles/principles_of_design/

Designblitz:

This is my chair! Look at how the intervals are evenly spaced creating a pattern. This is called regular rhythm.

chair

 Proportion

Is the scale of the element in relation to another element. It can create weight, depth, symmetry, etc.

Designblitz:

The apple is proportionally huge compared to the pumpkin and pinecone, yet they balance each other out.

porpotion

 

Dominance

Where is the emphasis in the design? It helps establish perspective. There are three stages of dominance.

  • Dominant: The object given the most visual weight, the element of primary emphasis that advances to the foreground in the composition.
  • Sub-dominant: The element of secondary emphasis, the elements in the middle ground of the composition.
  • Subordinate: The object given the least visual weight, the element of tertiary emphasis that recedes to the background of the composition.

Think about foreground, middle ground, bad ground.

Unity

Might be the most important element of design! It means that all the pieces come together to form something- concept, function, etc. Having unity gives the view a sense of wholeness and correctness. Without unity one gets a sense of variety, confusion, “something is missing”, which could be the purpose of the design.