Jump to site menu

Web Unit Workshop

Work to have done: a solid attempt at a complete website, ideally meeting baseline criteria. Rough edges are still welcome.

Plan for the day:

  1. Workflow tweaks: still Describe -> Evaluate -> Suggest, but a wrinkle (5 min)
  2. Evaluation reminder: our shared criteria (5 min)
  3. Peer review workshop (3 times 10-12 min)
  4. Evaluation revisited (10 min)
  5. HW preview
  6. EXT: Studio

#ThingsIShouldHaveToldYou

Your homepage should probably be called something like index.html (or index.md) for it to load automatically at the root directory of your website URL. If you're getting a 404 error when you open the root URL of your project, that might be the reason.

Workflow Tweaks

As you remember from the sound and image units, I encourage you to always start by describing the piece, before judging what’s good about it, so the creator knows whether you’re on the same page. (Which is itself important feedback: is my message getting through.)

For this unit, in which display is a separate – and often challenging – concern, I'm going to ask you to use a two-step description.
  1. First look at the HTML files, and say back what you see there. What seem to be the major content areas? What's given top-level focus? (e.g. what kind of thing gets its own page, or what's at <h1> status within a page?) What's next in the hierarchy?
  2. Once you've done that, turn to the browser and repeat the process for the display. What's given visual weight? What falls "above the fold"? Where are you invited to go next?

From there, you can continue on to evaluation, using the shared criteria we developed on Thursday – and also the correspondence between the hierarchy you observed in the HTML and the hierarchy you observed in the rendered site.

Finally, in your suggestions, some revision possibility that you think might help take the project to the next level: assume this is a work in progress. Given the goals, the focus, the criteria, what might be next?

2. Evaluation reminder: our criteria (5 min)

We set up a few shared goals and constraints bit.ly/cdm2019fall-criteria to meet the baseline requirements. Let’s try to help everyone get at least to there!

3. Peer Review Workshop (3 times 10-12 min)

Let’s do this!

Before you leave your seat,
  1. load up your Atom project folder*,
  2. load your home page in a browser (preferably Firefox or Chrome), and
  3. label three index cards For: {yourname}.

* NB: if your site is dynamically generated from lots of files, e.g. with Jekyll or Flask, you may (also) want to open a View Source window in the browser to show the rendered HTML.

Then…

Go four seats clockwise around the room, hopefully arriving somewhere you haven't yet been for workshop. Label one index card From: {yourname}. View / read through the project fully at least once, then
  1. Describe what you see – first in the HTML, then in the browser –
  2. Evaluate where it meets or misses the criteria,
  3. and
  4. Suggest ways to meet and exceed the criteria!

I’ll keep track of time.

On subsequent loops, note that after viewing the project first, you may also want to read and/or refer to the previous index cards.

4. Evaluation revisited (10 min)

Head back to your seats and take a minute to read and photograph the notes you’ve received. (Make sure your photos are legible; I’ll be collecting the cards at the end of class.)

Based on your viewing, would anyone like to propose changes to the baseline criteria, or new aspirational goals to consider?

Homework for Next Time

  • Even as we zoom in toward the unit finale (again), I want to keep one eye open toward the bigger picture (again!). At this point, we have a number of great ideas for group projects:
    • Collaborative soundscape narrative / podcast / radio show, perhaps traversing existing soundscape narratives
    • Art of Foley (adding sounds to video - maybe one of these)
    • “Reverse-Foley” (visually animating, or filming, a soundscape)
    • Digital stop-motion / flip-book animation (several tools available)
    • Animated or text-based game (perhaps using Twine)
    • Visual programming (probably in Scratch)
    • UI/UX design in Adobe Suite (talk to Margaret about this one!)
  • Skim through any links above that seem intriguing, and if something strikes you, post a proposal to try to recruit partners. As before, there is no minimum length for these posts.

  • Next class will be a web designers’ studio: optionally bring headphones for sonic isolation, and whatever else you need to work towards finalizing your website portfolio.
    • The final draft is due at the end of the day on Sunday, and a reflection by class-time on Tuesday; see the prompt for further details.

EXT:

If any time remains, go ahead and get started on those revisions!