topical media & game development

topical media & game development

[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

chart(s) / help / lookat(s) / tutorial(s)

section 0 -- getting started

lookat -- www.alexa.com/topsites
read -- about firefox 3.5
explore -- www.google.nl/search?q=web+technology

select (y)our browser(s)

choose (y)our browser(s)

firefox 3.5 (*) -- www.mozilla-europe.org/en/firefox
safari -- www.apple.com/safari/download
opera -- www.opera.com/download
chrome -- www.google.com/chrome
iexplorer (6/7/8) -- www.microsoft.com/windows/internet-explorer

(*) FF 3.5 is (y)our reference browser!

install the tool(s)

edit & debug -- getfirebug.com / web developer
inspector -- view source / debugger [optional]
editor(s) -- www.winedt.com / www.flashdevelop.org
tool(s) -- filezilla / classic ftp
IDE [optional] -- netbeans / visual studio express / web developer
server(s) [optional] -- WAMP / LAMP
analyser(s) [optional] -- packet sniffer(s)

learning (with/by/from) example(s)

hands on experience -- explore, copy & paste, understand, adapt
read what you need-- see other course(s) / wikipedia
search & explore -- www.google.nl/search?q=web+code+example
focus -- basic exercise(s) / final application(s)
reflect -- write essay(s) / blog(s)

a touch of style(s) & behavior(s)

lookat -- bubble(s) / cupid(s) / bat(s) / timer(s) / game(s) / heart(s) / snake(s)
explore -- canvas / parallax / processing / S5 / math(s) / presentation(s) / bullit(s) / tool(s)
meet -- the blob(s) again / play(s) / eliza

other course(s)

course(s) -- web technology @ VU (*)
search -- www.google.nl/search?q=course+webtechnology
resource(s) -- web design / tool(s)

(*) with kind permission of Jacco van Ossenbruggen and Guus Schreiber

[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.

chart(s) / help / lookat(s) / tutorial(s)

section 0 -- getting started

section 0 -- getting started

document.write(' <a href=');if (!slidemode) { document.write('@slide-'); } else { document.write('sub-tutorial-web-0.html#slide-'); } document.write('sub-tutorial-web-0'); if (!slidemode) document.write('.html');document.write('>');

select (y)our browser(s)

choose (y)our browser(s)

document.write(' <a href=');if (!slidemode) { document.write('@slide-'); } else { document.write('sub-tutorial-web-0.html#slide-'); } document.write('sub-tutorial-web-0-browser'); if (!slidemode) document.write('.html');document.write('>');

install the tool(s)

install the tool(s)

document.write(' <a href=');if (!slidemode) { document.write('@slide-'); } else { document.write('sub-tutorial-web-0.html#slide-'); } document.write('sub-tutorial-web-0-tool'); if (!slidemode) document.write('.html');document.write('>');

learning (with/by/from) example(s)

learning (with/by/from) example(s)

document.write(' <a href=');if (!slidemode) { document.write('@slide-'); } else { document.write('sub-tutorial-web-0.html#slide-'); } document.write('sub-tutorial-web-0-learning'); if (!slidemode) document.write('.html');document.write('>');

a touch of style(s) & behavior(s)

a touch of style(s) & behavior(s)

document.write(' <a href=');if (!slidemode) { document.write('@slide-'); } else { document.write('sub-tutorial-web-0.html#slide-'); } document.write('sub-tutorial-web-0-behavior'); if (!slidemode) document.write('.html');document.write('>');

other course(s)

other course(s)

document.write(' <a href=');if (!slidemode) { document.write('@slide-'); } else { document.write('sub-tutorial-web-0.html#slide-'); } document.write('sub-tutorial-web-0-course'); if (!slidemode) document.write('.html');document.write('>');