Click here to launch the experiment.
I figured out how to implement double buffering in Flash this morning, and this is the result: 500 particles, with transparency and a blur filter.
If this seems to run slow, click on the headline to this article to open the Flash movie in a page where it isn’t competing for resources with the other experiments.
Click here to launch the experiment.
This is 100 particles following a simple curve formula. Anything repeated 100 times is going to be kind of interesting.
Here it is. My first real experiment in Flash 9.
Because, first and foremost, Flash is a trip toy.
Code for this experiment here:
package {
import flash.display.*;
import flash.events.Event;
import flash.geom.*;
import flash.filters.BlurFilter;
public class BitmapRotate2 extends Sprite {
private var _graphic:PolyStar;
private var _graphic2:PolyStar;
private var _bitmap:BitmapData;
private var _image:Bitmap;
private var _m:Matrix;
private var _blurFilter:BlurFilter;
private var xSpeed:Number = .9;
private var ySpeed:Number = 1.1;
public function BitmapRotate2() {
_graphic = new PolyStar(0,0,7,false,50,30,0,0xff0000,100,0x0000ff,100);
_m = _graphic.transform.matrix;
_blurFilter = new BlurFilter();
addEventListener(Event.ENTER_FRAME,registerStage);
}
public function registerStage(event:Event) {
if(stage) {
removeEventListener(Event.ENTER_FRAME,registerStage);
_graphic.x = 0
_graphic.y = 0;
_bitmap = new BitmapData(stage.stageWidth,stage.stageHeight,true,0xff000000);
_image = new Bitmap(_bitmap);
_m = _graphic.transform.matrix;
_graphic2 = new PolyStar(stage.stageWidth/2,stage.stageHeight/2,9,true,stage.stageWidth/2-20,stage.stageWidth/6,0,0xff0000,100,0xff0000,0);
addChild(_image);
addEventListener(Event.ENTER_FRAME,onEnterFrame);
}
}
private function onEnterFrame(event:Event) {
_graphic.rotation+=5;
_graphic.x = mouseX;
_graphic.y = mouseY;
_m = _graphic.transform.matrix;
_bitmap.draw(_graphic,_graphic.transform.matrix);
_bitmap.draw(_graphic2,_graphic2.transform.matrix);
_bitmap.applyFilter(_bitmap,_bitmap.rect,new Point(),_blurFilter);
}
}
}
The “PolyStar” class is here:
package {
import flash.display.Shape
public class PolyStar extends Shape{
public function PolyStar($x:Number,$y:Number,$points:Number,$vertical:Boolean,$outerRad:Number,$innerRad:Number,$lineW:Number,$lineC:Number,$lineA:Number,$bgC,$bgA:Number) {
var points:Number = $points*2;
var angleDelta:Number = (Math.PI*2 / points);
var angle:Number = 0;
var anglex:Number = 0;
var angley:Number = 0;
graphics.lineStyle($lineW,$lineC,$lineA);
if(typeof($bgC)=="number") {
graphics.beginFill($bgC,$bgA);
} else {
graphics.beginGradientFill($bgC.type,$bgC.colors,$bgC.alphas,$bgC.ratios,$bgC.matrix);
}
if($vertical != true) {
graphics.moveTo($outerRad,0);
} else {
graphics.moveTo(//change orientation of polygon
Math.cos(angle + (angleDelta/2)) * $outerRad,
Math.sin(angle + (angleDelta/2)) * $outerRad
);
}
for(var i=0;i<points;i++) br=""> angle += angleDelta;
var temp:Number = (i%2) ? $outerRad: $innerRad;
if($vertical != true) {
anglex = Math.cos(angle) * temp;
angley = Math.sin(angle) * temp;
} else {//change orientation of polygon
anglex = Math.cos(angle + (angleDelta/2)) * temp;
angley = Math.sin(angle + (angleDelta/2)) * temp;
}
graphics.lineTo(anglex,angley);
}
x = $x;
y = $y;
}
}
}
Enjoy!
introducing papervision3D
carlos ulloa
www.papervision3d.org
blog.papervision3d.org
wiki.papervision3d.org
open source 3d library or Flash
genesis: Spark conference Amsterdam 2005
-presentation by joost korngold – renascent
2006.12.02 – papervision went open source
-papervision license: MIT license – free for commercial use
-open-sourced so that people could use it
2006.12.10
ralph hauwert – the guy who built he rhino
core team: carlos ulloa, John Grdner, Ralph Hauwert
COMMUNITY has been very important. Feedback has been invaluable
WHY PAPERVISION?
-powerful: Flash 3d is extremely difficult to do well.
-easy to use : people should be able to pick it up quickly, immediately be useful
-production driven design
-high performance realtime 3d rendering
-linear texture mapping per face
-hierarchy, instances, materials management
EASY TO USE
-useful for developers and designers
-designed for Flash
-AS3-style syntax -3d objects should not be more complex than movieclips
-no maths required defaults to using degrees
-you can use your own 3d package
-create and modify without recompiling
-preview your scenes in realtime
COLLADA – data format
-open standard
-XML based
-scene format
-multiple objects and textures per scene
-supports camera, materials, paths, tween & skeleton animation, physics
-originally created by Sony for PS3 and PSP-now property of Khronos
Free plugins available for Maya, 3dsm, softimage XSI, and Blender
-adopted by many commercial game studios, game engines, and Google Earth
-Thanks, Collada!
METAPHOR which we use in papervision
-in a computer, 3d data must be rendered in 3d
1. Scene (stage) -> Objects (thing) -> materials (look and feel) ->
2. Scene -> Camera (viewpoint)
OBJECT
org.papervision3d.objects
displayobject3d -> xyz pos, xys rotation, scale, scale xyz, visible, name, parent, root
3d model
-created by a 3d artist in a 3d package (GENERALLY NOT DESIGNED BY THE DEVELOPER)
planes
-planes moving in 3d, mimicking a 3d object
Primitives
-cube, sphere, cone, cylinder
Skybox
-panorama
Particles
-e.g. stars
Materials
org.papervision3d.materials
Textures
-bitmapdata, MC, library assets, jpg, png, flv
-Photoshop CS3 extended
Cameras
-the location from which the scene is being viewed
org.papervision3d.cameras
extends displayobject3d
-target – a thing the camera follows
ONE LINE OF CODE
-each behavior can be implemented with one line of code
-Flash CS3 component in the works
MORE COMING SOON
animation
-Tim Knip – skeleton animation
-Jim Armstrong – classes for hands, arms, etc.
MATERIALS
-visual quality
-z-flat shading : quick, easy, not the best
-phong shading
-z-flat shading textured implementation
-phong shading
-argh! Too many ways of rendering to copy down!
BumpMapping
COMING SOON
Normalmapping – high poly to low poly without datsa loss
specular maps – reflection mapping
cubic environment mapping – thing the Terminator 2
Mip-Maps
Real silhouettes/outline shading..not cheating using a filter
plugin structure for custom materials
lighting structures
shadow structures
z-buffer(?)
PERFORMANCE
current RC2 speed increase: 20%
better clipping, fogging, depth queuing
Demo reel: HOLY SHIT!!!!!!!!
[also lots of photos of the screen]
Experience Information
Marcos Weskamp
www.marumushi.com
-one number really doesn’t mean anything until compared to another number
wikipedia: information visualization
many different ways of visualizing a dataset.
many different datasets can be included in one visualization
Voronoi diagram — look this up
data can be both useful and beautiful
[.eps printouts of dynamic visualizations]
PARSE
ANALYSE
reduce
organize
learn
VISUALIZE
difference
contextualize
reduce
PROJECT: Wieden + Kennedy (www.wk.com)
used QT back in 2001.
brought in MW for a re-build of their site
anything can be information
in any data source, decide what the information points are, and create the interface based on which aspect of the data is most important
APPLICATION ARCHITECTURE
Justin Lewis, Instrument — www.instrum3nt.com
“restful” : CMA
-RoR /Ajax
-beautiful
[I need to dive into Flex]
EXPERIMENT EXPERIMENT EXPERIMENT!!!!!!!
DIGG API EXPERIMENT
Introducing the Chumby
Steve Tomlin CEO
Duane Maxwell Head of Software Engineering
www.chumby.com
What is Chumby?
-still in Alpha-level prototype
-A device
-a company
-a media (widget) network
-plug powered, wifi connected
-connects to Chumby network
-runs Flash Lite 2.1.1, eventually Flash Lite 3
Flash Lite community
-Chumby team
business partner
flash community at large
Why is Chumby?
-some stuff on internet is REALLY important to us
-we can’t spend all day in front of our computers
-but we want the internet around us all the time
-PCs require interaction and full attention and don’t integrate well into our lives
-smartphones don’t PUSH, they PULL
-think “look at your watch” rather than “browse on a PC”
-we want a lot of info in our lives
Chumby: the religion
-make it inexpensive
-make it powerful
-make it “open”
SO WHAT’S THE DEAL FOR US?
-we sell Chumbys as close to cost as possible
-Chumbys display, they don’t store—always connected to Chumby network
-network grows: more widgets
WHAT’S THE DEAL FOR JOHN WINKELMAN (DEVELOPER)?
-we create audience for your work
unlike mobile phone ecosystems, Chumby is open
-no taxes, no publishers, no carrier certification, no deck placement issues
-i.e. fewer middlemen
-Chumby is viral; Chumby content providers retain total control of their content; think of it as Chumby having a license for our work
WIDGETS
if widgets are good, they should be available everywhere
-virtual Chumbys in MySpace, apple dashboard, cellphones, etc.
-widgets should be everywhere, and Flash is more fun
NEW CHUMBY INFORMATION!!!!!!!
-price $165, +$9.95 s&h
-if it is cheaper, we will lose $$
-no additional fees
-no subscriptions
-accessories (chumBling)
-new classic colors, plus limited editions
-accessories to customize chumby (currently 1 USB port, later probably 2)
[input from stuff talked about in “making it physical” ]
-FM radio adapter
-IPOD
-launch this summer with Flash Lite III
-Flash video & audio
-based on Flash 8
WE NEED YOUR HELP
-create and upload cool Flash Lite Widgets
-stay in touch with us (blogs, forms, wikis)
-move to San Diego and work for us!
CHUMBY TECHNICAL SPECS
3 versions of Chumby
-foo — prototype last august
-katamari — 2nd gen prototype
-ironforge (production)
[photo of lots of screens — too much info to type]
Chumbys talk loudly over LANs
-Chumby doesn’t need to be on network to test new hardware/software
-public widgets are hosted on chumby server, but content that Chumby displays can be pulled from anywhere
-the CHUMBY is going to be freaking cool!
-Chumby native resolution is 320 x 240px, but it is Flash, so it is vector
-ads will be more sponsors, rather than commercials
-“chumBooty” — offer for stuff, ring tone, scavenger hunt clue, etc.
-“advertoon” think YouTube, but with advertising
-ads will keep the bandwidth free.
-possible future subscription for people who don’t want ads at all.
-“we’re trying not to screw it up and make it annoying”
-pin-out for larger LCD? Yes, info on forum.
-video — playing 12fps full screen takes up 60% CPU, on the alpha build of Chumby
-Chumby network — limited to Flash files
-a lot of work has gone into privacy/security, so there won’t be any Benedict Chumbys
Building Casual Games in Flash
Philip Kerrman
philipkerrman.com/fitc/
Built most of these games for MSN messenger.
Casual Game: “Carefree game”
<50 megabytes
try -> explore -> buy
“adver-game”
-either fully sponsored (branded up the wazoo) or maybe a subtle watermark, or an ad you have to see before you play
casual games are not usually done in Flash—more often director/java, etc.
Casual game -> you pay for
advergame -> client pays for it
casual game market is HUGE, >50% women
a casual game will sell for ~$20
try/buy conversion rate:
>2% is a hit
1-2% is the norm
<1% is poor
portals will pay the author ~30%
Advergames
-usually work for hire
-simply skinning an existing game isn’t popular
-wide range of money-making opportunities for free games with advertising
-banner ads
-in-game sponsorship
-pre game ad
-in-game (break-time) ad
ARMS RACE
-more and more advanced graphics
-increased user expectations
XBLA—6m xbox users
-try but — very frictionless
-they say 75k – 300k to produce a game
-certification
-games sell for $10
conversion rates around 30-35%
-better revenue share: 50/50 or better
-gatekeepers
WINDOW LIVE MESSENGER
-250m users
15 unique game users per month
-potentially 30-35m players
30% average yearly growth
-subscriptions
-ad revenue
NOMENCLATURE
Up sell — try version gives you a nag screen to buy the full version
frictionless —
Portals — “publishers” for your casual games.
-big portals take a bigger cut, but tend to be more stable and more trustworthy
badges/achievements — visible “pride” based declaration of your awesomeness at a game
ADAPT YOUR SKILLS
-use the appropriate tools for the target market
TECHNICAL STUFF
1. GAME MUST BE FUN!!!!!
2. user experience
2. user experience
4. user experience
USABILITY
MS Games prototyped using PAPER mockups of all the screens
Casual games often have to live within a framework, which YOU have to adjust to, because THEY won’t change it for you.
You will need to include “ad breaks” functionality in your game
You are living in reality
-lean toward the lowest common denominator
MULTI-PLAYER
-griefing situations
-race conditions
-technical limits
-home-made random seed
-turn-based is MUCH easier
-don’t underestimate difficulty involved
2 player game > single player game * 2
AI
-many different ways of thinking about it
PORTING OF GAMES
-many many many venues in which a game can live
LOCALIZATION — allow for many different fonts, lengths of words
-this could be the hardest/most frustrating part of the development
CHEATS
-think of them as “hints”
-Keep the number of server requests to a minimum.
-synchronizing is difficult, but very important
-if two people perform an action on an object at the same time, before the info is sent to the server
-learn ways to make data smaller so it gets sent faster, especially in situations where a lot of info is constantly going back and forth
GRIEVING — one person quits, the other stays on, expecting to play
Games need to be bulletproof, and they need to talk loudly but briefly to the server
[jigsaw game] — every piece has the same registration point: 0:0. Even if it is visually all thee way across the stage, it is a small visible portion of a big empty movie clip
-international portal games can have a long development process
The Blind Sketchmaker- exploring evolutionary and generative art with Flash
Mario Klingemann – quasimondo.com
Can computers create art all by themselves?
No: Only artists can create art.
[stuff about art as a system of belief]
art happens because our brains want an assignment after the basic work is done:
color – find food
danger – pattern matching
aim/estimate distance
orient/find your way home
-select mating partner
-protect and care for offspring
-learn new things
-get bored
What makes it art? Good networking
Komar and Melamid: “America’s most wanted painting”
www.diacenter.org/km/
Artist battle
http://www.saatchi-gallery.co.uk/showdown/
is it art or not?
If not Art can computers at least create art?
can computers create interesting pictures?
Maybe.
Learning to see
-The more you know, the more you see
-What do we have to look for?
-How can we tell art from noise?
-How can a program “See” after all?
This session = Too much art, not enough generative.
This session has nothing to do with anything. I just wasted an hour.
Well, he pulled it together a little bit in the last five minutes, showing us how his tool creates generative art…based on the “Biomorph” experiments of Richard Dawkins.
It has created some badass art.
Great tool, fantastic experiment, boring session
“Let’s Get Physical” — ambiance as input data
Craig Swan
crashmedia
talking about ideas
“change the way you look at things— and the things that you look at change”
API — (H)API Human Application Programming Interface
flash can be a set of ears — using a microphone
-it knows how loud things are—useful for building environments
eg. “ambient awareness”
everything which you can make Flash aware of an be a variable
VISION
-flash can “see” using the camera
-flash can measure change in video from moment to moment
-e.g. motion sensor recording
with bitmapdata Flash can record video and play it back, non-linearly
detecting motion-
flash can react, real-time with video captures being used to interact with “virtual overlays”
gesture-based interface
grabbing bitmap data from live video, applying live filters for display
find keys for content delivery from the environment. Give Flash eyes and ears. take the input and make use of it.
TIME
time as meta data of real-time input
replay frames, or parts of frames, at different time intervals, or completely out of sequence
videograbber
timescanner
timetunnel
TOUCH
all input devices are CONTACTS — one thing making a connection with another
IPAC — allows the creation of your own controllers for a computer input is interpreted as key presses—WHICH CAN BE USED BY FLASH
EXAMPLE. Wired up a wind chime. The wind outside controls an app running in Flash
EXAMPLE: Ethernet cable — wires hooked up to finger rings which, when contact is made, sends info back to Flash
Conductive thread
conductive paint
conductive marker
you can draw an electric circuit on a wall, or sew it into a garment. Plug it into the IPAC and you have a new input device
LITEGRAF
painting with light drawn from a physical palette
EXAMPLE: Wired up a simple lock and key which could be used to lock/unlock accessibility to a computer
TOOLS:
Arduino
Phidget RFID
RFID detectors/readers can be picked up for $60
The many Flavors of Sensors
breath distance proximity light temperature acceleration noise remote current
Once the input comes in, you can can process that info and send it back into the world in another form
“Teleo”?
wireless flash zipzap remote
Sudden Motion Sensors (inside all mac books — accelerometer)
Blinking lights and buttons — MONOME input device
“OSC” Open Sound Control
two-way communication between flash and controllers
Playing with knobs : MIDI
midi2flash by crashmedia olaf matthers
WIImote to Mac controller: wiili.org “darwinremote” by hiroaki kimura