Fun Programming

Videos for learning creative programming

About

Programming can be fun and a very creative activity. Playing with graphics and sound is a great way to get started. That's how I learnt programming and math: by experimenting and building things I could see and hear. This is my attempt to share with you how I learnt coding.

Most episodes include a very short program that tries to explain one idea, and builds on top of previous episodes. The first episodes talk about a programming language called Processing. It's very easy to get started with it. The newer episodes combine graphics generated with Processing and sound produced with the SuperCollider programming language.

Have fun mixing code and your creativity!

Help

You can post questions and comments below each video. If you are stuck with a Processing project, this forum can probably help. The SuperCollider forum can be found here.

Download

Download the videos for watching them offline.

Source code

It's possible to run many programs shown in these videos in Sketchpad.cc

You can download the source code for all episodes, but you will learn more if you type them yourself :)

Social networks

Fun Programming is on Google+, Twitter and Facebook.

Donate

The only thing I expect when recording these videos is that it inspires you to create beautiful or useful programs, and that it maybe helps you a bit in your career or life. Programming has given me the freedom to live and work in different countries. I hope you benefit from that too. There are different ways you can support this project, if you really feel like doing that :)

Suggest a video

Do you want to propose a topic for the next episode?

Books you might enjoy

Processing

Introduction to programming. Write short programs that generate graphics and animation.

1. Introduction
2. Download Processing. Use point() and line()
3. Create an animation, use random()
4. Shades of gray and colors, frameRate()
5. Light speed effect, change line colors
6. Animate white lines across the display
7. Animate horizontal lines, use a variable
8. Animate vertical lines
9. Change screen size, animate colorful lines
10. Draw circles and rectangles, change fill color
11. Non-random animation of a circle crossing the screen
12. Do a loop animation using an if() statement
13. Event happening only sometimes
14. New directions for our moving circle
15. Ball bouncing at the window borders
16. Create an animated rainbow
17. A better way to generate random colors
18. Things that happen sometimes
19. Tweak the bar-code, create your first function
20. The smallest drawing program ever
21. Improved tiny drawing program
22. Stars blinking at night (fade out effect)
23. Using the while loop
24. Circle patterns with a while loop
25. Typing big letters that fade out
26. Make patterns by rotating objects
27. Animating while rotating
28. Rotate and even move your axes
29. Rectangle spinning around the mouse pointer
30. Multiple rotating objects and reset matrix
31. Function parameters and return values
32. Use a function to simplify a program
33. Use multiplication to scale up or down speeds and sizes
34. Create a grid of objects with nested while loops
35. A grid of rotating objects creates a wave of rectangles
36. Organic random animation using noise()
37. Make a rectangle dance using noise()
38. Animate the ocean surface using noise()
39. The candy-space. Understanding noise() with 1 parameter
40. The candy-space. Understanding noise() with 2 and 3 parameters
41. A function that generates sine waves
42. Programming animated effects on Android phones
43. Animate using sin(). Less math thanks to map()
44. Combine sine functions to create crazy waveforms
45. Convert distances into colors or widths
46. Create beautiful curves with lots of sin() calls
47. Share your Processing program with the world
48. Load and animate an image of Rick
49. Show part of a loaded image using copy()
50. What are global and local variables?
51. Convert float into int and animate a photo
52. The drunk camera man effect
53. Create a pattern by drawing 150000 pixels
54. Infinite Forest? Combine random words using an Array
55. How many items in an Array?
56. Silly poet writes absurd things
57. A random sentence generator writes nonsense
58. Travel through space, use an array to move stars
59. A space-triangle flying through the galaxy
60. Are two circles touching or intersecting?
61. Draw shaky points, append items to an array
62. A screen full of bouncing circles
63. Time for our first 3D animation
64. Animate objects that slow down and stop using lerp()
65. Are we getting close? Use dist() to find out the distance
66. How random is random? randomSeed() & noiseSeed()
67. Circular motion: sine and her cousin.
68. Circular motion reviewed
69. Combine circular and other motions
70. Slowly change the direction
71. Playing with directions
72. Create visual rhythms using modulo
73. The circlebeats of a running circle
74. for() loops and other ways of typing less
75. Bezier curves are so beautiful
76. Slowly morphing bezier curves
77. A 3D rotating cloud of points
78. An array is like a book full of numbers
79. A spinning star becomes a plant
80. The color datatype
81. How to read the color of a pixel
82. Program a gradient of colors
83. Circular gradients can look like spheres
84. Draw gradients, review functions and image loading
85. Using a background image, mousePressed and mouseReleased()
86. Drawing shapes with your mouse
87. Playing with strings
88. Change pixels using the pixels array
89. Create your own photo filters
90. Change pixel hue, saturation and brightness
91. Timelines: tell a story
92. Interactivity: a draggable circle
93. Draggable circle with tweening
94. Boolean: true or false?
95. Is the mouse inside a square?
96. Easier mouse in a rectangle
97. Interacting with many rectangles (I)
98. Interacting with many rectangles (II)
99. Add sounds to your programs
100. Sound and random rhythms
101. Control Processing using a MIDI controller
102. Control Processing tilting your phone
103. Functions help keep code organized
104. OOP means Object Oriented Programming
111. Drive 100 cars: an array of objects
112. Array of objects: hypnotic animation part I
113. Array of objects: hypnotic animation part II
114. How to create movies using Processing
115. Numbers and computers
116. Reading and displaying bytes, part 1

SuperCollider

Learn how to create sound, music and rhythms using the SuperCollider programming language, and combine it with visual effects generated by Processing.

105. Introducing SuperCollider
109. SuperCollider: start the server and find help
110. SuperCollider: play sounds with SinOsc.ar

Ubuntu

Create music, 2D or 3D graphics and movies, drawings and short films using Ubuntu, a free and easy to use operating system.

106. Ubuntu Software Center: installing programs the easy way
107. Ubuntu: install SuperCollider from a PPA
108. Ubuntu: compile SuperCollider from source