《交互程序设计》课程总结(2012.08)

Written by on 2012/08/09 in 活动 - 3 Comments

在央美为期两周的《交互程序设计》今天结束了最后一次的讲课,短短的两周对于一门程序设计的课程来讲的确不算太长,特别是对逻辑思维相对训练较少的艺术设计类学生来讲,需要在两周的时间内介绍完程序设计的相关基础知识的确不那么容易。本着主要是了解程序设计的基本思路和方法的目的,我在这门课程上对学生的要求主要还是以了解交互程序设计的基本方法为主要目标,对最后编程的要求其实并不是那么高。总的来讲,这门课程一上达到了我自己的目的,虽然最后学生可能还是没有办法写出比较复杂的程序出来(这个基础需要比较长时间的工程训练),但起码已经对互动程序设计有了一个基本的概念性认识。

两周的课程安排是周一周三周五讲课,说是讲课,其实学生实践的时间更多一些。通常在讲完示例性的代码之后,就会要求学生在自己的计算机上运行一次,然后修改一些参数以加深对程序的认识。很多时候学生都认为自己已经听懂了,但一到真实的上机环节就会出现各种各样的问题,所以坚持让他们把代码输入进去再查看运行结果就变得非常必要了。一周内的其它时间会给他们安排一些作业,一是适当降低上课的频度以便学生更好地理解,另外也是给他们更多实践的时间,这样的安排效果还算不错。

这次课程主要的参考书箱是《Programming Interactivity, A Designer’s Guide to Processing, Arduino and openFrameworks》、《Generative Art, A Practical Guide Using Processing》和《Processing A Programming Handbook for Visual Designers and Artist》,使用的工具则是Processing。本来我自己的计划是很想尝试用openFrameworks,但备课的时候发现难度对艺术设计类的学生来讲可能还是有点大,所以最后还是选取了相对比较保险的Processing,openFrameworks在效率和功能方面有很大的优势,希望在今后的课程中有可能介绍到这一优秀的框架。



第一天的课程从交互设计的基本概念开始,从一种新的设计方法的角度向大家介绍了交互程序设计在目前交互设计中的作用。虽然面向的是艺术设计类的学生,但做为一门程序设计的课程来讲还是少不了基本概念的介绍,所以需要大家很快地转变思路,从一个更加理性和逻辑的角度来看待另一个世界。首先介绍了源代码(Source Code)、文件(File)、编译器(Compiler)和可执行代码(Executable)这些最基本的概念,以及它们在整个程序设计过程中所对应的阶段。接下来介绍变量、类型、数组、算术运算符、逻辑运算符等基本概念。再往后则是一些简单的程序结构的介绍,主要包括if/else分支结构、for循环结构和函数。代码风格是整个课程一直接在强调的一点,不过因为大家接触代码的时间不长,Processing的IDE又不是那么好用,所以直到最后还是有部分同学写出来的代码是无法对齐的,这也是几乎所有这类课程上大学的一个通病吧;-)

第二天要求大家课前下载和安装好了Processing,所以课上首先主要介绍了Processing IDE环境的使用,包括每个按钮的作用以及界面中各个窗口的用法,顺便发现了一个有用的快捷键Ctrl+K。当学生熟悉了Processing IDE之后,我们就开始探索一个基本的Processing程序所应该包含的两个主要函数setup()和draw(),并且介绍了几个常用的函数size()、frameRate()、print(),让大家理解一个最基本的Processing程序看起来可能长成什么样子。再往后是Processing中一些基本绘图函数的介绍,包括rect()、ellipse()、line()。颜色对于绘图来讲是非常重要的,所以需要向大家解释颜色的基本表示方法和Processing中跟颜色设置相应的一些函数,包括fill()和background(),fill()函有很多种形式,我们只介绍了其中常用的几种。stroke()和strokeWeight()是用来控制绘图是笔的粗细的,同样也会影响到对基本图元的绘制。课上并没有介绍绘制曲线的函数curve()和vertex等,后来发现可能还是有一定的问题,不过要想想如何以通俗易懂的方式来解释好曲线。作为基本的用户交互的手段,鼠标和键盘还是最重要的两种方式,所以从鼠标我们在课上介绍了mouseX和mouseY这两个变量,mousePressed()、mouseReleased()和mouseDragged()这几个函数,键盘方面则介绍了key这个变量及keyPressed()这个函数。这次的课程主要是介绍交互式软件设计,所以没有加入Arduino和传感器这样的硬件交互的方式。

第三天开始介绍一些与生成式艺术(Generative Art)相关的知识,这也是我自己比较感兴趣的一个方向。随机数的生成是生成式艺术依赖的一个重要技术手段,所以我们从random()这个函数开始,讲解如何生成随机数,以及如何利用连续生成的随机数来形成一条不规则的曲线。noise()函数生成的随机数效果更好,不过需要记住的步骤也更多一些。之后从圆的方程入手,介绍了如何生成螺旋线,以及如何利用随机数绘制出不规则的螺旋线,再通过很多不规则的螺旋线来构成意想不到的结果。如果时间允许,这里其实可以安排一个典型案例的分析。这天的课后给大家安排了一个家庭作业,用学到的不规则图形的生成方式,以及已经掌握的一些基本的图元绘制方式,生成任意有意思的图形,之后从学生上交的作业来看,效果还是不错的。

第四天开始引入更多的维度,首先是如何在二维平面上进行随机数的生成,之后再扩展到三维或者更多维度。这天课程上所要求大家绘制的东西也开始变得复杂起来,于是加入了坐标变换的介绍来简化一些绘图的操作,主要包括坐标的平移变化translate()和坐标的旋转变化rotate(),以及与之配置的如何保存和恢复原始的坐标函数pushMatrix()和popMatrix()。从维度的角度自然也少不了对Processing中三维绘图的一些介绍,包括如何在OPENGL和P3D模式下进行3维图形的绘制等。这次对三维绘图介绍得相对比较简单,下次需要加上对灯光(Light)和视角(Camera)的处理。这天的家庭作业是要求大家去openprocessing.org上找一些自己感兴趣的例子,并尝试对代码进行相应的修改。

第五天的上午主要是分析大家找到的例子,这个过程我之所以觉得比较重要是因为刚开始的时候其实要大家写代码会不太现实,但分析一下人家的代码还是有可能的,而且这其实也是一种对编程能力的锻炼。下午首先介绍了如何在Processing中进行声音和图像的处理,声音的数据可以对其进行分析并进行一定的可视化处理,图形的话则可以进行一些像素化的处理,这样都是理解声音和图子像数据处理的一些基本方法。视频其实就是连续的多个图形,借助Movie(Capture)例子进行了相应的讲解。下午还有一个比较重要的内容就是简单介绍了一下面向对象编程的基本概念,不知道我举的模型例子大家是不是能有所体会。第五天的作业是让大家去找一个基于Processing的艺术作品进行分析。

最后一天的课程首先是每个同学介绍一下自己找到的Processing艺术作品,大家找到的例子似乎不太理想,所以这个变成了课程总结的作业,让大家再多花一点时间进行整理。课程这天主要是安排了一些算法的介绍,上午主要是GA和GOL的介绍,由于时间的原因GOL只是做了一个大致的介绍。下午则介绍了如何产生一个非常简单的粒子系统,同时再度复习了一下面向对象的编程和Processing中如何加入多个Tab。看得出来最后一天大家基本上都已经被程序设计折磨得不行了,很多同学都只剩下被动抄代码的体力了,希望这样的高强度训练对他们今后来读人家的代码会有所帮助;-)

更多照片请访问我们的相册

3 Comments on "《交互程序设计》课程总结(2012.08)"

  1. burn 2012/08/11 at 12:50 AM ·

    老师怎么没有出镜啊:)

  2. flamingoeda 2012/08/11 at 5:16 PM ·

    负责拍照片去了;-)

  3. YI YU 2012/11/28 at 5:42 AM ·

    老师您好,我在openprocessing上下载的程序拿到自己的笔记本上 运行出背景 然后就没有别的东西了,具体地址:http://www.openprocessing.org/sketch/39230 该作者的所有紫色背景三维交互动画出了显示背景,其余动画都出不来,请问您知道是什么原因吗??

Leave a Comment

使用新浪微博登录