Monday, July 30, 2007

Widget: Radial Clock

Last weekend I was experimenting a bit more with different ways to display the time, again working with clocks using Tweener and a bit of Maths and this is one of the widgets I did, the Radial Clock has similar idea to my Squares Clock but tweening the time units in a radial way similar to an analogue clock. I've used the ChangeColour AS2 class to show the rollOver state of a button that links to this blog.

As you can see, this time I've added it to the yourminis website, and it's the first widget I've uploaded over there. To my surprise, few hours later, the clock had been cloned! of course immediately I wrote an email to yourminis letting them know about it... later on I realized that "cloning" widgets is actually a feature in the yourminis platform called "remix".
I'm a bit jealous with my widgets and didn't find it funny though... :P

Well, it was interesting trying a new widget platform, maybe another day I will write something about my experience using the different platforms I've used so far.

salut!

// --- Edit ---
It seems like yourminis doesn't exist any more. The widget shown here is powered by Widgipedia.

Sunday, July 29, 2007

ChangeColour Actionscript 2 class

I made this class some time ago and I'm still using it whenever I don't have time or creativity to do any other rollOver - rollOut effect; One of my readers (who saw the Spanish-Polish application) asked me about it so, why not sharing the code?

I guess these days I would do it in a different way but still does the job; to use it, just copy and paste the following code into your actionscript editor and save it as ChangeColour.as

/*
*
* Version 1
*
* Movieclip rollOver and rollOut ChangeColour class
*
* Author: Ernesto Quezada, Overloadstudios (ernesto.quezada(a)gmail.com)
* Date: October 2006
*
* Description: Gradually changes colour and brightness to a movieclip when rolled over
* and back to its original colour when rolled out
*
*/
class ChangeColour extends MovieClip {

private var control:Number = -10;
private var addShine:Object;
private var currentState:String;
private var myColour:Color;

// -- Constructor --
private function ChangeColour() {
currentState = "rolledOut";
}

// -- Events --
private function onRollOver():Void {
currentState = "rolledOver";
this.onEnterFrame = function () {
checkState();
};
}
private function onRollOut():Void {
currentState = "rolledOut";
}

// -- private functions --
private function checkState():Void {
myColour = new Color(this);
myColour.setTransform(addShine);
if (currentState == "rolledOver") {
if (control<=100) { control += 10; addShine = {rb:control, gb:control-20, bb:control-50}; } else { addShine = {rb:0, gb:0, bb:0}; } myColour.setTransform(addShine); updateAfterEvent(); } else if (currentState == "rolledOut") { if (control>=10) {
control -= 10;
addShine = {rb:control, gb:control, bb:control};
} else {
delete this.onEnterFrame;
}
myColour.setTransform(addShine);
updateAfterEvent();
}
}
}

Then put it in a folder called Classes (or wherever your classpath points to) and whenever you want to use it, in the Flash library, right click on a movieclip, select export for actionscript and write ChangeColour as the AS 2.0 class.

I know, I made it 9 months ago and needs a review...

salut!

Saturday, July 28, 2007

Flash Spanish-Polish application - update

A year ago I posted something about a Spanish-Polish application I was working on as part of the experiments and personal stuff I was doing in my spare time.
Let's see an update on what I mentioned in that post:
- I managed to finish just 2 out of the 3 games I was working on (Breakout & Blitzkrieg)
- The Spanish-Polish application is still half way, those designs where put into flash but still there's a lot to do.
Only 3 out of 8 sections are working: Time, Calendar & Colours but still need sound.
Click here if you want to check it out.

And, what am I working on these days?
- 3 widgets
- if I have time, I might continue with the Spanish-Polish application...

Salut!
Spanish-Polish application

Sunday, July 22, 2007

Squares Clock Widget

I'm a bit obsessed about data, I think of data as numbers because every single piece of data represents already a unit!
For example, when I built the CPU Usage widget, I translated the numbers into bars, tweening depending on the data; same when I built the Moving Earth widget, where the magnitude of earthquakes is shown using bars as well...
But if we take numbers and translate them into squares, so X units will be represented by squares, then we have something like my Firefox Screensaver or the Squares Clock widget:



As is experimental then expect some minor bugs :P
If you like it, you can get it from Widgetbox.

Salut!

Saturday, July 21, 2007

Add to Google Flash Button

Trying out FeedBurner I noticed most of my feed readers are using either iGoogle or Google Reader, products I knew about but never took a close look at them.
I assume many other people are using this two ways to check news on many blogs without going to each blog each time...
so I built this Add to Google flash button widget and uploaded it to Widgipedia, this is the description:

Promote your feed by placing this widget to your website. This will make it easy for people to quickly add your feed right to their Google homepage or Google Reader.

and this is how it looks like:


The Widgipedia gallery
requires Adobe Flash
Player 7 or higher.

To view it, click here
to get the latest
Adobe Flash Player.
Get this widget from WidgipediaMore Web & Desktop Widgets @ WidgipediaMore Web & Desktop Widgets @ Widgipedia


To be honest it wasn't that easy to build as there is some crazy php coding behind to get the HTML code from the page that displays the widget, search through it looking for the feed address and as soon as it locates the feed, sends this address to Google...

I hope people find it useful and if you think of a similar widget I should built, just shout ;)

salut!

Wednesday, July 18, 2007

Actionscript: Tween vs Tweener

The other day I asked my mate ThatBlokeMike which Tween class was he using, the answer: Rob Penner's one, included by default when you install Flash.
I talked to him about the goodness of Tweener & how it helped me to speed up my developing process, but still couldn't convince him...
That's why I've decided to have a look at both options and see why I prefer using Tweener rather than Tween.

When I first started "Tweening with Actionscript", I was checking every time a great tutorial on Kirupa about it: Using the Tween Class.

It was good at the beginning, in fact I used it for several months and was happy about it, but still had to go back to Kirupa to check the options; the reason: the code needed to do a simple tween is a bit too long...

For instance, if we want to blur a Movieclip on an OnMouseDown event, if using the Tween class, we will need to import the the Tween class, the Filter class, play a bit and after writing a long code and spent some good minutes doing it, we will get what we want. But, if using Tweener, with a couple of lines of code we will get the same effect!
Click anywhere on the flash movie:


Let's see it the code:
import caurina.transitions.Tweener;

function blurIt():Void {
Tweener.addTween(my_mc, {_blur_blurX:15, time:1});
Tweener.addTween(my_mc, {_blur_blurX:0, time:1, delay:1});
}
this.onMouseDown = blurIt;

That's it!
easy, isn't it? now, your homework, do the same using the "traditional" Tween & Filter Classes...

More good things about Tweener:
- is open source
- the best bit, you can add more properties to the same tween, ie:

Tweener.addTween(my_mc, {_x:15, _y:25, _alpha:85, time:1});

& even a change of event in the same line:

Tweener.addTween(my_mc, {_x:15, time:1, onComplete:doSomething});

- has loads of parameters, special properties and many more transitions, so for sure you will fine one that suits you ;)

of course, it has some "back downs" but is up to you if you consider them "too bad", anyway, after using Tweener for some months now, I've found just two of them:
- It doesn't (yet) have anything similar to the "yoyo();" method found in the original Tween Class.
- It adds to your final swf 5 or 6kb more than if you were using the Tween Class only.
for me, that's not a big deal, so my advice:

Download Tweener, try it out, if you like it, keep on using it, if not, don't use it and all of us happy :)

salut!

Tuesday, July 17, 2007

my 15 minutes of fame

Andy Warhol said once:

"In the future, everyone will be world-famous for 15 minutes."

I think it was my turn as when my latest widget was announced winner of the Big Widget Challenge, the news were posted on MASHABLE, one of the most important news websites about social networking & web 2.0.
I did a quick search on Google and found the widget being mentioned on another couple of sites:
BOL - Business On-Line (Japanese), STUFFLEUFAGUS & Colechurch Consulting.

--- UPDATE ---
just wanted to add two more links:

Daniel Todd who's blog is part of the MXNA and
StickyWidgets (bookmarked) that I found just minutes after publishing this post
----------------

Big thanks to all of you!

To celebrate it, I've changed the look & feel of this blog. To be honest, it wasn't easy because Blogger is not as flexible as other blog platforms but hey! I like it! :)

I just hope I can manage to have some free time to experiment more with Flash, build more widgets, games & write some more tutorials...

salut!

Saturday, July 14, 2007

Big Widget Challenge winner

Having built some widgets for Widgetbox, three weeks ago I've got an email from them inviting me to participate in the BIG Widget Challenge which was a contest organized by Freewebs and Widgetbox.
So, I did this Flash widget that takes information from the United States Geological Survey's Earthquake Hazards Program; this info is partly presented using Google Maps thanks to a component developed by AFComponents, and the rest of the info is presented in an info box which has a couple of animations made with the tweener class.

The contest winner has been officially announced at the WidgetCon 2007 website, so, I'm proud to say that I won the contest!.

If you want to have a look at the widget click here.


Salut!