I said I would test it out, and the verdict is... yes.
At least, it did with the Dell projector I tried it on. While I initially found that there was more ghosting on the projector image when viewed through ColorCode (Amber+Blue) glasses, than my LCD monitor, at least it was 3D.
I have not yet had success with Cyan+Red at all on a projector.
Changing "Video Mode" improves image
The Dell projector I used allowed me to change the "video mode", which is basically a bunch of different colour level presets. I found that in "game mode" the ghosting pretty much vanished even on the projector.
So there you have it.
ColorCode (Amber+Blue) can work with a projector.
Wednesday, 18 November 2009
Tuesday, 10 November 2009
Channel-4 3D Week
I was at Sainsbury's today (unusual, but I happened to be near one) and came across a big point-of-sale bin thing with loads of FREE 3D glasses in it. Apparently Channel-4 is hosting a 3D week, which according to my 3D glasses arm will feature "never-seen-before archive footage and continue[s] through the week with loads of awesome 3D films and concerts to enjoy".Anaglyph TV
Now, the image below (from the C4 website) doesn't look like anything special to the naked eye, but when viewed through the special Sainsbury's glasses will take on a 3D appearance. It is an anaglyph.
To view anaglyphs you need special "3D glasses" that have coloured filters. But there are several different colour combinations around, and you have to make sure you get the right one for what you are watching. You can get Red Blue, Red Cyan (the most popular), Red Green and, as I learned today, Blue Ochre (sometimes called Blue Amber, or Blue Brown).
And guess which ones Channel-4 have opted for?
Blue Ochre of course - which means you probably don't have an old pair of 3D glasses hanging round the house which will work for 3D week. Your "Journey to the Centre of the Earth" glasses will not work, and neither will your "Shark Boy and Lava Girl" pair.
Better get yourself down to Sainsbury's and get some Blue Ochre.
But what's with all the different types?
Why not just stick to one type and have done with it? Simply put, different colour combinations have different benefits. Red Cyan is probably the most popular because it allows the creation of both colour and B&W anaglyphs (as does Red Green). Red Blue only allows B&W and the images are very dark.
But more information on the different types can be found here:
http://nzphoto.tripod.com/sterea/anaglyphs.htm
However, and this was news to me until today, Blue Ochre when viewed in a dark room, has better colour transmission than the others. So this is probably why Channel-4 opted for it. After all, if you want people to think that 3D is more than just a gimmick, it needs to look good.
Blue Ochre not free but very clever
While all the other anaglyph colour methods are pretty much public domain, the Blue Ochre combination is apparently patented. Not the idea of the anaglyph - that has been around for too long, you can't patent that - but according to this website it is the method for converting an image for Blue Ochre is patented:
What makes it patentable (the "secret sauce") is the mathematical formula that modifies the luminance of the right eye record and the luminance and chrominance of the left eye record to best transmit the colour information. The darker brown is necessary for balance, because blue is low luminance.
Whilst I haven't read the patent (http://www.patentstorm.us/patents/6687003/fulltext.html) thoroughly, their process doesn't seem to attempt to determine which point in each image represents each point in the three dimensional scene, so it seems to me that they are effectively presenting a luminance-based stereoscopic pair combined with a flat chrominance image based on the average of the two views.
(http://www.dvinfo.net/forum/archive/index.php/t-128661.html)
Apparently this method was invented at the Technical University of Denmark, and has been branded as ColorCode. More information can be found here: http://www.colorcode3d.com/.
What makes it so clever, and therefore worth paying for perhaps, is explained on their website:
The ColorCode 3-D system is the only in the world to reproduce high quality 3-D Stereo images and movies with full color- and depth information on all display types.
(http://www.colorcode3d.dk/group.asp?group=39)
And I can't argue with this claim. I know from experience that Red Cyan may work on a CRT or TFT monitor, but utterly fail on a projector. You can also get a fair amount of ghosting. If ColorCode (Blue Ochre) can crack this, it will be worth the license fees for TV companies who want good quality 3D without a trace of gimmick.
I will test my new Sainsbury's ColorCode glasses on the LCD projector at work, and if the result is good I will be very impressed and let you know.
Monday, 9 November 2009
Flash Projects #7 - Making a Flash MP3 Player
Finally here is the solution. It turns out you can use NetConnect and NetStream to make an MP3 player in Flash, but only if you encapsulate all your MP3s as FLV files. Not really very helpful since it means converting your MP3 files - it just makes more work.
And busy designers really don't want the job to take longer.
However there is another way to make an MP3 player in Flash, that still gives us all the control we need, but the pausing and playing is just a tad more complicated. But nothing you can't handle I am sure.
The Code
First, here's the code, then I will explain it:
The Explanation
Here goes. First, instead of using NetConnect and NetStream as we did for the video player, we are going to use loadSound. This still gives us a fair amount of control, in some ways more than the NetStream would give us, but it doesn't automatically pause when you play something that is already playing, as NetStream does. So while the rest is no more difficult, just different, pausing and then playing again is slightly more complicated using loadSound.
As with any program, we can only work with the information available, or that we can find out. With the loadSound approach we can find out one very important thing that will help us make a pause/play mechanism - we can find out our current position in the MP3 as it plays. In the code above we do this as follows:
Not hard, but on its own it is not a pause/play mechanism. We make it into a pause/play by storing the current position as a variable called playpoint at the time of pause. In effect we remember where we got up to. Then, when we play, we tell it to play from where we left off by asking the variable playpoint to tell us where we got to. As follows:
When pausing:
First we set the variable playpoint to store our current position. This is actually given in milliseconds so we divide it by 1000 to convert it to seconds - and that's what you see being done here. Then we tell it to stop.
When resuming playing:
We simply tell it to start, but include the start position as playpoint so it resumes from where we left off.
Isn't that what pausing/playing really is? Stopping, and then starting from where you left off?
The other code is effectively a menu, allowing you to choose which track to listen to. The term false on the end means the track won't play straight away, but will wait for you to press play as well. Change the false into a true and just clicking on the menu will make the track start as well.
Have fun.
And busy designers really don't want the job to take longer.
However there is another way to make an MP3 player in Flash, that still gives us all the control we need, but the pausing and playing is just a tad more complicated. But nothing you can't handle I am sure.
The Code
First, here's the code, then I will explain it:
//set default starting position for playback in seconds
var playpoint = 0;
//create sound object
var audio_sound:Sound = new Sound();
//play button
this.play_btn.onPress = function() {
//play the mp3 from the point defined in the variable playpoint
audio_sound.start(playpoint);
};
//pause button
this.stop_btn.onPress = function() {
//define the variable playpoint as the same as the current position, this is given in milliseconds so we divide it by 1000 to convert it into seconds
playpoint = (audio_sound.position/1000);
//stop the playback
audio_sound.stop();
};
this.m1_btn.onPress = function() {
audio_sound.loadSound("track1.mp3", false);
//true = streaming and therefore autoplay, false = not streaming and therefore just sets the file for when you hit the play button.
};
this.m2_btn.onPress = function() {
audio_sound.loadSound("track2.mp3", false);
};
The Explanation
Here goes. First, instead of using NetConnect and NetStream as we did for the video player, we are going to use loadSound. This still gives us a fair amount of control, in some ways more than the NetStream would give us, but it doesn't automatically pause when you play something that is already playing, as NetStream does. So while the rest is no more difficult, just different, pausing and then playing again is slightly more complicated using loadSound.
As with any program, we can only work with the information available, or that we can find out. With the loadSound approach we can find out one very important thing that will help us make a pause/play mechanism - we can find out our current position in the MP3 as it plays. In the code above we do this as follows:
audio_sound.position
Not hard, but on its own it is not a pause/play mechanism. We make it into a pause/play by storing the current position as a variable called playpoint at the time of pause. In effect we remember where we got up to. Then, when we play, we tell it to play from where we left off by asking the variable playpoint to tell us where we got to. As follows:
When pausing:
this.stop_btn.onPress = function() {
playpoint = (audio_sound.position/1000);
audio_sound.stop();
};
First we set the variable playpoint to store our current position. This is actually given in milliseconds so we divide it by 1000 to convert it to seconds - and that's what you see being done here. Then we tell it to stop.
When resuming playing:
this.play_btn.onPress = function() {
//play the mp3 from the point defined in the variable playpoint
audio_sound.start(playpoint);
};
We simply tell it to start, but include the start position as playpoint so it resumes from where we left off.
Isn't that what pausing/playing really is? Stopping, and then starting from where you left off?
The other code is effectively a menu, allowing you to choose which track to listen to. The term false on the end means the track won't play straight away, but will wait for you to press play as well. Change the false into a true and just clicking on the menu will make the track start as well.
Have fun.
Monday, 28 September 2009
eLearning Business Game (Arrays in action)
My last post was all about my array sorting problem. But I thought you might want to see the final product.
It was actually a game I put together to help my new students relax and get to know each other, but then I tweaked it and made it available for anyone to download.
Available here: http://digitalarena.co.uk/teach/markettraders/
The array was used in the part of the game that displays the team's performance as a graph. I needed to find a way to make the graph always fit in the available space. That meant finding the highest score and then working out a scale ratio that I could apply as the graph drew, so it always fit in the graph space.
So what has this to do with arrays? Well... finding out the absolute highest score of each team's highest score meant storing them all in an array and then sorting them (lowest to highest). Then I just had to retrieve the last item in the array to get the highest.
It was actually a game I put together to help my new students relax and get to know each other, but then I tweaked it and made it available for anyone to download.
Available here: http://digitalarena.co.uk/teach/markettraders/
The array was used in the part of the game that displays the team's performance as a graph. I needed to find a way to make the graph always fit in the available space. That meant finding the highest score and then working out a scale ratio that I could apply as the graph drew, so it always fit in the graph space.
So what has this to do with arrays? Well... finding out the absolute highest score of each team's highest score meant storing them all in an array and then sorting them (lowest to highest). Then I just had to retrieve the last item in the array to get the highest.
Friday, 25 September 2009
Sorting Numeric Arrays with Actionscript
Just lately I have been having fun with arrays. Of course, I say "having fun", what I mean is having problems. Especially with sorting numerically.
Arrays are really useful, they allow you to store data, select data, order it, etc. You can create them from strings and other variables, and turn them into strings and other variables. All in all, they can be very handy.
I found them handy as part of a game I was writing a couple of days ago. As part of my code I needed to find the number with the highest value out of a choice of 3 numbers. The logical solution was to put all 3 numbers into an array, then sort them numerically, then retrieve the last item in the array (this should, after sorting, be the one with the highest value).
Numeric sorting is not numeric
Let's say we start with the following array:
var my_array:Array = [650,12,86];
Then we sort them numerically:
my_array.sort(Array.NUMERIC); //doesn't work correctly
After this command you might expect flash to order the array as:
12, 86, 650
But what you actually get is:
12, 650, 86
This is because, as the Flash documentation explains, 'Numeric fields are sorted as if they were strings, so 100 precedes 99, because “1” is a lower string value than “9”. '
In other words, the Numeric sort does not sort numerically at all. It sorts alphabetically. Odd sort of numeric, but it can't be helped, we have to find a solution.
Prepending 0s so all values have the same number of digits
Of course this only happens because not all the values had the same number of digits. If the lower values began with a 0 then a numeric (alphabetical) sort would work correctly. So my initial plan was to use an if statement in a for loop to check for 1 digit, 2 digit and 3 digit numbers and prepend (put in front) 0s to make them all the same number of digits as follows:
With for loops we can repeat a peice of code until a condition is met. This loop repeats for the length of the array (that's the number of items in the array). It starts by checking how many digits the first array item has. Then depending on how many digits the code prepends 3, 2, 1 or no 0s. On the next repetition it checks the next array item, and so on until all array items have been checked and had the required number of 0s prepended so that they all have the same number of digits, and then the loop ends.
The result is that the original values:
650, 12, 86
become
0650, 0012, 0086.
Now when we sort them numerically, it does put them in the right order:
0012, 0086, 0650.
Leading 0s alter the value (it's a decimal v. octal thing)
Wouldn't it be great if that was the end of your troubles?
The problem is that if we then want to do anything with the values afterwards, like doing anything other than displaying them, we need to remove the 0s we just added. And it is not nearly as easy taking off, as putting on.
The reason we have to remove the leading 0s is because Flash, like lots of other programs, does not treat numbers beginning with 0 as decimal numbers. It treats them as octal. This means that 0650 does not have the same value as plain old 650 (without the leading 0).
0650, as octal, actually has the decimal value of 424.
0650 is in fact a totally different number to 650.
So while prepending leading 0s solves our array sorting problem, it actually changes our values. just because a leading 0 in Flash means it is an octal value, not a decimal value.
Leading 0.0 do not alter the value (it's a less than 1 thing)
But then I realised. Hang on a minute says I (yes, programming problems really can have you doing a good Ben Gunn impression). Hang on a minute says I, Flash handles numbers begining with a 0 all the time. What about 0.1, 0.2 etc. It has no problems with decimal values of less than 1.
And here is my solution. Instead of using my for loop to prepend just 0s, I will use it to prepend 0.0s, as follows:
The result is that the original values:
650, 12, 86
become
0.0650, 0.0012, 0.0086.
Now when we sort them numerically:
my_array.sort(Array.NUMERIC);
It does put them in the right order:
0.0012, 0.0086, 0.0650.
OK, I know that doing this has changed the values too, but at least they are still decimals (not a totally different numbering base). Because they are still decimals it is easily rectified, it's just a case of shifting the decimal point a few places. And we can do this by very simple multiplication...
...just multiply them by 10,000.
0.0012 x 10000 = 12
0.0086 x 10000 = 86
0.0650 x 10000 = 650
So, to finish off, now we have prepended 0.0s to our original values, then sorted them, all I need to do to get the highest value is retrieve the last item from the array, and multiply it by 10000.
var highestscore:Number = (my_array[my_array.length-1])*10000;
And there we have it. Hopefully some of you will find this helpful. Frankly I don't know why numeric sorting doesn't just work. But since it doesn't, here is a cheap and cheerful workaround.
Arrays are really useful, they allow you to store data, select data, order it, etc. You can create them from strings and other variables, and turn them into strings and other variables. All in all, they can be very handy.
I found them handy as part of a game I was writing a couple of days ago. As part of my code I needed to find the number with the highest value out of a choice of 3 numbers. The logical solution was to put all 3 numbers into an array, then sort them numerically, then retrieve the last item in the array (this should, after sorting, be the one with the highest value).
Numeric sorting is not numeric
Let's say we start with the following array:
var my_array:Array = [650,12,86];
Then we sort them numerically:
my_array.sort(Array.NUMERIC); //doesn't work correctly
After this command you might expect flash to order the array as:
12, 86, 650
But what you actually get is:
12, 650, 86
This is because, as the Flash documentation explains, 'Numeric fields are sorted as if they were strings, so 100 precedes 99, because “1” is a lower string value than “9”. '
In other words, the Numeric sort does not sort numerically at all. It sorts alphabetically. Odd sort of numeric, but it can't be helped, we have to find a solution.
Prepending 0s so all values have the same number of digits
Of course this only happens because not all the values had the same number of digits. If the lower values began with a 0 then a numeric (alphabetical) sort would work correctly. So my initial plan was to use an if statement in a for loop to check for 1 digit, 2 digit and 3 digit numbers and prepend (put in front) 0s to make them all the same number of digits as follows:
for (var i = 0; i<finalscores_array.length; i++) {
if (finalscores_array[i]<=9) {
finalscores_array[i] = "000"+finalscores_array[i];
} else if (finalscores_array[i]<=99) {
finalscores_array[i] = "00"+finalscores_array[i];
} else if (finalscores_array[i]<=999) {
finalscores_array[i] = "0"+finalscores_array[i];
} else {
finalscores_array[i] = finalscores_array[i];
}
}
With for loops we can repeat a peice of code until a condition is met. This loop repeats for the length of the array (that's the number of items in the array). It starts by checking how many digits the first array item has. Then depending on how many digits the code prepends 3, 2, 1 or no 0s. On the next repetition it checks the next array item, and so on until all array items have been checked and had the required number of 0s prepended so that they all have the same number of digits, and then the loop ends.
The result is that the original values:
650, 12, 86
become
0650, 0012, 0086.
Now when we sort them numerically, it does put them in the right order:
0012, 0086, 0650.
Leading 0s alter the value (it's a decimal v. octal thing)
Wouldn't it be great if that was the end of your troubles?
The problem is that if we then want to do anything with the values afterwards, like doing anything other than displaying them, we need to remove the 0s we just added. And it is not nearly as easy taking off, as putting on.
The reason we have to remove the leading 0s is because Flash, like lots of other programs, does not treat numbers beginning with 0 as decimal numbers. It treats them as octal. This means that 0650 does not have the same value as plain old 650 (without the leading 0).
0650, as octal, actually has the decimal value of 424.
0650 is in fact a totally different number to 650.
So while prepending leading 0s solves our array sorting problem, it actually changes our values. just because a leading 0 in Flash means it is an octal value, not a decimal value.
Leading 0.0 do not alter the value (it's a less than 1 thing)
But then I realised. Hang on a minute says I (yes, programming problems really can have you doing a good Ben Gunn impression). Hang on a minute says I, Flash handles numbers begining with a 0 all the time. What about 0.1, 0.2 etc. It has no problems with decimal values of less than 1.
And here is my solution. Instead of using my for loop to prepend just 0s, I will use it to prepend 0.0s, as follows:
for (var i = 0; i<finalscores_array.length; i++) {
if (finalscores_array[i]<=9) {
finalscores_array[i] = "0.000"+finalscores_array[i];
} else if (finalscores_array[i]<=99) {
finalscores_array[i] = "0.00"+finalscores_array[i];
} else if (finalscores_array[i]<=999) {
finalscores_array[i] = "0.0"+finalscores_array[i];
} else {
finalscores_array[i] = "0."+finalscores_array[i];
}
}
The result is that the original values:
650, 12, 86
become
0.0650, 0.0012, 0.0086.
Now when we sort them numerically:
my_array.sort(Array.NUMERIC);
It does put them in the right order:
0.0012, 0.0086, 0.0650.
OK, I know that doing this has changed the values too, but at least they are still decimals (not a totally different numbering base). Because they are still decimals it is easily rectified, it's just a case of shifting the decimal point a few places. And we can do this by very simple multiplication...
...just multiply them by 10,000.
0.0012 x 10000 = 12
0.0086 x 10000 = 86
0.0650 x 10000 = 650
So, to finish off, now we have prepended 0.0s to our original values, then sorted them, all I need to do to get the highest value is retrieve the last item from the array, and multiply it by 10000.
var highestscore:Number = (my_array[my_array.length-1])*10000;
And there we have it. Hopefully some of you will find this helpful. Frankly I don't know why numeric sorting doesn't just work. But since it doesn't, here is a cheap and cheerful workaround.
Wednesday, 16 September 2009
Design industry calls for "More Rounded" design graduates
This is always one issue that concerns me about my students. You get the creative ones who hate computers, then you get the computer geeks who think knowing the software will somehow make up for their lack of creativity.
They are both wrong. Where interactive media is concerned anyway.
Design Week reports that the D&AD Xchange conference for tutors once again highlighted the "mismatch between the kind of graduates design colleges are providing and what consultancy creative heads require".
And what do design consultancies require in new graduates? In their own words "More rounded" graduates. By this they mean more creatively rounded - more understanding of creativity, more understanding of design. Rather than a 2 or 3 year higher education in design some have even suggested a 3 year foundation course in design (allowing design students to experience a wide variety of creative disciplines while developing their creativity) followed by only one year of specialisation.
For some of my students that would mean not getting into the web design and interactive media technology for another 3 years - and meanwhile, they learn to be creative designers in many different media.
Oddly perhaps for art & design (though not so odd perhaps for a wanabee web designer) many of my students seem to resist the creative development required to be an effective designer. Many are focused so much on learning the technology, they are in danger of being technically good, but creatively stunted - able to use technology, but not to solve design problems.
As Neville Brody puts it: "We imagine to be able to do anything, and our software helps us believe we can... But we must move beyond the 'how' to reconsider the 'what' and the 'why'."
This is my greatest fear for some of my design students. They are most interested in learning how to do something, but ignore the important business of learning how to decide what they should produce and why.
Those who persist in making this mistake may well regret it. Leaders from the industry have spoken, they want creative people, not just technitians.
If they resist the creative development aspect of their education, they may get what they want in the short term, but in the process fail to become what their employer wants.
They are both wrong. Where interactive media is concerned anyway.
Design Week reports that the D&AD Xchange conference for tutors once again highlighted the "mismatch between the kind of graduates design colleges are providing and what consultancy creative heads require".
And what do design consultancies require in new graduates? In their own words "More rounded" graduates. By this they mean more creatively rounded - more understanding of creativity, more understanding of design. Rather than a 2 or 3 year higher education in design some have even suggested a 3 year foundation course in design (allowing design students to experience a wide variety of creative disciplines while developing their creativity) followed by only one year of specialisation.
For some of my students that would mean not getting into the web design and interactive media technology for another 3 years - and meanwhile, they learn to be creative designers in many different media.
Oddly perhaps for art & design (though not so odd perhaps for a wanabee web designer) many of my students seem to resist the creative development required to be an effective designer. Many are focused so much on learning the technology, they are in danger of being technically good, but creatively stunted - able to use technology, but not to solve design problems.
As Neville Brody puts it: "We imagine to be able to do anything, and our software helps us believe we can... But we must move beyond the 'how' to reconsider the 'what' and the 'why'."
This is my greatest fear for some of my design students. They are most interested in learning how to do something, but ignore the important business of learning how to decide what they should produce and why.
Those who persist in making this mistake may well regret it. Leaders from the industry have spoken, they want creative people, not just technitians.
If they resist the creative development aspect of their education, they may get what they want in the short term, but in the process fail to become what their employer wants.
Saturday, 5 September 2009
FREE eBook - The Principles of Successful Freelancing
Whether you are a Freelance, Student or work within a studio, you will probably find Sitepoint's latest offer an interesting if not valuable read.
It's a 200 page eBook on The Principles of Successful Freelancing.
It normally costs about $30 but Sitepoint are giving it away FREE for the next 8 days.
To get the book you must either follow them on Twitter or submit your email address to their mailing list.
Sitepoint often give away selected chapters from their books as tasters, but this is the first time I have seen them give away an entire book. Clearly a good strategy for increasing their Twitter following (currently 49,662) and mailing list sign-up - we could all learn a trick there.
GO GET IT: http://twitaway.sitepoint.com/
Subscribe to:
Posts (Atom)
Posts
