creative technology / new media
[] readme new(s) workshop(s) project(s) CA1 CA2 CA3 CA4 CA5 course(s) - creative exploration(s) / serious games / ethic(s) - resource(s) _ / .

talk show tell print

present / print / tag(s) / form

NM2: interactive visualization

6700020 / project-based course, semester 2, 6 ects

Æliens


rule(s) of the game: if you are absent when you must be present or miss the deadline(s) you will be listed in the hall of shame, when you are in time and excellent, you will gain a place in the hall of fame ...

[keep clicking] rule(s): Æ

schedule-nm2.pdf / goal(s) / hint(s) / link(s) / tutorial(s)

schedule(s) -- common(s) / register! / request for grading

participant(s) / lab(s) / assignment(s) / NM2

  1. introduction -- storytelling in the digital age
  2. interactive scenario(s) -- concept/story/space(s)
  3. requirement(s) -- animation & visualisation
  4. student presentation(s) -- concept(s) & plan(s)
  5. advanced topics -- storytelling & game design
  6. advanced topics -- sound & visuals
  7. student presentation(s) -- work in progress / moodboard(s)
  8. student presentation(s)-- final assignment(s)

submit your clip(s) / blog(s)


content(s)
NM2

course description -- nm2: interactive visualization

The course description(s) are taken from the accreditation report Creative Technology (version 2.0).

contents

The course will address the development of rich media applications using current web-based media technology, with a special focus on animation and interactive visualization(s) of dynamic complex systems. The platform used will be Adobe flex / as3.

Recommeded literature: Foundation Actionscript 3.0 Animation: Making Things Move! by Keith Peters

Online reference(s):

prerequisites:

CA1, CS1, NM1, MA1

goal(s) & attainment target(s)

During the course students are expected to learn the skills to create moderately complex media applications.

After following the course, students are expected to have

  • awareness of issues in information visualisation
  • familiarity with XML-based data and program configuration
  • fluency in scripting (actionscript) and the use of lfex.
  • full literacy in developing simple physics based animations
Students are expected to have an explorative attitude, and will be stimulated in developing aesthetically interesting animations and dynamical visualisations.

place in curriculum:

NM2 is meant to be an intermediate course, required for both ST and NM students. The course will enable students to apply their knowledge of dynamic systems and mathematics in a (media-rich) context, as a preparation for more advanced projects in virtual enbironments and game development. In relation to DE-courses, the focus of NM-courses Is primarily on technical issues and programmatic authoring.

application area & motivating example(s)

Physics based animation is an effective means of visualizing complex information structurs. Effective information visualization morever depends on intuitive ways of interaction to support exploration. Interactive information visualization is increasingly being used in web 2.0 applications, for giving access to huge amounts of user-contributed data such as blogs and video.

teaching method(s)

The course will be organized around lectures in which both technical and conceptual issues, related to animation and visualization, are dealt with. The assignments will consist of a series of basic exercises and a final exercise In which the students are required to develop a moderately complex dynamic web application.

Regular feedback will be given in classroom sessions where students present their work as well as via online comments or email. Grading will be based on basic assignments, the final assignment project with documentation, as well as an essay in which a topic of choice, either technical or in relation to issues of animation and information visualisation, is discussed in more depth.

special facilities:

computer lab & presentation facilities, installation of flex 3 SDK.

course outline(s) -- nm2: interactive visualization

outline(s) / schedule(s)


content(s)

In this part a more detailed discussion will be provided of topics, learning goals, materials used, and the actual structure of the course, as well as a sketch of the assignments given. Also references to releveant literature is provided, including online resources. At the end, advice for students following the course will be given, as well as hints for the instructor(s).
NM2

course topic(s)
Since the web must be considered to be the most prominent platform for the dissemination of information and services, the interactive visualization course will primarily focus on web-based rich media technologies. Topics treated in the course include:

topic(s)


  • elementary web-based multimedia technology
  • programming and tools for interactive animation
  • first principles of information visualisation
  • elements of interaction design
  • data representation issues for rich media applications
However, instead of using advanced high-level tools, our approach will start from first principles, that is using computational means to get access to, manipulate, and present data, in visually appealing ways.
NM2

learning target(s)

 With regard to the programming skills, the actual topics treated in interactive visualization will to a large extent on what has been covered in the earlier programming course(s) However, taking a technology-agnostic view our learning goals can be summarized as:

NM2 target(s)


  • skill(s) -- scripting, XML-based configuration
  • knowledge -- interactive animation & visualization
  • theory -- dynamic systems, information presentation
  • experience(s) -- medium scale interactive visual application(s)
  • attitude -- explorative, problem-finding, aesthetics
In particular, students must gain an intuition on how to create visualizations using computational means, and how to approach visualization issues by iteratively, as outline in Ben Fry's book on visualizing data, going through the following steps: acquire, parse, filter, mine, represent, refine and interact. No need to emphasize that an exploratory attitude is essential, as well as a (to be developed) sense of (computational) aesthetics
NM2

lesson material(s)
Apart from the highly recommended book Visualizing Data by Ben Fry, all material(s) will be online, including a (large) number of examples, as well as reference material, and challenging targets, that examples that may serve as a target for students' accomplishments.

interactive visualization -- authoring


During the course this list will be extended, and dependent on circumstances, particular aspects of interactive visualization will be emphasized, in particular visualization techniques that use physics-based animations as a means of conveying relationships between data, examples of which are given in the onlune resources below.
NM2

course structure


The course does require active participation of the student(s), not only in exploring the technolgy by making the assignments, but also by presenting solutions and problems in class.

session(s)


  1. introduction of (rich) media platform(s)
  2. basic assignment(s) -- animation (1)
  3. essentials of animation and visualisation
  4. basic assignment(s) -- visualization (2)
  5. principles of interactive information presentation
  6. basic assignment(s) -- interaction (3)
  7. elements of data-driven information systems
  8. presentation of final assignment(s)
At this stage it is not clear whether to enforce the use of one particular technology, flex/as3 or processing, to use multiple technologies, or to allow students a choice of technologies, which would then also include javascript, Ch and C++.
NM2

assignment(s)


There will a small number of assignemts, to be made by the students individually. The goal of these assignments is to provide a structure that assists the students in exploring the technology. Basic assignemnts (may) include:

basic(s) -- interactive visualization


  1. particle systems -- with collisions and effects
  2. map-based visualization -- e.g. using www.umapper.com with flex/as3
  3. information overlays -- e.g. in combination with interactive video
For the final assignment(s) of the course, students are allowed to work indidually, or in groups of two or three (maximally) students. Work done in groups must be proportionally more challenging and complex. Students can make a choice out of (among possibly others):

final(s) -- interactive visualization


  • geo-located information -- e.g. health or finances
  • activity-monitoring -- e.q. sensor-data, web-traffic
  • information game -- e.q. climate issues
In effect, students will be encouraged to follow their own ideas, in for example implementing a game using visualization technology, giving information and (game-play) feedback in visually compelling ways.
NM2

reference(s)
As said before, a highly recommended reference for interactive data visualization is Visualizing Data by Ben Fry, not in the least because the approach described is tightly connected with processing and its underlying philosophy of creative intuitive understanding by computational means. However, also the flex/as3 related references are worthwhile because they give access to the display environment of flash, which is the dominant media technolgy for (business-related) web-applications.
  1. Visualizing Data: Exploring and Explaining Data with the Processing Environment, by Ben Fry -- (amazon)
  2. Foundation Actionscript 3.0 Animation: Making Things Move! by Keith Peters -- (amazon)
  3. Professional Adobe Flex 2 (Programmer to Programmer) by Rich Tretola, Simon Barber, and Renaun Erickson -- (amazon)
  4. Foundation Flash 8 Video (Foundation) by Jordan L Chilcott and Tom Green -- (amazon)
  5. Visualizing the Semantic Web: XML-based Internet and Information Visualization by Vladimir Geroimenko -- (amazon)
  6. Eliëns A., Wang Y. van Riel C. and Scholte T. (2007), 3D Digital Dossiers -- a new way of presenting cultural heritage on the Web, In Proc. Web3D 2007, ACM SIGGRAPH, pp. 157-160
  7. A. Eliëns, topical media & game development -- media.eliens.net
A wealth of material and references can be found at my topical media & game development site, including tutorials and examples.

online resource(s)
Of the many online resources, in particular the flow(s) from diggs.com deserve special mention, because they apply physical principles in an experimental way to gain understanding of patterns of information flow on the internet, as an example of what as been called cultural analytics by Lev Manovich.

resource(s) / NM2 / assignment(s)


After mastering the first principles of visualization, it may be interesting to use actual (game) physics engines for the presentation of (dynamic) data.
NM2

advice for the student(s)

 The interactive visualization course provides you the opportunity to apply what your have learned in previous mathematics and programming courses in an integrated way. You may even try to apply what you learn in dynamic systems in an application that may primarily be meant to be entertaining. Keep in mind that, as testified by the use of physics simulation(s) in games, that visual appeal may well be served by more or less deep computational/physical principles and, as you should have learned in the creatove explorations, mathematical insight(s).
NM2

hint(s) for the instructor(s)

 The decision on what to take as a unifying approach and language in the computation part of the curriculum still pending, the safest bet, from many perspectives, seems to take the visualizing data book of Ben Fry as a starting point, and dependent on the actual capabilities and skills of the students explore alternative technologies, in particular flex/as3 for more integrated interactive visualizations, involving the essential use of maps and physical animation(s) in a rich-media context, allowing for the use of interactive video in a well-integrated fashion. For the final assignments, the development of information-centered games must be encouraged, with an emphasize of explorative ways of using data visualization in a game or entertainment setting.
NM2

afterthought(s) -- 09 / 10

(11/5/11):

PDF

monitor(s)


Almost a year later, a few comment sremain. First, the choice for unity was justified, and seems even more so when the group gets larger. The moodspace election, however was suggested to be earlier.

All in allthe students liked the involvement of external shareholders with their assignments. For the telemedicine application this was succesful. The nano group, however, did not succeed, due to planning, too high expectations, and students of the team stopping with the study.

(11/5/11):

PDF

monitor(s)


In contrast with last year, most groups chose for the nano assigment, and the concepy presentations were promising. Not every group is online though. Perhaps partly due to an overladen schedule, the students started really slowly. Also, somewhat disappointingly, only half of the students submitted a moodboard in unity, and all in all the quality, I must say, was quite OK. In general, however, the (total) group of students is somewhat unresponsive and passive. And with the exception of some, both blogs and portfolios are not maintained after CA1 and NM1, which makes them virtually useless as an instrument to monitor progess and as a measure for motivation and activity. I partially blame the mentor/tutor system for this, since they do not properly emphasize the importance of individual students' portfolios, nor, apparently, take the time to look at either blogs or portfolios!

[] readme new(s) workshop(s) project(s) CA1 CA2 CA3 CA4 CA5 course(s) - creative exploration(s) / serious games / ethic(s) - resource(s) _ / .

(C) Æliens 2013