Documentation

Tips for documenting your creative and technical work

slides | md

Contents

Introduction

Review the following sections and perform the activities on your own or with your group.

Perform the task(s) when you see this 👉 emoji

Learning Objectives

Students who complete the following will be able to:

  • Explain why documentation is important
  • List methods for documenting one's work
  • Use different methods to show their creative process

About

  • You completed your project and turned it in. The last thing you want to do right now is think about it.
  • Six months later, you are in a job interview and someone asks to see examples of your work.
  • The problem is, you've slept since then, nothing is live anymore, and you didn't document it.

Capture everything

If you document your process from the outset, it will help:

  • Create the work, tracking progress from conception to completion.
  • Archive iterations, concepts, and successes and failures that you can reference later.
  • Tell the story of your project to parents, professors, peers, potential employers, grad schools, award committees, other academics, the world.

Continue reading for examples and tips...

Start a Google Doc

Collect documentation in a Google Doc and paste links, images, notes, etc. as you progress.

  • Research (articles, artworks, concepts) while developing the concept.
  • Methods (different mediums, practices, tools, etc.) you considered and tested.
  • Progress (insights, discoveries, interesting knowledge gained) towards your goal(s).
  • Versions distinct working examples of successive phases of your project?

Screenshots and videos

Add screenshots to your project folder as you progress through a project. The filenames will be ordered by date automatically.

Made with Giphy Capture

How to make a screenshot

You may already know the basic command for capturing a screenshot, but these can level-up your ability to capture stills on a computer:

Screenshot type Mac Windows [1]
Capture entire screen Cmd+Shift+3 Windows+PrtScn
Drag to select a portion of screen Cmd+Shift+4 Windows+Shift+S
Capture a single window Cmd+Shift+4+Space Alt+PrtScn
Cancel screenshot Esc (Escape) Esc (Escape)

How make videos of your screen

Name Cost Platform About
Open Screen free all Professional screen recordings with zoom effects, annotations, and backgrounds
Quicktime free Mac Choose File > New Screen Recording
Screenflow $129 Mac Amazing tool and editor. Can capture computer audio too.
Giphy Capture free all Create GIFs or MPGs of your screen
⚠️ Please don't record your screen with a phone camera.

Create a video

Videos are great for incorporating the whole story. For example, in both Immaterials: light painting WiFi and My little piece of Privacy, the videos:

  • Tell the story dramatically, with music, a story, and/or a narrator or text subtitles.
  • Combine text, footage of the object, game, or working interface, and screencasts of the command line.
  • Are published online for the world to see, share, or embed.

Source code

Sharing source code has never been more convenient:

  • Make it live on Github or in a Gist so that others can see and use it.
  • Attribute others (name, URL, etc.) in a comment preceding any code you borrowed.
  • Consider adding a CC or open source license to your repository so others might do the same.
/**
 * Convert Fahrenheit to Celsius:
 * Credit: W3Schools Javascript Examples
 * https://www.w3schools.com/js/js_examples.asp
 */
function toCelsius(f) {
	return (5/9) * (f-32);
}
console.log(`${toCelsius(77)}`);

Collect it all

Combine all of the above (the code, statements, screenshots/videos, images, flowcharts) into a single document, preferably that is online and you can share with others:

  • Edit multiple segments, text, and other documentation into a video
  • A Google Presentation or slide deck
  • A white paper (see next slide) published online as a PDF or web page

White paper

White papers offer a common format to document, discuss, and share research-based projects. In your document should:

  • Include a statement (800–1200 words) explaining the ideas behind your project.
  • Document your process with images, sketches, flowcharts, links to videos.

Suggestions for preparing such reports:

White paper examples

Artistic / Cultural

Commercial

Presentation comments ...