Mos Wanted

Hello!

First – the obligatory “I’ve not posted much for ages” bit. I’ve been working away on lots of interesting projects, including a couple of E-Learning applications, some games, a few more music experiments, more arduino tests and I’m starting to get underway on some iPhone and Android apps too – both native and Air based! So hopefully I’ll have some more updates in the near future. But today I want to talk about our fancy new charity fund raising site – Mos Wanted.

During November I will be growing a moustache to help spread awareness of Prostate Cancer and raise some cash for charity.

Movember challenges men to change their appearance and the face of men’s health by growing a moustache. The rules are simple, start Movember 1st clean shaven and then grow a moustache for the entire month. The moustache becomes the ribbon for men’s health, the means by which awareness and funds are raised for cancers that affect men. Much like the commitment to run or walk for charity, the men of Movember commit to growing a moustache for 30 days.

You can read more about about Movember at their site –
http://uk.movember.com/about/

If you have a bit of spare change you wouldn’t mind donating to this great cause, then here’s a link to my sponsorship form – http://uk.movember.com/donate/your-details/member_id/526842, where you’ll get to see me sporting a huge mustache, as well as my current progress.

You can also check out the site I’ve made with some guys from work documenting our Mo-Growing progress –
http://moswanted.co.uk/

Mos Wanted Line Up

Case file

Or you can use the photobooth site we made –
Mos Wanted Photobooth

Which lets you test drive mustaches – either from saved photos –

Lawrie Mo-laroid

Or from your webcam –

I worked with some of the great designers in my office, to make this site promoting our fund-raising efforts. All the work was done in our downtime, when no client work was on and over a few late nights. I’m pretty proud of the results, and I’ll try to post a code round up, some of the lessons learned and maybe even some code snippets when I get a chance.

Also – The site is today’s site of the day on DesignLicks and is in the running for an FWA – so please head over to the FWA site and vote for it!

Cheers guys.
With your help we might reach out £3000 target!
Lawrie.

VIMEO LIKES

The other day I had a little time on my hands, so I decided to make a Vimeo video explorer.

From the beginning, Vimeo was created by filmmakers and video creators who wanted to share their creative work, along with intimate personal moments of their everyday life. As time went on, like-minded people came to the site and built a community of positive, encouraging individuals with a wide range of video interests. We hope that you feel inspired to show us both your creative side as well as your friendly side.

What is a ‘like’?

A ‘like’ is quick and friendly way to let a video creator know that you appreciate or like his or her video.

What is the point of liking a video?

‘Liking’ a video is simple way to let other users know that you enjoy their videos. Once you look around Vimeo, you’ll quickly start to find videos that you enjoy. By ‘liking’ a video you are helping to promote content to your contacts and subscribers as well as giving that video a creator a nice feeling.

So the Vimeo Explorer site looks up all the videos a user has “liked” – then displays their thumbnails in this semi-3D grid. You can then click a thumbnail to read the details of that video – and click again to watch the video.

There’s a few weird bugs in there still – sometimes the description doesn’t match the selected video, and the embedded vimeo player has a few odd quirks of its own. But on the whole, I was quite pleased with how it turned out.

As well as trying the Vimeo API, I got the chance to try out some cool effects, such as text to speech conversion and animated displacement maps.
See – http://wonderfl.net/c/rgyc and http://wonderfl.net/c/tLMY for source code demos.

The page is set to default to my personal Vimeo Likes – but by passing in any Vimeo user’s ID, you can load theirs.

For example – you can check out the likes of –
James Alliban of Tech Arts Vimeo Channel
Mario Klingemann aka Quasimondo
ideajockey.tv – a vlog about creative idea videos
Erik natzke – Flash based generative artist
John Davey of Flash On The Beach

Hopefully you’ll find it a fun way of exploring the videos liked by various people.
Cheers.
Lawrie.

Constellation – A flocking experiment

This week I saw Flight 404’s “Swarm Behavior” on vimeo –

Swarm behavior from flight404 on Vimeo.

Yet another awesome video from Robert, using his Cinder framework. Cool!
In the description, he mentions the particle’s behavioral rules –

1) If I am far away from my neighbors, move towards them.
2) If I am too close to my neighbors, move away from them.
3) If I am neither too close or too far from my neighbors, move with them.

So I decided to try and implement these rules in Flash. The idea changed a few times, and ended up looking like an interactive constellation app. So here it is! It’s still pretty rough around the edges – but I’m quite pleased with how it’s developing.

See and edit the code over on Wonderfl

CODE

package{

	[SWF(width="465", height="465", frameRate="50")]

	import flash.events.*;
	import flash.events.KeyboardEvent;
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	import flash.display.DisplayObject;
	import flash.display.MovieClip;
	import flash.display.Stage;
	import flash.geom.Point;
	import flash.filters.BlurFilter;
	import flash.filters.ColorMatrixFilter;
	import flash.filters.ConvolutionFilter;
	import flash.filters.GlowFilter
	import flash.text.TextField;
	import com.bit101.components.*;
	
 	public class BFCWonderfl extends MovieClip {
		
		//Vars - 
		//You can play with these ones - 
		private var numBoids:int=20;
		//Boids closer than this will feel crowded!
		private var minDist:int=90;
		//Boid further away than another than this will be lonely!
		private var maxDist:int=100;
		//This is how fast the boids can move. TOP SPEED!
		private var maxSpeed:Number = 3;
		//This is how much boids influence each other - lower number = more influence
		private var divideBy:int=100;
		//Shall the boids slow down with friction?
		private var enableFriction:Boolean = true;
		private var friction:Number = 0.9;
		//Settle down - if they're not too close and not too far away from their friends - they'll just stop
		private var settleDown:Boolean = false;
		
		private var boidColour:uint = 0xffffff;
		private var lineColour:uint = 0xffffff;
		private var bgColour:uint   = 0x000033;
		
		private var glow:GlowFilter = new GlowFilter();
		private var glowColour:uint = 0x99ffff;

		//But you should probably leave these as is - 
		private var boidArray:Array=[];
		private var menuHeight:Number = 85;
		private var doMidi:Boolean = false;
		private var BMD:BitmapData = new BitmapData(stage.stageWidth,stage.stageHeight-menuHeight, false, bgColour);
		private var BF:BlurFilter = new BlurFilter(5,5,1);
		private var Bit:Bitmap = new Bitmap(BMD);
		private var bitHolder:MovieClip = new MovieClip;
		private var ballHolder:MovieClip = new MovieClip;
		private var isMouseDown:Boolean = false;
		private var TB:TextField = new TextField();
		private var myCheckBox1:CheckBox;
		private var myCheckBox2:CheckBox;
		private var mySlider1:HSlider;
		private var mySlider2:HSlider;
		//Boid Flock Class
		public function BFCWonderfl():void{
			trace("Init!");
			addChild(bitHolder);
			bitHolder.addChild(Bit);
			addChild(ballHolder);
			
			glow.color = glowColour;
			glow.alpha = .5;
			glow.blurX = 5;
			glow.blurY = 5;
			
			ballHolder.filters = [glow];
			
			addChild(TB);
			TB.y = 0;
			TB.width = stage.stageWidth-10;
			TB.height = 75;
			TB.selectable = false;
			TB.text = "Constellation by Lawrie\nhttp://www.LawrieCape.co.uk\nSpace to add a boid at mouse - click to attract - any other key to reset.\n\nADD MINIMAL COMPS HERE - MIN MAX sliders and Friction Settle checkboxes";
			
			myCheckBox1 = new CheckBox(this,5,50,"Friction?",updateVals);
			myCheckBox1.selected = true;
			myCheckBox2 = new CheckBox(this,5,70,"Settle?",updateVals);
			var sLabel:Label  = new Label(this,75,45,"Min size");
			var sLabel2:Label = new Label(this,75,65,"Max size");
				
			mySlider1 = new HSlider(this,125,50,updateVals);
			mySlider2 = new HSlider(this,125,70,updateVals);
			
			mySlider1.setSliderParams(1,200,75);
			mySlider2.setSliderParams(1,200,100);
			
			addChild(myCheckBox1);
			addChild(myCheckBox2);
			
			addChild(mySlider1);
			addChild(mySlider2);	
			
			bitHolder.y = menuHeight;
			ballHolder.y = menuHeight;
			ballHolder.mouseEnabled  = false;
			ballHolder.mouseChildren = false;
			bitHolder.alpha=1;
			
			BMD.fillRect(BMD.rect, bgColour);

			bitHolder.addEventListener(MouseEvent.MOUSE_DOWN, mouseIsDown);
			bitHolder.addEventListener(MouseEvent.MOUSE_UP,   mouseIsNotDown);			
			stage.addEventListener(KeyboardEvent.KEY_UP, makeASingleBoid);

			addEventListener(Event.ENTER_FRAME, updateBoids);
			//makeBoids(numBoids);
		}
		
		private function makeASingleBoid(e:KeyboardEvent):void{
			if(e.keyCode==32){
				makeBoids(1,mouseX,mouseY);
			}
			else{
				reset();
			}
		}
		
		private function mouseIsDown(e:Event):void{
			isMouseDown = true;
		}
		private function mouseIsNotDown(e:Event):void{
			isMouseDown = false;
		}
		
		private function makeBoids(makeXBoids:int, bX:Number = 0, bY:Number = 0):void {
			for (var i:int=0; imaxDist) {
					B.speedX-=B.distToB2X/divideBy;
					B.speedY-=B.distToB2Y/divideBy;
				}
				//2) If I am too close to my neighbors, move away from them.
				else if (B.distToB2stage.stageWidth){
					B.x=stage.stageWidth-B.speedX;
					B.speedX*=-friction;
				}
				else if(B.x<0){
					B.x=-B.speedX;
					B.speedX*=-friction;
				}
				if (B.y>(stage.stageHeight-menuHeight)){
					B.y=(stage.stageHeight-menuHeight)-B.speedY;
					B.speedY*=-friction;
				}
				else if(B.y<0){
					B.y=-B.speedY;
					B.speedY*=-friction;
				}
				
				//Limit them to a top speed - 
				if(B.speedX>maxSpeed){
					B.speedX = maxSpeed;
				}
				else if(B.speedX< -maxSpeed){
					B.speedX=-maxSpeed;
				}
				if(B.speedY>maxSpeed){
					B.speedY = maxSpeed;
				}
				else if(B.speedY< -maxSpeed){
					B.speedY=-maxSpeed;
				}		
				
				//Add friction?
				if(enableFriction){
					B.speedX*=friction;
					B.speedY*=friction;		
				}
				
				//Move them 
				B.x+=B.speedX;
				B.y+=B.speedY;
			
			}
			//Draw into the BMD

			BMD.draw(ballHolder);
			//Apply a blur?
			BMD.applyFilter(BMD,BMD.rect,new Point(0,0),BF);
		}
		
		private function reset():void{
			removeEventListener(Event.ENTER_FRAME, updateBoids);
			for (var i:int=0; i

Flash Midi Server – Processing + Flash + Webcam Instrument

Right, this has been something I’ve had in development for a while – and I’ve finally decided to put out a video demo. More info, videos, audio and hopefully source coming soon.

Flash Midi Server + Webcam image to audio app

An early test of my Flash Midi Server – used to send Midi notes and controllers from within Flash movies.

This early demo shows the Processing based Midi server (blue app in the bottom left), and also a Flash Webcam based audio tool. The Flash app takes still images from a webcam, and analysies them for 4 colours within them. These colours are then mapped to a range of notes, so for example, a white image will send a high note, whilst a black image wil send a low note. These notes can then be played back using Midi, and the corresponding images are displayed.

As an extra feature – the “activty level” (amount of movement) in the webcam can be monitored, and sent as CC data, to alter any settings. Here it is linked to a paramater of the midi instrument.

More polished versions coming soon.

Hopefully some nicer audio coming soon too : )

Back in the UK! Job hunting and new Portfolio page.

I’m finally back from 6 months of travelling around Asia, having seen some really cool things –

It’s been amazing, but I’m glad to be back and I’m excited to get stuck into some new and interesting projects. I’ve got a whole notebook full of ideas, so now I just need to find the time to get some of them made. There should be plenty more Flash experiments coming, and hopefully some further ventures into Processing and openFrameworks.

Now that I’m back, I’m looking for full time or freelance work; so if anyone knows of any vacancies please get in touch! I’ve also put together a new portfolio page including a few videos, which you can check out here.

Lawrie!