Cover Letter for Hypertext Project

Here’s the link to my first Hypertext Website Project

Topic and Purpose of Website

My first website is a prototype for a hypothetical first-year composition class called Practical Writing. I envision this class as a useful addition to a Community College two-year technical or associate degree program where good written communication skills rather than academic writing are stressed. My audience is the approximately fifty percent of Community College students, according to CollegeBoard.org who do not plan to transfer to a four-year college, but still need good, transferable writing skills.   I also plan to use many of the design ideas I learned during this process to create an actual class website for an independent study I’ll be doing this summer.

Design and Development Process (C.R.A.P.)

I love color, and lots of it. This, in combination with a naturally eclectic design sense, was bound to lead to many hours of site editing.  I realized that I had crossed the line of good design practices when, prior to reading the C.R.A.P. articles (even though I had removed my brightly colored home page image), I received the following comments from my fellow classmates; “Even though the color scheme is one you don’t see often (black/red & blue/yellow), it works surprisingly well.”  Another classmate wrote, “The red on you project is very bold.” I took these suggestions as kindly hedged constructive criticisms, and scrapped my original brightly colored Home page image for a more “subtle” bright red on white image. Now my Home Page had a huge amount of white space for contrast, but it wasn’t an audience grabber. So, after weeks of playing with the new image, I switched it back to my original choice; I’m happy I did too.  I chose to create contrast on my homepage by using color mainly as a frame around large areas of white space. I think my choice of bright contrast exudes energy, creativity, and warmth― just the feeling I want for my class. I like how the bright image draws attention to the count-down calendar gadget too. I realized that color could be overwhelming though if it distracted from my focal points, so I opted for changing most of my script to black, using font size and bold lettering to draw attention where needed.  In my sidebar, I used a dark shade of gray for the text so as not to compete with the black text of my page content, and I kept a touch of red too.  Another eye-catching move I made was to use the turquoise color of my background for all my hyperlinks. All title fonts on the site are Verdana (except for the main site font which is Asset), and all text font is Trebuchet.

The page I had the most trouble with was the Assignment page. There was a lot of information that I wanted to appear here. One classmate confirmed what I already suspected, that “on [my] “Assignments” page, some of the assignment titles are gray and are the links, while the ones that are not links are black. Visually, it is distracting.” Another classmate mentioned “that the font size on the Assignments page is a bit large to read and is inconsistent with the rest of the site.” I really cleaned up this page (and standardized the fonts overall on the site). I used a simple image of a blank notebook, a small font size for the text, red and bold for the main instructions, gray for all assignments, and underline for all links, which created the proper hierarchy of the information and assignments, as well as providing good repetition of design element with the other pages. I used a line to separate each assignment. Only the first two links are operable at this time.

The Instructor’s Page uses my photo to connect (proximity) the two personal aspects of this page together; How to Contact Me and About Me(Do you like how I went all the way to France with my turquoise shirt just to create repetition of color on my website?) This page also serves another practical purpose. Students will also use this page to make appointments with me for conferences on a shared calendar (not the one that’s there now). This is the only page where I used a totally different font (Normal in italics) to make a special point― to mind my privacy when calling my home phone.

The Class Newsletter page is a template for a monthly student-edited project utilizing peer-review as its means of success.  Students will write original newspaper-style articles, ads, haikus, and profiles of people in the news here on a rotating basis as part of their course grade.  I hope that this newsletter would work entirely as a peer reviewed project. I aligned the image slightly outside the page boundary to suggest its impermanence as part of the Class Newsletter page.

The Student Page contains a limited amount of pertinent resources to ensure success in the course. My rational is that students will be more likely to use resources if there are only a few of them.  Because of the limited amount of text on the page, I experimented with an asymmetrical balance layout that I learned in Basics of Design: layout & typography for beginners to create flow around the page.  Rather than use a stock image on this page, I used a Wordle of the information on the page. Wordles might be a fun resource for students to use as a way of drawing important points from class readings.  This, for instance, is a Wordle of the first portion of the article “Augmenting Human Intellect: A Conceptual Framework” by Douglas Engelbart from our class textbook.

Wordle: Untitled

Habits of Mind, one of the subpages to the Student Page, is just the draft from the WPA Council. Ideally, this page will be constructed to link out to explanations and resources for specific habits of mind that are pertinent to the student. The class syllabus is the second subpage of the Student Page. Rather than make this a primary page, I note at the top of the page that any changes to the syllabus will be in the Announcements section of the Home Page.

Learning Process

        I began the learning process for this project feeling very insecure and by taking notes on various tutorials.

In the end though, I dove in, made mistakes, resolved numerous hopelessly unorganized elements, and emerged with an acceptable, finished product. Oddly enough, the finished product looks nothing like I wrote about in my first blog about the project.  My “calming colors” evolved into a blaze of vibrancy. My audience changed too, from “undergraduate writing students learning about multimedia text construction” to community college non-transfer students learning practical written communication skills. What I learned is that I’m by nature a changeable (flexible), persistent, and independent person. These characteristics generally serve me well, but they often lead me to take a rougher road than necessary and that sometimes leads me to dead ends. In the future, I will benefit from taking a more systematic approach, fleshing out my outline better, and referring back to the many things I learned this time around. I would like to learn how to lay out grids more effectively to “both divide and unite the page” (Austin and Doust 65).

Scholarly Discussion

Various authors describe and expand on the C.R.A.P. guidelines. New Media Design expands on these guidelines by adding sound and movement to the design process while “[relying] on rules to create a sense of the whole” (Austin and Doust 71). I reflected that self-discipline, structure, or the inevitability of following the rules, is something that evolves as knowledge and experience is acquired and broadened. After some initial wild scurrying about my fragmented site, I started following new rules that create structure in hypertext and found, like Douglas Engelbart, in his article “Augmenting Human Intellect: A Conceptual Framework,” that “when I learned to work with the structures and manipulation processes . . . that I got rather impatient if I had to go back to dealing with . . . books and journals, or other ordinary means of communicating” (Wardrip-Fruin and Montfort 107). My messy process eventually coalesced from a learning experience for me to a product that could contribute to the learning of others (which was Englebart’s goal too). When Theodor H. Nelson broke down the writing process, he translated the needs of writers into a structure too. That structure allowed for movement and “various provisions for change” into “any form and arrangement desired” (137).

Bibliographic Information for Site Links and Learning Resources

Austin, Tricia, and Richard Doust. New Media Design. London: Laurence King, 2004. Print.

Council of Writing Program Administrators (CWPA), National Council of Teachers of English(NCTE), & National Writing Project (NWP). (2011). Framework for success in postsecondary writing. Retrieved from http://wpacouncil.org/framework

Darling, Dr. Charles. Darling’s Guide to Grammar and Writing. Capital Community College Foundation. Web. 11 April 2012. http://grammar.ccc.commnet.edu/grammar/

Graham, Lisa. Basics of Design: layout and typography for beginners. 2nd ed. London: Cengage, 2005. Print.

Old Dominion University’s Academic Skills Unit- http://uc.odu.edu/academicskills/

Old Dominion University’s Perry Library-http://www.lib.odu.edu/

Steves, Rick.Rick Steves: Europe through the Back Door. N.p., Web.11 April 2012.             http://www.ricksteves.com/

Tidewater Striders Running Club.  http://tidewaterstriders.com/

Wardrip-Fruin, Noah and Nick Montfort, eds. The New Media Reader. Cambridge: MIT Press, 2003. Print.

Engelbart, Douglas. “Augmenting Human Intellect: A Conceptual Framework.” Wardrip-Fruin and Montfort 95-108.

Nelson, Theodor H. “A File Structure for the Complex, the Changing, and the Indeterminate.” Wardrip- Fruin and Montfort 134-145.

Wordle “word clouds”.  http://www.wordle.net/

Return to Table of Contents   

       

Advertisements

Posted on April 30, 2012, in ENGL 539 and tagged . Bookmark the permalink. Leave a comment.

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: