Documentation

Tips for documenting your creative and technical work

slides | md

Contents

1. Introduction
2. About
3. Capture everything
4. Start a Google Doc
5. Screenshots and videos
6. How to make a screenshot 5 min
7. Source code
8. Collect it all
9. Edit a video
10. White paper

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

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:

How to make a screencast

Capturing videos of your screen

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:

/**
 * 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:

• Purdue OWL White Paper: Purpose and Audience
• How to Write White Papers People Actually Want to Read
• 8 Basic Tips for Writing an Amazing White Paper

White paper examples

Artistic / Cultural

• Jonathan Harris and Sep Kamvar, We Feel Fine and Searching the Emotional Web, 2005
• Julian Oliver The Transparency Grenade, 2012

Commercial

• Google The Arrival of Real-Time Bidding and What it Means for Media Buyers
• ExactFlat Accurate 3D to 2D Flattening
• QRA How to Eliminate Over Half of All Design Errors Before they Occur