In between my work and personal projects I have going on at the moment I am trying to work on a particular project which I am quite excited about. I don’t want to reveal too much yet but it should be an exciting addition to my portfolio site when it’s finished. At the moment I am simply in R&D mode, playing and prototyping with different pieces in flash until I can finally bring them all together.

Based on existing code I have ported the ActionScript over from an example and create an ActionScript 3.0 class that I can re-use. I will probably update it later to add even more functionality but for the time being it is doing the trick. I wanted a really smooth way to drag items around on a page but the items had to behave and ‘feel’ like they were actually being dragged. This meant calculating the cursors position in relation to the center of the item and comparing this to it’s previous positions and rotating it accordingly.

At the moment the image gets distorted as it rotates. I’m aware of this occuring when you rotate a bitmap as well as scaling a bitmap to anything other than 100%. If anyone is aware of a way to stop or reduce this then leave me a comment becuase I’d love to figure it out? Perhaps there is a way to use the bitmapData class to apply smoothing to a bitmap? I have just managed to find a handful of blogs which mention the allow smoothing property that you can activate for bitmaps in Flash. There was some great articles on kaourantin.net, valve blog and gskinner. At the moment this flashlet uses a bitmap image from the library so I have enabled allow smoothing directly from the library panel. I will need to do more work on this when I begin loading it the bitmaps dynamically.

I discovered a fantastic selection of articles on adobe.com written by experts within the field. After reading through and noting points from as many articles as possible I am trying to collate the information in to a series of “best practise” bullet points for quick and easy reference. I will be using these points when I work with flash video in the future and adding extra sections whenever I discover new information.

Encoding Flash Video (Tom Green and Scott Fegette)

I tried to split the best practises in to headed sections and give a few key points for each section:

Raw footage:

• Mac -> use Quicktime video or Quicktime Animation codecs
• Windows -> use the uncompressed AVI codec

Framerate:

• Streaming video can actually be stream at a lower framerate without a noticable loss of quality
• Original (NTSC) 29.97/30fps -> new 15fps
• Original (PAL) 25fps -> new 12fps

Bitrate:

• Think of bitrate as the current/flow of data coming from the video file, the greater the bitrate the stronger the current, which can cause problems for people with slower connections. Reduce the bitrate reduces the amount of data that is streamed from the video file
• Intranet -> 400 - 600
• Broadband -> 200 - 300
• Diual-up -> 60 - 70

Keyframes:

• A keyframe is similar to a keyframe in Flash, in that it defines a specific point in the files timeline. The frames in-between keyframes are called “difference frames”
• The keyframe interval is how close together the keyframes are to each other, the close the gap the greater the number of keyframes, the greater the quality, the greater the file weight
• If you wanted an interval of 5 seconds between keyframes in a 15fps video file the calculation would be: 15(fps) x 5(secs) -> 75 keyframe interval

Sound:

• The best way to approach sound is to think carefully about the target audience and content of the video
• Audience - most pc speakers are mono, only higher spec systems will have a suitable stereo speakers. Who are your target audience? What spec systems will they generally have?
• Content - a single voice or narration will be fine in mono, movie trailers or video with music will sound much better in stereo

I’m going to keep searching the wordpress site to see if there is an update to resolve this. Until this I have installed the no-flash-uploader plugin from Dion Hulse and my blog is accepting images again. This plugin disables the flash media uploader so standard HTML browse and upload buttons appear instead.

I was surprised to recently find that many people are unaware of the fantastic Flash video bitrate calculator that was created by Robert Reinhardt and is hosted on the Adobe.com. I swear by this tool and now used it every single time I need to encode a video in the .flv format.

You pass in the aspect ration and width and height of you desired .flv along with a few other variables such as motion, codec and audio settings and the application calculate the optimum bitrate for your video. You can then use these values instead of the default settings in whichever program you use to encode your video. This gives you an .flv that is still high quality but can as much as halve the file size and CPU workload. I’ve created .flv files that are up to 5 seconds long and 300 x 250px is size that can be as low as 5K, that’s not a typo either, 5K!

Check out the Flash video bitrate calculator. I would have posted a screenshot of the app but my wordpress blog has other ideas. I’ve turned off my flash media uploader in wordpress after upgrading my Flash player to version 10.0.0 and now I can upload images again.

I am beginning to become more and more fascinated by particles, particle systems, physics and artificial life/intelligence algorithms. To cut a long story short I wish I knew what Keith Peters does. Following on from a tutorial he wrote in the Friends of Ed book New Masters of Flash Vol3 I have been doing my initial experiments in to particle systems starting with a basic AS2 class. Once I’ve experimented with this some more and added some cool features to it I am hoping to port the class over to AS3 and then have fun on an even larger scale.

Ideally I want to add collision detection between the particles so they do not collide with one-another, experiment with flock behavior/boids, attraction, repulsion and dynamic behavior. The flash experiment above is my initial foray in to the world of the particle!

You may or may not be aware of the annual global relaunch of websites on the internet? Each year hundreds of people subscribe to the may1reboot.com event, you might have seen that my portfolio is also included in this years event. It’s a great way to give yourself a deadline and purpose to a website re-design although the launch is now tomorrow and I am still far from completing the new website.

http://www.kirupa.com/forum/showthread.php?t=22379

After developing the interactive and standard video scrubbers I wanted to create a version that would allow me to drag and rotate an object or scene a full 360 degrees. Rather than using 3D in flash, I wanted to find a way to create the effect that would allow complex animation and effects to be created in After Effects, then exported as an image sequences and used in this 360 degree scrubber.

Again the scrubber has hot-spots which can offer more interactivity and the easing and sensitivity of the scrubber can also be adjusted.

I was proud to have one of my early flash + arduino experiments photographed and the code for the experiment should be getting posted on the tinker.it website soon as a simple example of getting flash to communicate with the Arduino board.

I do not have a video yet of an experiment I made yet (watch this space) but I do have some photographs. I found an old PC joystick in the loft which I chopped the serial plug off and soldered some prototyping wires on to for my breadboard, I then re-wired the two potentiometers that record the joysticks X and Y position and tested the buttons. Using an AS3 library Glue, SerialProxy as a http server and Flash, I was able to use the joystick to control a particle system and use the left and right buttons to cycle through different sprites that made up the particles.

Developing the Video Scrubber further I have added ‘hot spots’ to the animation so as you drag through the video, you simultaniously drag through the hot spots as well. These can be toggled using the controls.

There are some really cool existing examples of this effect, and there are several ways that it can be developed further. The hot spots could be faded in and out when you begin to drag the video around, they could be used to skip to a certain point in the video etc.