YoSpace’s SPEDE 6.0

This is certainly not a new release, but today I needed for a few tests and so I also took a chance to write a short review. I have to admit that in the last few months I haven’t been involved in any tough WAP development, but more in writing guidelines and reviewing documents. Nevertheless I think this is going to be a very useful tool, so let’s see what it offers.

First things first. Yospace offers two tools, one is an online emulator for your site and one is a develompent tool, AKA SPEDE.
Where do you get it? A trial version of SPEDE 6.0 is available for Windows, Linux and Mac. Is this the proof of Java’s write once run everywhere?

What is it?
SPEDE is a testing toolkit that offers all the needed tools to verify that your mobile sites work as expected on many devices with little effort. It is primarily an emulator, but also offers more tools that will help developers to clean-up mistakes and optimize pages.

When you open it for the first time you get two devices side-by-side a Sony Ericsson K750i and a Motorola V3i. The devices will display a default start page from Yospace’s site.
On the right you will have a box that represents your workspace (the devices that you want to emulate) and another box for the recently visited locations. Very handy to jump back and forth.

Now the real fun starts. On the right you have a “workspace” box. Right-click and add all the devices that you like. I like to have different brands and families. I’ll add a couple of devices to show you how it works.

With 4 devices side-by-side it’s very easy to see how a page is rendered. You can load and re-load pages on a single device or on the entire workspace alltogether.

How are devices emulated? Yospace buys the real devices, checks the resolution, characters per line, number of lines, screen size in inches (they are from Middlesex in UK!) and everything that is needed to show how the devices look. They also test device features such as available fonts, font sizes, image formats, how images are rendered and so on. They do a deep device testing to make the emulation as real as possible.
Each device will act as the real device and you will be able to browse to any page. Here’s another screenshot with a different page on each emulated device. I could open single URL’s on each of them and then keep browsing. You can click on the buttons to see how it will be on the real device or use your keyboard (much easier!):

What else? Some of the tools available clearly come from the WML days, but they are very useful if you still want to support them and make sure you never get a “Unsupported content” or similar error.
Check out the full source, the decoded markup (if you received a WMLC page, otherwise it will be the same) and WML variables. Cookies are also available, but not in this screenshot. You can see, edit, add and remove them at your will. Feel the power!
Click on the screenshot to see it in fullscreen. You will notice that you can also see the HTTP headers, very useful if you want to check the charset, content-type and other headers. Hex view is also available, just in case you want to edit the binary version! 😉
Source URL is a dropdown and you can pick previous pages still in cache (each device has its own cache!).

Like every good browser, SPEDE also give you the possibility to add and manage your bookmarks.

Something that is not present in your default browser, but that will be very useful if you’re a mobile developer is a “device settings” menu that you can personalize for each device.
Configure the user-agent string, decide the parsing strictness and add custom headers.

If you can choose between strict and relaxed validations… You will also want to know if your page effectively validates. SPEDE offers you this too, of course. See this last screenshot that shows errors (if any) and a list of the requests made to download the markup, CSS, images, etc. Very useful!

A “skin manager” will let you see all the available skins. As described previously, skins are not just images drawn around the page, but real implementation of the browser behaviour.

The last feature is also very important if you want to test your site from time to time to verify that everything is still working. The scripting engine. You will get two windows, one with an old Nokia 7110 and a text window. You can write your script, save it, re-open it and edit it. Once you’re happy with it, you can run it.
I have to admit I did not test it, but I understand how important it can be if you keep up a big site for a long time and always want to make sure it’s working properly.

Is this a perfect tool? Well, it’s a very good tool and if you’re serious about mobile development, I suggest it. Like every other software, it’s not perfect. While testing and taking screenshots, a couple of times the Sharp GX30 hung and did not want to open any other page. I forced the workspace to load another page and eventually worked. I don’t konw what happened.
The Motorola V3 and V3i did not load the images for a WAP page that I have developed and incidentally I have a V3 here and works like a charm. I know that YoSpace dedicated a lot of time to this tool and I believe that the rendering if faithful, but of course this little glitch raised some doubts or at least made wonder how precise can be the emulation of a third party tool. Will it be able to emulator all the different sides, behaviours and glitches? I think it’s a very tough job.
When you look at the source code, YoSpace kindly included syntax highlighting. My personal preference would have been for more intense colors such as red. Also, the “Status page” shows errors, if any, it would be great to also see it in the source code window, highlight the markup.

It would have been good to have more Siemens and LG devices.
When are new skins available for download?

One last thing is the general UI. I tested on a Mac OS X. The UI is clearly inspired by Windows. I know that it’s a big effort for a small number of users, but a more native interface would have been appreciated.

Nevertheless, this is a great tool and don’t forget that it’s DAMN cheap!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s