Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 17 additions & 17 deletions coding-best-practices-workshop.md
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
#Week 5 - Mar 17: Workshop 2
#Creative Coding Best Practices
# Week 5 - Mar 17: Workshop 2
# Creative Coding Best Practices

##Time management
## Time management

![](http://i.imgur.com/aQZHy.gif)

###Activity: time estimation
### Activity: time estimation
1. List out the technical tasks / todos you need to accomplish this week.
2. Break into subtasks and estimate time for each. How long do you think each subtask will take you? Be as honest as you can.
3. Time the subtasks as you complete them throughout the week.
Expand All @@ -17,20 +17,20 @@
Read the top voted answer with 8.9k votes by Michael Wolfe
* [Bocoup Blog: Time Estimation, Software, and Dinner](http://weblog.bocoup.com/time-estimation-software-and-dinner/)

##Version control
## Version control

* DIY -- copy the folder and rename with date. Save copies on different machines or clouds just in case!
* Github -- tutorial [here](https://github.com/risd-creative-programming/s14-creative-programming-projects/blob/master/exercise-github.md)

##Code organization
## Code organization

* **Name well** -- Make sure variable names reflect what they describe on screen, class/object names reflect what they are, and function names reflect what they do.
* **Comment** -- Describe what's going on in English your parents can understand. Go line-by-line in your code if you have to. The more self-explanatory your variable/function names, the simpler your comments can be. It may seem obvious to you at the moment, but if you come back to your code hours, days, weeks, years later, you will thank yourself!
* **DRY** -- Don’t Repeat Yourself. Make variables for number values or functions for blocks of repeated code so you can make a change without having to update 5 different spots.
* **Modularize** -- Organize your code into functions so your code is easier to read and you can turn functionality on/off more easily. When your project starts to get larger, split your code into multiple files instead of having one really long file.
* **Format** -- Format your code early and often, line up if blocks, for loops, and functions. This will help you (and anyone you ask for help) to see and understand what’s going on. (Cmd/ctrl+t in Processing will do it automatically for you!)

##Common errors
## Common errors

![](http://i1087.photobucket.com/albums/j475/viniciusmiro/Gifs/tumblr_lk84kyJbMz1qbghjc.gif)

Expand Down Expand Up @@ -62,18 +62,18 @@ __*"There are two hard things in computer science: cache invalidation, naming th

**Part 2**: Each person picks one error. Create a diagram / illustration of the error. Could be more conceptual… should not be code example. Show diagram to class, explain what the error is, how to detect it, etc. (~20 mins)

##Debugging strategies
## Debugging strategies

Parts adapted from Clay Shirky’s [A Brief Introduction to Debugging](https://docs.google.com/document/d/1ZekLDsbLpySJgFvYYtpYmWMEQ3kiUNW6fOt7BNmTHX8/edit).

###Prepare
### Prepare

+ Don’t panic. (Do take a deep breath.)
![](http://i.imgur.com/LH1LO.gif)
+ Take a snapshot. Don’t go backwards! Keep track of everything you try.
+ Write a message asking for help.

###Observe
### Observe

![](http://i.imgur.com/WIrUykX.gif)

Expand All @@ -84,7 +84,7 @@ Parts adapted from Clay Shirky’s [A Brief Introduction to Debugging](https://d
+ LMGTFY
+ Print -- Print out any and all values that might help you better understand what's going on. Label what you're printing using String concatenation.

###Change
### Change
+ Can you work from one end to the other?

![](http://31.media.tumblr.com/d844d7209d5a9b01c1e79cc6fddc3329/tumblr_ms3lhghLxK1ql5yr7o1_400.gif)
Expand All @@ -96,7 +96,7 @@ Parts adapted from Clay Shirky’s [A Brief Introduction to Debugging](https://d

![](http://imageshack.us/a/img189/6613/tumblrlp9vi5yi801qhjpk5.gif)

###Defend
### Defend
+ Premature Optimization Is The Root of All Evil
+ Only do one thing at a time.

Expand All @@ -107,14 +107,14 @@ Parts adapted from Clay Shirky’s [A Brief Introduction to Debugging](https://d
+ Take breaks -- sleeping on it or letting things process in your subconscious can help you arrive at an answer.
![](http://25.media.tumblr.com/tumblr_mb5xneXFLU1rpyjpco1_250.gif)

###Be social
### Be social
+ __Ask for help__ -- Don’t waste hours or days stuck on a problem. If you have tried all the above yourself and looked around online, ask for help. Places to ask include forums, IRC, mailing lists, classmates. See below for tips for asking for help.
![](http://assets0.ordienetworks.com/misc/tumblr_lzcnn2wIFe1qi0hnvo1_500.gif)
+ __Talk it out__ -- Find a friend and talk through your problem. They don’t necessarily need to completely understand your code. Sometimes just walking step by step through a problem can make you see a detail or solution you were overlooking.
+ [Rubber duck debugging](http://en.wikipedia.org/wiki/Rubber_duck_debugging)


##Asking for help
## Asking for help

![](https://31.media.tumblr.com/d586c5f898287597dc01facc77d7a8a4/tumblr_inline_mzjzs15gYy1qj3ir1.gif)

Expand All @@ -130,7 +130,7 @@ Parts adapted from Clay Shirky’s [A Brief Introduction to Debugging](https://d
* [How to ask questions the smart way](http://www.catb.org/esr/faqs/smart-questions.html)
* [Getting help on IRC](https://workaround.org/getting-help-on-irc)

##Activity: debug competition
## Activity: debug competition

**Part 1**: Break into teams of 2 (make sure each group has one person that knows Processing or code well). Create a Processing sketch, and take a screenshot of the output. Then change only one line / insert one bug of the sketch code to “break” it. Broken could mean it won’t run or it looks wrong, compared to the screenshot you took.

Expand All @@ -145,13 +145,13 @@ Parts adapted from Clay Shirky’s [A Brief Introduction to Debugging](https://d
* How did we think about writing a sketch to be hard to debug / hide an error?
* What realizations did you have while creating or debugging?

##More resources
## More resources
* Excellent article on [how to approach problem-solving](http://mattgemmell.com/2008/12/08/what-have-you-tried/)
* Clay Shirky's guide to the [Basics of Debugging](https://docs.google.com/document/d/1ZekLDsbLpySJgFvYYtpYmWMEQ3kiUNW6fOt7BNmTHX8/edit)
* [whathaveyoutried.com](http://www.whathaveyoutried.com)


##Tools
## Tools
* Checking code: [JSLint](http://www.jslint.com/) / [JSHint](http://www.jshint.com)
* Debugging: Chrome Developer Tools ([tutorial](https://developer.chrome.com/extensions/tut_debugging)) / Firebug ([tutorial](http://www.developerfusion.com/article/139949/debugging-javascript-with-firebug/))
* Sharing code snippets: [gist.github.com](http://gist.github.com)
Expand Down
22 changes: 11 additions & 11 deletions github-workshop.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
##Week 1 - Feb 17: Workshop 1
##Getting Started with Git and GitHub
## Week 1 - Feb 17: Workshop 1
## Getting Started with Git and GitHub

###1. Prerequisites
### 1. Prerequisites
* Install Git: [Getting Started Installing Git](http://git-scm.com/book/en/Getting-Started-Installing-Git)
* [Installing on Mac](http://git-scm.com/book/en/Getting-Started-Installing-Git#Installing-on-Mac)
* [Installing on Windows](http://git-scm.com/book/en/Getting-Started-Installing-Git#Installing-on-Windows)
* [Installing on Linux](http://git-scm.com/book/en/Getting-Started-Installing-Git#Installing-on-Linux)
* Get Github account: [http://www.github.com](http://www.github.com)
* Sign up for free education account: [https://education.github.com/](https://education.github.com/)

###2. Introduction to the Command Line
### 2. Introduction to the Command Line
The command line (or terminal) is a text-based way to navigate your operating system's files. Instead of clicking through folders, you type commands to navigate folders, create and delete files, and much more.
* **Windows** [List of Windows commands](http://ss64.com/nt/)
* Start the command line
Expand All @@ -32,12 +32,12 @@ The command line (or terminal) is a text-based way to navigate your operating sy
* Create an empty file in the current folder
* Type `touch EmptyFile.txt`

###3. How Git Works
### 3. How Git Works
**Git** is a **versioning system** for files and software code. This means it is a server that helps you store, track changes to and delete files as you work on them. It is ideal for large collaborative teams working on a single project, since it helps to manage incoming changes from everyone in one single place. It is also useful for single users who want to store their files somewhere with a full history of changes in order to **revert** to changes if files are ever lost. A single git project is called a **repository** (or **repo** for short).

**[GitHub](http://www.github.com)** is a website that offers free git server space for individual and collaboration use. If you want your git repos to be private, you can sign up for a [free education account](https://education.github.com/). GitHub is also a social network, where you can find other people's git repos and follow, star, and even download (or fork/clone) other people's repositories so you can collaborate on them. GitHub is **not** used to host websites or HTML files, just raw code or files to be tracked and maintained.

###4. Getting Started with Git
### 4. Getting Started with Git
* [Getting Started with Git](http://try.github.io/levels/1/challenges/1)
* Common git commands [Git command cheat sheet](http://www.git-tower.com/blog/git-cheat-sheet-detail/)
* `git clone`
Expand All @@ -50,7 +50,7 @@ The command line (or terminal) is a text-based way to navigate your operating sy
![](http://i.imgur.com/66NShs3.png)


###5. Fork Your First Repo
### 5. Fork Your First Repo
* At some point you may find yourself wanting to contribute to someone else's project, or would like to use someone's project as the starting point for your own. This is known as "forking".
* What is the difference between fork and clone?
* https://help.github.com/articles/fork-a-repo
Expand All @@ -59,19 +59,19 @@ The command line (or terminal) is a text-based way to navigate your operating sy
![](http://i.imgur.com/OcLcCCh.png)
from [git simple guide](http://rogerdudler.github.io/git-guide/)

###6. Create Your First Repo
### 6. Create Your First Repo
* https://help.github.com/articles/create-a-repo
* Fill out form at: https://github.com/new

###7. Advanced: More About GitHub Repos
### 7. Advanced: More About GitHub Repos
* Example repository: [p5.js repository](https://github.com/lmccart/p5.js)
* branches
* issues
* histories
* blame
* contributor list

###8. More Resources
### 8. More Resources
* [list of tutorials](https://help.github.com/articles/what-are-other-good-resources-for-learning-git-and-github)
* [git simple guide](http://rogerdudler.github.io/git-guide/)
* [github guides](http://guides.github.com/)
Expand Down Expand Up @@ -112,7 +112,7 @@ from [git simple guide](http://rogerdudler.github.io/git-guide/)

6. If you refresh your github repo page online, you should see your updated files appear.

###STEP BY STEP: Syncing up your repository with the web
### STEP BY STEP: Syncing up your repository with the web

At some point, for example if you are collaborating with others, you may have changes in your github repository (remote repo) that you want to get into the copy of the code on your machine (local repository).

Expand Down
16 changes: 8 additions & 8 deletions open-source-workshop.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
#Week 5 - Apr 28: Workshop 4
# Week 5 - Apr 28: Workshop 4

##Open Source Software (OSS)
## Open Source Software (OSS)

### What is open source software?

Expand Down Expand Up @@ -74,7 +74,7 @@ How to choose a license for your project
* [Microsoft | Openness](http://www.microsoft.com/en-us/openness/default.aspx#home)
* [Microsoft Open Technologies](http://msopentech.com/projects)

####Open Source Creative Coding Libraries and Toolkits
#### Open Source Creative Coding Libraries and Toolkits
* [p5.js](http://p5js.org/)
* [openFrameworks](http://www.openframeworks.cc)
* [Processing](http://www.processing.org)
Expand All @@ -83,7 +83,7 @@ How to choose a license for your project
* [PureData](http://puredata.info/)
* [NodeBox](http://nodebox.net/)

####Open Hardware
#### Open Hardware
![](http://web.media.mit.edu/~mellis/fabfm/fabfm384.jpg)
* [David Mellis](http://web.media.mit.edu/~mellis/)
* [DIY Cellphone](http://web.media.mit.edu/~mellis/cellphone/)
Expand All @@ -92,7 +92,7 @@ How to choose a license for your project
* [Novena Laptop](http://www.crowdsupply.com/kosagi/novena-open-laptop)
* [thingiverse](thingiverse.com)

####Art Projects
#### Art Projects
![](http://www.blogcdn.com//media/2011/05/planetfoo-1-cjr.jpg)
* [Planetary](http://www.cooperhewitt.org/planetary-bloom)
* First open source art project to go into a museum collection
Expand All @@ -104,7 +104,7 @@ How to choose a license for your project
* [FFFFFAT](http://fffff.at/)
* [https://www.youtube.com/watch?v=-b0rlJvO1BQ](https://www.youtube.com/watch?v=-b0rlJvO1BQ)

####Conferences
#### Conferences
* [OpenHardware Summit](http://2013.oshwa.org/)
* [Art && Code](http://www.flong.com/projects/artandcode/)
* [OpenVisConf](http://openvisconf.com/)
Expand All @@ -126,7 +126,7 @@ The idea of Open Source applied to the creation and distribution of media.
* [opsound - Open Source music search engine](http://opsound.org/)


##Activity: OSS and Art + Design
## Activity: OSS and Art + Design
1. Pair up with someone *not* from your major
2. Finish and discuss the readings:
* [The Open Source Definition](http://opensource.org/osd)
Expand All @@ -142,7 +142,7 @@ The idea of Open Source applied to the creation and distribution of media.
* **Pick your favorite open source project and explain to your partner why it matters to you**
4. **AS PAIRS, SHARE YOUR PARTNER'S FINDINGS WITH THE CLASS**

##Class Shares
## Class Shares
* [JS DIY Bench](http://www.jianshentan.com/diybench)
* [DIY Nike Shoes](http://www.nike.com/us/en_us/c/nikeid)
* [DIY Bose Headphones - Custom QuietComfort design tool](http://www.bose.com/controller?url=/shop_online/headphones/noise_cancelling_headphones/quietcomfort_15/index.jsp&Variant=qc15_custom#currentState=qc15_custom)
Expand Down
Loading