creative coding for web developers

This is a workshop i am currently preparing. If you are interested in having this workshop be held at your institution, please contact me!

topics

In this workshop I will introduce the topic of creative coding, present some inspiration and examples, as well as teach the basics of the JavaScript canvas API for creating artistic animations and other creative projects such as the following:

couldn't embed Fileder:/projects/demoloops/twisted

./mmm/mmmfs/conversion.moon:263: error while converting Fileder:/projects/demoloops/twisted text/moonscript -> mmm/component from 'text/moonscript -> mmm/component' to 'mmm/component':
[string "Fileder:/projects/demoloops/twisted#text/moon..."]:1: [nossr]
stack traceback:
	[C]: in function 'assert'
	[string "Fileder:/projects/demoloops/twisted#text/moon..."]:1: in main chunk
	(...tail calls...)
	[C]: in function 'xpcall'
	./mmm/mmmfs/conversion.moon:260: in function 'mmm.mmmfs.conversion.apply_conversions'
	./mmm/mmmfs/fileder.moon:256: in method 'get'
	./mmm/mmmfs/fileder.moon:265: in function <./mmm/mmmfs/fileder.moon:263>
	[C]: in function 'pcall'
	./mmm/mmmfs/util.moon:132: in function <./mmm/mmmfs/util.moon:118>
	(...tail calls...)
	./mmm/mmmfs/builtins.moon:64: in function 'string.yieldable_gsub'
	./mmm/mmmfs/builtins.moon:136: in function <./mmm/mmmfs/builtins.moon:114>
	[C]: in function 'xpcall'
	./mmm/mmmfs/conversion.moon:260: in function 'mmm.mmmfs.conversion.apply_conversions'
	./mmm/mmmfs/fileder.moon:256: in method 'get'
	build/server.moon:126: in function 
	[C]: in function 'xpcall'
	build/server.moon:190: in function 
	(...tail calls...)
	[C]: in function 'pcall'
	/usr/local/share/lua/5.3/http/server.lua:187: in function 

• experiment: aligning fonts by their center of mass
• experiment: parallax SVG viewer

The workshop is designed to accompany an ‘industry-focused’ course in web development, and aims to deliver some wider perspective over the possibilities and creative use of technology to participants. The following topics are covered:

• what is creative coding?
• creative coding frameworks
• the canvas API
  • drawing basic shapes
  • colors
  • input events
• animation
  • requestAnimationFrame
  • easing functions
• online creative coding communities

The exact topics and structure can be adjusted based on the course runtime and level of the participants' experience.