Tuesday, November 29, 2011

10 Steps & 40+ portfolio's

I initially thought that I wouldn't use all of the 10 steps in creating my portfolio, but as I went through each steps, I found myself wanting/needing to use all 10. A logo allows followers to associate me with a visual icon, similar to logos like the live strong bracelets, or the Google logo. Each of the steps highlights my unique skills, and provides various outlets for others to follow. (via twitter, Facebook, blogs, etc.). What the 10 steps also provides is a human/personal connection through my about me, tag line, and services. Smashing Magazines overall approach in creating a portfolio, seems at first glance to be too much, but after analyzing my page each step had a specific role in creating a well rounded portfolio that can sell itself.                                                                                  
 40+ Portfolio's
I really enjoyed Cartonblanc's web portfolio. The visual layout is eye-catching, and creates this urge to click around all the tabs and arrows. The flash animations is what bought me on this portfolio, instead of just clicking a simple button, and transferring to a new page, we get a cool animation that brings life and color to the portfolio. The start-up screen was a good way of providing the viewer a distraction while the web page loaded, which I feel makes it more interesting than starring at a blank screen.
If I were to apply this approach to my web portfolio, I would need to look into creating effective flash animations that aid my page in navigation, and aesthetics. While at the same time not being to distracting and complicated.

Shannon Moellers page was another web page I enjoyed, and found to have an effective curb appeal. Unlike some of the other web pages, Moellers is simple, yet provides enough information allowing the viewer to understand what and who they're looking at. We get some of this from the tag line that takes up 25% of the page and helps to briefly describe what Moeller does and some quirky interest to create a personal connection to the viewer. PAge navigation was easy, and had a consistent tone from each different page. I liked the thumbnail list which bubbled a description of what the image links to when scrolled over. this visual approach to me made the page flow more easily, and feel less cluttered and bare with words and descriptions. Other links such as portfolio, and blog pages are easily identifiable at the top and bottom of the page, making it convenient for the viewer to not have to scroll up and down the page.

What I would use and apply to my page, would be the simplicity of the layout, and the thumbnail page list. Again in order to achieve a page like this, I would need to look into flash animation, as well as some indesign/photoshop to create a simple yet engaging page.

Wednesday, October 12, 2011

Literacy Narratives

Scannell: Fairly entertaining visual, though it seemed to drag on a bit near the four minute mark. Being a literacy narrative, there wasn't much in the way of describing a learning process of either reading or writing. Context of the video consisted mostly of the authors parents gloating, and describing how their daughter was naturally efficient in writing.When mentioning Reader Rabbit, the mother briefly mentions how the daughter learned to read, but quickly transitions to how amazing her daughter was. I found the miscued video and audio distracting. I feel that more of a personal input would have made the narrative more effective in that parents would typically always talk highly of their child, and I feel this didn't serve the purpose of the literacy narrative.

Andfull: The visual composition and transitions are used effectively and create a fluid movement throughout this literacy narrative. Though the authors redundancy of saying the title and a short opinion of the book became boring. This video seemed more like a laundry list of books that are for sale rather than a literary narrative. What I found effective was when she went in depth explaining the importance (to her) of the Berenstain Bears books. If she were to apply this method to a few other books, I feel that her narrative would become more enjoyable, insightful, and less redundant. Clarity of book covers was another issue with this narrative, making it look as though it was compiled at the last minute. Having clearer images would clean up and give the narrative a more visually pleasing experience. The overall concept was good, just needed to be more grounded and focus on fewer books rather than the whole library.

Trauman: Though this literacy narrative is done "in the field", the background noise is subtle yet at times is distracting. This approach creates this one-on-one feel with the speaker, which helps the viewer to connect and tune in to what is being said. His story helps to create this visual narrative that creates an interest in what he's saying. Using this back story assist the explanation of his discovery of the power, or in his case magic, of words. Coming at the narrative in this approach, for this literacy narrative, is easy to follow, and clearly explains the authors literary discovery.

Peyton: The visual concept is unique and interesting, though I don't think it was applied or done well. Due to the out of focus text, the texting sequences felt drawn out, almost time filler-ish. The issue he addresses about how texting has affected is writing skills is clearly expressed. He shows examples from english assignments that demonstrate the effects texting has had on his writing. What would tie this together would be to see the effects of is improvement which he stated at the end of the literary narrative. In terms of the texting visual, I found that it would have been more effective if there was some editing done to enhance the clarity. Having the text layer active while he's texting would have been a better approach, rather than after the text is written. Even though the main audience was probably an English class, I felt that not many viewers would know what DLN is when he writes, " I'm Trevor, and this is my DLN." Some minor fixes other than the visuals would be the text block at 49 seconds. It's unclear if he's trying to make a point by stating he didn't capitalize, or use proper punctuation, and actually have none of them done in the text this issue was stated in. Over all this was an original approach to this literary narrative.

Wooten: It's very simplistic, which in the case of the assignment is both good and bad. He has countering arguments which make following the content unbalanced. The flip-flop from general to specific statements is where I find most of the issues with this narrative. I enjoyed the visual story telling, it felt much like an automatic picture book, with a soothing, mellow soundtrack.

Grading Criteria: Fluid and understandable content, is the authors narrative easy to understand. Does/do the visuals correlate with the aural, textural content (within reason). Does the author address an issue and then resolve or explain ways of overcoming the issue. To Be Continued .  .  . 

Thursday, October 6, 2011

Project #2 analysis

Web page #1 (Nick G.):
   Camera shutter speeds is the focus on this multimodal analysis project. We look at various mediums: video, text, and imagery. Some the main criteria in having an effective text in teaching shutter speeds are clean and crisp presentation, fluid visual alignment, and informative text. For one text, poor layout and distracting images can cause the message to not broadcast properly to the viewer (Text 5). Alignment, framing, and text are, more, essential when looking at still image tutorials. Looking at Text 4, the viewer wouldn't be able to understand what they are looking at if the author didn't ad the shutter text at the bottom of the image. When looking at video, Text 1, having clear and informative narrative in correlation to the intended audience is crucial in having an effective text. Being an introduction to shutter speeds, the author, "goes into depth on not only how to properly use different shutter speeds, when photographing, but he also talks a great deal of exactly what is happening mechanically with the camera at different speeds (Text 1)."
  In presenting an effective text to beginning photographers having a clear and organized visual space helps to retain the viewers focus if your planning on using text or still images. If using charts or pictures, alignment and spacing a crucial in conveying your information, and can be aided with easy to read text. When doing a video tutorial, speech clarity and occasional text captions help to reinforce the material. Having a clean and low noise visual space also helps in maintaining focus.

Web Page #2 (Katerina G.):


    When we search for internet radio, we tend to gravitate towards those that are aesthetically pleasing, has easy to follow organization, and a user friendly interface, as well as quality music choices. Katerina touches on many of these attributes when looking at five varying internet radio sites. For the most part, each site template had similar qualities with one another. Color scheme between Pandora Radio and 8Tracks have the sleek white and blue, whereas Spotify and Grooveshark have a iTune-esque appearance. Having recognizable layouts allows users become quickly familiar with the program making music search and listening easy and enjoyable. Though what seems to be the one determinate in which internet radio source is used is the number of tracks that can be skipped which correlates to number of advertisements played after so many songs. This gives users many choices depending on whether they want to listen to more continuous music and have fewer song skips, or be able to have a larger amount of skips while having more frequent ad breaks. Currently it seems that the authors of this radio sites have keyed in on what the viewers are looking for in a radio site, and have created efficient yet personal sites for users to interchange with and have confidence in knowing what they are getting.

Web Page #3 (Allison H.):


   Simple is better, less is more, when looking at instructional work-out modes, be it a magazine, online article, or clip from a work-out routine video. Visually the viewer is looking for the steps, proper positioning and procedure of movement and results (or commented results using the routine). Effective modes tend to have clean page layout, clear concise textual or aural descriptions of how to perform a particular exercise, and varying routines based on skill level of the viewer. Allison looks at a few text related to working out, the 300 routine, a text from Men's Magazine had the right content, yet the visual organization and spatial alignment was cluttered "with all the ads and distractions. . . making it confusing and hard to follow." Similar to the 300 text, the Interval Training Chart had similar visual and aesthetic issues.
   The last two texts, Woman's Body Transformation, and Kermits Stretches had simple layouts and color schemes. The latter was a page with evenly spaced and aligned images of Kermit performing different stretches, which were titled at the top of each image. Clicking the images brought the viewer to a page with a description of how to do the stretch located under an enlarged version of the clicked image. Having a white background created a clean and soothing look to the page, and also provided contrast with the images of a green Kermit.
   It seems that content is not an issue with any of the text analyzed, the determinant of an efficient text relied mainly on the visual format and organization of the page.


Favorite Web Page:
   Sarah Johnston's web analysis page is amazing. Choice in color and graphic layout made the viewer (me) feel as if I were looking at an actual dove web page. Balance of text and imagery is used well, along with easy usability of the web page. the image strip link bar is visual appealing, at first I though it was just an image banner, but as a read the text,realized that each picture was a link to that text analysis. Navigation flow of the web page is smooth, I don't find myself loss or confused of where I'm at or where i'm going which is sometimes lacking in web pages. The border helps in focus the eyes to the content held within, which is aided by the contrasting white background. This was a well developed web page.

Tuesday, September 20, 2011

Project #2: How to Skateboard

 Though it may not be for everyone, those who want to learn how to skateboard sometimes find it difficult to perform the basics needed to advance in trick ability. Being one of my favorite time killers, I've noticed that there are a wide range of teaching styles on how to perform certain maneuvers on a skateboard. For me I've found it easier to learn by skating with friends and having them demonstrate the trick, and then critique me while attempting the particular trick. In most cases coordinating friends and allotting time may be hard to do if you're an older skater, or you're the only kid on your block with this interest. The three text that I'm using for my project are:

1. Skater Aron L.'s  Youtube channel, which has a variety of videos consisting of various tricks, which he breaks down into easy to follow steps. 
2. Another text is located on about.com called how to skate. This has both visual/auditory, as well as textual text. 
3. How2skate is another text I will be referencing to in creating my page on how to skate. 

  What all three text have in common are demonstrations using visual, gestural, and spatial text modes. These modes are key in this instance because skateboarding is a visual gestural sport, and having these to modes is essential. Though the How2skate demonstrations lack in aural mode, which makes deciphering what is being done to perform the trick difficult. My favorite text-mode would be Aron L.'s(which I've referenced to plenty of times) because not only does he perform the trick, he explains aural gestures, as well as gestures placement of feet and what to do in order to perform the trick in the visual tutorial.  About.com's how to skate page had a visual text and still image portion which I found semi-useful in the sense that it's sometimes difficult to transition words to action, and the still image doesn't really help to visually explain the instruction. 

Monday, September 5, 2011

ix Exploration of: Alignment, Contrast, Emphasis, Organization, & Proximity

ALIGNMENT:
   I feel that the choice in aligning the word "murmuring" at the top an jumbled attracted the viewers attention in trying to decipher what it reads. Once the letters fall into place we are able to read the word, and it disappears and the word "Insect" appears to its immediate right and then vanishes. This process is repeated along with the ambient sounds of frogs and insects murmuring. Having a short visibility, I feel that the emphasis on the words are minimal, though are aided by the alignment of the downward color gradient of the background.


2 EARTH: In this scene the pair of angled jet streams (or clouds) and the crescent shape remain in a central alignment. Much like the murmuring insects, the earth scenes alignment remains the same. This repetitive alignment helps to bridge the differing scenes together. My focus is mainly on the texts, since they are the only moving objects in the scene. 


3 AIR: Earth and air have differing alignments, in that the earth scene as text with ambient background noise. Where as in the air scene, we have lines appearing with an accompanying line of poetry. Looking at earth's scene, the texts seem to align right and in close proximity to the crescent shape (which may represent earth.). For the air scene, the alignment is left, and the text originates by the jet-stream, geese and drops down toward the crescent shape. This produces the essence of air, as the geese fly around the top of the scene. 


4 WATER: Water's scene, the background image is of an eye, and the lines of text are referring to swelling tears. Having the text aligned with the curvature of the eye we get this sense that the authors texts are swelling out of the eye, providing the viewer with a sort of visual interpretation. 


5 NO-ALIGNMENT:Lack of alignment between the text: earth, air, and water tells the viewer that all three have equal importance. The randomness of the alignment can be presumed as the viewers choice in viewing either scene in any random order. Though I did find that the text seemed to be aligned with their corresponding image/level. Air is located at the top next to the jet-stream, earth is located near the center but above the crescent shape, and water is located at the bottom of the scene below the crescent shape. What this alignment means may be some subconscious organization of the text and the accompanying scenes.


CONTRAST:
1(0:22-0:32):Microsoft Mary is the first noticeable element of contrast, along with the gray dialogue box and medium white text. Change in voice created a contrast from the Microsoft Sam dialogue in which she sounded more like an instructor providing the viewer with JUMP's mission statement. Having a gray screen over the running cartoon broke the attention away from the animation while retaining the forward flow of the cartoon. This backdrop help contrast the text from the ongoing background animations, yet maintained the tempo by having scrolling text while the narrator spoke. If the contrast were to be removed, JUMP's mission statement would become lost within the cartoon and probably be glanced over from the various distractions. 
2 (0:55-1:08):  Having white text against a black background is a classic contrast form. Along with the voice of Microsoft Mary, (when these textual excerpts pop up narrator switches from Micro Sam to Mary). Though this time around the omission of the cartoon was necessary to emphasize the instructional text. With the black background, the contrast is heightens the importance of the text, which is the rubric of what is required for the JUMP program.    
3 JUMP FLYER: For my flyer I would use a 60's cartoon image that relates to, or defines, the JUMP mission statement(0:45). This image would be in the cartoons original color, and take up about 2/3's of the flyer space. For the top 1/3 of the flyer,the background would be an extension of the cartoons gray background. Using white and black text the title would be in large and block bold type, with a smaller black print of further information details. The image would contrast the text in providing the viewer a visual depiction of THE JUMP mission. Having a large image would attract passing viewers, and bring them in closer which will focus in the bold text. With a linear alignment, the viewer could read top to bottom of what THE JUMP is and how they can learn more about it. 




EMPHASIS:
1: Within this text, the attention is drawn to the blank notepad. We visually see this cluttered desk producing a lot of visual noise, as our eyes move around we're attracted to this blank notepad page near the center of the mess. Creating a chaotic background helps to emphasize the clean empty space of the notepad, which is essential since it is the location of the scenes title. This clip, to some degree, works as a title page, where it hinders is the size and legibility of the title text. (Though I feel this may actually emphasize the title requiring the viewer to focus more on the text on the pad). 
2: During the stop-motion animation, our attention is drawn to the woman and here movements on the notepad. We are able to see what she is writing, but it is absorbed in fragments as the shakiness of the scene emphasizes the title segments being written. Once the woman is out of the frame, and is still on the title. we're able to view the complete title in one chunk and connect the context of the film.Having this period of stillness emphasizes the importance of what was written and that the author wants the viewers to read what was written/drawn. Though the jumpy movements of the stop-motion helps to emphasize the movement of the woman, and the creation of text she is putting onto the notepad. All-in-all I feel that this is an effective method in emphasizing particular points of a scene. 
3: The soundtrack to this clip has this dramatic enforcement tone to it. I didn't feel that it emphasized any particular moment because it was a repeated beat, plus the sounds didn't match up with any of the visual actions. 


ORGANIZATION:
IMAGES: 1- "Fist & American Flag", this image signifies our determination as a nation, and our voice in maintaining the American dream. 2-"woman painting" depicting a middle-aged woman painting an explosively colorful image, with text saying 'We ___ can dream', which is part of the American ideology of achieving your dreams. 3- "Modern Barn" represents the past American ideology which has been lost/buried in the snow of capitalism. Our dream of opportunity has been lost in the snow and frozen in the past. 4-"Feet with Bar-code", we have been branded consumers and by-products of modern American capitalism. 5-"Wedding Cake  Topper", much like the American dream, the concept of marriage has evolved over the years. Modern marriage as a laundry list of benefits and qualifications which may prevent some from this dream.
2- When rearranging the images, I was able to create an opposing argument to the one created. Moving bar-code to first position, woman painting to second, modern barn still a third, fist & flag fourth, and wedding cake topper last. I feel that I would have to choose a few different images to make a coherent argument.
3- Text would strongly reinforce my slide show argument. It would bring clarity to the context of the image order and argument. Adding music will hinder on which argument I go with. the music would have to be more of an ambient application to in order to retain focus on the argument. 


PROXIMITY: 
1- For my book cover, I placed the two seagull images centered, the title and subscript close together, with former on top and latter on bottom. At the bottom of the title page I placed the title page. 
2- The book title is the most important information on the cover. To emphasize this, I chose a large size and nautical looking typeface to convey this is as an academic book. My covers layout textually and visually relays information about the context of the book.  I feel the organization as enough information, while at the same time is not to cluttered. 
3- Some of the limitations I ran into in designing this cover (with the default items) is shading, transparency of text or images, and variety of text available. There really isn't any other way I would organize the information on a book cover, that I can think of at the moment. 

Sunday, August 28, 2011

Analyzing Multimodal Projects (WWU)

   Fig. 2.5 Repsonse:
  XKCD's comic college campus lists of "things people go to the site looking for" is near accurate. Having gone through the rings searching and applying to four-year Universities, I had a similar checklist of items when looking at a University's site page. What I came to notice is that much like the army web page, university web pages had a clutter of flare, be it pictures of students chatting in the halls, engaging in fun activities/ interacting with faculty or a story of past accomplishments. It was sometimes difficult to just find a link to the university's department/ course list on some sites or student aid page to find out if this institution is for me, and is affordable. Given the audience the University's are trying to attract, they seem to have this assumption (based on their web-page) that incoming students are attracted by the more flashy, well-known institutions. When in most cases the student is looking for the infrastructure of the university, though the name of the school does have a big influence on the choice.

    Dissecting Western Washington University's web-page:
  Western Washington University has to have one of the most user friendly webpage. It address's information in a clear and aesthetically pleasing manner for both future and current students. WWU's webpage loosely follows the patterns listed in the XKCD comic. It is visually organized and not to chaotic, in the sense that the majority of the page is filled with text. Having placed a single still image in the center helps to segment the texts and links on the page. The author of WWU's page has addressed the needs of any, if not all, possible audiences. There are clearly labeled sections for jobs at Western, applications, financial aid calculators, events, and much more. From an initial glance at this page we can extrude that the purpose of this page is to inform any audience member, while retaining a strong emphasis towards student and faculty members. I feel that WWU was able to include everything on the XKCD comic list into one page, and make it work without being to cluttered. Visually the author spent time in orienting the information in a manner that can be easily read and used. My overall take on Western Washington University's webpage is able to dissolve the web designs "competition with the site's purpose and the audience's genre expectations"(CH 2).

Wednesday, August 24, 2011

5 structures of multimodality & its relation to multimedia

   Multimedia and multimodal are two differing functions in the purpose(s) of relaying information. Multimodal is the various combinations of modes (form of communication) to convey or produce a particular message. We use multimedia such as: television, radio, newsprint/magazines, internet and phones to spread these modalities. Linguistics, visuals, aural, spatial, and gestural are the five modes.

   Linguistic Mode Response:
This message comes across sincere and uplifting, "our thoughts and our prayers..." enforces the ending statement concerning the rebuild and recovery of Japan. Though at first read, the statement seemed insincere and that without the direction of our president America would be unable to lend assistance to Japan. The overall tone of the statement is comforting and portrays Americas willingness to aid Japan in anyway.
   
 Visual Mode Response:
  Color and profile pictures are two visual differences I notice between the profiles. I can't really understand the person going off the profile color choice, though judging by the profile pictures I feel that Fig 1.4 is more personalized than Fig. 1.3's, which has a more basic and general visual look. We have a partial mug shot of the person we can assume manages the profile in fig. 1.3. Whereas we have a panda toon image for fig. 1.4's profile. In addition, when looking at the text, it appears that Fig. 1.4's profile has a more personal use, and Fig. 1.3 is used for academic purposes. As of right now, I currently don't have a twitter account.
 
   Aural Mode Response:
In the creative commons advertisement, there were musical and vocal aural elements. The music became ambient to the vocal message, and had this soothing zen affect which was broken up once in awhile by bass beats. This ad had an abstract and current tone emphasized by the aural elements. the speaker sounds like a fellow student or partner, emitting this sense of teamwork and togetherness. Bluegrass or country wouldn't fit with this mode, both tend to have a depressing tone.
 
 Spatial Mode Response:
  Washington State's homepage seems dominated by a circulating picture band located at the center of the page. Each image frame consist of subjects that are easily identifiable yet don't get in the way.  I feel this site deters viewers from the smaller text bar below the picture, as well as smaller text links and search bar located above. After some tinkering with the home page the person may find out that you can click on the alternating images to unravel more links and information regarding the three key subjects: Learning, research, and community. Without further play of the homepage, I feel the arrangement could be fine tuned better so that the viewer doesn't need to discover that the center pics fold out to provide more info. Though it was a cool way to consolidate the information, I felt if the center images and content were expanded, the site would be much better. Also, if the content on the bottom were switched with that above it, there would be a better flow of information as we see smaller text and gradually scroll down to the larger.


 Gestural Mode Response:
  President Obama's gestures aid his speech, in that it helps to emphasize key points and topics. These gestures help in identifying these key issues in such when does a downward fist-point, he's making the associated words big and bold. When he does his double open handed motion it seems to relate with an action such as coming together or moving forward. I feel this helps to visualize what the president is addressing. Plus it works much like a conductor and helps the speaker and the viewer/audience hear and retain the tempo of the speech/message.