Friday, September 27, 2013

Blog Post #4: Mini Art School: Effective Graphic Design and Design Layout

Project #1:

The first project I've chosen to do is the Word Portraits Project, where I had to choose 12 fonts and list two words that  conveys the 'voice' of that font.  The font is listed at the top of the slide and the first two words under it amplify the meaning by being presented in that particular font.  (Page 241)

I couldn't help using color, especially since I am so visual.  I hope that was allowed!

The last word on the slide is a word whose meaning is a direct contradiction to the voice of the font.

Working on my Mac, I made the initial presentation in Keynote with no music or sound.  I then exported the file to my Dropbox.  From my iPad, I opened Explain Everything, imported the presentation.  To create the presentation, I muted the sound and pressed the record button, counted to three, and then stopped the recording.  I did this for all 12 slides.  The final and 13th slide, I created the ending to the presentation.  Thereafter, I first saved it as a regular Explain Everything file.  Then I exported it as a video file to my Dropbox from where I embedded it into this blog.  I have to say that I am quite proud of myself.  I actually did this with such ease that I just may have begun the process of mastering this procedure.  Yea, Me!!

I hope you enjoy it.  I look forward to your feedback.
Note: When I uploaded my project on Friday night, the fonts could not display accurately.  On my way to Massachusetts to my grandson's 5th birthday, I realized I only needed to change them to... something else!  jpegs did the trick...

















Project #2:
































































I've chosen to review this site because I have been asked to make design changes to it.  It has been suggested that it needs more 'pizazz'.  Perhaps some color in the center section; some blocking and segmentation.

I think the design is easy to read.  I like the shadings on the page.  The information on the left is the 'table of contents' so to speak; all the links that take the reader to different parts of the site. I like the dark blue and white print contrast; again I think the dark left border repeats the top dark border and results in drawing the eye to the links.

I like the pale color blue on the right.  Again, I believe that it reduces the fatigue that can come with reading a busy page.  This page does  have a lot of information on it.  But again, the information is well chunked by color and makes it easy on the eyes.  Hagen and Golimbusky (2013) say that staying away from saturated colors on saturated  and using contrast (like the dark blue with white print, or the pale blue with black print) creates visibility, making it easy for the viewers to see clearly (p. 124).

The pictures do rotate but I don't see them as a distraction to the reader.  I think it transitions smoothly and provides a bit of interest to the reader who needs to peruse the page for a particular piece of information without being distracted by music or splashy messaging. Hagen and Golimbusky also say that the splash of color (in this case from the change in pictures), can be sufficient enough to create interest without overkill (p.125).


I look forward to feedback from you because I'm not sure that this page needs anything else. I believe it may sacrifice the eye appeal it has now unless the entire page is redesigned, which is not in the agenda at this time.

If you get the chance, please visit the page at www.njascd.org and let me know what you feel when you first see it.  Some of the links are broken and information in the future will be relocated, but if you could give me feedback about the readability and visiability issues (Hagen and Golimbusky, 2013), I would be ever grateful.


References:

Hagen, R., & Golombisky, K. (2013). White space is not your enemy: A beginner's guide to communicating visually through graphic, web & multimedia design. New York: Focal Press. 

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

Thursday, September 26, 2013

Still, Audio & Multimedia Critiques

Hi everyone!
This first critique is of Aviary.  This critiques the merits of Aviary as a still media editor.  I look forward to your feedback :)






My next critique is of WebWave, an audio editing tool that is compatible with Apple iPads.  I made the recording in Pocket Wavepad, an audio app for iPad users.  I was able to make the audio recording with amazing speed.  My hurdle has been being able to embed it into a program where the audio from the recording could match the explanation that accompanied it.  That said, I used the iPad application Explain Everything to accomplish this synchronization.  I also tried to make a Keynote presentation, but I ran into the same problem; the audio file and the explanation didn't really meet my delivery expectations.
Again, my challenge ended up being getting the audio recording to embed and play  in the new program.  I was only able to get the audio from Pocket WebWave into the Explain Everything app by playing the recording on my computer and recording it through my microphone.  This has reduced the clarity of the recording but it has made the recording audible to the viewer of the video. From the second slide onward, I used a direct recording through my headset to record the audio explanation.  I am really looking forward to your comments.  Thanks so much!






The last critique is of Vacasmo.com.  I apologize in advance, but regardless of the number of times I created and clipped the screencast, it was still 10  minutes long.  I really did try to get it down to size and I succeeded by getting down below 14 minutes.  Please bear with the cast as I will look forward to your comments.







Ciao!


Friday, September 20, 2013

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. 






Saturday, September 14, 2013

Blog Post #2: Multimedia Montage

As a result of the predominant role media plays in the life of the 21st Century Learner (Daley, 2003), the Common Core Standards have been designed around significant media inclusion in every subject (New Jersey Department of Education, 2010).  For this reason, I’ve chosen to join the Common Core community to ascertain and inform the community of the tremendous role inclusion and construction of media is expected to play in their everyday units of instruction. It is also the reason that brought me to this program in Educational Technology.
I am an active subscriber to many academic organizations such as AMLE (Association for Middle Level Education), NAESSP (National Association for Elementary and Secondary School Principals), and ASCD (Association for Supervision and Curriculum Development).  These subscriptions, as you may know, provide a plethora of literature (both physically and technologically) that can truly make your head spin.  The reason I bring this information to this discussion is that in all my readings, and I really do read virtually every educational magazine I receive, I cannot recall coming across material that addresses the continuum of instruction that needs to be addressed for our national system of education, despite its many varieties, to truly meet the critical thinking and innovation driving skills our students need to have to have the United States continue leading the world in innovative productions as we have with the car and  the computer, to name two.
This class illuminates for me the fabulous opportunities we can bring to our classes to drive this innovative explosion from our students. I believe the students are anxiously waiting for us to show them how to tap into the media skills they use every day because they see no media-school connection in their daily work.  It also presents me with the recognition of the dearth of understanding I see present in the educational community surrounding me. it appears this dearth isn’t only in my community but in the trenches of instructional leaders everywhere.
 I have had many rumblings of ideas suggesting how I can personally bring the information I’m gaining, (and practically on a minute by minute basis), to my fellow instructional colleagues at all levels.  Professional development ideas seem to be the strongest method of delivery but I have yet to decide what it could look like.  I personally, must be careful to stay in the moment of learning so as not to miss the idea that could be the gel for my ideas.  I would look forward to others’ ideas.

An additional note:  This is the link to a digital article regarding public libraries' ramping up their digital abilities: Public Libraries Add Multimedia Learning to Digital Mission

References:

Daley, E. (2003). Expanding the concept of literacy. EDUCAUSE (March/April), 33-40.

Education Week (2013, September 11). Public Libraries Add Multimedia Learning to Digital Mission. Retrieved September 14, 2013, from http://www.edweek.org/ew/articles/2013/09/04/03library.h33.html

New Jersey Department of Education (2010). Skills array, NJ CCCS 8.1 Computer and information     Literacy. Retrieved September 12, 2013, from http://Department of Education. (2010). Skills array, NJCCCS 8.1 computer and information literacy. Retrieved from http://www.nj.gov/education/techno/techlit/tapin/2ci_skills_array.pdf

Tuesday, September 10, 2013

Blog Post #1: Madge, The Palmolive Lady

I chose the vintage Palmolive commercial.  I remember watching it as a young girl.  Madge's perfect hair and fresh lipstick; so cheery at her work.  The woman in the salon reminded me of my mother who went to the salon every week for a manicure and set.

As a child, this was my reality.  My mother really went to the salon and the ladies there were always happy to see her.  She seemed to leave there in a better mood than when she entered .  As a child I identified with this scenario; a trusted nail technician.  I would never have thought that anyone was left out of the picture because all of my mother's friends also went to the salon every week.

From the cinematic perspective, it spoke to the new suburban housewife who was always doing dishes to keep up with her growing family.  Her work was manual and her hands paid the price for the luxuries her husband could afford for her.  Scrubbing the dishes, floors, and children in their nightly baths was an activity that truly took its toll on a woman's hands.  The commercial addressed this demographic because it was the largest growing segment of the country post WWII.  Soldiers came home, factory jobs were plentiful, and life was good.  Men's salaries permitted their wives to stay home to raise their families while enjoying some pampering for their hair and nails.  But their hands needed the touch of Palmolive dish detergent to keep their manicures and hands in the softest condition between salon trips.

While it wasn't clear to me at the time, the commercial was directed to the growing middle class segment of the population; white, successful, well dressed, and well spoken.  I didn't realize that the people who were left out, those who weren't successful, well dressed, well spoken, and white even existed.  Television didn't portray minorities in commercials, at least in my mind, because they were being excluded from the financial success of the white middle class.

Daley (Educase, 2003) says that "the language of the screen enables modes of through, ways of communicating... and methods of publication and teaching that are essentially different than those of text" (p 34).  Reflecting on only the spoken words in this commercial, which essentially came from a written script (text), the reader could not possibly have been moved to feel the sense of familiarity that I felt when the words were married to the images and voices.

Petterson (TechTrends, 2009) writes that message design "deals with the organization to bring forward scientific knowledge of artifacts" (p 39).  Petterson (ibid) writes to the collection of society, art, aesthetics, language, and cognition together as an interdisciplinary melding of influences that, in this case, can be used to persuade.  When Madge says that 'it's so mild, you're soaking in it now", there is an implied sense that the detergent has a scientific basis for it.  I don't ever remember wondering if there was any truth to the statement. But I know that when I had to do the dishes, I wanted Palmolive dish soap there to keep my hands soft!

It seems to me as I examine this commercial from the production perspective, Madge is wearing a cool blue smock; blue is the color used to imply trustworthiness and honesty. Madge's hair, makeup and demeanor are meticulous; implying honorability and personal integrity. Who would doubt Madge? The background is muted but clean; the voices are clear and there is little distraction from the two characters in the initial scene. This commercial was made for television to reach the rising number of housewives who had televisions; quite a novelty at the time.

http://www.youtube.com/watch?v=_bEkq7JCbik&feature=relatedhttp://www.youtube.com/watch?v=_bEkq7JCbik&feature=related