Warning: This is an archived course website that is part of my teaching portfolio, so some links may no longer work. Please contact me with any questions about this site.

Unit #3: Client Project

Due Date: Monday, December 17, 11:05 a.m.

Submission Name: URL for live (or prototype) site, plus shared Dropbox folder containing all of your team’s project materials

Your final assignment in ENGL 4814 calls for you to develop (or redevelop) a website for a real client. Clients may include employers, nonprofit groups, and campus organizations, but the client must need a website and be willing to participate in the project before the end of the semester. Your work for the client should demonstrate your abilities as a writer, a coder, an information architect, and a usability specialist. Each of you will work with a small group of your classmates (preferably 2–4 people total).

Assignment Guidelines

Because each project will be unique, your work for this assignment will be governed by a memorandum of understanding between you, me, and your client. In your MOU, you should propose a plan that will govern your work for the remainder of the course. Once you have identified a client and assembled a team, you should create a copy of the MOU template and begin drafting your proposal.

One of the primary objectives of this assignment is to learn how to work with clients, so you will need to maintain regular contact with your client throughout the project. Checking in with your client (in person, on the phone, or via email) at least weekly will ensure that you stay on track and meet your client’s expectations. Your final project folder should contain evidence of this collaborative, iterative design process, including wireframes, draft text, prototypes, client feedback, etc. (Tip: Save everything related to this project!)

Depending on your client’s needs, you may focus most heavily on writing, design, content management, social media, etc… Whatever the case, your work should be commensurate with an eight-week project and should reflect well on yourself and on Virginia Tech.

Deliverables

The primary deliverable for this assignment will be the finished client site, which should be live on the web or ready to go live pending your client’s approval.

In addition, your project should be accompanied by a two-page memo of transmittal (single spaced, using memo format) that explains and justifies the choices your team made over the course of the project. Your memo should contain the URL for your finished site and should address issues of audience, content, and purpose, as well as more technical topics, such as markup, color, typography, usability, etc. Your memo should also address any problems you encountered during this project and discuss what you might do differently if you had more time, different software, greater expertise, etc.

Your project will almost certainly include additional deliverables, such as evidence of client feedback, drafts of web content, and screenshots of early prototypes. Your MOU should include a full list of the specific deliverables you intend to produce for your project.

Assignment Checkpoints

To help you stay on schedule, I will meet regularly with each team and will collect draft components of your project on the following dates:

  • October 29: Memorandum of understanding, signed by client and all members of your team.
  • November 7: Wireframes/mockups of your proposed site.
  • November 16: First rough draft of the site.
  • November 28: Protocol for usability tests.
  • December 5: Usability test results.
  • December 12: Second full draft of the site, with client feedback.

Submitting Your Project

Your project is due at the beginning of our final exam, on Monday, December 17, at 10:05 a.m. Please bring a copy of your memo of transmittal (described above, under the “Deliverables” subheading) and your individually completed Team Evaluation Forms to the final. To submit any additional materials (usability results, wireframes, screenshots of early drafts, client feedback, or anything else listed in your team’s MOU), please create a single Dropbox folder titled “ENGL 4814 Team # Unit 3,” place all of your project materials in the folder, and share the folder with email hidden; JavaScript is required before you come to the final.

Evaluation Criteria

Like everything else related to this assignment, the criteria I will use to evaluate your project are negotiable and will be finalized in your MOU. As you draft your evaluation criteria, you may want to draw upon these examples:

  • Audience: What primary or secondary audiences does your client need or want to address in establishing a presence on the web? Have you anticipated the information needs of these audiences and does your site fulfill these needs? Who are these people and how can you draw them into your client’s website?
  • Information Architecture: Does the site you created reflect the information needs of the audiences you identified above? Does the site have an organizational scheme that is used consistently throughout the site?
  • Longevity: Is the site structured and coded in such a way that your client will be able to maintain the site without coming to you for help? Have you provided documentation to your client that explains how to maintain the site?
  • Visual Design: Is the site visually appealing? Does the site employ best practices in design, color, and typography?
  • Usability: Is the site easy to navigate? How quickly would first-time visitors be able to find the information they are looking for?
  • HTML/CSS Markup: Does your markup conform to current standards, and if not, why have you deviated from these standards? Have you tested your site on a variety of browsers running on a variety of machine configurations to ensure no one in your intended audience is excluded from viewing the site because of the markup you have used? Does the site pass the W3C Validator tests?
  • Memo of transmittal: Does the memo clearly and persuasively explain your work on this project and justify the decisions that you made? Does it adhere to the standards of professional written English (spelling, grammar, punctuation, etc.)?
Where am I?
This is the class website for English 4814: Writing for the Web, taught by Quinn Warnick at Virginia Tech in fall 2012.
Worthwhile Reading
The links below are the most recent additions to my collection of bookmarks that are relevant to this course. You can find a complete list of ENGL 4814 bookmarks on Pinboard.

  • CodePen
    Awesome browser-based tool for experimenting with HTML, CSS, and Javascript.
  • What Constitutes Good and Bad Web Design?
    NY Times: "Shoddy Web site design is a curse of modern life. The more dependent we have become on the Internet for information, the likelier we are to suffer from its design deficiencies. Bad design can be infuriating, inconvenient or damaging in any field. But it is especially frustrating in areas like this where many of us find the technology so inscrutable that we tend to blame ourselves for being baffled, because we feel unable to judge whether the design is at fault."
  • wireframe.cc
    Free, minimalist wireframing tool, with templates for desktop, tablet, and phone.
  • Yes, learn basic programming
    Derek Sivers thinks everyone should learn HTML, CSS, and Javascript: "If you heard someone say, 'I have this idea for a song. But I’m not musical, so I need to find someone who will write, perform, and record it for me.' - you’d probably advise them to just take some time to sit down with a guitar or piano and learn enough to turn their ideas into reality."
  • CSS Floats 101
    Another great article from Noah Stokes in A List Apart. This one focuses specifically on one of the trickiest parts of CSS for beginners to master: the float property.
  • CSS Positioning 101
    Noah Stokes's A List Apart article is a great starting point for getting better at CSS positioning. Complete with several examples.
  • Modular Scale
    Handy tool for improving typography on modern, responsive websites. (The linked articles on this page are important, too.)
  • Interactive Guide to Blog Typography
    Great tutorial for improving typography on any website, not just a blog.
  • The Basement
    Great photo essay by Cabel Sasser: "And eventually, you crawl behind a corner, and discover a bundle of conduit. Conduit for every major internet carrier you’ve ever heard of. Oh, right. You had almost forgotten. This building, this basement, is the major internet hub for the entire region."
  • Snow Fall: The Avalanche at Tunnel Creek
    Beautiful interface for this NY Times article. Perfect integration of video, images, and text.
  • Service Learning Survey
    Students: If you worked with a client from the VT Engage program, please take a few minutes to provide the program with some feedback about your experience.
  • SPOT Survey - Fall 2012
    Students: If you haven't completed the SPOT evaluation for this course, please do so during class on Wednesday. I take this feedback very seriously, and I use it to revise my classes each semester, so please be specific about the aspects of the course (and my teaching) that you found successful and unsuccessful.
  • Standards, not Prescriptions
    Nathan C. Ford: "For standardization to truly continue making the web a more stable place, we do not need more anticipatory specifications, we need solutions. Lots of them. Dumb ones, fat ones, smart ones, skinny ones. Let us embrace them all then watch them fight it out in the field. When the strongest emerge, we can adopt them into our specs and wait for the next batch of victors."
  • Into the vault: the operation to rescue Manhattan's drowned internet
    Dante D'Orazio, writing for the Verge: "Hurricane Sandy's storm surge flooded Verizon's downtown office, rendering miles of copper wiring useless."
  • Responsive Design Testing
    Great little tool for seeing what your website looks like at a variety of screen resolutions.
  • Having a Mobile Strategy is Like Having a Laptop Strategy 20 Years Ago
    John Steinberg: "I do not want to download your app. I just want to read the content on the mobile web and possibly share it if I’m engaged. The constant knee-jerk interstitialing of full-screen app download messages every time I load sites is beyond frustrating. Many site owners seems convinced that this frustration, which no doubt dampens the velocity and volume of content sharing, will convert in loyal downloading app users."
  • Google Data Centers
    Photos, video, and history of Google's physical facilities. Obviously one-sided, but interesting nonetheless.
  • Google Throws Open Doors to Its Top-Secret Data Center
    Steven Levy, in Wired: "This is what makes Google Google: its physical network, its thousands of fiber miles, and those many thousands of servers that, in aggregate, add up to the mother of all clouds."
  • Guidelines, Tools and Resources For Web Wireframing
    A nice list of resources about wireframing.
  • Save For Later
    Fascinating report on a Mozilla UX project by Brian Groudan: "All browsers support two functions: searching and revisiting. My research questions whether constructs like bookmarks really are the right model to support revisiting. I worked closely with Mozilla user experience researchers and designers to rethink how Firefox can better offer 'save for later' in the browser."