Blog Post #3, Mini Art School

 Mini Art School Part 1

I've chosen to compare two examples and identify how the the 10 Web Design Rules You Can Break, supports my sense of the better use of the specific design element.

1) White Space:  I believe the first design uses white space more effectively than the second.  In some way, the first design violates the idea that Margaret referred to in her interview:  consider the edge of the design to become a 'frame' for the contents.  The second design follows this rule very closely.  However, she also refers to the use of an eye for art/balance and although the first design does not follow that rule, the black and white figure in the top center gives a sense of framework, supported by the thick black lines surrounding the entire design.  I think this is an example of using an analytic eye when using (or not) the rules of white space.

2) Color:  Although both designs are green, I chose to compare them because the green on the first design is more vibrant than the green on the implied chalk board.  The designer of the second design probably chose the chalkboard backdrop because of its informational reference to the event, but I'm not certain that it was the best choice, for all the reasons I've stated.

3) Visual Interest:  For obvious reasons, there are no horizontal or vertical scroll bars, but the placement of the information on the first graphic truly grabs my eye because of its visual interest.  The second graphic is informative and clearly presents its message, its just not very visually appealing to me.  I read it because I had to know the information.

4)   Fonts:  Again, the first design uses only one font and uses only two colors; variation of the size of the font creates differentiation within its message without creating visual confusion or distractions.  The second design, uses three fonts in four different colors.  This is too busy to my eye and displeasing to read through.

5) Make the design's goal obvious:  I believe the first design is simplistic enough and delivers the clearest message in the least amount of reading.  Again, although the second design's goal is clear, the distractions prevent me from wanting to read the rest of the design.  It's almost cluttered.

6) Navigation should be easy to figure out:  As these designs are static, navigation here is moot.  However, I translate this idea into being able to easily identify any actions the reader should take as a result of reading the design.  Again, the top design's message is uncluttered and the design did provide an icon taking the reader (on a website) to the newly designed Parent Portal.  The design does not indicate to 'click here' but it seemed implied to me as I looked at it on the site.  The second design provides a clearer follow through for the reader.

7)  Use different color for text and background:  Both designs do a fairly good job of differentiating the text from its background.  However, because the first design is more simplistic with fewer color changes, I feel it is an easier read than the the second.  Additionally, the second design uses a lighter shade of green for some of its text.  I feel that the designer thought this was a good way to have that part of message stand out, but I feel it was ineffective and enhanced my sense of clutter in the design.
8)  Don't put animation in the way of the design:  Neither of these designs had any animation to distract the reader, even though both were taken from a website where animation was possible.

9)  Stick to safe fonts:  Both texts are created in recognizable fonts.  I think the first design uses an Arial font and the second uses Chalkduster, Arial and a third I think may be Times New Roman with letters that are tightly kerned.

10)  Don't have a splash landing:  Again, these are static designs and neither one of them triggers any kind of splash when clicked through.  Each takes you to another static design, making the transition more smoothly than when a splash of video or music interrupts the reader.

Reference:
Penner, E. (2009, June 17). 10 web design rules you can break. Retrieved September 18, 2013, from http://rutgersonline.net/re/DotNextLaunch.asp?courseid=8427776&userid=9432241&sessionid=a097fab070&tabid=C+E+Uj6lGs3IxiT00Nfm6p5JKSCbqdXRnWBgpT4wwJg=&sessionFirstAuthStore=true&macid=INgmjRcA/MJVeXeCsFIZD2Mj6+yoHNSKjKfL+3NXuqW8LipHCXzNZCehk/mazCIOg4TVZDOVJv3wXdpo0aTS2TCIAJJ9ScbruYrvJ4OUdTRU11eFLU8MULKV7WXl3kjfe3Q3bkYaNodB7dk4fF8jODI9ZZDN858vR8wT1K+az0XkRIB9o3+29g1brhp1xmxunMVx1lmi/p65Q0IOvmsoLg==

 Mini Art School Part 2

I chose to use the repeating patterns found in the Using Design Index: Harmony Workshop Exercise  Repetition on page 58.  The repeating elements are the:

• purple gingham background (my school colors are purple and gold).  I chose purple because it was a more distinguishing color than yellow; more to draw the eye to the flyer.

• pencils:  the pencil shape was repeated in multiple colors, reinforcing the repetition theme of the exercise
• purple colored text:  I used two fonts, Times and American Typewriter,

These three elements are used in three different layouts creating related but distinguishably different flyers.

The flyer contains simple headline in Times Bold 80 Font in purple. 
The tan ‘recipe card’ uses a combination of purple capitalized American Typewriter
    Bold 18 Font for the labels and American Typewriter 18 Font  and 14 Font for the
    note’s information.
The picture is of my family and I at a party where my daughter baked the cake for me last Sunday, 9/15, when I celebrated my 5 year anniversary of being cancer free. (Unrelated to the flyer, but a personal note of interest..)

I used Pages on my Mac Computer which is fully compatible ( for viewing and construction purposes) with my students' iPad for classroom projects.

This project took me 3:45 hours to complete, including making the screen cast and posting it to my blog.

Christine Garner-Duane
Ed Tech 504
Fall, 2013

Reference:
Krause, J. (2004). Design basics index. Cincinnati, Ohio: How Design Books.

Mini Art School, Part 3

For  my second option, I chose to do the Design Basic Index: Loosened  Alignment Exercise from page 87.  This one was a bit easier for me but I struggled with getting the product to the blogpost.  Ultimately, I took a screen shot of the product I made in Pages, emailed it to myself, saved it to my iPhotos application and uploaded the jpeg file.

I adopted the "handcrafted' language because it was a natural fit (for me) for toys.  Although my iPad is the toy my grandchildren like best, I adhere to the philosophy that creative play lays the best foundation for adult critical thinking skills from where our creativity is drawn.