XML in Production (lazy)

March 30th, 2009

I’m working a lot with international sites and there can often be times where the deadlines are short, customers aren’t so fast as I wish they where with feedback e.g.

This often messes up translations with XML files. They needs to be resend for changes and as the sites takes interaction you can find that things are missing.

Here is a small tip if you are running out of time, make sure your XML structure is simple, as well make sure that you are using unique id attributes. Then you can just combine the XML files and you don’t really need to go thru hours of copy/paste work.

A small example.
XML 1
<xml>
<gui>
<item id=”replay”>REPLAY</item>
<item id=”start”>START THE GAME</item>
</gui>
</xml>

XML 2
<xml>
<gui>
<item id=”volumeOff”>TURN ON VOLUME</item>
<item id=”volumeOn”>TURN OFF VOLUME</item>
</gui>
</xml>

So what I do is just to add on and on and combine the XML;s.

var copy:XML = levelLoader.getXML("data/en.xml");
var copy1:XML = levelLoader.getXML("data/en01.xml");
var copy2:XML = levelLoader.getXML("data/en02.xml");
copy = copy.appendChild(copy1.*);
copy = copy.appendChild(copy2.*);
 
var volumeOff : String = copy.gui.(@id=="volumeOff");

Flash , , , ,

Bandwidth tester for server.

March 12th, 2009

So I needed to try out some speed from a company server. You can always take a bandwidth test on your computer to see your own bandwidth speed (http://www.speedtest.net/), but when placing files on a server you also need to consider that server speed, the connection and the whole way of roadblocks to your computer.

First step is to create a dump file, I just took a ordinary file and renamed it to “data.bin”.

Next step is the speed tester itself. If I figure it out correctly I can take the downloaded time and run it against the downloaded bits to get the speed.

var downloadTime:Number = (getTimer() - timeMarker) / 1000;
var bits:Number = file.bytesTotal * 8;
var bps:Number = bits / downloadTime;

Something like “bps = download size in bits / download secs”

To think of here is that when calculating file size 1mb = 1024kb, but when going for bits whe have 1kbps = 1000bps. Look at this (http://web.forret.com/tools/bandwidth.asp).

How to use
So anyway I created this simple zip file, unzip it on your server, place a file/files in the same folder and then set the paths from the html file, look at line 92“flashVars”, “files=data.bin”, use , to add more files to load as an array.

This way I could for e.g. check that my connection is 9.6mbit to the net but the speed from my hosting server is 4.5mbit.

Download the Server Speed Tester. bandwidthtester

Life , , , ,

iPhone Stop Motion

February 23rd, 2009

We looked at some stop motion at work and decided to create our own test with an Iphone. Nothing fancy pancy, have a look =)

 

Life , ,

Runtime Dynamic Fonts for CS4 (fp9), next-gen

February 13th, 2009

Runtime Fonts for Flash is a wonderful way when building apps, even better if you are as me and creating international apps for a lot of countries, you have the language supports and the problem with characters in fonts when staring to look at Greek, Japanese, Korea, Chinese and so on. I have a old Runtime font for CS3 that works pretty well. But when starting to use CS4 I wanted to improve the loading and sharing.

So the idea was to use Flex to compile Font SWF files, a big problem when I use Flash CS4 (fp9) and Flex 3. Flex will not recognize my font SWF file, it will also not recognize my local fonts to embed bold/italic font sets. Using an exported CS3 (fp9) file it works just fine.
Note; fp9 = Flash Player 9.

So lets look of how to do this.
First we need to create our font file.
1.) Create an Flex ActionScript project (I use framework 3.2)
2.) The Class name will be something that we will get later so I renamed my as file to FontHolder.as
3.) Remove the constructor and add the embed tags, example below. Note the unicodeRange tag, these are used to select characters to be embedded, remove to embed the entire font.

package {
	import flash.display.Sprite;
 
	public class FontHolder extends Sprite
	{
		[Embed(systemFont='Verdana', fontFamily='Verdana', mimeType='application/x-font', unicodeRange='U+0061-U+0074')]
		public static const verdana_regular:Class;
 
		[Embed(systemFont='Verdana', fontFamily='Verdana', mimeType='application/x-font', fontWeight='bold', unicodeRange='U+0061-U+0074')]
		public static const verdana_bold:Class;
	}
}

4.) Now you have your font SWF file to use for the project.

So with your font file it’s time to use it in the project. In this example I use my Flex 3 as CS3 development tool., this is because I create Flash Player 9 project. You can of course use only Flash IDE or any other kind of code editor.
1.) Create a new ActionScript project, change the SDK to CS3.
2.) Click next, “Main source folder”, type “src”, this is just to put the files more pretty =), Click Finish.
3.) Create a CSS file that will control the fonts. “default.css”. Just add two classes that we can work with.

h1{
	font-family: Verdana;
	font-size: 24px;
	font-weight: bold;
}
body{
	font-family: Verdana;
	font-size: 12px;
}

5.) Download the FontManager.swc file and add it to your project.

Add SWC HowTo for Flex
6.1.) Create a folder called swc in project folder.
6.2.) Place the FontManager.swc file into the created folder.
6.3.) Right-Click on project folder and select properties
6.4.) In menu choose “ActionScript Build Path”, Choose the tab “Library path”
6.5.) Click on “Add SWC Folder”,  Select the created swc folder and close the windows, all done.

Add SWC HowTo for Flash
7.1.) Create a folder called swc in project folder.
7.2.) Place the FontManager.swc file into the created folder.
7.3.) Open Flash and Publish Settings.
7.4.) Choose the Flash tab and click on Settings next to the script combobox.
7.5.) Choose the “Library Path” tab and add the swc file to the list, all done. 

So, everything is there. How am I using it? Well, this is a dump on the project playground.
dynamic_files1

 

 

 

 

 

 

 

 

To be able to use the fonts they are needed first to be loaded. By default this is the structure for font swf and css file named default. They can be changed by FontManager.name = ‘default’ (the name) and the path with FontManager.path = ‘fonts/’.

The easiest way is to just get the singleton and load it.

var manager:FontManager=FontManager.instance();
manager.addEventListener(Event.COMPLETE, onManagerComplete);
manager.loadStandalone();

When it’s loading just send the textfield, style and text to the FontManager, you can add only textfield and text if you want to add e.g. multiple styles to one textfield.
Here’s some examples.

private function onManagerComplete(event:Event):void
{
	var tf:TextField = new TextField();
	tf.autoSize = TextFieldAutoSize.LEFT;
	tf.border = true;
	tf.rotation = 6;
	FontManager.instance().register(tf, "h1", "abc");
	this.addChild(tf);
 
	var tf1:TextField = new TextField();
	tf1.autoSize = TextFieldAutoSize.LEFT;
	tf1.x = 150;
	tf1.border = true;
	tf1.rotation = 6;
	FontManager.instance().register(tf1, "body", "abc");
	this.addChild(tf1);
 
	var tf2:TextField = new TextField();
	tf2.autoSize = TextFieldAutoSize.LEFT;
	tf2.x = 300;
	tf2.border = true;
	tf2.rotation = 6;
	FontManager.instance().text(tf2, "<h1>abc</h1>\nabc");
	this.addChild(tf2);
}

Flash, Flex , , , , , ,

Scandinavians in Facebook

February 6th, 2009

I took out some information from Facebook about members and sex in the Scandinavian and looked up some population statistics from wiki. Here are the results;

Percent of members based from country population.

chart_percent

 

 

 

 

 

 

 

 

 

Here’s a overview of the countries population, facebook memeber and sex. Think it’s kinda cool that the majority of members are girls. Rock on I say. Rock on!

statsfacebook

Life

Encode to FLV

February 3rd, 2009

This is a quick help for how to Encode/Convert movies to the Flash FLV format. There are a couple of general encoding features that could be good to know. The key is to find a good balance of frame rate, data rate and keyframe.

When working with digitally compressed video in a format such as Flash Video, the higher the frame rate, the larger the file size. To reduce the file size, you must lower either the frame rate or the data rate If you lower the data rate and leave the frame rate unchanged, the image quality is reduced. If you lower the frame rate and leave the data rate unchanged, the video motion may look less smooth than desired. Something to remember here as well is that you can never gain quality when encoding, so if you have a bad video to start with it will not get any more pleasant to look at just because you boost the data rate.

For short;
Frame rate (fps); The less, the more jumpy.
Data rate (bitrate); The less, the more pixels/blur.
Keyframe; The less, smaller file size.

Since Flash Player 9,0,115,0 there is now the possibility to convert HD quality, so i brief version list of the codecs;
Flash 6-7; Sorenson Video
Flash 8-9; On2
Flash 9-10; On2 (new F4V open format since 9,0,115,0)

There is a really good convert guide to get some help on the export settings;
http://www.adobe.com/devnet/flash/apps/flv_bitrate_calculator/

How to work out the best video compression for me?
This is the hard bit, for short I would recommend these steps.
1.) Figure out a compression that you guess would be the perfect one (get help from calculator).
2.) Setup 4 more compressions, 2 that has higher quality than your (1.) setting and 2 that are below.
3.) Line up all the videos and find the video with the lowest quality settings but that you find is still good. Now from this go back to step 2.
4.) After a couple of rounds this way you should have found a compression for your video.

Remember that all videos are different, so there is no magic setting that will work on all your videos. Also when choosing the “best” video you need to keep track on the file size and what the target is going to be.
Read more…

Flash , , , , , ,

Flex 3 as CS4 development tool

January 23rd, 2009

Are you as me and using Flex as a development tool and just switched to CS4 development. Well, no problem, you can still use Flex for your coding and debugging.

First you need to download and install Gumbo for flex.
1.) Download Gumbo: http://opensource.adobe.com/wiki/display/flexsdk/Downloads
2.) Place it inside the Flex SDK folder: /Applications/Adobe Flex Builder 3/sdks
3.) Go into the library directory: /Applications/Adobe Flex Builder 3/sdks/{sdk version}/frameworks/libs/
Remove all files except the /player/10/playerglobal.swc.
Before: flex_sdk_before After:

flex_sdk_after1

4.) Open the “flex-config.xml” in the /Applications/Adobe Flex Builder 3/sdks/{sdk version}/frameworks/ folder
Replace the text “{targetPlayerMajorVersion}” with “10″.

5.) Open/Restart Flex and add the SDK to flex: Preferences/Flex/Installed Flex SDKs
flex_add_sdk_1

6.) Create a empty ActionScript Project, In the window make sure to change the SDK (use a specific SDK).

Now you should be able to use Flex Builder as a code editor when building Flash CS4 projects. You can also look on how to develop for CS3. A tip is not to click finish, click the next button and in the field “Main source folder” enter src. Cleaner place for putting the fla & as files.

Flash, Flex , , , ,

Myracer portable MF-101

January 9th, 2009

Just got hold of Myracer MF-101 that is a portable game device from South Korea (made in china) and somewhere play4u is a part of the action as well, looks like you can get a lot of new games from there (I don’t understand Korea).

product

The MF-101 comes with some built in applications as, Game, Movie, Music, E-book, Image Viewer and of course has some custom settings. At a first glance the device it seems very inspired from the PSP but it’s much smaller in all the ways and very light. It has 1gb inbuilt memory but has a SD-Card slot if you want to expand, must say that the USB plug is strangely placed. The whole cool thing about this portable game device is that it has a Flash Player.

Read more…

Flash , , , , , ,

Flash CS4

December 15th, 2008

I finaly got my license of Adobe CS4.

cs4package-compress

Happy as I was i tried out Flash and some of the new cool features, created a small dynamic draw application and tried out the 3D features (use the knobs, hold and drag mouse). Make sure you have Flash Player 10 installed.

cs43ddraw.png

As usual, download source here dynamicdraw.zip

Flash , ,

Working in the “Cloud”

December 11th, 2008

I’m currently starting a new company called Hello There (http://hellothere.se/) and what I’ve done the latest time is to evaluate and setup the infrastructure for our company. I’ve compare working in the “old” way or trying something new as the “cloud” (http://en.wikipedia.org/wiki/Cloud_computing).
I really love the whole idea about the cloud. The basic idea is that you host all your content online and as well use online tools for your workflow. One of the best things as well is that your don’t need to know what’s going on with the technical infrastructure.

I started to compare and look for services that could fill my company need and when we work as a “agency” it’s a lot of big files (videos,images,binary development). Search and went thru a big list of services until I found a couple that looked interesting for evaluation.

Some of the goals that they needed to fulfill is:
1.) Hosting uptime > 95% (ideal is 99%)
2.) Security (SSL, hopefully extra encryption)
3.) Easy to learn
4.) Easy to use

Points 1 & 2 are important for the company and to maintain our security policy for the clients. Points 3 & 4 are important for the employees where there is a wide range of age (25-50) and where everyone has worked the “old” way for many years.

Now we have our services running and I will probably reveal them over time when we have worked in a couple of projects and really tried them but here is the experiences so far. I will then as well describe how we work and what hardware we are using and why. Everything tries to go mobile as much as possible, always connected, always updated.

Costs:
When comparing running Microsoft Exchange Servers, having own backups servers with technical support, buying desktop applications the “cloud” solution is much cheaper. I’ve slices the cost with 80%/employee if I compare from my previous company.

Security:
Uptime guarantees is not always there and that could create some real problems in tight project delivery situations. The security varies between the different services but most uses SSL, very few gives VPS for data storage. Some services doesn’t have enterprise solutions with admin accounts and that could really create problems with user logins and sharing/grouping data.

General:
All services has their own standard for handling accounts and passwords and there are few services that actually talks to each other. The majority of the services feels like “beta”. The whole “could” community works perfect for a single user or a small group that are very online aware, but for companies it’s not quite there yet. The support varies here as well depending on time-zone and what your pay for your account. A good thing about many services is that it’s easy to upgrade/downgrade the account with users or features.

Future:
For this to take of and become the new standard there are a couple of things that I would like to see.

1.) Standard login
Why not e.g. continue on “Open ID” (http://openid.net/) and make it for enterprise solutions like a online LDAP where you control your accounts for all online services. Today you need to control it for each services alone and with the different standards this is a real pain in the ass.

2.) Security
The security for handling data with SSL, VPS e.g. company information has much higher demands than personal users or small independent companies. To often backup the data is important as well, some services has every 10 minutes and some 1/day.

3.) Uptime
The uptime is critical, having the services go down during work would create a direct impact that none of your files are available.

4.) Sharing
Create more open API;s and implement others API;s to their own services so that content and info can be shared as much as possible. For e.g. many services has own calendars when everyone already has a calendar elsewhere, instead the end user needs to control all linking, update at the correct place.

Conclusion:
When comparing the costs with what you get, comparing the workflow and access to correct files, access from anywhere e.g. the “cloud” wins in my book. I have no expertise in this subject but I had no problem setting up the services and create a complete infrastructure for my company. What I love about it is that you pay often monthly fee so you have control over the expenses and you will get the new features as they are being developed so no expensive license costs.

The “cloud” is still in “beta” mode and I figure it will take a year or two before it starts to get more structured and easier for the end-users to use multiple services. The perfect scenario is a common “portal” where you administrate your company employees and services, and from there choose what services you want to use that fits your company workflow and needs. The “portal” hosts the actual data so you could change the services and go for something else, maybe in another life =)

The Winner: CLOUD

Life , , , ,