Home Contact RSS

StomperNet’s Stomper Universe | Interactive Flash Site Map

June 25, 2008 at 10:20 pm · 205 views · Filed under portfolio, work

StomperNet now has a site map. Only it’s much bigger than just a site map, we’re calling it Stomper Universe! It contains all the pieces parts that make up StomperNet. It links to different sites, video series, tools, and more by giving a 3D interactive space to inspect the thumbnails and click through to the sites! It will help visitors navigate easily to all areas of StomperNet, whether they are new to them or old favorites.

So go check out the StomperNet Universe now!

Stompernet universe thumbnail

Tags: , , , , , , , , ,

Comments

Brownian Movement in Actionscript | Random Motion Tutorial

June 24, 2008 at 10:34 pm · 843 views · Filed under tutorial

Overview

Having things drift around or move randomly has always interested me. Having an animation that is never going to be the exact same thing is very exciting. The focus turns from key-ing exact animations to programming a feel and letting the animations take car of themselves! One type of seemingly random motion is Brownian motion. This gives the movement a random walk wandering look, it will just drift around with no real direction.

Steps

Step by step this process is very simple. In every random motion you create the random number, and apply it to the property. If you want constant random action (motion) rather than just random placement, you repeat that over and over.

  1. Make a random number (random velocity)
  2. Apply the random number (apply velocity to property)
  3. Repeat (if needed)

To create a random number in actionscript, use Math.random(), which creates a random number between 0 and 1. Usually you’ll want to scale it to a range you want to use. If you want a number between 50 and 100, you’d do Math.random() * 50 + 50. *50 to scale it to 0-50, and + 50 to bring it up to 50 - 100. Also if we want to get a 100 range around 0 (-50 - 50) we would do Math.random() * 100 - 50. In the code below I’ve abstracted this to Math.random() * this.randomRange - this.randomRange/2.

Example

(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)
Here I’ve got dots created and placed randomly, with randomly set scale and alpha. On every frame each dot has a random velocity applied to it’s x and y coordinates.
The yellow dot is the simple example (code below) and the rest are included in the complex example below.

Actionscript

Simple Example:

  1. dotOne.onEnterFrame = function() {
  2. //create a random velocity for x and y direction
  3. vx = Math.random() * 4 - 2;
  4. vy = Math.random() * 4 - 2;
  5. //apply velocity to coordinates
  6. this._x += vx;
  7. this._y += vy;
  8. }

Complex example:

  1. var numDots = 25;
  2. var randomRange = 1;
  3.  
  4. for(var i=1; i<=numDots; i++) {
  5. //create a new dot
  6. duplicateMovieClip(_root.dot, "dot"+i, i);
  7. //save it's ref path for use
  8. theDot = _root["dot"+i];
  9. //give it random coordinates
  10. theDot._y = Math.random() * Stage.height;
  11. theDot._x = Math.random() * Stage.width;
  12. //give each dot a distinct random range
  13. theDot.randomRange = i/numDots;
  14. //give each dot a random size and transparency
  15. theDot._xscale =
  16. theDot._yscale =
  17. theDot._alpha =  i*4;
  18.  
  19. //apply this code on the dot every frame
  20. theDot.onEnterFrame = function() {
  21. //create a random velocity for x and y direction within the specifically created random range for each dot
  22. vx = Math.random() * this.randomRange - this.randomRange/2;
  23. vy = Math.random() * this.randomRange - this.randomRange/2;
  24. //apply velocity to coordinates
  25. this._x += vx;
  26. this._y += vy;
  27. }
  28. }

Download

randomMotion.fla

Tags: , , , , , , , ,

Comments

Dynamic Flash Scrolling Link List XML driven Component on FlashDen

March 26, 2008 at 8:42 pm · 3,256 views · Filed under portfolio

Go get the file at FlashDen

Dynamic Scrolling Link List XML driven (No Wrap)

An interactive link list. Vertically scrolling list of links or just text. Could be used for a nav menu or a link list, or even just a scrolling list. Scroll speed calculated dynamically from mouse position to give not only scrolling control, but also speed control. Reads an external XML file containing just titles and url paths and creates this interactive click-able link list! On click the link is highlighted and on release loads the url either in a blank window or not (configurable). On rollover the list item grows with animation and is highlighted (all configurable, size speed etc). Once end of list is reached scrolling stops, another version is available with a wrap-around feature: Dynamic Scrolling Link List XML driven Auto wrapping

(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)

Tags: , , , , , , , , , ,

Comments

Interactive Spin Actionscript Tutorial

March 14, 2008 at 6:51 pm · 3,692 views · Filed under portfolio, tutorial

I have been thinking of different interactions that are possible with objects. If you’ve read this blog at all you’ll know that I’ve played with physics and gravity and throwing balls and bouncing balls and all sorts. But I hadn’t wrapped my head around an interactive spinner. I know it’d be easy to make a slider or something that would apply a spin to an object, but this just isn’t interactive enough for me.

Circle with slider to rotate and button for random spin:
(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)

This attempt at spinning is ok. I mean, it spins the object and it even glides to a stop if you press the button for a random spin… But it’s just not intuitive and not fun. But if you want this, here’s how I did it.

Actionscript:

  1. drag = .96;
  2. speed = 0;
  3.  
  4. slider.handle.onPress = function() {
  5. spinning = false;
  6. //drag along the line
  7. this.startDrag(true, slider.line._x-slider.handle._width/2, slider.line._y-slider.handle._height/2, slider.line._width-slider.handle._width/2, slider.line._y-slider.handle._height/2);
  8. }
  9. slider.handle.onRelease = slider.handle.onReleaseOutside = function() {
  10. this.stopDrag();
  11. }
  12. _root.onEnterFrame = function() {
  13. if (spinning) {
  14. //apply the speed to the rotation
  15. knob._rotation += speed;
  16. //recalculate speed
  17. speed = speed*drag;
  18. //if speed gets unnoticeably tiny just set it to 0
  19. if (Math.pow(speed, 2) < .0001) {
  20. speed = 0;
  21. }
  22. }
  23. else {
  24. //set the rotation from the slider position
  25. knob._rotation = slider.line._x + slider.handle._x + slider.handle._width/2;
  26. }
  27.  
  28. //spit out feedback continuously
  29. feedbackr.text = knob._rotation;
  30. feedbackaccr.text = speed;
  31. }
  32. spinner.onRelease = function() {
  33. //find a random speed
  34. speed = (Math.random()* 50) - 25;
  35. spinning = true;
  36. }

I want to grab it and spin it though. I want to apply the same principles from physics, like acceleration and friction as forces to the object, so I can grab to spin and release to watch it glide gracefully to a stop. I’ve been thinking about this and how I’d have to use trigonometry and stuff to do it. One day I finally had the time and tried it out. It took me a minute but I figured out that what I needed was arctangent. So (with pointers from jbum, thanks Jim!) I came up with this:

Interactive grab-able circle to spin and twirl:
(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)

This one is much more interactive and intuitive. I really think this is because there are no sliders or buttons, no controls, just an object to interact with. It’s much more like real life!

Steps:

In order to make a grab and spin object
1. You have to know where you grab. The user clicks on the shape (knob) and you must figure out what degree or rotation point they have started at. (atan2)
2. As the knob is clicked and the mouse moves (dragging), calculate new rotation by mouse position
3. When mouse is released figure out the current speed of rotation and apply it to the knob with friction, so it can be thrown and spun in that way. (Of course this is optional, if you just want to spin it when the mouse is down you’re done at step 2)

Actionscript:

  1. damp = .96; //friction
  2. r = 0; //rotation
  3. accr = 0; //speed of rotation
  4.  
  5. knob.onPress = function() {
  6. dragging = true;
  7. //find mouse y coordinate in relation to knob origin
  8. a = _root._ymouse - knob._y;
  9. //find mouse x coordinate in relation to knob origin
  10. b = _root._xmouse - knob._x;
  11. //using arctangent find the spot of rotation (in degrees)
  12. oldr = Math.atan2(a,b)*180/Math.PI;
  13. }
  14.  
  15. knob.onRelease = knob.onReleaseOutside = function() {
  16. dragging = false;
  17. }
  18.  
  19. knob.onEnterFrame = function() {
  20. if (dragging) {
  21. //find mouse y coordinate in relation to knob origin
  22. a = _root._ymouse-knob._y;
  23. //find mouse x coordinate in relation to knob origin
  24. b = _root._xmouse-knob._x;
  25. //using arctangent find the spot of rotation (in degrees)
  26. r = Math.atan2(a,b)*180/Math.PI;
  27.  
  28. //use current rotation and previous rotation
  29. //to find acceleration
  30. //averages the acceleration with the
  31. //previous acceleration for smoother spins
  32. accr = ((r - oldr) + accr)/2;
  33. //apply the acceleration to the rotation
  34. knob._rotation += accr;
  35. //remember current rotation as old rotation
  36. oldr = r;
  37. feedbacka.text = a;
  38. feedbackb.text = b;
  39. }
  40. else {
  41. knob._rotation += accr;
  42. //apply friction to acceleration force
  43. //and if acceleration gets tiny, just set it to zero
  44. if (Math.pow(accr, 2) > .0001 ) {
  45. accr *= damp;
  46. }
  47. else{
  48. accr = 0;
  49. }
  50. }
  51. //spit out feedback continuosly
  52. feedbackr.text = knob._rotation;
  53. feedbackaccr.text = accr;
  54. }

I commented the code to explain what is happening, if you need more just post a comment. Let me know if you find this useful and what you end up making with it.

Downloads:

spin fla
interactive spin fla

Tags: , , , , , , , , , , ,

Comments (4)

Men Circles | Interactive Experiment

February 20, 2008 at 7:01 pm · 472 views · Filed under portfolio

Here’s a graphic of a circle of men. You may recognize the outline from any public restroom. They’re standing in a corny circle holding hands, like an all over the world theme., let’s just hope they all washed their hands…

I made the graphic a while ago, and have been wanting to interactive-ize it. I’ve really been wanting to play with elasticity, throwing things and snapping to a point… Although I’m still thinking about a version where I’d spin the objects rather than just throw them, I figured I’d put it up for any feedback that comes.

(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)

The different pieces all rotate differently and it changes if you are dragging or ‘holding’ them. Then you can press the anchor (gray) button to toggle the snap. The objects will all center around the anchor and spring into place (elasticity applied to position and rotation). And then the interactivity changes and rather than dragging and dropping them, you push and bump or throw them. It almost turns into a game…

Here’s some of the actionscript

  1. _root.tr = 0;
  2. _root.k = 0.2;
  3. _root.damp = .9;
  4. _root.margin = 150;
  5. _root.heads.ax = 0;
  6. _root.heads.vx = 0;
  7. _root.heads.ay = 0;
  8. _root.heads.vy = 0;
  9. _root.heads.ar = 0;
  10. _root.heads.vr = 0;
  11. _root.heads._x = (Math.random() * (Stage.width + _root.heads._width)) - _root.margin;
  12. _root.heads._y = (Math.random() * (Stage.height + _root.heads._height)) - _root.margin;
  13.  
  14. //Heads
  15. _root.heads.dragging = false;
  16. _root.heads.onEnterFrame = function() {
  17. if (!_root.center.dragging){
  18. if (_root.heads.dragging){
  19. this._rotation += 1.2;
  20. }
  21. else {
  22. rot = this._rotation + Math.random();
  23. xmouse = _root._xmouse/Stage.width;
  24. this._rotation += rot + xmouse;
  25. }
  26.  
  27. this._x+=Math.random()*2 - 1;
  28. this._y+=Math.random()*2 - 1;
  29.  
  30. }
  31. else {
  32. //_root.heads._x = _root.center._x;
  33. //_root.heads._y = _root.center._y;
  34. _root.heads.ax = (_root.center._x - _root.heads._x) * _root.k;
  35. _root.heads.vx += _root.heads.ax;
  36. _root.heads.vx *= _root.damp;
  37. _root.heads._x += _root.heads.vx;
  38.  
  39. _root.heads.ay = (_root.center._y - _root.heads._y) * _root.k;
  40. _root.heads.vy += _root.heads.ay;
  41. _root.heads.vy *= _root.damp;
  42. _root.heads._y += _root.heads.vy;
  43.  
  44. _root.heads.ar = (_root.tr - _root.heads._rotation) * _root.k;
  45. _root.heads.vr += _root.heads.ar;
  46. _root.heads.vr *= _root.damp;
  47. _root.heads._rotation+=_root.heads.vr;
  48. }
  49. this.onPress = function() {
  50. startDrag(this, false);
  51. _root.heads.dragging = true;
  52. }
  53. this.onRelease = this.onReleaseOutside = function() {
  54. stopDrag();
  55. _root.heads.dragging = false;
  56. }
  57. this.onRollOver = function() {
  58. if(_root.center.dragging){
  59. startDrag(this, false);
  60. _root.heads.dragging = true;
  61. }
  62. }
  63. this.onRollOut = function() {
  64. if(_root.center.dragging) {
  65. stopDrag();
  66. _root.heads.dragging = false;
  67. }
  68. }
  69. }
  70.  
  71. //Button
  72. _root.center.dragging = false;
  73. _root.center.onEnterFrame = function() {
  74. this.onPress = function() {
  75. startDrag(_root.center, false);
  76. _root.center.dragging = !_root.center.dragging;
  77. if (_root.center.dragging) {
  78. this.gotoAndStop("on");
  79. }
  80. else {
  81. this.gotoAndStop("off");
  82. }
  83.  
  84. //var vr:Number = 0;
  85. }
  86. this.onRelease = this.onReleaseOutside = function () {
  87. stopDrag();
  88. //_root.center.dragging = false;
  89. }
  90. }

Tags: , , , , , ,

Comments

Mazamedia Splash

August 13, 2007 at 8:10 am · 187 views · Filed under portfolio, work

The new splash is in effect for Mazamedia’s 5th anniversary!

I just re-vamped Mark Callahan’s splash on his Mazamedia.com
Re-vamped as in made interactive innovative and fun. I was just playing with different effects and wanted to see it in action, so I applied it to Mark’s splash intro. He liked it so much he wanted to put it live on his site. That’s cool with me, thanks Mark.

New Version - The letters are anchored to their spot, but use the mouse to push or nudge them. You can also drag them try throwing them even.
(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)

Vs the old static version
(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)

Tags: , , , , , , ,

Comments

Rollover elastic bounce rezise

July 26, 2007 at 1:57 pm · 887 views · Filed under portfolio

Flash experiment that could be used for navigation. Rollover each area and watch them all resize themself to accomodate the growing box. It’s pretty fun to play with.

(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)
I’m sure there is a way to simplify the code, but this worked so there was no need.
Actionscript:

  1. import mx.transitions.easing.*;
  2. import mx.transitions.Tween;
  3. var normWidth:Number = mc_1._width;
  4. mc1x = mc_1._x;
  5. mc2x = mc_2._x;
  6. mc3x = mc_3._x;
  7. mc4x = mc_4._x;
  8. mc_1.onRollOver = function ():Void  {
  9. //Tween( obj:Object, prop:String, func:Function, begin:Number, finish:Number, duration:Number, useSeconds:Boolean )
  10. //Double in size
  11. var mc1Width:Tween = new Tween (mc_1, "_width", Elastic.easeOut, normWidth, normWidth * 2, 1, true);
  12. mc_1.gotoAndPlay("over");
  13. //Shrink by 33% and move 66% along using width
  14. var mc2Width:Tween = new Tween (mc_2, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  15. var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc2x, (mc2x) + (normWidth * 2 / 3), 1, true);
  16. //Shrink by 33% and move 33% along using width
  17. var mc3Width:Tween = new Tween (mc_3, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  18. var mc3X:Tween = new Tween (mc_3, "_x", Elastic.easeOut, mc3x, (mc3x) + (normWidth * 1 / 3), 1, true);
  19. //Shrink by 33%, no need to move as already in position
  20. var mc4Width:Tween = new Tween (mc_4, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  21. //trace("rollOver 1");
  22. };
  23. mc_1.onRollOut = function ():Void  {
  24. //Return to normal width
  25. var mc1Move:Tween = new Tween (this, "_width", Elastic.easeOut, normWidth * 2, normWidth, 1, true);
  26. mc_1.gotoAndStop("up");
  27. //Return to normal width and use mc_1 as basis for x
  28. var mc2Width:Tween = new Tween (mc_2, "_width", Elastic.easeOut, normWidth * 2 / 3, normWidth, 1, true);
  29. var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, (mc2x) + (normWidth * 2 / 3), mc2x, 1, true);
  30. //var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc_2._x, mc_1._x + (normWidth*2), 1, true);
  31. //Return to normal width and use mc_4 as basis for x
  32. var mc3Width:Tween = new Tween (mc_3, "_width", Elastic.easeOut, normWidth * 2 / 3, normWidth, 1, true);
  33. var mc3X:Tween = new Tween (mc_3, "_x", Elastic.easeOut, (mc3x) + (normWidth * 1 / 3), mc3x, 1, true);
  34. //Return to normal width
  35. var mc4Width:Tween = new Tween (mc_4, "_width", Elastic.easeOut, normWidth * 2 / 3, normWidth, 1, true);
  36. //trace("rollOut 1");
  37. };
  38. mc_2.onRollOver = function ():Void  {
  39. //Double in size and move left 33%
  40. var mc2Width:Tween = new Tween (mc_2, "_width", Elastic.easeOut, normWidth, normWidth * 2, 1, true);
  41. var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc2x, (mc2x) + (normWidth * 2 / 3), 1, true);
  42. mc_2.gotoAndPlay("over");
  43. //Tween( obj:Object, prop:String, func:Function, begin:Number, finish:Number, duration:Number, useSeconds:Boolean )
  44. //shrink by 33% mc1
  45. var mc1Width:Tween = new Tween (mc_1, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  46. //var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc_2._x, (mc_2._x) + (mc_2._width*2/3), 1, true);
  47. //Shrink by 33% and move 33% along using width
  48. var mc3Width:Tween = new Tween (mc_3, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  49. var mc3X:Tween = new Tween (mc_3, "_x", Elastic.easeOut, mc3x, (mc3x) + (normWidth * 1 / 3), 1, true);
  50. //Shrink by 33%, no need to move as already in position
  51. var mc4Width:Tween = new Tween (mc_4, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  52. //trace("rollOver 2");
  53. };
  54. mc_2.onRollOut = function ():Void  {
  55. //Return to normal width and position
  56. var mc2Move:Tween = new Tween (this, "_width", Elastic.easeOut, normWidth * 2, normWidth, 1, true);
  57. var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, (mc2x) + (normWidth * 2 / 3), mc2x, 1, true);
  58. mc_2.gotoAndStop("up");
  59. //Return to normal width and use mc_1 as basis for x
  60. var mc1Width:Tween = new Tween (mc_1, "_width", Elastic.easeOut, normWidth * 2 / 3, normWidth, 1, true);
  61. //var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc_2._x, mc_1._x + (normWidth*2), 1, true);
  62. //Return to normal width and use mc_4 as basis for x
  63. var mc3Width:Tween = new Tween (mc_3, "_width", Elastic.easeOut, normWidth * 2 / 3, normWidth, 1, true);
  64. var mc3X:Tween = new Tween (mc_3, "_x", Elastic.easeOut, (mc3x) + (normWidth * 1 / 3), mc3x, 1, true);
  65. //Return to normal width
  66. var mc4Width:Tween = new Tween (mc_4, "_width", Elastic.easeOut,normWidth * 2 / 3, normWidth, 1, true);
  67. //trace("rollOut 2");
  68. };
  69. mc_3.onRollOver = function ():Void  {
  70. //Double in size and move left 33%
  71. var mc3Width:Tween = new Tween (mc_3, "_width", Elastic.easeOut, normWidth, normWidth * 2, 1, true);
  72. var mc3X:Tween = new Tween (mc_3, "_x", Elastic.easeOut, mc3x, (mc3x) + (normWidth * 1 / 3), 1, true);
  73. mc_3.gotoAndPlay("over");
  74. //Tween( obj:Object, prop:String, func:Function, begin:Number, finish:Number, duration:Number, useSeconds:Boolean )
  75. //shrink by 33% mc1
  76. var mc1Width:Tween = new Tween (mc_1, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  77. //var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc_2._x, (mc_2._x) + (mc_2._width*2/3), 1, true);
  78. //Shrink by 33% and move 33% along using width
  79. var mc2Width:Tween = new Tween (mc_2, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  80. var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc2x, (mc2x) + (normWidth * -2 / 3), 1, true);
  81. //Shrink by 33%, no need to move as already in position
  82. var mc4Width:Tween = new Tween (mc_4, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  83. //trace("rollOver 3");
  84. };
  85. mc_3.onRollOut = function ():Void  {
  86. //Return to normal width and position
  87. var mc3Move:Tween = new Tween (this, "_width", Elastic.easeOut, normWidth * 2, normWidth, 1, true);
  88. var mc3X:Tween = new Tween (mc_3, "_x", Elastic.easeOut, (mc3x) + (normWidth * 1 / 3), mc3x, 1, true);
  89. mc_3.gotoAndStop("up");
  90. //Return to normal width and use mc_1 as basis for x
  91. var mc1Width:Tween = new Tween (mc_1, "_width", Elastic.easeOut, normWidth * 2 / 3, normWidth, 1, true);
  92. //var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc_2._x, mc_1._x + (normWidth*2), 1, true);
  93. //Return to normal width and use mc_4 as basis for x
  94. var mc2Width:Tween = new Tween (mc_2, "_width", Elastic.easeOut, normWidth * 2 / 3, normWidth, 1, true);
  95. var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, (mc2x) + (normWidth * -2 / 3), mc2x, 1, true);
  96. //Return to normal width
  97. var mc4Width:Tween = new Tween (mc_4, "_width", Elastic.easeOut, normWidth * 2 / 3, normWidth, 1, true);
  98. //trace("rollOut 3");
  99. };
  100. mc_4.onRollOver = function ():Void  {
  101. //shrink in size and move left 33%
  102. var mc3Width:Tween = new Tween (mc_3, "_width", Elastic.easeOut, normWidth, normWidth * 2/3, 1, true);
  103. var mc3X:Tween = new Tween (mc_3, "_x", Elastic.easeOut, mc3x, (mc3x) + (normWidth * - 3 / 3), 1, true);
  104. //Tween( obj:Object, prop:String, func:Function, begin:Number, finish:Number, duration:Number, useSeconds:Boolean )
  105. //shrink by 33% mc1
  106. var mc1Width:Tween = new Tween (mc_1, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  107. //var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc_2._x, (mc_2._x) + (mc_2._width*2/3), 1, true);
  108. //Shrink by 33% and move 33% along using width
  109. var mc2Width:Tween = new Tween (mc_2, "_width", Elastic.easeOut, normWidth, normWidth * 2 / 3, 1, true);
  110. var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc2x, (mc2x) + (normWidth * -2 / 3), 1, true);
  111. //double in size, no need to move as already in position
  112. var mc4Width:Tween = new Tween (mc_4, "_width", Elastic.easeOut, normWidth, normWidth * 2, 1, true);
  113. mc_4.gotoAndPlay("over");
  114. //trace("rollOver 4");
  115. };
  116. mc_4.onRollOut = function ():Void  {
  117. //Return to normal width and position
  118. var mc3Move:Tween = new Tween (mc_3, "_width", Elastic.easeOut, normWidth * 2/3, normWidth, 1, true);
  119. var mc3X:Tween = new Tween (mc_3, "_x", Elastic.easeOut, (mc3x) + (normWidth * - 3 / 3), mc3x, 1, true);
  120. //Return to normal width and use mc_1 as basis for x
  121. var mc1Width:Tween = new Tween (mc_1, "_width", Elastic.easeOut, normWidth * 2 / 3, normWidth, 1, true);
  122. //var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, mc_2._x, mc_1._x + (normWidth*2), 1, true);
  123. //Return to normal width and use mc_4 as basis for x
  124. var mc2Width:Tween = new Tween (mc_2, "_width", Elastic.easeOut, normWidth * 2 / 3, normWidth, 1, true);
  125. var mc2X:Tween = new Tween (mc_2, "_x", Elastic.easeOut, (mc2x) + (normWidth * -2 / 3), mc2x, 1, true);
  126. //Return to normal width
  127. var mc4Width:Tween = new Tween (mc_4, "_width", Elastic.easeOut, normWidth * 2, normWidth, 1, true);
  128. mc_4.gotoAndStop("up");
  129. //trace("rollOut 4");
  130. };

Here is the source file for those who want.

Tags: , , , , , , , ,

Comments

I Heart Net Art | net.Art Exhibit

May 6, 2007 at 3:53 pm · 124 views · Filed under portfolio

Class exhibition of net art.

ARST3800 Net Art Studio Fall 2005.
Mark Callahan @ Digital Media @ Lamar Dodd School of Art @ The University Of Georgia

Net Art Studio examines the current state of artistic practice on the Internet and facilitates the production of new works for networked audiences. The course consists of concurrent research and studio components, joined by critical theory.
The research component, achieved by prepared lectures, readings, and directed group research, surveys the cultural and technological underpinnings of contemporary net art. Key areas include historical discourse (media studies, pre-history of the computer, counter-culture movements), significant works online (independent, collective, curated), and practical technical structure (hardware, software, networks).
The studio component focuses on the creation of prototypes that lead up to a final project that exists on the internet and can be submitted to online ‘galleries’ and new media festivals. Student projects are discussed in group critiques within the context of individual artistic development and contemporary net.art. The studio component will be supplemented as necessary by remedial demonstrations, problem-solving assignments, and individual critique.

View the archive of the exhibit

I Heart Net Art
(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)

Make a Face, by Evan Mullins
9 pieces in the exhibit in which I play with interactivity, randomness, artificial intelligence, and typography/typefaces.

View the works in the exhibit I’ve posted on the blog:
Make a Face: Single, Grid, Interactive Grid, Crowd.
Hungry
Dog Trainer
Typeface: 1, 2, 3.

The whole exhibit (beware of broken links):

balloon Burn the House Down Expansion Squad fryman gerrysattele.com gooooooooooooooooooooooooooooooooooooooooooooooooooooogle.com handsomerobot Tony Smith I.S.P. jaredoldham.com kudzoomedia.com Brian Parsons Make a Face Evan Mullins Project(n.) Project(v.)

Tags: , , , , , , ,

Comments

Next entries »