Tuesday 12-4pm.
Brown Center 206
Contact:jrouvelle@mica.edu
Office: Brown Center, room 211, phone (in office).
Office hours: by appointment
Interactive Scripting. It is hoped that this course will provide an entry point into the dynamic world of interactive scripting. We will define interactivity as a relationship of mutual influence Ð similar to a conversation Ð between participants, based in input, processing, output, and feedback. The participants can be any combination of humans and other systems; mechanical, electric, or other. Scripting will be understood as the will of the creator/artist/designer within this relationship. We will study various techniques and tools to make the intention of the script writer clear to the participants and effective within the media it is deployed. Students will be encouraged to use both electric and non-electronic materials. While various software and hardware will be presented, the focus of our work will be on developing a clear understanding of what interactive scripting is, and to have each student locate media in which they can engage the concepts presented in such a way as to make their understanding of the materials covered clear. We will develop a discourse to differentiate between one-dimensional, responsive interfaces, and interactive relationships. A final project will be required of each student that will exemplify that students understanding of the course material.
Evaluation:
Grades in this course will be based on regular class attendance, the quality of your work, class participation, and progress. Tardiness and excessive absences will adversely affect your grade. Participation in discussions and critiques is mandatory.
Projects & Grading:
You will be asked to do assignments throughout the semester. Most of the assignments will be presented in class and will be designed to stimulate group conversation.
***We will not have a final exam during finals week***
Students will be graded by letter, A-F, on all evaluated work. Work must be completed on time and in full satisfaction of each project goal. Late work (assignments handed in or posted after the start of in-class critique sessions) will be automatically downgraded by one letter grade. In addition to in class exercises, you will complete four projects.
A
|
Well above the expectations of the course. Outstanding participation, attendance, and exceptional progress. |
B |
Above average assignments and participation. No more than one absence. |
C |
Average execution of assignments, participation, and no more than two absences. |
D |
Well below average: work, attendance (two absences), projects, and participation. |
F |
Unsatisfactory: work, attendance (more than two absences), projects, and participation |
Attendance:
Two or more unexcused absences from class may result in failure. Two unexcused late arrivals, or early departures will be marked as the equivalent of one absence. Absence from a class is not an excuse for skipping a tutorial, reading assignment, or posting an assignment. You are fully responsible for completing work.
Readings:
Readings will be linked from the syllabus. There is no textbook. You may utilize the printers in class to download hard copies of web-based content if you prefer. Critiques and discussion will frequently be initiated from various topics covered in the readings Ð in other words, please use the concepts you read about in discussion of fellow studentsÕ work.
Supplies:
Please bring to each class a storage media of your choice. I recommend a jump drive from the bookstore, in lieu of this, an ipod, or server space, or 1-2 CD-R(s) Ð Recordable Compact Discs (700 MB) will suffice. YouÕll probably go through many of them, for both this and other digital classes. You might also want to bring in a sharpie to label your CDÕs.
It is essential that all work done in class be saved to either your jump drive, CD-R, server space, ipod, etcÉ at the conclusion of class. There will be many, many other students using these computers and anything saved on them will be permanently removed shortly after the conclusion of class.
Food and Drink in the Computer Labs:
No.
ADA COMPLIANCE:
In MICA's efforts to provide the
highest possible quality educational experience for every student, MICA
maintains compliance with the requirements of the ADA and Section 504. Any
student who has, or suspects he or she may have, a disability and wants to
request academic accommodations must contact Dr. Kathryn Smith at the Learning
Resource Center, 443 695-1384 or email at ksmith@mica.edu immediately.
MICA has developed policies and
practices to ensure a healthful environment
and safe approaches to the use of
equipment, materials, and processes. It is
the mutual responsibility of
faculty and students to review health and
safety standards relevant to each
class at the beginning of each semester.
Students should be aware of
general fire, health, and safety regulations
posted in each area and course
specific polices, practices, and cautions.
Students who have concerns related
to health and safety should contact
Quentin Moseley, Environment
Health and Safety Coordinator at 410 225 0220
or email at qmoseley@mica.edu
Electronic Art,
Artists, and Projects List
Weekly Schedule
______________________________________________________________________________
Introduction, Resource website,
review syllabus, registration matters
motto:
In general I'm more interested in how whatever you do
engages the concepts of interactivity (a relationship of mutual influence),
integrated media (media as an ensemble of actions, not bound to any specific
discipline or practice), and scripting events, and less concerned about the
technology you employ. You will
have time to develop your technical know-how during your time at MICA and
elsewhere. Instead, I would like
to use our class as a place to explore ideas related to the concepts mentioned
above, and to create models (i.e., diagrams, sketches, objects, scenarios) that
help you to come to a deeper understanding and facility of and with these
concepts.
Some preliminary terms:
Process:
á
a series
of tasks that result in a goal
Code:
Algorithm:
á
A series
of tasks leading to a specific result. Do you hear that echo? A Script, or
program can be considered Algorithms. Successful Algorithms:
á
Reach
their goal
á
Are Lean
(no redundancy or extraneous steps)
á
Are
designed for the specific system that will run (parse) them in mind
á
May be
Unilateral/one dimensional or Interactive/Adaptive.
ÒExcept for the miracle of reduction, there is no special reason to build
computers with silicon technology.
Building a computer out of any technology requires a large supply of
only two kinds of elements: switches and connectors. The switch
is a steering element (a hydraulic valve, or the transistor), which can combine
multiple signals into a single signal.
Ideally, the switch should be asymmetrical, so that the input signal
affects the output signal but not vice versa, and it should have a restoring
quality, so that a weak or degraded input signal will not result in a degraded
output. The second element, the
connector, is the wire or pipe that carries a signal between switches. This connecting element must have the
ability to branch, so that a single output can feed many inputs. These are the only two elements
necessary to build a computer. Later we will introduce one more element - a
register, for storing information Ð but this can be constructed of the same
steering and connecting components. Ò
-Dan Hillis, from ÒThe Pattern on the StoneÓ
LetÕs
try some of this out and write a short script. The object of the script, the goal of the process, is to
have a small package delivered to:
Mr. Y
123 e 22nd
st, apt. 5-C
ny ny,
10019
to
accomplish this letÕs use English as our scripting language, and a text editor
as our development environment. In
other words, open up any program that allows you to write and start creating an
algorithm that will accomplish the goal stated above.
Now
letÕs explore a few other ideas:
Interactivity:
Models,
modeling:
Media:
Criticality:
>>>Andre
Gregory: ÒWhen we stop reacting, interacting with each other what do we have
left?Ó
actions:
Marc
Horowitz
National Dinner Tour Ð Marc Horowitz
Sliv and
Dulet
Sliv and Dulet Ð sixty second
symphonies
Electronic
Civil Disobedience Theater
***Ricardo Dominguez, of EDT, will be visiting MICA September 28th
Electronic Civil Disobedience
Theater
Floodnet
Zombie
Mobs
Assignment::
Frank Dietrich, ÒThe Computer: a tool for
thought experimentsÓ Ð sections I and II Ð please pay close attention to
section II
Think about: The relationship between objects and abstract thought mentioned in the Dietrich piece. How would you characterize DietrichÕs thoughts on the role of art in society?
Isaac Asimov, ÒThe last QuestionÓ
Create
a graphic (any medium is fine) that models your understanding of the
relationship between:
Look at some of the pieces I didnÕt have time to show you last week.
Discuss your images and impressions of the two readings.
Dietrich:
Perspective?
Asimov:
complementarity
Ð implicate/explicate order.
excerpt from
an interview with
physicist David Bohm:
Bohm: ...At any given moment we feel the
presence of all the past and also
the anticipated future. It's all present and active.... The
best metaphor (model)
might
involve memory. We remember a great many events, which are all present
together.
Their succession is in that momentary memory: We don't have to run
through
them all to reproduce that time succession. We already have the
succession.
Omni: And a sense of movement--so you have
replaced time with movement?
Bohm: Yes, in the sense of movement of the
symphony, rather than the
movement
of the orchestra on a bus, say, through physical space....In
classical
mechanics, movement or velocity is defined as the relation between
the
position now and the position a short time ago. What was a short time
ago is
gone, so you relate what is to what is not. This isn't a logical
concept.
In the implicate order you are relating different frames that are
co-present
in consciousness. You're relating what is to what is. A moment
contains
flow or movement. The moment may be long or short, as measured in
time. In
consciousness a moment is around a tenth of a second. Electronic
moments
are much shorter, but a moment of history might be a century.
á
Bohm liked
to use the television and the broadcasting system as an example:
ÒThe signal, screen, and television electronics
in this analogy represent the Implicate Order whilst the image produced
represents the Explicate Order. He also uses an interesting example in which an
ink droplet can be introduced into a highly viscous substance (such
as glycerine),
and the substance rotated very slowly such that there is negligible diffusion of
the substance (ink and glycerine are said to be immiscible Ð meaning that they
donÕt dissolve into each other.
Lava lamps are created by immiscible components). In this example, the
droplet becomes a thread that, in turn, eventually becomes invisible. However,
by rotating the substance in the reverse direction, the droplet can essentially
reform. When it is invisible, according to Bohm, the order of the ink droplet
as a pattern can be said to be implicate within the substance.
In another analogy, Bohm asks us to consider a
pattern produced by making small cuts in a folded piece of paper and then,
literally, unfolding it. Widely separated elements of the pattern are, in
actuality, produced by the same original cut in the folded piece of paper. Here
the cuts in the folded paper represent the Implicate Order and the unfolded
pattern represents the Explicate Order.
This explicate order is the surface appearance of
a much greater enfolded or implicate order, most of which is hiddenÉ. it might
be tempting to assume that the implicate order refers to a subtle level of
reality that is secondary and subordinate to the primary explicate order, which
we see manifest all around us. However, for Bohm, precisely the opposite is the
case: The implicate order is the fundamental and primary reality, albeit
invisible. Meanwhile, the explicate orderÑthe vast physical universe we
experienceÑis but a set of "ripples" on the surface of the implicate
order. The manifest objects that we regard as comprising ordinary reality are
only the unfolded projections of the much deeper, higher dimensional implicate
order, which is the fundamental reality. The implicate and explicate orders are
interpenetrating in all regions of space-time, and each region enfolds all of
existence, that is, everything is enfolded into everything.
Bohm believes that each part of physical reality
(explicate forms) contains information about the whole (implicate). Thus in
some sense, every part of the universe "contains" the entire
universeÉ we have all experienced a glimmer of this in the following
commonplace example. Imagine yourself gazing upward at the night sky on a clear
night, and consider what is actually taking place. You are able to discern
structures and perceive events that span vast stretches of space and time, all
of which are, in some sense, contained in the movements of the light in the
tiny space encompassed by your eyeball. The photons entering your pupil come
from stars that are millions of light years apart, and some of these photons embarked
on their journey billions of years ago to reach their final destination, your
retina. In some sense, then, your eyeball contains the entire cosmos, including
its enormous expanse of space and immense history in timeÑalthough, of course,
the details are not highly refined. Optical and radio telescopes have much
larger apertures, or "holographic plates", and consequently they are
able to glean much greater detail and precision than the unaided eye. But the
principle is clear, and it is extraordinary to contemplateÓ.
You can
think of the explicate form as a focal point of the implicate
structure/system. A possible
ÒstaticÓ moment or form within a dynamic system that cannot be seen, in its
entirety, at any one moment.
-> excellent introductory article
by William Keepin that goes into more detail on BohmÕs ideas.
á
OK, where
in the Asimov story can you locate an example of what might be understood as implicate
order, and what might be explicate order?
o
What would
you say is the relationship between humans and computers vis-ˆ-vis implicate
order and explicate order as the story progresses?
o
Do you see
our culture as more invested in implicate or explicate forms?
o
Do you
sense a change from one towards the other?
LetÕs watch a short film:
á Does this seem reasonable?
á
Is the googlezon an implicate system or an explicate
form?
o
The googlezon is experience by many as what?
o
And the response is what?
o
Do you think that trivia, and trivial information can be
understood as an explicate form Ð a possible focal point, of an implicate
system?
Assignment:
____________________________________________________________________________________________
your images from assignment # 1:
Discuss Sterling article (Spimes): Present class definitions of spime, artifact, machine, gizmo, blobjectÉ
Is the city a spime?
Remember the human element.
HereÕs the Carl Sandberg poem he
references: ÒThe People, YesÓ
(at least most of itÉ)
ÒMetaphor is the currency of knowledge. I have spent my life learning
incredible amounts of disparate, disconnected, obscure,
useless pieces of
knowledge, and they have turned out to be, almost all of
them, extremely
useful. Why? Because there is no such thing as disconnected
facts, there is
only complex structure. And both to explain complex
structure to others, and
perhaps more important, (this is forgotten usually) to understand
them
oneself, one needs better metaphors. If I was able to
understand this,
this issue of smell, this mystery of the senses, it was
because my chaotic
accrual of information simply gave me better metaphors
than anyone
else. My father always said, Ò if you translate a
proverb from one
language into another you pass for a poet, the same for
science, work
strictly within one area and it produces diminishing
returns, hard to make
progress. But translate a concept from its field for use
where it is
unknown, and it is always fresh and powerful. In buying
outside, you are
doing intellectual arbitrage, the rate-limiting step in this
is your
willingness to continuously translate, to force strange
languages to be
yours, to be in between, to be everywhere, and nowhere.
-
Luca
Turin, biophysicist, subject of the book ÒThe Emperor of ScentÓ
excerpt from
an interview with
physicist David Bohm:
Bohm: ...At any given moment we feel the presence
of all the past and also
the anticipated future. It's all present and active.... The
best metaphor (model)
might
involve memory. We remember a great many events, which are all present
together.
Their succession is in that momentary memory: We don't have to run
through
them all to reproduce that time succession. We already have the
succession.
Omni: And a sense of movement--so you have
replaced time with movement?
Bohm: Yes, in the sense of movement of the
symphony, rather than the
movement
of the orchestra on a bus, say, through physical space....In
classical
mechanics, movement or velocity is defined as the relation between
the
position now and the position a short time ago. What was a short time
ago is
gone, so you relate what is to what is not. This isn't a logical
concept.
In the implicate order you are relating different frames that are
co-present
in consciousness. You're relating what is to what is. A moment
contains
flow or movement. The moment may be long or short, as measured in
time. In
consciousness a moment is around a tenth of a second. Electronic
moments
are much shorter, but a moment of history might be a century.
á
Bohm liked
to use the television and the broadcasting system as an example:
ÒThe signal, screen, and television electronics
in this analogy represent the Implicate Order whilst the image produced
represents the Explicate Order. He also uses an interesting example in which an
ink droplet can be introduced into a highly viscous substance (such
as glycerine),
and the substance rotated very slowly such that there is negligible diffusion of
the substance (ink and glycerine are said to be immiscible Ð meaning that they
donÕt dissolve into each other.
Lava lamps are created by immiscible components). In this example, the
droplet becomes a thread that, in turn, eventually becomes invisible. However,
by rotating the substance in the reverse direction, the droplet can essentially
reform. When it is invisible, according to Bohm, the order of the ink droplet
as a pattern can be said to be implicate within the substance.
In another analogy, Bohm asks us to consider a
pattern produced by making small cuts in a folded piece of paper and then,
literally, unfolding it. Widely separated elements of the pattern are, in
actuality, produced by the same original cut in the folded piece of paper. Here
the cuts in the folded paper represent the Implicate Order and the unfolded
pattern represents the Explicate Order.
This explicate order is the surface appearance of
a much greater enfolded or implicate order, most of which is hiddenÉ. it might
be tempting to assume that the implicate order refers to a subtle level of
reality that is secondary and subordinate to the primary explicate order, which
we see manifest all around us. However, for Bohm, precisely the opposite is the
case: The implicate order is the fundamental and primary reality, albeit
invisible. Meanwhile, the explicate orderÑthe vast physical universe we
experienceÑis but a set of "ripples" on the surface of the implicate
order. The manifest objects that we regard as comprising ordinary reality are
only the unfolded projections of the much deeper, higher dimensional implicate
order, which is the fundamental reality. The implicate and explicate orders are
interpenetrating in all regions of space-time, and each region enfolds all of
existence, that is, everything is enfolded into everything.
Bohm believes that each part of physical reality
(explicate forms) contains information about the whole (implicate). Thus in
some sense, every part of the universe "contains" the entire
universeÉ we have all experienced a glimmer of this in the following
commonplace example. Imagine yourself gazing upward at the night sky on a clear
night, and consider what is actually taking place. You are able to discern
structures and perceive events that span vast stretches of space and time, all
of which are, in some sense, contained in the movements of the light in the
tiny space encompassed by your eyeball. The photons entering your pupil come
from stars that are millions of light years apart, and some of these photons
embarked on their journey billions of years ago to reach their final
destination, your retina. In some sense, then, your eyeball contains the entire
cosmos, including its enormous expanse of space and immense history in
timeÑalthough, of course, the details are not highly refined. Optical and radio
telescopes have much larger apertures, or "holographic plates", and
consequently they are able to glean much greater detail and precision than the
unaided eye. But the principle is clear, and it is extraordinary to
contemplateÓ.
You can
think of the explicate form as a focal point of the implicate structure/system. A possible ÒstaticÓ moment or form
within a dynamic system that cannot be seen, in its entirety, at any one
moment.
-> excellent introductory article
by William Keepin that goes into more detail on BohmÕs ideas.
á
kartOO
á
twttr
á Collective
Intelligence/CI
Blog>>aka: integrated intelligence
David Bohm wrote many books,
one of them was entitled simply ÒOn DialogueÓ. This work was written late in his life
and was an attempt at exploring collective intelligence. The idea was to get between twenty and
forty people into a room and have them engage in a group exploration of ideas,
and to reveal the implicate structure of human interaction, and explore the
connections between the explicate and implicate Ð to use the explicate to
perceive the form of the implicate by suspending the will towards
Newtonian/Cartesian ÒclarityÓ Ð to listen deeply to others and to realize the
complex connections we all share at every moment, and the degrees to which those
rich connections are minimized during standard discussions. The dialogue was not intended to be a
discussion Ð as Bohm noted a semantic relationship between the words
discussion, percussion, and concussion.
Discussion, for Bohm and others, was understood to imply a form of
communication where one personÕs idea was to be argued. Discussions fractured groups of people
and engaged primarily the ego.
Bohm wanted to explore the complement of discussions, which he termed
dialogues (meaning dia ÒthroughÓ, logos ÒideasÓ). The ego is an aspect of dialogue but the goal is to
establish empathy through listening to each other. I will give you something to read about BohmÕs dialogue
technique in a few weeks. Later
today we are going to do a small experiment based on his ideas, and some of the
ideas weÕve discussed today.
á A central concept is to listen to others
and acknowledge your own responses to what is being said, and then to suspend
your responses, not to suppress Ð but to hold them ÒthereÓ, keeping them
available so that when you feel the time is right, you chime in with your
relevant association, and the dialogue evolves from there. The idea is to take time to explore the
deeper issues that we all are trying to explore.
á
Can you
think of some ÒdiscursiveÓ forms that people engage in? Here is a start: concerts, lectures,
moviesÉ
á
Can you
think of some ÒdialogicÓ forms?
To prepare for our dialogic experiment:
ÒIn
Western science, the formative years of our training are traditionally based on
Newtonian abstraction. The methods we are taught do not make us comfortable with
relating to, or resolving, contradictory information or modes of thought. They
teach us, instead, to screen out one of the options. They force us to eradicate
apparently extraneous data and opinion, in the interests of over-simplicity,
predictability and economic or temporal efficiency, just as soon as they seem
irrelevant to our original aim.
The
fact is, however, that in this way, we often throw our proverbial baby out with
the claw-footed bath. First, because abstracted thinking is inappropriate for dealing
with a natural world of chaotic, dynamic and complex behaviors. Second,
because, as modern psychologists Howard Gardner [1, 2] and Bernice McCarthy [3,
4] point out, the acknowledgement of contradictory information is an important
part of the rational learning process, the creative process and the evolution
of integrated intelligence. Ò
From Contradiction
and Analogy as a basis for inventive thinking
Model/Metaphor,
explicate/implicate forms of order
The experiment
(finally!): a collaborative, implicate sentence generation
Another modelÉ
Five
obstructions by Lars von Trier ÒHis agenda is to strip away the pretense,
to get from the "perfect" to the "human," as he puts it.
Media as an ensemble of actions
Alternative/Augmented Reality Games, from the
beginning:
Assignment:
á Next week
we play wtt
Week 4
Weather or not we are going to
play wtt
outside todayÉ
á The word interaction has lately been
applied to just about any relationship between people or things, as though
shapes interact in a Picasso painting. More properly, the word implies
deliberation over the exchange of messages. Much experience can be
understood as interaction, of course. As a usual point of departure, one
can approach interaction as a conversation. One party acts or speaks, and
the other interprets and then responds. This distinguishes the exchange
from mere transmittal. The more that the response follows one assertion
and invites another, the more engaging the interaction is thought to be.
Supporting contexts and protocols help keep this on track.Ó
Today we will be playing a game called
Òwalkers_towers_trackersÓ Weather permitting. As noted above, this is a
mobile urban strategy game, which is different than an online game, or mobile
multiplayer role player game. We will discuss the differences.
Here are the details:
walkers_towers_trackers is an mobile urban strategy game where
teams of towers and trackers search for, and attempt to encircle a single or
pair of walkers.
Using any available technology. A
typical team of trackers has one tower, who sits at a computer and receives
periodic images from the walkers. From these images, towers attempt to
deduce the direction of the walkers and communicate with their associated
tracker party to work together to find the walkers before the walkers photo the
trackers. The end game involves the coordination of the tracking parties
to surround the walkers. A variation exists where the trackers can
eliminate each other by photographing each other first. This creates a
layer of play where the towers, who often share data and strategy, must change
their behavior to keep their own team in the gameÉ.
Here is how to start:
The start of play:
The game continues until the trackers surround
the walkers.
Variation 1:
We will use this google maps application I wrote to
keep track of things:
if you look at
this script, can you figure out how to add pop-up message windows?
into flash?
with
maps/visualizations in mind:
_______________________________________________________________________________
Week 5
Any thoughts on
improving walkers_towers_trackers?
More elaborate
games:
Media as an
ensemble of actions
Alternative/Augmented
Reality Games, from the beginning:
>>
interactive
design:
o
Presentation
by Per Persson, Mikko
Aarras, Petri
Piippo & Tetsuya
Yamamoto & myself to last year's Designing
the User Experience conference can now be downloaded from here
[2MB].
o
Slides
include photo examples of how to think about carrying behaviors including:
¤
Center
of Gravity, (scroll down to Nov. 11, 2005)
¤
Point
of Reflection (scroll down to Nov. 11, 2005), and the
¤
Range
of Distribution (scroll down to Nov. 11, 2005).
o
ÒA
conclusion? The easiest way to have nothing to forget is to have
nothing to remember. Whilst you might be tempted to interpret this as
a form of Zen philosophy, it is actually more about the art of delegation.Ó
¤
Sound
familiar?
o
Related
research here and here.
o Jane FultonÕs Òthoughtless actsÓ
identity
as an ensemble of interactive objects Ð Autotopography assignment or, Òhow do
the objects you carry around compute your identity?Ó
***Ricardo
Dominguez lecture is Thursday, September 28th at 8pm in Brown 320***
fyi:
ÒIncreases
in transistors per chip will advance interconnect technology, and when
nanoelectronics replace silicon as the technology of choice, the interconnect
era will truly begin.Ó
__________________________________________________________________________________________
Week 6
Bruce
Sterling South by Southwest Speech,
March 3, Ô06
- is the internet of things an example of our contemporary commodity fetishism?
Media as an ensemble of actions
Alternative/Augmented Reality Games, from the beginning:
"Groupware" is all about things like "workflow", which means, "the chairman of the committee has emailed me this checklist, and I'm done with item 3, so I want to check off item 3, so this document must be sent back to my supervisor to approve the fact that item 3 is changing from `unchecked' to `checked', and once he does that, it can be directed back to committee for review."
Nobody cares about that shit. Nobody you'd want to talk to, anyway.
Consider these quotes from Bruno Latour's latest book, Reassembling the social: An introduction to actor-network-theory (2005, Oxford University Press)
ÒAccording to Latour, the social designates "a type of connection between things that are not themselves social" (p. 5, italics in original). Examining the social is, therefore, the tracing of associations between things, or 'actors' in the vocabulary of actor-network theory. These things or actors can be human as well as non-human:
A new vaccine is being marketed, a new job description is offered, a new political movement is being created, a new planetary system is discovered, a new law is voted, a new catastrophe occurs. In each instance, we have to reshuffle our conceptions of what was associated together because the previous definition has been made somewhat irrelevant. We are no longer sure about what 'we' means; we seem to be bound by 'ties' that don't look like regular social ties.
Actor
Network Theory:
|
Actor |
Any element that bends space around itself, makes other |
¯ Hmm, are actors spimes???
¯ Can you think about why we, mobile, technological enhanced web beings as we are, might want to spend some time thinking carefully about the associations we have with our stuff Ð and how our stuff is not simply passive in relation to our will? We train to the medium, and the key is to expand our understanding of the social to include our stuff (ÔactorsÕ broadly defined). Deploying controversies is a method of observing the associations among actors, and watching things associate reveals specific characteristics of different actors.
ÒDispersion, destruction, and deconstruction are not the goals to be achieved but what needs to be overcome. It's much more important to check what are the new institutions, procedures, and concepts able to collect and to reconnect the social" (p. 11).]
Latour describes three steps that are treated in each part of the book: deployment, stabilization, and composition:
1. "We first have to learn how to deploy controversies so as to gauge the number of new participants in any future assemblage (Part I); then
2. We have to be able to follow how the actors themselves stabilize those uncertainties by building formats, standards, and metrologics (Part II); and finally,
3. We want to see how the assemblages thus gathered can renew our sense of being in the same collective"
What do you think about the works weÕve discussed above in relation to LatourÕs ideas? Do you think that the tools of the web/mobile web are an indication that we are working to Òrenew our sense of being in the same collectiveÓ?
Artificial Culture:
A
Laboratory in Human Complex Systems
Exploring "What
if?" Scenarios:
How to describe, understand and explain
multiple causation and interrelatedness
through interactive evolutionary multi-agent computer simulations.
ÒAs we move into the age of ubiquitous computing, we
are in danger of forgetting how we first made things think and how things are
thinking today. Computation is increasingly hidden on chips, sealed in plastic
behind the stylish skins of our appliances, under the sexy high performance
hoods of our automobiles, and behind the sizzling screens of our PCs, ATMs and
cell phones. Information seems to have lost its materiality as, increasingly,
we envision it freely floating in a global ether of wireless connectivity.
While it is a pleasure to be seduced by these sleek virtual realities, looking
underneath their thin veneers is a good sanity check. In this talk, computer
collector Nicholas Gessler will give us a close-up look at a variety of early
technological devices - things that think - starting with the original complex
computing mechanism, the Jacquard loom. We will look at mechanical and
electromechanical computing modules, at the lacy handmade marvel of "core"
memories, and the physically sculptural beauty of "cam" memories.
Finally, we'll examine some 20th Century cryptographic machines. A real-life
show-and-tell. Perhaps, as Gessler dreams, we can develop a Rube-Goldbergian
aesthetic that foregrounds processes linking computation across all of its
evolutionarily diverse media, moving towards an aesthetic of intermediation.Ó
Non-sequitor:
Passive Dynamics
On ARGs and various
interactions with the Datasphere:
Mr. Lawrence Lessig is a professor of law at
Stanford Law School and founder of its Center for Internet and Society.
His talk focuses on the following
points:
1) Creativity and innovation always built on the past.
2) The past always tries to control the creativity that builds upon it.
3) Free societies enable the future by limiting the power of the past.
4) Ours is less and less a free society.
Mr Lessig is clearly angered and confused by the
seemingly utter lack of action on the part of the populace in the face of these
clear erosions of the Òcreative commonsÓ, and the dire implications for our
collective future. Why have we become robots, focused on learning
specific software apps without poking our heads out and looking around to get a
broader view of our emerging environment?
Electronic Frontier
Foundation
LessigÕs talk is a few years old. Since then a
few ÒadvancementsÓ have taken place that seem to confirm some of his
assertions:
The patriot act etched in silicon:
Intel Pentium D and
Macintosh Ð please read the entire article
Net
Neutrality from PBS, pt. 1
Net
Neutrality from PBS, pt. 2
PBS/Moyars
special airs Wednesday, October 18th, 9pm on PBS, check your local
listings!
Au contraire -> anti-The net neutrality act
Further reading:
Who
Will Control the Internet? Ð Kenneth Neil Cukier. This is a very well
considered and informative article. If you care about the subjects
mentioned above and would like to participate in future conversations on this
topic PLEASE read this.
Some examples:
OK, but what can artists do?
What is this and why is it important?
Lessig makes the point of the Cotton Gin and itsÕ
patent. LessigÕs comment is that the Cotton Gin could be taken apart by
anyone who wanted to find out how it worked. While it was, legally,
patented in Washington. It was a part of the Òcreative commonsÓ as it was
available to everyone. The digital world seems less available, and more
vulnerable to governmental censure.
I love the .walk applets because they are
both literal and virtual computers Ð e.g., they are providing a view into how
the computer works. They are algorithmic and can be represented in
pseudo-code, while providing a conceptual framework with which to discuss
computers and the way they affect our lives. They may actually even point
to the future of computing, and hereÕs how:
Our task, culturally, is to develop ways to
integrate the online world into the offline. This is inevitable, btw, and
the sooner artists/bold creative thinkers begin to participate in the
development of the discourse the better off we will all be.
HereÕs why:
ÒWeÕve hardly
mastered user experience on the web and now weÕre facing a
future where the detritus of our lives will be ÒtaggedÓ with RFID
chips. How do we design for ambient findability?
The user experience will begin with a keyword
search, but weÕll
have all sorts of new facets and filters for refining our query. I may want to
Google my possessions or the contents of my house or your bookshelf. Last week
I went to the shopping mall for the first (and last) time this year. It was a
horrible experience. I had to physically drag my body from store to store in
search of a specific product. I desperately wanted to Google the Mall. And
thanks to RFID, it may not be too long before thatÕs possible. Of course, Endeca
may be a better choice than Google, since their Guided Navigation approach fits
perfectly with an increasingly faceted future.
Of course, itÕs tough to predict how this will all pan out. A few
futurists including Adam Greenfield, Mike Kuniavsky, Bruce Sterling, and myself
have written about the user experience in a world of ambient findability, but
weÕre only
scratching the surface, and weÕre all probably suffering from apophenia
anyway.Ó
---from you're it!
Here is a series of works that seem to address these
ideas:
These were submitted by Sam Sheffield:
Here is one of my favorites who makes an appearance
in the previous link
Related Links:
Turing
Machines (read the sections on functions and relations Ð makes the points
about mapping of inputs to unique outputs more clearly, perhaps, than the
previous link)
Assignment:
Have a good fall break, and please try
to watch the PBS/Moyars
special airs Wednesday, October 18th, 9pm on PBS, check your local
listings!
Finish your social software
project for next class.
_________________________________________________________________________
Week 7
Your
experiments, thoughts on ANT.
LetÕs
think about the web itself as an actor.
What
are its interests?
Are
there analogous interests in the offline (not battery poweredÉ) IÕm not
talking about web enabled pdaÕs or cellphones or electronic kiosks, IÕm
referring to, for example, fans being able to purchase sports apparel from the
same companies that make the stuff for the professional athletes Ð where, in
earlier times, fans wore fan-gear and the pros wore pro-gear. The breaking down
of boundaries, increased homogeneity; equal access for all Ð that sort of
thing.
Web3.0
Ð Òthe post-pc webÓ is understood as Ubiquitous or Pervasive computing. Spimes are thought objects of
Web3.0. Are there places where you
experience the ideas of the web being placed in environments where the result
is de-creased efficiency, or complication rather than making things better for
more people? Who, if anyone,
benefits from complicated tech?
Remember
jan chipchase?
Future Perfect/Present Imperfect: temporal orientation. Interactivity may be said to connect
the user to the present.
What
does it mean if we are focused on the future? How does that affect the present?
HereÕs
thinkg,
What
is the temporal orientation of the these sites?
Research:
Human
Computer Interface (HCI) paradigms of Web3.0
Òsituational
metadata from the clients network leads to-Ò
Katherine Hayles and Nicolas Gessler (Jane McGonigal is on here, tooÉ) speak at:
____________________________________________________________
Week
8
We
will now begin some tech skill buildingÉ
One
of the best tools to explore data is a database. Databases are invaluable to interactive works. We will spend the next four weeks
working on interacting with databases from phones. Today we will focus on server-side scripting using
html, php and mysql. Our client-side
work will be done with Semacode ,
and callXML 3.0 .
To inspire us, letÕs look at Usman
HaqueÕs work, in particular his Environmental XML.
Databases:
Open:
PHP_Admin
Setup
a database with the name intscr
Add
a table called Tags2
Tag_ID int NOT NULL AUTO_INCREMENT, PRIMARY KEY, Tagone varchar(15), Tagtwo varchar(15), Tagthree varchar(15), Tagfour varchar(15), Tagfive varchar(15),
When
your database (db) is setup, copy the following script into a text editor,
replacing the username, password, and database name with yours. Upload it to your mica server space Ð
(the folder with your name on it in the im244 folder on our server), and run
it.
***IF
YOU COPY AND PASTE THE SCRIPTS BELOW FROM THIS PAGE YOU MUST COPY THEM AS RAW
TEXT****
<?php
$date
= date("Y-m-d");
$time
= date("H:i:s");
$dbh=mysql_connect
("localhost", "<USERNAME>",
"<PASSWORD>");
if
(!$dbh)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("<DATABASE_NAME>",
$dbh);
mysql_query("INSERT
INTO Tags2 (date, time,Tagone, Tagtwo, Tagthree, Tagfour, Tagfive)
VALUES
($date, $time,'Peter', 'Griffin', 'is', 'a', 'what?')");
mysql_query("INSERT
INTO Tags2 (date, time,Tagone, Tagtwo, Tagthree)
VALUES
($date, $time,'Glenn', 'Quagmire', 'isn't')");
mysql_close($dbh);
?>
If
you donÕt get any errors, copy, paste, correct, upload and run this script:
<?php
$dbh
= mysql_connect("localhost","<USERNAME>","<PASSWORD>");
if
(!$dbh)
{
die('Could not connect: ' .
mysql_error());
}
mysql_select_db("<DATABASE_NAME>",
$dbh);
$result
= mysql_query("SELECT * FROM Tags2");
echo
"<table border='1'>
<tr>
<th>date</th>
<th>time</th>
<th>tag_one</th>
<th>tag_two</th>
<th>tag_three</th>
<th>tag_four</th>
<th>tag_five</th>
</tr>";
while($row
= mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" .
$row['date'] . "</td>";
echo "<td>" .
$row['time'] . "</td>";
echo "<td>" .
$row['Tagone'] . "</td>";
echo "<td>" .
$row['Tagtwo'] . "</td>";
echo "<td>" .
$row['Tagthree'] . "</td>";
echo "<td>" .
$row['Tagfour'] . "</td>";
echo "<td>" .
$row['Tagfive'] . "</td>";
echo "</tr>";
}
echo
"</table>";
mysql_close($dbh);
?>
If
this runs without errors, copy, paste, correct, upload, this script:
<?php
$date
= date("Y-m-d");
$time
= date("H:i:s");
$dbh
=
mysql_connect("localhost",",<USERNAME>","<PASSWORD>");
if
(!$dbh)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("<DATABASE
NAME>", $dbh);
$sql="INSERT
INTO Tags2 (date, time,Tagone, Tagtwo, Tagthree, Tagfour, Tagfive)
VALUES
(Ô$dateÕ,Ô$timeÕ,'$_POST[tagone]','$_POST[tagtwo]','$_POST[tagthree]','$_POST[tagfour]','$_POST[tagfive]')";
if
(!mysql_query($sql,$dbh))
{
die('Error: ' . mysql_error());
}
echo
"1 record added";
mysql_close($dbh)
?>
If
this runs without errors, copy, paste, correct, upload, and run this script:
<html>
<body>
<p><b>
Hi! This is part of a research project on tagsonomy. Please enter tags in the
boxes, then hit the submit query button. Thanks! </b>
</p><br>
<form
action="data_in.php" method="post">
date:
<input type="text" name="date" />
time:
<input type="text" name="time" />
Tag_one:
<input type="text" name="tagone" />
Tag_two:
<input type="text" name="tagtwo" />
Tag_three:
<input type="text" name="tagthree" />
Tag_four:
<input type="text" name="tagfour" />
Tag_five:
<input type="text" name="tagfive" />
<input
type="submit" />
</form>
</body>
</html>
If
this script runs without error, go back and run: show_info_from_db_in_form.php
Ð you should see new data in your database.
If
everything is running smoothly, go to Semacode
Ð and create a tag for the complete URL for the: html_into_php.html script (I
showed how to do this at the end of class last week). Call me over, or anyone
who has a cameraphone with Semacode software running on it, and see what
happens if you try to enter some data into the text boxesÉ.
Review
of Scripts for
querying database:
Open
up a text editor and copy the following scripts.
á
html_to_php.html
á
data_in.php
á
test_data_in.php
á
show_info_from_db_in_form.php
á
Read_db.php
Upload
the scripts to your server space for this class (folder with your name on it in
im244 class folder)
Test
them by running:
á
Html_php.html Ð to
input data
á
Show_info.php Ð to read
data youÕve input
Assignment:
Create
three different tables, with four fields each.
Enter
four lines of data into each table using a variation of html_php.html (above)
Use
a variation of show_info.php (above) to check your work.
The
variations to the base scripts will be changes in the field names to correspond
with the field names of our three different tables. You will have to create different html_php.html and
show_info.phpÕs for each new table you create.
Be
patientÉ.
Good
luck!
______________________________________________________________________
Week 9 (PHP/MYSQL
STUFF IS NOW ON WEEK 10, BELOW)
Server update:
David Apaw wrote this in
response to our server questions:
I checked the server and
increased the quotas for the students. I hope this
is the issue. In the past quota issues affected users ability to change
files.
With the FTP connections, I know the Macs have to use full paths instead of
virtual (Courses/IM/Fall/IM244A) as the directory path.
I think with
the Macintosh, the students have to enter the full path instead of using the
FTP virtual directory. That is, the FTP will be:
Host:
digital.mica.edu
username:
portal ID
Password:
portal password
Directory:
courses/IM/IM244A
If any of
you can check this IÕd appreciate it.
In the
meantime, please write two voxeo, callxml scripts and run them via the
application manager in the developer site at voxeo
Review from last class:
***You will need server space to store
your scripts. Your mica server space is fine as the scripts will be very
small. If you donÕt have server space please see me and weÕll get you
some. I suggest you create a folder specifically for your callxml
applications***
<?xml
version="1.0" encoding="UTF-8" ?><callxml
version="2.0"> <text voice="English-Female2">
</callxml>Now try this
script:
This Lesson is based on
the things you accomplished in Lesson 1. If you haven't yet done this Lesson,
you'll need to go through it first so that you aren't left in the dust with the
high-falutin' concepts that we discuss here.
In this tutorial, we will:
In the previous
tutorial, we ended up with a callxml file that looked like this:
<?xml
version="1.0" encoding="UTF-8" ?>
<callxml
version="2.0">
<playaudio value="helloworld.wav"/>
</callxml>
In callxml, things like <playaudio> are called action elements. These
elements perform "actions", such as playing audio, recording audio,
and hanging up. Callxml has another category of elements known as event
elements. These elements describe what to do when various events occur during a
call, such as when the user presses touch-tone keys on their telephone. Here we
will add a callxml event element to the hello world callxml we created in the
last tutorial. This event element will react to the "*" key.
<?xml
version="1.0" encoding="UTF-8" ?>
<callxml
version="2.0">
<playaudio value="helloworld.wav"/>
<ontermdigit value="*">
</ontermdigit>
</callxml>
Now we need to fill in the event element with instructions on what to do when
the '*' key is pressed. In this example, we will use another action element --
the <text> element -- to read text to the caller, telling them that they
"pressed the star key."
<?xml
version="1.0" encoding="UTF-8" ?>
<callxml
version="2.0">
<playaudio value="helloworld.wav"/>
<ontermdigit value="*">
<text>you pressed the star
key.</text>
</ontermdigit>
</callxml>
Next we'll add a second event element for the '#' key, which will tell the
caller they "pressed the pound key" when they do, in fact, press that
key.
<?xml
version="1.0" encoding="UTF-8" ?>
<callxml
version="2.0">
<playaudio value="helloworld.wav"/>
<ontermdigit value="*">
<text>you pressed the star key.</text>
</ontermdigit>
<ontermdigit value="#">
<text>you pressed the pound
key.</text>
</ontermdigit>
</callxml>
Pretty easy so far... but we need to do one more thing. By default, callxml
will not interrupt actions such as <playaudio> when keys are pressed. To
allow an action to be interrupted, or terminated, you must add a termdigits
attribute to the action. Termdigits specifies a list of digits which can
terminate the action. In this tutorial, we'll add termdigits="*#" to playaudio, as shown
below:
<?xml
version="1.0" encoding="UTF-8" ?>
<callxml
version="2.0">
<playaudio value="helloworld.wav"
termdigits="*#"/>
<wait value="4s" termdigits="#*"/>
<ontermdigit value="*">
<text>you pressed the star key.</text>
</ontermdigit>
<ontermdigit value="#">
<text>you pressed the pound key.</text>
</ontermdigit>
<onerror>
<sendemail from="MyApp@here.com"
to="YourEmail@there.net"
type="debug">
We caught an error in our application.
Details follow...
</sendemail>
</onerror>
</callxml>
You'll notice that we also added a new element into the mix, the <wait> tag. We need this to be
placed at the end of our <playaudio>, since our sound file is so short, otherwise,
the caller's DTMF ijnput may not have time to be recognized. You'll probably
also notice that this tag has the same termdigits attribute as in our <playaudio> element. This is
required as well, since if a caller enters DTMF input while in the <wait>, then we need to be
able to trap and handle the event.
We also tossed another curve ball at you, as well. You'll note the <onerror/sendemail> tags at the very bottom
of the code. This is not an accident; since CallXML does not have a Form
Interpretation Algorithm, any and all event handlers should reside at the very
bottom of your CallXML documents in order to execute. The cool thing about this
event handler, coupled with the <sendemail> element, is this:
Whenever the application takes a nose-dive, be it from a fetch error, or a
coding typo, the event will be caught, and an email sent to the email address
that you specify. When we set the type attribute to 'debug' the
resulting email will also contain information about the application failure
that you can use to correct the problem. If the problem in question still
eludes you, you can simply forward the debug email to the Voxeo Support team,
who can use this information to help you fix your application.
This Lesson is based on the
things you accomplished in Lesson 1. If you haven't yet done this Lesson,
you'll need to go through it first so that you aren't left in the dust with the
high-falutin' concepts that we discuss here.
In this tutorial, we will:
In the previous
tutorial, we ended up with a callxml file that looked like this:
<?xml
version="1.0" encoding="UTF-8" ?>
<callxml
version="2.0">
<playaudio value="helloworld.wav"/>
</callxml>
In callxml, things like <playaudio> are called action elements. These
elements perform "actions", such as playing audio, recording audio,
and hanging up. Callxml has another category of elements known as event
elements. These elements describe what to do when various events occur during a
call, such as when the user presses touch-tone keys on their telephone. Here we
will add a callxml event element to the hello world callxml we created in the
last tutorial. This event element will react to the "*" key.
<?xml
version="1.0" encoding="UTF-8" ?>
<callxml
version="2.0">
<playaudio value="helloworld.wav"/>
<ontermdigit value="*">
</ontermdigit>
</callxml>
Now we need to fill in the event element with instructions on what to do when
the '*' key is pressed. In this example, we will use another action element --
the <text> element -- to read text to the caller, telling them that they
"pressed the star key."
<?xml
version="1.0" encoding="UTF-8" ?>
<callxml
version="2.0">
<playaudio value="helloworld.wav"/>
<ontermdigit value="*">
<text>you pressed the star
key.</text>
</ontermdigit>
</callxml>
Next we'll add a second event element for the '#' key, which will tell the
caller they "pressed the pound key" when they do, in fact, press that
key.
<?xml
version="1.0" encoding="UTF-8" ?>
<callxml
version="2.0">
<playaudio value="helloworld.wav"/>
<ontermdigit value="*">
<text>you pressed the star key.</text>
</ontermdigit>
<ontermdigit value="#">
<text>you pressed the pound
key.</text>
</ontermdigit>
</callxml>
Pretty easy so far... but we need to do one more thing. By default, callxml
will not interrupt actions such as <playaudio> when keys are pressed. To
allow an action to be interrupted, or terminated, you must add a termdigits
attribute to the action. Termdigits specifies a list of digits which can
terminate the action. In this tutorial, we'll add termdigits="*#" to playaudio, as shown
below:
<?xml
version="1.0" encoding="UTF-8" ?>
<callxml
version="2.0">
<playaudio value="helloworld.wav"
termdigits="*#"/>
<wait value="4s" termdigits="#*"/>
<ontermdigit value="*">
<text>you pressed the star key.</text>
</ontermdigit>
<ontermdigit value="#">
<text>you pressed the pound key.</text>
</ontermdigit>
<onerror>
<sendemail from="MyApp@here.com"
to="YourEmail@there.net"
type="debug">
We caught an error in our application.
Details follow...
</sendemail>
</onerror>
</callxml>
You'll notice that we also added a new element into the mix, the <wait> tag. We need this to be
placed at the end of our <playaudio>, since our sound file is so short, otherwise,
the caller's DTMF ijnput may not have time to be recognized. You'll probably
also notice that this tag has the same termdigits attribute as in our <playaudio> element. This is
required as well, since if a caller enters DTMF input while in the <wait>, then we need to be
able to trap and handle the event.
We also tossed another curve ball at you, as well. You'll note the <onerror/sendemail> tags at the very bottom
of the code. This is not an accident; since CallXML does not have a Form
Interpretation Algorithm, any and all event handlers should reside at the very
bottom of your CallXML documents in order to execute. The cool thing about this
event handler, coupled with the <sendemail> element, is this:
Whenever the application takes a nose-dive, be it from a fetch error, or a
coding typo, the event will be caught, and an email sent to the email address
that you specify. When we set the type attribute to 'debug' the
resulting email will also contain information about the application failure
that you can use to correct the problem. If the problem in question still
eludes you, you can simply forward the debug email to the Voxeo Support team,
who can use this information to help you fix your application.
Your updated hello world
callxml file is now done. Go ahead and save it as "helloworld.xml",
and upload it to the same web server and directory you uploaded to in the
previous tutorial. Call the number you received in the previous example, and
try pressing '*' or '#'. You should here a message saying which key you've
pressed.
_____________________________________________________________________________
WEEK 10
PHP/HTML/MySql
voting app: for the web and phone.
Today
we will work on adding input and output to our databases. Input and output to a MySql database is
called querying. I will
provide you with some scripts that will do this, then ask you to come up with
something youÕd like voted on, and, most importantly, to script the ifÉthen elements. Look carefully at the scripts below and
youÕll see how.
Think
about how the scripts and databases you created for this week could be used for
a tagsonomy, or, simply, tagging study.
LetÕs
discuss that.
Here
are some projects to consider:
What are the differences between the two?
If
you are interested in getting a new phone, insure that your current carrier
offers both GSM and Data Plans. Go
to their website, and check their list of available phones with:
Symbian OS
Hardware Ð 2nd edition is the most full featured at the moment,
meaning you might want to search ebay .
In
brief, you want a phone that can run Java, Flash lite, has video capabilities, at
least a 1-2 megapixel camera, a browser, and bluetooth.
If
you have a GSM plan (meaning you have a SIM card), you can also purchase an
UNLOCKED phone from a place like myworldphone.com
Ð but you MUST BE SURE YOUR PHONE OPERATES ON 850/1900, phones that operate on
900/1900 will not work well in the USA.
Now
to another project ->
PHP
script that creates a TABLE in a preexisting database Ð YOU DONÕT NEED
PHPMYADMIN TO CREATE A TABLE WITH THIS SCRIPT. THE TABLE WILL WORK WITH ALL OF
THE FOLLOWING SCRIPTS FOR THIS PROJECT
<?php
require_once('code.php'); ?>
<?
$database
= "DATABASE_NAME";
@mysql_select_db($database)
or die( "Unable to select database");
//
Create table in database
mysql_select_db("$database",
$dbh);
$sql
= "CREATE TABLE TABLE_NAME
(
eventID
int NOT NULL AUTO_INCREMENT,
PRIMARY
KEY(eventID),
ip_add
varchar(25),
caller_id
varchar(15),
region
varchar(25),
hood
varchar(15),
emotion
varchar(15),
favnumber
varchar(15),
date
varchar(15),
time
varchar(15)
)";
mysql_query($sql,$dbh);
mysql_close($dbh);
?>
**********************************
A
callxml script that sends data to a database, queries that database, and
responds.
<?xml
version="1.0" encoding="UTF-8"?>
<callxml
version="3.0">
<block
label="Start">
<assign
var = "caller_id" value = "$session.callerid;"/>
<say
voice="English-Male2"> Hello. This is an example of how to gather
information
and
pass it on to a database.
</say>
</block>
<!--
This is the first question-->
<block
label="One">
<say
voice="English-Male2" choices="Northeast (1), Mid Atlantic (2),
South (3),
Midwest
(4), Southwest (5), Pacific Northwest (6), West Coast(7) ">
What
part of the country are you from?
The
northeast is one.
The
mid-atlantic region is two.
The
south is three.
The
midwest is four.
The
southwest is five.
The
pacific northwest is six,
and,
last, the west coast is seven.
</say>
<wait
value="10s"/>
<on
event="choice:nomatch">
<say
voice="English-Male2"> Sorry, I did not understand your response.
Please try
again.</say>
<goto
value="#One"/>
</on>
<on
event="choice:Northeast">
<assign
var = "region" value = "Northeast"/>
<say
voice="English-Male2">You chose $region;.</say>
<goto
value="#Two"/>
</on>
<on
event="choice:Mid Atlantic">
<assign
var = "region" value = "Mid Atlantic"/>
<say
voice="English-Male2">You chose $region;.</say>
<goto
value="#Two"/>
</on>
<on
event="choice:South">
<assign
var = "region" value = "South"/>
<say
voice="English-Male2">You chose $region;.</say>
<goto
value="#Two"/>
</on>
<on
event="choice:Midwest">
<assign
var = "region" value = "Midwest"/>
<say
voice="English-Male2">You chose $region;.</say>
<goto
value="#Two"/>
</on>
<on
event="choice:Southwest">
<assign
var = "region" value = "Southwest"/>
<say
voice="English-Male2">You chose $region;.</say>
<goto
value="#Two"/>
</on>
<on
event="choice:Pacific Northwest">
<assign
var = "region" value = "Pacific Northwest"/>
<say
voice="English-Male2">You chose $region;.</say>
<goto
value="#Two"/>
</on>
<on
event="choice:West Coast">
<assign
var = "region" value = "West Coast"/>
<say
voice="English-Male2">You chose $region;.</say>
<goto
value="#Two"/>
</on>
<on
event="choice:Something Unknown">
<assign
var = "region" value = "An Unknown region"/>
<say
voice="English-Male2">You chose $region;.</say>
<goto
value="#Two"/>
</on>
</block>
<block
label="Two">
<say
voice="English-Male2" choices="City (1), Suburban (2), Country
(3), Bar
(4)">Next
question. What sort of neighborhood did you grow up in? The city is one.
The
suburbs is two. the country is three. A bar is four. somewhere else is
five.</say>
<wait
value="10s"/>
<on
event="choice:nomatch">
<say
voice="English-Male2"> Sorry, I did not understand your response.
Please try
again.</say>
<goto
value="#Two"/>
</on>
<on
event="choice:City">
<assign
var = "hood" value = "city"/>
<say
voice="English-Male2">You chose $hood;.</say>
<goto
value="#Three"/>
</on>
<on
event="choice:suburban">
<assign
var = "hood" value = "suburban"/>
<say
voice="English-Male2">You chose $hood;.</say>
<goto
value="#Three"/>
</on>
<on
event="choice:Country">
<assign
var = "hood" value = "Country"/>
<say
voice="English-Male2">You chose $hood;.</say>
<goto
value="#Three"/>
</on>
<on
event="choice:Restaurant">
<assign
var = "hood" value = "bar"/>
<say
voice="English-Male2">You chose $hood;.</say>
<goto
value="#Three"/>
</on>
<on
event="choice:somewhere else">
<assign
var = "hood" value = "somewhere else"/>
<say
voice="English-Male2">You chose $hood;.</say>
<goto
value="#Three"/>
</on>
</block>
<block
label="Three" >
<say
voice="English-Male2" choices="Hungry (1), Depressed (2), Happy
(3), Scared
(4),
Safe (5), Disgusted (6), Energized (7), Confused (8)">
Next
question. How does this building make you feel? Press one if this building
makes
you feel hungry. Depressed is two. Happy is three. Scared is four. Safe is
five.
Disgusted is six. Energized is seven. Confused is eight.</say>
<wait
value="10s"/>
<on
event="choice:nomatch">
<say
voice="English-Male2"> Sorry, I did not understand your response.
Please try
again.</say>
<goto
value="#Three"/>
</on>
<on
event="choice:Hungry">
<assign
var = "emotion" value = "Hungry"/>
<say
voice="English-Male2">You chose $emotion;.</say>
<goto
value="#Four"/>
</on>
<on
event="choice:Depressed">
<assign
var = "emotion" value = "Depressed"/>
<say
voice="English-Male2">You chose $emotion;.</say>
<goto
value="#Four"/>
</on>
<on
event="choice:Happy">
<assign
var = "emotion" value = "Happy"/>
<say
voice="English-Male2">You chose $emotion;.</say>
<goto
value="#Four"/>
</on>
<on
event="choice:Scared">
<assign
var = "emotion" value = "Scared"/>
<say
voice="English-Male2">You chose $emotion;.</say>
<goto
value="#Four"/>
</on>
<on
event="choice:Safe">
<assign
var = "emotion" value = "Safe"/>
<say
voice="English-Male2">You chose $emotion;.</say>
<goto
value="#Four"/>
</on>
<on
event="choice:Disgusted">
<assign
var = "emotion" value = "Disgusted"/>
<say
voice="English-Male2">You chose $emotion;.</say>
<goto
value="#Four"/>
</on>
<on
event="choice:Energized">
<assign
var = "emotion" value = "Energized"/>
<say
voice="English-Male2">You chose $emotion;.</say>
<goto
value="#Four"/>
</on>
<on
event="choice:Confused">
<assign
var = "emotion" value = "Confused"/>
<say
voice="English-Male2">You chose $emotion;.</say>
<goto
value="#Four"/>
</on>
</block>
<do
label="Four">
<say
voice="English-Male2"> Please enter your favorite number, followed
by the
pound
key. </say>
<getdigits
var="addresswpound" termdigits="#"
maxsilence="10000"
includetermdigit="true"/>
<on
event="termdigit:#">
<assign
var="address" expr="regex-replace( '$addresswpound;', '#', ''
)" />
<say
voice="English-Male2">You entered $address;</say>
<goto
value="#Post"/>
</on>
</do>
<block
label = "Post">
<say
voice="English-Male2">
To
summarize: You come from the $region;, grew up in the $hood;, this building
makes
you feel $emotion;, and your favorite number is $address;.
This
data will now be passed to another script. If all goes well, you will be told that some new data has
been added to the database.</say>
<goto
value="http://THE URL FOR YOUR PHP SCRIPT/callxml_1_data_in.php?"
submit="caller_id,region,hood,emotion,address"
method="get"/>
</block>
</callxml>
**********************************************************************
<?php
$dbh=mysql_connect
("localhost", "<username>",
"<password>") or die ('I cannot connect to the database
because: ' . mysql_error());
?>
***********************************************************************
<?php
require_once('code.php'); ?>
<?php
echo
"<?xml version=\"1.0\" encoding=\"UTF-8\" ?>
";
echo
"\n";
echo
'<callxml version="3.0"> ';
echo
"\n";
echo
'<do label="initial">';
echo
"\n";
echo
'<say>';
$ip_add
= getenv('REMOTE_ADDR');
$caller_id
= $HTTP_GET_VARS["caller_id"];
$region
= $HTTP_GET_VARS["region"];
$hood
= $HTTP_GET_VARS["hood"];
$emotion
= $HTTP_GET_VARS["emotion"];
$favnumber
= $HTTP_GET_VARS["address"];
$date
= date("Y-m-d");
$time
= date("H:i:s");
if
(!$dbh) {
die('Could
not connect: ' . mysql_error());
}
//
select the db
$db_selected
= mysql_select_db('DATABASE_NAME', $dbh);
if
(!$db_selected) {
die
('Can\'t use voxeo : ' . mysql_error());
}
//Add
new entries into database
$sql
= "INSERT INTO TABLENAME (ip_add, caller_id, region, hood, emotion,
favnumber,
date,
time)
VALUES('$ip_add','$caller_id','$region','$hood','$emotion','$favnumber','$date','$time')";
if
(!mysql_query($sql,$dbh))
{
die('Error: ' . mysql_error());
}
echo
"1 record has been added";
//
Find old entries that match yours.
$sql
= "SELECT * FROM `TABLENAME` WHERE `region` = '$region' AND `hood`
= '$hood'
LIMIT
0, 1";
$result
= mysql_query($sql);
while
($row = @mysql_fetch_array($result)) {
printf("<!--
Caller ID: %s -->\n",
$row["caller_id"]);
printf("<!--
From: %s -->\n",
$row["ip_address"]);
printf("The
first person from the %s who grew up in a %s environment\n",
$row["region"],$row["hood"]);
printf("felt
%s in this building\n",
$row["emotion"]);
echo
"</say><wait value =\"1\" /><say>";
printf("They
entered their data on %s\n",
$row["date"]);
printf("Their
phone number is %s\n",
$row["caller_id"]);
}
mysql_close($dbh);
echo
"</say><wait value =\"1\" /><say>";
echo
"To review, you are from $region and grew up in a $hood\n";
echo
"<!--You called from phone number $caller_id on the date $date at the
time
$time.-->\n";
echo
" Your favorite number is $favnumber.\n";
?>
this
php script will now return to the original call xml script and the process
will
repeat.</say>
<goto
value="http://www.rouvelle.com/callxml_1.xml#Start" />
</do>
</callxml>
Assignment:
Adapt the three scripts above, create a
net table, and make your own question/answer/database query/response project.
__________________________________________________________________
Week 11
***if your scripts arenÕt working try commenting out (Ô//Õ)
the $date and $time variables. It
seems some of us donÕt have permissions set properly in our folders to allow
access to this data***
Mysql
Searching: selecting data using conditions
Work on the scripts from last week, adding increased
interactivity via Mysql searching.
You are free to alter the given scripts in any way. If you have moved on to the pie
chart/voting apps below, try to connect callxml to the pie chart: a voice
activated voting system.
>>>
demoscrazy
But first: modern
day robin hood Ð what do you think of this action? What do you think of the statement that
this is part of a larger project?
What might that project be?
Who and what are these Robin HoodÕs robbing, and whom are they giving
to? If the project makes people
climb around on the street for a few dollars perhaps its not as simple as the
guy talking over the images says:
ÒWeÕre giving out free money to make people smile, itÕs
simple.Ó
I donÕt know but I sense that the people clamoring after $1
donÕt really need it Ð I would have liked to do some follow up and found out
what they did with the $1-$4 they got.
Selling oneÕs dignity one dollar at a time? Why donÕt they just give money to the hungry, for example?
For some reason IÕve been associating the M.I.A. video for bucky done gun with
the modern day robin hood video above.
I think it is a combination of some of the gestures of throwing things
into a crowd in both (remember Ricardo Dominguez talking about gesture: demos?),
and the response by the ny papers which suggest that the mdrh event was
actually inciting violence. There
have been some comments about M.I.A. that suggest the work as glamorizing urban
ethnic battle. Here is a line:
I'm armed and I'm equal
More fun for the people
My point is that these two gestures have intentions of
unifying a group but under what terms?
>>>
Here are three more scripts that add to the scripts from
last week:
<?php
require_once('code.php'); ?>
<?php
if
(!$dbh)
{
die('Could
not connect: ' . mysql_error());
}
mysql_select_db("DATABASE_NAME",
$dbh);
$result
= mysql_query("SELECT * FROM TABLENAME");
while($row
= mysql_fetch_array($result))
{
echo
$row['date'] . " " . $row['time'] . " " .$row['region'] .
" " . $row['hood']
.
" " . $row['emotion'] . " " .$row['caller_id'] . "
" .$row['ip_add'];
echo "<br />";
}
mysql_close($dbh);
?>
****************************
<?php
require_once('code.php'); ?>
<?
$database
= "DATABASE_NAME";
@mysql_select_db($database)
or die( "Unable to select database");
$query="SELECT
* FROM TABLE_NAME";
$result=mysql_query($query);
$num=mysql_numrows($result);
mysql_close();
echo
"<title>read database into simple form</title>";
echo
"<b><center>Database Output</center></b><br><br>";
$i=0;
while
($i < $num) {
$date=mysql_result($result,$i,"date");
$time=mysql_result($result,$i,"time");
$ip=mysql_result($result,$i,"ip_add");
$caller_id=mysql_result($result,$i,"caller_id");
$region=mysql_result($result,$i,"region");
$hood=mysql_result($result,$i,"hood");
$emotion=mysql_result($result,$i,"emotion");
echo
"<b>Date: </b><i>$date</i><br><b>Time:
</b><i>$time</i><br><b>Ip:
</b><i>$ip</i><br><b>Phone:
</b><i>$caller_id</i><br><b>Region:
</b><i>$region<i><br><b>Neighborhood:
</b><i>$hood</i><br><b>Emotion:
</b><i>$emotion</i><hr><br>";
$i++;
}
?>
****************
remember Usman HaqueÕs Environmental XML?
It is now live, here is a script that parses a database and spawns an xml
document:
<?php
require_once('code.php'); ?>
<?php
$db_name
= "DATABASE_NAME";
$table_name
= 'TABLE_NAME';
mysql_select_db($db_name,
$dbh);
$query
= "select * from " . $table_name;
$result
= mysql_query($query, $dbh) or die("Could not complete database
query");
$num
= mysql_num_rows($result);
if
($num != 0) {
$file=
fopen("results.xml", "w");
$_xml
="<?xml version=\"1.0\" encoding=\"UTF-8\"
?>\r\n";
$_xml
.="<site>\r\n";
while
($row = mysql_fetch_array($result)) {
if
($row["eventID"]) {
$_xml
.="\t\t<date> " . $row["date"] .
"</date>\r\n";
$_xml
.="\t\t<time> " . $row["time"] .
"</time>\r\n";
$_xml
.="\t\t<IP>" . $row["ip_add"] .
"</IP>\r\n";
$_xml
.="\t\t<phone>" . $row["caller_id"] .
"</phone>\r\n";
$_xml
.="\t\t<region>" . $row["region"] .
"</region>\r\n";
$_xml
.="\t\t<hood>" . $row["hood"] .
"</hood>\r\n";
$_xml
.="\t\t<emotion>" . $row["emotion"] .
"</emotion>\r\n";
} else {
$_xml .="\t<page
title=\"Nothing Returned\">\r\n";
$_xml
.="\t\t<file>none</file>\r\n";
$_xml .="\t</page>\r\n";
} }
$_xml .="</site>";
fwrite($file, $_xml);
fclose($file);
echo "XML has been written. <a
href=\"results.xml\">View the XML.</a>";
} else {
echo "No Records found";
} ?>
Assignment: Vacation.
__________________________________________
Week 12
Hope you all had a good break.
Today we will again work on scripting with html, php, mysql,
callxml, etc. in class. Sam will
again be joining us. Our goals are for each of you to:
1.
Get
both the vote.php and callxml_1.xml examples above working, then
2.
to
have each of you create a project that involves customizing some of the scripts
above by next week.
1.
customizing
the scripts should involve creating your own questions and conditional logic
for each.
2.
please
create your own mysql queries by looking at: Mysql
Searching: selecting data using conditions, for the callxml_1
examples.
Cascading
Style Sheets (CSS), a brief intro via an excellent site .
Coincidentally,
Sam created an extension of the vote.php stuff that incorporates CSS.
How to edit the scripts above in our lab:
3.
open
ÒdreamweaverÓ
4.
create
a new, blank, html document
5.
copy
the script you want to work with off of this page.
6.
paste
it into a blank code window in dreamweaver.
7.
inspect
the code for characters that clearly donÕt belong there, delete them.
8.
save
the script with the proper extension.
9.
try
it out in the browser.
10.
if
all is well, upload it to your im244a folder.
Some stuff I donÕt think I covered from earlier in the
syllabus:
Our task, culturally, is to develop ways
to integrate the online world into the offline. This is inevitable, btw,
and the sooner artists/bold creative thinkers begin to participate in the
development of the discourse the better off we will all be.
HereÕs why:
ÒWeÕve hardly mastered user experience on the
web and now weÕre facing a future where the detritus of
our lives will be ÒtaggedÓ with RFID chips. How do we design for
ambient findability?
The user experience will begin with a
keyword search, but weÕll have all sorts of new facets and
filters for refining our query. I may want to Google my possessions or the
contents of my house or your bookshelf. Last week I went to the shopping mall
for the first (and last) time this year. It was a horrible experience. I had to
physically drag my body from store to store in search of a specific product. I
desperately wanted to Google the Mall. And thanks to RFID, it may not be too
long before thatÕs possible. Of course, Endeca may be a
better choice than Google, since their Guided Navigation approach fits
perfectly with an increasingly faceted future.
Of course, itÕs
tough to predict how this will all pan out. A few futurists including Adam
Greenfield, Mike Kuniavsky, Bruce Sterling, and myself have written about the
user experience in a world of ambient findability, but weÕre
only scratching the surface, and weÕre all
probably suffering from apophenia anyway.Ó
---from you're
it!
Here is a series of works that seem to
address these ideas:
These were submitted by Sam Sheffield:
Related Links:
Some
other, potentially useful tools:
Re: final project:
1.
if
you are finding that the html/php/mysql/callxml is going to take you a few more
weeks to get working, then do that for your final project.
2.
if
you have already, or by next week will have those exercises done, then please
create a final, INTERACTIVE project of your own design.
1.
Using
a combination of tools/ideas weÕve covered, create an interactive work, bearing
in mind that interactive means: a persistent relationship of mutual
influence. Your work may
involve html/php/callxml/mysql, or dotwalk, or public intervention/interaction
(doeat, improve everywhere, ANT, dotwalk, Gaming, etc.). The more you can combine different
things weÕve studied the better.
Combining, for example: dotwalk with semacode with php/mysql, if you create a very ambitions project
then please be able to make a presentation on how the piece would work and
provide working prototypes Ð e.g., bits of working code that would, if the
project were fully realized, would play an important role.
>>Review:
Re:
PhP
Html color
combination chooser
Html color mapping/hex and rgb
Here is an example you
can expand with what you already know.
I
found the image (ideal for the cell phone screen at 100 x 100 pixels), here
___________________________________________________________________
Week 13
Today will be another work session! Tonight the IM Fall Spectacular opens
in Rosenberg at 6pm. Free
cheese! Bring your friends. Or else.
>>flash/php/mysql
o Just in
case #1 (fuzzy on flash?)
o Just in
case #2 (still fuzzy?)
_______________________________________________
The
script -> compare it to the scripts you wrote this week, how is it
different?
********************************************************************
<html>
<body
BGCOLOR="#111111">
<img
src=test_53.jpg><br>
<p><b><i>
<font color=ff0000>Hi! This is part of a research project on tagsonomy.
Please
select a description of your current environment from the drop down menus,
then
enter tags in the boxes below for the image above. Thanks sucka!
</font></i></b>
</p><br>
<form
action = "insert.php" method = "GET">
<select
name="vote"> <option
value="1">emotion</option>
<option
value="2">object</option> <option
value="3">leave me alone</option>
</select>
<input
type=hidden name=mode value=voted>
<input
type=submit>
</form>
<form
action="insert.php" method="post">
<font
color=ff0000>Tag_one: </font><input type="text"
name="tagone" />
<font
color=ff0000>Tag_two: </font><input type="text"
name="tagtwo" />
<font
color=ff0000>Tag_three: </font><input type="text"
name="tagthree" />
<font
color=ff0000>Tag_four: </font><input type="text"
name="tagfour" />
<font
color=ff0000>Tag_five: </font><input type="text"
name="tagfive" />
<input
type="submit" />
</form>
</body>
</html>
****************************************
Script1:
<?php
$db_name
= "dbname";
$username
= "username";
$password
= "password";
$connection
= mysql_connect("localhost", $username, $password) or die
("Could not connect.");
mysql_select_db($db_name,
$connection);
if
(!$connection) {
die('Could
not connect: ' . mysql_error());
}
//Add
new table
$sql
= "CREATE TABLE votes (first INTEGER, second INTEGER, third
INTEGER)";
mysql_query($sql);
mysql_close($connection);
$result
= mysql_query($sql, $connection) or die("Could not complete database
query");
?>
******************************************************************
Script 2:
<?php
$db_name
= "dbname";
$username
= "username";
$password
= "password";
$connection
= mysql_connect("localhost", $username, $password) or die
("Could not
connect.");
mysql_select_db($db_name,
$connection);
if
(!$connection) {
die('Could
not connect: ' . mysql_error());
}
//Insert
Data into table votes
$sql
= "INSERT INTO votes (first, second, third) VALUES (1,1,1)";
mysql_query($sql);
mysql_close($connection);
$result
= mysql_query($sql, $connection) or die("Could not complete database
query");
?>
*******************************************************************
Script 3: live
<?php
$db_name
= "dbname";
$table_name
= 'votes';
$username
= "username";
$password
= "password";
$connection
= mysql_connect("localhost", $username, $password) or die
("Could not
connect.");
mysql_select_db($db_name,
$connection);
//Name
of our cookie
//$cookie
= "Voted";
//A
function to display our results - this refrences vote_pie.php which we will
//also
make
function
pie ()
{
$data
= mysql_query("SELECT * FROM votes")
or
die(mysql_error());
$result
= mysql_fetch_array( $data );
$total
= $result[first] + $result[sec] + $result[third];
$one
= round (360 * $result[first] / $total);
$two
= round (360 * $result[sec] / $total);
$per1
= round ($result[first] / $total * 100);
$per2
= round ($result[sec] / $total * 100);
$per3
= round ($result[third] / $total * 100);
echo
"<body BGCOLOR=\"#111111\">";
echo
"<img
src=vote_pie.php?one=".$one."&two=".$two."><br>";
Echo
"<font color=ff0000> OPTION 1 </font> <font
color=ffffff> has $result[first]
votes:
$per1 % </font> <br>
<font
color=0000ff>OPTION 2 </font> <font color=ffffff> has
$result[sec] votes:
$per2
% </font> <br>
<font
color=00ff00>OPTION 3 </font> <font color=ffffff> has
$result[third] votes:
$per3
% </font> <br>
<br>";
if
( ($per1 > $per2) & ($per1 > $per3))
{
Echo
"<font color=9900ff>>>Turn
Right<<</font><br><br>";
}
else
if ( ($per2 > $per1) & ($per2 > $per3) )
{
Echo
"<font color=ffff00>>>Go Straight Two
Blocks<<</font><br><br>" ;
}
else
if ( ($per3 > $per1) & ($per3 > $per2) )
{
Echo
"<font color=ffff00>>>Turn
Left<<</font><br><br>" ;
}
else
{
Echo
"<font color=ffff00>>>Turn
Left<<</font><br><br>";
}
}
//This
runs if it is in voted mode
//if
( $mode=="voted")
//{
//makes
sure they haven't already voted
//if(isset($_COOKIE[$cookie]))
//{
//Echo
"Sorry You have already voted this month<br>";
//}
//sets
a cookie
//else
//{
//$month
= 2592000 + time();
//setcookie(Voted,
Voted, $month);
//
adds their vote to the database
switch
($vote)
{
case
1:
mysql_query
("UPDATE votes SET first = first+1");
break;
case
2:
mysql_query
("UPDATE votes SET sec = sec+1");
break;
case
3:
mysql_query
("UPDATE votes SET third = third+1");
}
//displays
the poll results
pie
();
//}
//}
//if
they are not voting, this displays the results if they have already voted
//if(isset($_COOKIE[$cookie]))
//{
//pie
();
//}
//
or if they have not voted yet, they get the voting box
//else
//{
//if(!$mode=='voted')
//{
echo
"</body>"
?>
<form
action = "<?php echo $_SERVER[ÕPHP_SELFÕ]; ?>" method =
"GET">
<select
name="vote"> <option value="0">Select an
option...<option value="1">Option
1</option>
<option
value="2">Option 2</option> <option
value="3">Option 3</option>
</select>
<input
type=hidden name=mode value=voted>
<input
type=submit>
</form>
<?
//}
//}
?>
***********************************************
Script 4:
<?php
$slide = $one + $two;
header('Content-type: image/png');
$handle = imagecreate(100, 100);
$background = imagecolorallocate($handle,
0, 0, 0);
$red = imagecolorallocate($handle, 255,
0, 0);
$green = imagecolorallocate($handle, 0,
255, 0);
$blue = imagecolorallocate($handle, 0, 0,
255);
$darkred = imagecolorallocate($handle,
150, 0, 0);
$darkblue = imagecolorallocate($handle,
0, 0, 150);
$darkgreen = imagecolorallocate($handle,
0, 150, 0);
$pie_color[8] =
ImageColorAllocate($handle, 128, 255, 0);
// 3D look
for ($i = 60; $i > 50; $i--)
{
imagefilledarc($handle, 50, $i, 100, 50,
0, $one, $darkred, IMG_ARC_PIE);
imagefilledarc($handle, 50, $i, 100, 50,
$one, $slide , $darkblue, IMG_ARC_PIE);
imagefilledarc($handle, 50, $i, 100, 50,
$slide, 360 , $darkgreen, IMG_ARC_PIE);
}
imagefilledarc($handle, 50, 50, 100, 50,
0, $one , $red, IMG_ARC_PIE);
imagefilledarc($handle, 50, 50, 100, 50,
$one, $slide , $blue, IMG_ARC_PIE);
imagefilledarc($handle, 50, 50, 100, 50,
$slide, 360 , $green, IMG_ARC_PIE);
imagepng($handle);
?>
***************************************************************
Study scripts 1-4. Copy them, insert your username and
password, and upload them. Adapt
them by changing the ifÉthen, and personalize them by inserting your own
categories and things to vote on.
When you have successfully adapted them, figure out how to change the
drop down menu to radio buttons, here is an adaptation of the vote.php script
that will work, save it as vote2.php:
Script 5 (variation on vote.php, with
variables and radio buttons):
<?php
$db_name = "dbname";
$table_name = 'votes';
$username = "username";
$password = "password";
$opone = "METAPHOR";
$optwo = "REALITY" ;
$opthree = "TRUTH" ;
$connection =
mysql_connect("localhost", $username, $password) or die ("Could
not connect.");
mysql_select_db($db_name, $connection);
//Name of our cookie
//$cookie = "Voted";
echo "<title> Voting Cell Test
1 </title>";
//A function to display our results -
this refrences vote_pie.php which we will //also make
function pie ()
{
$sym1 = "METAPHOR";
$sym2 = "REALITY";
$sym3 = "TRUTH";
$data = mysql_query("SELECT * FROM
votes")
or die(mysql_error());
$result = mysql_fetch_array( $data );
$total = $result[first] + $result[sec] +
$result[third];
$one = round (360 * $result[first] /
$total);
$two = round (360 * $result[sec] /
$total);
$per1 = round ($result[first] / $total *
100);
$per2 = round ($result[sec] / $total * 100);
$per3 = round ($result[third] / $total *
100);
echo "<body
BGCOLOR=\"#111111\">";
echo "<img
src=vote_pie.php?one=".$one."&two=".$two."><br>";
Echo "<font color=ff0000>
$sym1 </font> <font color=ffffff> has $result[first] votes: $per1 %
</font> <br>
<font color=0000ff> $sym2
</font> <font color=ffffff> has $result[sec] votes: $per2 %
</font> <br>
<font color=00ff00> $sym3
</font> <font color=ffffff> has $result[third] votes: $per3 %
</font> <br>
<br>";
if ( ($per1 > $per2) & ($per1 >
$per3))
{
Echo "<font
color=9900ff>>>Turn
Right<<</font><br><br>";
}
else if ( ($per2 > $per1) & ($per2
> $per3) )
{
Echo "<font
color=ffff00>>>Go Straight Two
Blocks<<</font><br><br>" ;
}
else if ( ($per3 > $per1) & ($per3
> $per2) )
{
Echo "<font
color=ffff00>>>Turn Left<<</font><br><br>"
;
}
else
{
Echo "<font
color=ffff00>>>Turn
Left<<</font><br><br>";
}
}
//This runs if it is in voted mode
//if ( $mode=="voted")
//{
//makes sure they haven't already voted
//if(isset($_COOKIE[$cookie]))
//{
//Echo "Sorry You have already voted
this month<br>";
//}
//sets a cookie
//else
//{
//$month = 2592000 + time();
//setcookie(Voted, Voted, $month);
// adds their vote to the database
switch ($vote)
{
case 1:
mysql_query ("UPDATE votes SET first
= first+1");
break;
case 2:
mysql_query ("UPDATE votes SET sec =
sec+1");
break;
case 3:
mysql_query ("UPDATE votes SET third
= third+1");
}
//displays the poll results
pie ();
//}
//}
//if they are not voting, this displays
the results if they have already voted
//if(isset($_COOKIE[$cookie]))
//{
//pie ();
//}
// or if they have not voted yet, they
get the voting box
//else
//{
//if(!$mode=='voted')
//{
echo "</body>"
?>
<form action = "<?php echo
$_SERVER[ÕPHP_SELFÕ]; ?>" method = "GET">
<INPUT TYPE=RADIO
NAME="vote" VALUE="1"><font color=ffffff> <?php
echo $opone; ?></font><BR>
<INPUT TYPE=RADIO
NAME="vote" VALUE="2"><font color=ffffff> <?php
echo $optwo; ?></font><BR>
<INPUT TYPE=RADIO
NAME="vote" VALUE="3"><font color=ffffff> <?php
echo $opthree; ?></font><P>
<INPUT TYPE=SUBMIT VALUE="submit">
</form>
<?
//}
//}
?>
*****************************************************
Assignment: (please start in class)
Create one variation on the above scripts
that produces an interactive poll. Think creatively about using semacode, or
some other method for getting users involved with your poll Ð and realize the
scripts above and below can be used to create an interactive game.
***If you work hard to understand this
stuff and find that you are stuck, please send me an email and I will arrange
for you to meet with our department consultant sam.****
Here are some enhancements to the scripts
above that produce a nine-option poll and corresponding pie chart. Carefully study the differences
between:
Vote.php ˆ vote_9_opts.php
Vote_pie.php ˆ vote_pie_9_opts.php
If youÕd like to change the look of the
pie chart consult these sites:
Html color
combination chooser
Html color mapping/hex and rgb
But I would prefer if you customized them
with your own questions, and conditional logic. Bear in mind that you
can use semacode tags, etcÉ as gateways
into your project.
Script 1:
<?php
$db_name
= "dbname";
$username
= "username";
$password
= "password";
$connection
= mysql_connect("localhost", $username, $password) or die
("Could not connect.");
mysql_select_db($db_name,
$connection);
if
(!$connection) {
die('Could
not connect: ' . mysql_error());
}
$sql = "CREATE TABLE votes9
(
personID int NOT NULL AUTO_INCREMENT,
PRIMARY KEY(personID),
first INTEGER,
sec INTEGER,
third INTEGER,
fourth INTEGER,
fifth INTEGER,
sixth INTEGER,
seventh INTEGER,
eighth INTEGER,
ninth INTEGER
)";
mysql_query($sql,$connection);
mysql_close($connection);
?>
**********************************************
Script 2:
<?php
$db_name
= "dbname";
$username
= "username";
$password
= "password";
$connection
= mysql_connect("localhost", $username, $password) or die
("Could not
connect.");
mysql_select_db($db_name,
$connection);
if
(!$connection) {
die('Could
not connect: ' . mysql_error());
}
//Insert
Data into table votes9
$sql
= "INSERT INTO votes9 (first, sec, third, fourth, fifth, sixth, seventh,
eighth, ninth) VALUES (1,1,1,1,1,1,1,1,1,1)";
mysql_query($sql);
mysql_close($connection);
$result
= mysql_query($sql, $connection) or die("Could not complete database
query");
?>
*******************************************************
Script3:
<?php
$db_name = "dbname";
$table_name = 'votes9';
$username = "username";
$password = "password";
$OPONE = "METAPHOR";
$OPTWO = "REALITY" ;
$OPTHREE = "TRUTH" ;
$connection =
mysql_connect("localhost", $username, $password) or die ("Could
not
connect.");
mysql_select_db($db_name, $connection);
//Name of our cookie
//$cookie = "Voted";
//A function to display our results -
this refrences vote_pie.php which we will
//also make
function pie ()
{
$data = mysql_query("SELECT * FROM
votes9")
or die(mysql_error());
$result = mysql_fetch_array( $data );
$total = $result[first] + $result[sec] +
$result[third] + $result[fourth] +
$result[fifth] + $result[sixth] +
$result[seventh] + $result[eighth] +
$result[ninth];
$one = round (360 * $result[first] /
$total);
$two = round (360 * $result[sec] /
$total);
$three = round (360 * $result[third] /
$total);
$four = round (360 * $result[fourth] /
$total);
$five = round (360 * $result[fifth] /
$total);
$six = round (360 * $result[sixth] /
$total);
$seven = round (360 * $result[seventh] /
$total);
$eight = round (360 * $result[eighth] /
$total);
$nine = round (360 * $result[ninth] /
$total);
$per1 = round ($result[first] / $total *
100);
$per2 = round ($result[sec] / $total *
100);
$per3 = round ($result[third] / $total *
100);
$per4 = round ($result[fourth] / $total *
100);
$per5 = round ($result[fifth] / $total *
100);
$per6 = round ($result[sixth] / $total *
100);
$per7 = round ($result[seventh] / $total
* 100);
$per8 = round ($result[eighth] / $total *
100);
$per9 = round ($result[ninth] / $total *
100);
echo "<body
BGCOLOR=\"#111111\">";
echo "<img
src=vote_pie_9_opts.php?one=".$one."&two=".$two."&three=".$three."&four=".$four."&five=".$five."&six=".$six."&seven=".$seven."&eight=".$eight."&nine=".$nine."><br>";
echo "<font color=ff0000>
OPTION 1 </font> <font color=ffffff> has $result[first] votes:
$per1 % </font> <br>
<font color=0000ff>OPTION 2
</font> <font color=ffffff> has $result[sec] votes: $per2 %
</font> <br>
<font color=ff0000> OPTION 3
</font> <font color=ffffff> has $result[third] votes: $per3 %
</font> <br>
<font color=ff0000> OPTION 4
</font> <font color=ffffff> has $result[fourth] votes: $per4 %
</font> <br>
<font color=ff0000> OPTION 5
</font> <font color=ffffff> has $result[fifth] votes: $per5 %
</font> <br>
<font color=ff0000> OPTION 6
</font> <font color=ffffff> has $result[sixth] votes: $per6 %
</font> <br>
<font color=ff0000> OPTION 7
</font> <font color=ffffff> has $result[seventh] votes: $per7 %
</font> <br>
<font color=ff0000> OPTION 8
</font> <font color=ffffff> has $result[eighth] votes: $per8 %
</font> <br>
<font color=00ff00>OPTION 9
</font> <font color=ffffff> has $result[ninth] votes: $per9 %
</font> <br> <br>";
if ( ($per1 > $per2) & ($per1 >
$per3))
{
Echo "<font
color=9900ff>>>Turn
Right<<</font><br><br>";
}
else if ( ($per2 > $per1) & ($per2
> $per3) )
{
Echo "<font
color=ffff00>>>Go Straight Two
Blocks<<</font><br><br>" ;
}
else if ( ($per3 > $per1) & ($per3
> $per2) )
{
Echo "<font
color=ffff00>>>Turn
Left<<</font><br><br>" ;
}
else
{
Echo "<font
color=ffff00>>>Turn
Left<<</font><br><br>";
}
}
//This runs if it is in voted mode
//if ( $mode=="voted")
//{
//makes sure they haven't already voted
//if(isset($_COOKIE[$cookie]))
//{
//Echo "Sorry You have already voted
this month<br>";
//}
//sets a cookie
//else
//{
//$month = 2592000 + time();
//setcookie(Voted, Voted, $month);
// adds their vote to the database
switch ($vote)
{
case 1:
mysql_query ("UPDATE votes2 SET
first = first+1");
break;
case 2:
mysql_query ("UPDATE votes2 SET sec
= sec+1");
break;
case 3:
mysql_query ("UPDATE votes2 SET
third = third+1");
break;
case 4:
mysql_query ("UPDATE votes2 SET
fourth = fourth+1");
break;
case 5:
mysql_query ("UPDATE votes2 SET
fifth = fifth+1");
break;
case 6:
mysql_query ("UPDATE votes2 SET
sixth = sixth+1");
break;
case 7:
mysql_query ("UPDATE votes2 SET
seventh = seventh+1");
break;
case 8:
mysql_query ("UPDATE votes2 SET
eighth = eighth+1");
break;
case 9:
mysql_query ("UPDATE votes2 SET
ninth = ninth+1");
break;
}
//displays the poll results
pie ();
//}
//}
//if they are not voting, this displays
the results if they have already voted
//if(isset($_COOKIE[$cookie]))
//{
//pie ();
//}
// or if they have not voted yet, they
get the voting box
//else
//{
//if(!$mode=='voted')
//{
echo "</body>"
?>
<form action = "<?php echo
$_SERVER[ÕPHP_SELFÕ]; ?>" method = "GET">
<select name="vote">
<option value="0"> Select an option...</option><option
value="1">option
1</option>
<option value="2">Option
2</option> <option value="3">Option 3</option>
<option value="4">option
4</option>
<option value="5">Option
5</option> <option value="6">Option 6</option>
<option value="7">option
7</option>
<option value="8">Option
8</option> <option value="9">Option 9</option>
</select>
<input type=hidden name=mode
value=voted>
<input type=submit>
</form>
<?
//}
//}
?>
*******************************************************
Script 4:
<?php
$slide1 = $one + $two;
$slide2 = $slide1 + $three;
$slide3 = $slide2 + $four;
$slide4 = $slide3 + $five;
$slide5 = $slide4 + $six;
$slide6 = $slide5 + $seven;
$slide7 = $slide6 + $eight;
header('Content-type: image/png');
$handle = imagecreate(100, 100);
$background = imagecolorallocate($handle,
0, 0, 0);
$pie_color[1] =
ImageColorAllocate($handle, 0, 67, 255); //blue
$pie_color[2] =
ImageColorAllocate($handle, 255, 165, 0); //orange
$pie_color[3] =
ImageColorAllocate($handle, 0, 255, 255);
$pie_color[4] =
ImageColorAllocate($handle, 0, 175, 99);
$pie_color[5] =
ImageColorAllocate($handle, 153, 0, 153);
$pie_color[6] =
ImageColorAllocate($handle, 255, 0, 0); //
$pie_color[7] = ImageColorAllocate($handle,
255, 255, 0);
$pie_color[8] =
ImageColorAllocate($handle, 128, 255, 0);
$pie_color[9] =
ImageColorAllocate($handle, 255, 127, 127);
$pie_color[10] =
ImageColorAllocate($handle, 0, 0, 195); //dark blue
$pie_color[11] = ImageColorAllocate($handle,
255, 115, 0); //dark
$pie_color[12] =
ImageColorAllocate($handle, 0, 211, 255);
$pie_color[13] =
ImageColorAllocate($handle, 0, 135, 99);
$pie_color[14] =
ImageColorAllocate($handle, 139, 0, 153);
$pie_color[15] =
ImageColorAllocate($handle, 223, 0, 0); //
$pie_color[16] =
ImageColorAllocate($handle, 255, 221, 0);
$pie_color[17] =
ImageColorAllocate($handle, 128, 232, 0);
$pie_color[18] =
ImageColorAllocate($handle, 226, 127, 127);
// 3D look
for ($i = 60; $i > 50; $i--)
{
imagefilledarc($handle, 50, $i, 100, 50,
0, $one, $pie_color[10], IMG_ARC_PIE);
imagefilledarc($handle, 50, $i, 100, 50,
$one, $slide1 , $pie_color[11], IMG_ARC_PIE);
imagefilledarc($handle, 50, $i, 100, 50,
$slide1, $slide2 , $pie_color[12], IMG_ARC_PIE);
imagefilledarc($handle, 50, $i, 100, 50,
$slide2, $slide3, $pie_color[13], IMG_ARC_PIE);
imagefilledarc($handle, 50, $i, 100, 50,
$slide3, $slide4 , $pie_color[14], IMG_ARC_PIE);
imagefilledarc($handle, 50, $i, 100, 50,
$slide4, $slide5 , $pie_color[15], IMG_ARC_PIE);
imagefilledarc($handle, 50, $i, 100, 50,
$slide5, $slide6, $pie_color[16], IMG_ARC_PIE);
imagefilledarc($handle, 50, $i, 100, 50,
$slide6, $slide7 , $pie_color[17], IMG_ARC_PIE);
imagefilledarc($handle, 50, $i, 100, 50,
$slide7, 360 , $pie_color[18], IMG_ARC_PIE);
}
imagefilledarc($handle, 50, 50, 100, 50,
0, $one, $pie_color[1], IMG_ARC_PIE);
imagefilledarc($handle, 50, 50, 100, 50,
$one, $slide1 , $pie_color[2], IMG_ARC_PIE);
imagefilledarc($handle, 50, 50, 100, 50,
$slide1, $slide2 , $pie_color[3], IMG_ARC_PIE);
imagefilledarc($handle, 50, 50, 100, 50,
$slide2, $slide3, $pie_color[4], IMG_ARC_PIE);
imagefilledarc($handle, 50, 50, 100, 50,
$slide3, $slide4 , $pie_color[5], IMG_ARC_PIE);
imagefilledarc($handle, 50, 50, 100, 50,
$slide4, $slide5 , $pie_color[6], IMG_ARC_PIE);
imagefilledarc($handle, 50, 50, 100, 50,
$slide5, $slide6, $pie_color[7], IMG_ARC_PIE);
imagefilledarc($handle, 50, 50, 100, 50,
$slide6, $slide7 , $pie_color[8], IMG_ARC_PIE);
imagefilledarc($handle, 50, 50, 100, 50,
$slide7, 360 , $pie_color[9], IMG_ARC_PIE);
imagepng($handle);
?>
________________________________________________________________
Assignment:
