Skip to content

Resources

Between two flames, the old man who offered Link advice in The Legend of Zelda (Miyamoto et al 1987)

Services at Pitt

DMAP site
The English department maintains a Digital Media And Pedagogy site with a number of useful resources, including recording equipment you can check out, easy-to-reserve office hours with either a grad student or faculty digital media consultant, and a way to reserve the DMAP studio (CL 463) for up to eight people.
Pitt Writing Center
Though not every consultant will have experience in multimodal composing or digital media, some will; but more importantly, the Writing Center's emphases on process-oriented reflection and rhetorical thinking makes every consultant a useful sounding board for your projects. It's a good idea to plan for your visit and to make an appointment before you go.

Help with Git and GitHub

ohshitgit.com
We can pretend that the three words in that URL all have three letters, but let's face it: there are times when even experienced users of git feel that something has gone terribly wrong. This is a great resource of quick command-line fixes for common problems, compiled by someone who feels your pain.
Free private repositories
GitHub defaults to making repositories public, and ordinarily you would have to buy a paid account to keep your projects private. But if you have a .edu email account, you can request a discount that lets you get unlimited private repositories for free. Click the link to find out more.

Free and Licensed Images, Music, and Other Assets

search.creativecommons.org
A portal for searching multiple sites that have built-in CC licensing, including flickr, jamendo, and ccmixter
Font Squirrel
Fonts that are free for personal and commercial uses, making them especially handy for advertising campaigns and the like.
The site also includes some useful educational resources for learning more about font history and font selection.
The Noun Project
A liberally licensed icon sets aiming to create "icons for everything," though as the name suggests, they specialize in things, rather than actions. If you realize you don't want all the detail of a photo when a simple line drawing would get the idea across, try searching their million-plus collection.
Unsplash
I just found out about this one at the start of the semester, and I'm pretty excited: it's a collection of high-res, large-scale images that are free for personal and commercial uses; they may be especially useful for splashy website headers.
Adobe Color CC
Paletton
Color-Hex
Tools for color selection, for when you want to find a palette of complementary tones, or just to find the hex codes along an axis of saturation or intensity.
Freesound
As they put it in their FAQ, "Freesound aims to create a huge collaborative database of audio snippets, samples, recordings, bleeps, ... released under Creative Commons licenses that allow their reuse." Note that this won't have music as such; it's more for incidentals.
CCMixter
SoundCloud
Jamendo
Three sites where you can find music with open licenses for remix. Each has its own community and search interface; I've had some success using CCMixter's tag search feature. Pay attention to the licenses for the specific tracks you want: some have the non-commercial Creative Commons license, and some are licensed only to listen to, especially on SoundCloud, where a lot of professional recording artists post to build buzz. If you're planning on doing any cutting or distorting, look for something you can modify (which includes CC-BY or CC-BY-NC).

Unit-Specific Resources

This section will expand as we move forward; feel free to suggest others that you come across!

Visual

Under the assets listings above, you might find FontSquirrel and The Noun Project especially pertinent here.

GIMP Tutorials
You can find quite a few intro-level tutorials on the GIMP site itself, at www.gimp.org/tutorials, including "GIMP Quickies" and a tutorial on layer manipulation called "Simple Floating Logo."
Examples of Static Visual Appeals
Thinker/Thought, a collection of academic infographics by Nathaniel Rivers. In addition to being useful for how he handles design elements, quotation, and citation, some of the content deals with ideas on multimedia composing and rhetoric.

Audio

Under the assets listings above, you might find FreeSound, CCMixter, SoundCloud, and Jamendo especially pertinent. See also the section on file compression, below.

Audacity Wiki
As with GIMP, members of the community that created the tool have contributed their own tips and tricks; in this case, it comes in the form of a minimally styled wiki. I find it not always as clear as I might like, but many of my initial searches led here, regardless, so it's worth familiarizing yourself with the sections. I do recommend at least starting with their Audacity Tour Guide, and the documentation on how to properly install Audacity and add mp3 export is essential.
10 Tips for How to Keep Audacity from Crashing
The title says it all. I haven't had problems, but if you start to, have a look here.
Examples of Soundwriting
There is kind of a glut of good radio out there, especially in the form of podcasts produced by NPR (National Public Radio) or PRX (Public Radio Exchange). You can look for something in the same genre as the piece you want to re-mediate.
I'll assign a few of my favorites over the next week or two.
Also, Courtney Danforth, a professor at the College of Southern Nevada and a prominent voice in favor of soundwriting in composition, has compiled a list of her favorite sound essays and audio stories as part of her three-page handout on Getting Started with Soundwriting.
Ira Glass's composing process
Glass, in case you haven't heard of him yet, is the host of This American Life, one of those much-beloved NPR podcasts I mentioned above. He's been called upon, on a number of occasions, to talk about how he makes the show work. Here he is holding forth on the basic building blocks of storytelling for broadcast.
And here's a longer lecture on "making better radio," punctuated with examples, that he gave back in 1998 (many of the principles – and critiques – still hold).
This may be less relevant for this particular assignment, but I was searching the web for a recording of Ira Glass talking about This American Life and how to write stories for the radio, but instead I found an interview-in-writing – for LifeHacker, of all things – in which he answers the question, "What everyday thing are you better at than everyone else? What’s your secret?" with a really great and concise rendering of how he takes hours of tape and condenses them into a story. So if you've got too much textual material for your audio remediation, and you're not sure how to render it down, click the link above and search for that question.
On minding P's and S's
One of the more common challenges of recording speech is that sibilants (s sounds) and plosives (especially p sounds) tend to pop out in stark contrast to the sounds around them. Some of the extended early readings in the unit talk about ways to fix this when first recording, but there are also lots of tutorials out there describing Audacity tricks for filtering them out once they're in the mix.

Collective feedback on the audio unit, including a couple more tips and tricks, is included in lesson 12.

Web Design

Under the assets listings above, you might find Unsplash especially useful here (for banner images), as well as FontSquirrel (check the web licenses) and The Noun Project (for icons).

internetingishard.com/html-and-css
Your one-stop shop for learning basic web architecture from the ground up. I'll assign this for homework.
Web Design in 4 Minutes
We walked through this demo on the first day of the unit; if you're at a loss for what to include in your stylesheet, you can do far worse than adding the basic spacing rules Jeremy Thomas sets up here.
How CSS Selectors Work (CSS-Tricks)
This could be a very useful follow-up to the Interneting is Hard tutorial, or perhaps just a handy reference for some of the more common "advanced" CSS selectors. It starts from basic ways of matching style rules to html elements, and then proceeds to discuss what happens when multiple rules apply to the same element – which rule "wins," or supersedes the other. To sum up, it's not simply which one comes last in the *.css file (though that also matters): in general, the more narrowly defined rule will still override a more broadly defined one. Read on for more details.
Also, it's worth saying that many of my Google searches for solutions to CSS problems lead me here, so I figured I'd point it out early and reassure you that it's legit. Some very clear explanations not only of what to do, but why it works – and, often, alternative approaches to the same challenges.
htmlreference.io
cssreference.io
There are a *lot* of html elements and CSS attributes that you'll find in your travels through the web. As with book literacy, you'll pick up the vocabulary mostly by encountering them in the world, on websites, not by starting with a dictionary. But when you do find them, you'll want a good dictionary where you can look them up and learn more about how they're supposed to work. These are pretty well organized, and (unlike some of the "official" documentation) give usually you visual examples of what the elements and rules mean and do. And when you do want that official documentation, you can find it by clicking on the "MDN" link at the top right of any definition page.
templated.co
html5up.net
There are a lot of websites that offer collections of free website themes and templates. These are two of my favorite sources for starting up static sites with built-in semantic html5 and responsive css.
Bootstrap CSS Framework
and other CSS libraries
Once you're clear on what a CSS class is, and how to add it to an HTML element, you can pretty much work from scratch designing your own CSS rules and building from there. But sometimes it helps to have a leg up, and that's where libraries come in: with a single line in the `` element of your web page, you can import a whole slew of pre-made CSS rules (and even some related JavaScript actions), so that you can just start adding them to your html. It's a little like Lego for web design, only free.

Bootstrap is one of the most popular CSS libraries right now – I guarantee you've seen more than one website that uses it – and it's got enviably clear documentation for specific classes. One of the key advantages is that Bootstrap divs can split the page into a convenient grid for you, and they can automatically resize responsively for different screens. The latest version, Bootstrap 4, is is now much better at aligning and centering things along vertical axes, as well as horizontal; the tradeoff is that it's still in beta release, which means it has a few bugs. You can still use the more stable Bootstrap 3 if you prefer.

Optimizing Images for Website Performance
You can find some beautiful free images out there, at very high resolution – and your own digital camera (even the one on your phone) probably defaults to a ridiculously high number of pixels, too. All those pixels come at a cost. If you find that your site is loading slowly, and especially if you see the images appear with some lag behind the text, you may want to scale down.
Luckily, you have a tool that can help you do it: GIMP! Check the link above for some tips on pixel counts, resolutions (pixels per inch), and jpeg compression quality.
WebFont Generator, by FontSquirrel
When you find a good font, before you can use it on the web it has to be formatted for browsers to render properly. Some fonts on your favorite font sites will already have webfont versions. If they don't, as Gabi demonstrated in class, you can convert them to web-ready fonts using this tool. Just make sure you have permission to do so, okay?

Collaboration

GitHub Features for Collaboration
GitHub is really designed as a social platform built around git, and what I mean by that is that a lot of its features are designed to encourage and support collaborations among groups. One relatively recent and cool tool is the Project board. Check out this features list if you get a chance: https://github.com/features/project-management.

One of the first links will take you to the excellent introduction to Mastering Issues, which is also worth the 10 minutes if you haven't used issues before. (Basically, it's a discussion board with version-control bonus features.)

I've also set up a little artificial demo if you want to play around with any of this non-committally.

File Compression

If you're having trouble uploading large files to GitHub or through email, you can try compressing the files. But while most computers come with built-in compression algorithms, they tend not to be very good. Luckily, there are several excellent and free applications that will happily shrink your file sizes. Here are some 2017 roundups:

Other Resource Roundups

Especially in the realm of digital production, there's no need to reinvent the wheel; just as there are many excellent tutorials and sites on which to locate assets, there are many excellent lists of such tutorials and sites. Here are a few to draw on:

  • Noel Tague's bag of tricks is quite extensive, and includes sections on fair use, on archives of materials you can use or cite, on strategies for working with audio and video, and links to free / open source software.
  • Annette Vee's CDM resources page includes guidance on GitHub and Markdown (a widely used shorthand for HTML, with a bunch of variants a.k.a. "flavors").
  • Courtney Danforth has a full three pages of resources on Getting Started with Soundwriting that I expect will be useful in the audio unit.

As the semester goes on, we can identify our own list of favorites!

2 thoughts on “Resources

  1. benmiller314

    Something I thought I knew how to do, but was wrong about, and now know how to do, is move multiple layers at once. Turns out, that's what the little chain symbol in the layer menu means: it locks layers to each other (rather than, say, preventing the layer from being changed). Thanks, 'Tutorials with GS'!

    Reply
  2. benmiller314

    GIMP: Hide all layers except the current one: apparently, it's as easy as holding shift while you click the visibility eye. Thanks, Ahmed Amayem, for your tutorial!

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

css.php