to Like or not to Like…

If you look at the bottom of this post (or any other post on my blog, for that matter – hint, hint) you’ll find that I’ve now added the almost ubiquitous Facebook “Like” button functionality to this blog. I decided it was time and had a few minutes spare in which I could add it… to give you a chance to say how much you enjoy my posts! ;)

The Like button and the little “thumbs-up” icon are becoming a massively-popular meme throughout the offline world with stickers, graffiti and even advertisements echoing the “I Like” sentiment. Coincidentally, I found something related while checking through today’s links on notcot.org:

If you want to be able to mark your preference, or indifference, on physical objects, you can now do so with these wonderfully analog rubber stamps from Nation:

Like rubber stamp from Nation
Like rubber stamp from Nation

Now you can not only show your appreciation for content online, but you can print it and stamp it with your approval aswell!

 

The New Bus for London – a Hybrid Hop-on, Hop-off winner!

The final design for the “New Bus for London” has now been released and the project is moving forward ready for 2012. The result looks fantastic – and it’s got a rear platform, just like the old Routemasters!

Take a look at this video from Transport for London:

This is going to be a great bus to ride on – particularly if you, like me, love the old routemaster’s rear platform and hop-on, hop-off bus trips. It’s a great feeling being able to just jump onto, and off from, the bus with an open platform. This feature is also going to create jobs as there’ll be a need for a second crew member, a conductor, to check oyster cards and issue tickets.

The bus will be light and airy and will also be significantly greener than existing buses as it’s a hybrid. All in all, this looks like it’ll be a real winner for London and it promises to bring back some of the uniqueness of the old Routemaster and make the London Bus something special again.

The only thing that Transport for London need to do now is give their drivers a refresher course on smooth driving ;)

 

ASDoc and how to actually make it work

Shock, horror! ASDoc working?!!

OK, ASDoc IS a cool thing. If, like me, you’ve spent many a happy hour trying to figure out how to make it actually work and been driven insane by it’s habit of pointing out errors in your code – or worse, errors in third-party code – and not just producing the blasted documents you wanted, then hopefully I can help just a little. With a little help from Seb Lee-Delisle and a cool little tool called Dita – it’s an AIR app!

ASDoc is delivered along with Flex Builder and is free, so why not use it to produce some nice API documentation for your latest project?

Because it’s command-line and very very fiddly?

I was determined to make it work this time (after giving up on a previous project) and surfed around for clues to get it working. I’d tried Dita on it’s own before and also tried the ASDocGUI AIR app – neither worked for me for some reason. So, google it is…

I immediately found Seb’s excellent blog post on the theme. He explains a neat little way to set up ASDoc within Flex, as an external tool. He also recommends using external SWCs instead of libraries to avoid ASDoc’s annoying tendency to document everything it finds unless you specifically exclude all classes you don’t want documented – individually :|

Now I had the issue that my project HAS used external linked libraries and I didn’t want to rework everything now that the project is final. This means that I needed to exclude several classes. That’s where, as Seb points out, Dita comes in.

Dita does not run ASDoc but allows you to create a batch file with all commands necessary to run it for your project. As I said, I couldn’t get it to work for me before, but this time I had other plans for it ;) I was going to use it simply to create that long list of classes to be excluded (in my case the Greensock TweenLite classes) and save me having to type them in manually.

Simply enter the project details and paths into Dita and include the file system path to the classes you wish to exclude, for example:

Entries in Dita for your project
Entries in Dita for your project

You’ll see that I have specified the path to the greensock libraries for the parameter exclude classes/packages (in the src/com folder).

Hit “GO” and you’ll produce a batch file as mentioned above.

Open up the batch file with an editor (notepad?) and you’ll see something like the following:


"C:\Program Files\Adobe\Flex Builder 3\sdks\3.2.0\bin\asdoc.exe" -output "C:\Documents and Settings\robert\My Documents\Flex Builder 3\Donut\docs" -source-path C:\Documents and Settings\robert\My Documents\Flex Builder 3\Donut\src -library-path -main-title "" -window-title "" -footer "" -doc-classes CAD Card CardContent CardEvent CardStack ChoiceDropdown CirclePreloader CoinStack com.greensock.core.PropTween com.greensock.core.SimpleTimeline com.greensock.core.TweenCore com.greensock.data.BevelFilterVars com.greensock.data.BlurFilterVars com.greensock.data.ColorMatrixFilterVars com.greensock.data.ColorTransformVars com.greensock.data.DropShadowFilterVars com.greensock.data.FilterVars com.greensock.data.GlowFilterVars com.greensock.data.TransformAroundCenterVars com.greensock.data.TransformAroundPointVars com.greensock.data.TweenLiteVars com.greensock.data.TweenMaxVars com.greensock.data.VarsCore com.greensock.easing.Back com.greensock.easing.Bounce com.greensock.easing.Circ com.greensock.easing.Cubic com.greensock.easing.EaseLookup com.greensock.easing.Elastic com.greensock.easing.Expo com.greensock.easing.FastEase com.greensock.easing.Linear com.greensock.easing.Quad com.greensock.easing.Quart com.greensock.easing.Quint com.greensock.easing.Sine com.greensock.easing.Strong com.greensock.events.TweenEvent com.greensock.OverwriteManager com.greensock.plugins.AutoAlphaPlugin com.greensock.plugins.BevelFilterPlugin com.greensock.plugins.BezierPlugin com.greensock.plugins.BezierThroughPlugin com.greensock.plugins.BlurFilterPlugin com.greensock.plugins.ColorMatrixFilterPlugin com.greensock.plugins.ColorTransformPlugin com.greensock.plugins.DropShadowFilterPlugin com.greensock.plugins.EndArrayPlugin com.greensock.plugins.EndVectorPlugin com.greensock.plugins.FilterPlugin com.greensock.plugins.FrameLabelPlugin com.greensock.plugins.FramePlugin com.greensock.plugins.GlowFilterPlugin com.greensock.plugins.HexColorsPlugin com.greensock.plugins.QuaternionsPlugin com.greensock.plugins.RemoveTintPlugin com.greensock.plugins.RoundPropsPlugin com.greensock.plugins.ScalePlugin com.greensock.plugins.ScrollRectPlugin com.greensock.plugins.SetActualSizePlugin com.greensock.plugins.SetSizePlugin com.greensock.plugins.ShortRotationPlugin com.greensock.plugins.SoundTransformPlugin com.greensock.plugins.TintPlugin com.greensock.plugins.TransformMatrixPlugin com.greensock.plugins.TweenPlugin com.greensock.plugins.VisiblePlugin com.greensock.plugins.VolumePlugin com.greensock.TimelineLite com.greensock.TimelineMax com.greensock.TweenAlign com.greensock.TweenLite com.greensock.TweenMax com.greensock.TweenNano com.hybrid.ui.ToolTip ConfigLoader CustomCellRenderer DependantNotice DependantNoticeChoice DependantNoticeChoice2 Diabetes DOB Donut5 DonutEvent DonutSegment DropDown EmailValidation fl.controls.ScrollBar FundValue GreyButton Halo HealthDropDowns Item Measurements MultilineCheckBox Options Overlay PostCode Pot QuestionButton Radio2 Radio3 RightPanel RightPanelEvent SegmentCheck SeriousConds Slider SliderForm StopEvent SummaryScreen SummaryScreenEvent TwoChoice TwoChoiceDeps YellowButton -exclude-dependencies
pause

I’ve no idea why the exclude classes are listed along with the actual classes in my app but at least I don’t have to type them out… Now all you need to do is to go back to Seb’s instructions and set up an external tool (Step 1) through to Step 5. Then add the -exclude-classes directive and copy and paste the nice long stream of class names into the Arguments window of the external tool dialog, resulting in something like the following:

ASDoc settings in the external tool dialog in Flex
ASDoc settings in the external tool dialog in Flex

That’s dealt with the classes to be excluded. What about external linked libraries that are needed by the compiler? Simply specify them by entering their file path as follows:


-source-path "C:\Program Files\Adobe\Adobe Flash CS4\Common\Configuration\Component Source\ActionScript 3.0\User Interface"

If you want the classes in this library excluded then don’t forget to run it through Dita again with this path in the exclude classes/packages field to get a nice list. I wanted them documented in this case as they’ve been partially sub-classed in my app (custom skinning and component extending, fun :| ).

Don’t forget then to add a custom title, footer text and browser window title:


-window-title "xxxxxx Classes Documentation"
-main-title "xxxxxx Classes Documentation"
-footer "created by me using ASDoc"

Now, back to those annoying little compilation errors that can stop you from producing nice shiny documentation. I know we shouldn’t have errors but you may be using a third-party library that has them, right? ;)

Make the compiler more tolerant by adding:


-strict=false
-warnings=false

and the compiler should happily skip those duplicate variable definitions or untyped variables (in my experience the most common things that pop up here).

Now, if you’ve followed Seb’s suggested argument parameters and used -doc-sources, make sure you don’t use -exclude-dependencies as ASDoc doesn’t like it and you’ll only get another error message.

By now you should have a whole stream of parameters listed in the Arguments section of the external tool dialog – something like this:


-strict=false
-warnings=false
-exclude-classes com.greensock.core.PropTween com.greensock.core.SimpleTimeline com.greensock.core.TweenCore com.greensock.data.BevelFilterVars com.greensock.data.BlurFilterVars com.greensock.data.ColorMatrixFilterVars com.greensock.data.ColorTransformVars com.greensock.data.DropShadowFilterVars com.greensock.data.FilterVars com.greensock.data.GlowFilterVars com.greensock.data.TransformAroundCenterVars com.greensock.data.TransformAroundPointVars com.greensock.data.TweenLiteVars com.greensock.data.TweenMaxVars com.greensock.data.VarsCore com.greensock.easing.Back com.greensock.easing.Bounce com.greensock.easing.Circ com.greensock.easing.Cubic com.greensock.easing.EaseLookup com.greensock.easing.Elastic com.greensock.easing.Expo com.greensock.easing.FastEase com.greensock.easing.Linear com.greensock.easing.Quad com.greensock.easing.Quart com.greensock.easing.Quint com.greensock.easing.Sine com.greensock.easing.Strong com.greensock.events.TweenEvent com.greensock.OverwriteManager com.greensock.plugins.AutoAlphaPlugin com.greensock.plugins.BevelFilterPlugin com.greensock.plugins.BezierPlugin com.greensock.plugins.BezierThroughPlugin com.greensock.plugins.BlurFilterPlugin com.greensock.plugins.ColorMatrixFilterPlugin com.greensock.plugins.ColorTransformPlugin com.greensock.plugins.DropShadowFilterPlugin com.greensock.plugins.EndArrayPlugin com.greensock.plugins.EndVectorPlugin com.greensock.plugins.FilterPlugin com.greensock.plugins.FrameLabelPlugin com.greensock.plugins.FramePlugin com.greensock.plugins.GlowFilterPlugin com.greensock.plugins.HexColorsPlugin com.greensock.plugins.QuaternionsPlugin com.greensock.plugins.RemoveTintPlugin com.greensock.plugins.RoundPropsPlugin com.greensock.plugins.ScalePlugin com.greensock.plugins.ScrollRectPlugin com.greensock.plugins.SetActualSizePlugin com.greensock.plugins.SetSizePlugin com.greensock.plugins.ShortRotationPlugin com.greensock.plugins.SoundTransformPlugin com.greensock.plugins.TintPlugin com.greensock.plugins.TransformMatrixPlugin com.greensock.plugins.TweenPlugin com.greensock.plugins.VisiblePlugin com.greensock.plugins.VolumePlugin com.greensock.TimelineLite com.greensock.TimelineMax com.greensock.TweenAlign com.greensock.TweenLite com.greensock.TweenMax com.greensock.TweenNano
-external-library-path="C:\Program Files\Adobe\Adobe Flash CS4\Common\Configuration\ActionScript 3.0\libs"
-external-library-path="C:\Program Files\Adobe\Adobe Flash CS4\Common\Configuration\ActionScript 3.0\FP10"
-source-path src
-source-path "C:\Program Files\Adobe\Adobe Flash CS4\Common\Configuration\Component Source\ActionScript 3.0\User Interface"
-doc-sources src
-window-title "xxxxxx Classes Documentation"
-main-title "xxxxxxx Classes Documentation"
-footer "created by Robert Turrall using ASDoc"

Now. Hit the “Run” button and off you go!

I hope this works for you too!

Just remember that what is output is a collection of web pages, with fairly-well implemented CSS styling. It’s therefore pretty straight-forward to style the output so that it’s “on brand” and to produce some nice end-of-project API documentation.

Thanks to Seb, Dita and a little bit of fiddling, I can now produce ASDoc documentation for my projects, straight out of Flex, and with no need to mess around with the command line. Nice.

I don’t pretend to be an ASDoc expert but I hope I’ve been able to help with this elaboration on it’s use in Flex.

Happy documenting!

 

BP Oil Spill hits London

Sorry about the sensationalist title but, yes, this is what the BP Oil Spill currently drifting in the Gulf of Mexico would look like if it was laid over London, effectively covering an area from Norfolk down to Brighton and across west to Swansea and Northampton in the North:

What the BP Oil Spill would look like over the UK
What the BP Oil Spill would look like over the UK

Kind of puts the sheer size of the catastrophe in perspective, doesn’t it?

Take a look at IfItWasMyHome.com, the source of this image. You can move the spill to any location thanks to the clever code within the site and the use of Google Maps.

It’s a shame we can’t just REmove the spill…

 

iPad first impressions

Firstly: No, I haven’t bought one.

Secondly… well, let’s just go through my initial impressions first:

I popped into the local Apple Store today to take a look at, and play with, an iPad. As expected, the area nearest to the entrance was occupied by said device and a few people were swiping and punching away at the around 10 devices on display.

I found one and picked it up. Not particularly heavy but heavy enough to be a recognised cause of RSI of the left wrist (or right wrist for those of a left-handed persuasion) after a reasonable period of time using one.

The screen was also disgusting – grubby, greasy streaks all over it. Combine that with the shiny display surface and it wasn’t the easiest viewing experience ever. OK, so the one at home is likely to be less grimy and better protected than the ones in the store – but it does give an interesting view into just how susceptible the screen is to grease and dirt. I also hate shiny displays and am not yet updating my MacBook Pro because I’ll have to pay extra just to have a non-shiny display. I want to see what I’m working on/browsing and not to watch my reflection! Here are some thoughts from Charlie Brooker, who apparently also dislikes the display ;)

Anyway. The navigation was as expected, using the by-now-automatic gesturing approach which sometimes has me wiping my fingers across my laptop display if I’m been using my iPhone a lot ;)

A few apps were installed and I played around a bit. The “to-do” app looks nice at first but I found myself clicking around the screen, trying to turn what looked like pages – until I realised that this was just some sort of background image meant to look like an analog “organiser” or filofax. Why did they bother? Oh well. I’ll stick with my “Things” App on the iPhone.

I opened up the “Popular Science” App and pinched, then spread apart, my finger and thumb – trying to zoom in and out on the picture of a wind generator. Nothing happened. It seems that this could be one of those initial Apps that Jakob Nielsen cites in his critique of the usability failings of the device and initial Apps.

This is where my familiarity with (and, I must say, love of) the iPhone interface proved to be a bit of a handicap. I expected more than the iPad and the handful of Apps I tried on it were capable of delivering. I think that Apple need to review how they’ve implemented the interface on this device and also should look at how developers are producing apps for it – better guidelines and more time and effort in development are needed. It’s not the same as the iPhone and will be used differently. They (neither Apple or some developers) haven’t figured this out, IMHO.

Generally, and taking into account that horrible shiny mirror-like display, the device is a thing of beauty. Google maps looked lovely on it, video seemed a little dark (remember the same issue with the first iPod Touch?). It’s simple. It’s sleek and shiny, feels solid if a little too heavy but has that “Apple feeling”. It’s also the first multitouch tablet device of this type. This is no doubt why many people have bought them – and why I would be tempted to buy one if it did what I need.

Another down side is the audio volume – although I was in a busy Apple Store. Let’s assume that it’s fine when at home on the sofa.

Even putting aside the usability and interface failings, this is still not a device that I’d rush to buy now. I say “now” because I don’t believe that it does anything I can find a use for in it’s current incarnation, at the price that comes with it. To illustrate this, here are a couple of usage scenarios:

- I get up in the morning and check the weather, pollen count, my calendar and even twitter and facebook on my iPhone. Even if the iPad has a bigger display, why would I pay £599 (64GB wi-fi model) for one when I have an iPhone already? My iPhone is also significantly more portable and also makes and takes phone calls (and photos)…

- A friend of mine has small kids and we were talking about use cases. Here’s one: It’s Sunday afternoon and the kids are restless. It’s raining, miserable outside. Instead of booting up a laptop just reach for the iPad lying on the coffee table! The kids can surf around their favourite sites, such as the Disney site or BBC’s CBeeBies – no,wait. The iPad doesn’t support Flash! Try telling kids they have to wait for the BBC to roll out an HTML5 version of the entire site before they can play “Animal ABC”.

So. Stumbling block again. Steve Jobs has, in my opinion (and I’m only one voice among many…), failed due to his fanatical anti-Adobe anti-Flash complex and managed to exclude a massive portion of the internet from users of the iPad. AND IT MAKES NO SENSE!!!!

OK, breathe.

The iPad is not an iPhone. It’s bigger, it offers a nice web-browsing experience (display permitting) and would be a great device for sofa web-browsing with no boot-up time. I can accept not having Flash on the iPhone and don’t really miss it. I have developed an iPhone-optimised version of turrall.ch which takes advantage of accelerometer-driven navigation and doesn’t even need the Flash-based menu on the normal site.

It does, however, seem more than daft having to create an iPad-optimised version of a website without Flash just because Steve Jobs doesn’t like it and is badly-informed as to what Flash is actually used for. It’s not just for video Steve!

Steve Jobs and other Apple employees involved in bringing products like the iPad to market should not be in the job of dictating to us what we can do with a device – especially when it’s massively overpriced. The device should stand on it’s merits and not form another cog in a money-generating machine.

As Jakob Nielsen says:

When a customer has bought a device, it’s theirs; they should be able to see the information they want, and run the applications they want.

If the iPad is going to be of any use for it’s £599 then it has to support a full web browsing experience, including Flash, and not just give us a bigger display than I have on my iPhone – that’s all it’s doing and it ain’t worth the money.

The iPad is not magic. It’s not a netbook challenger and it’s not really revolutionary. It’s just a step on the way and one that should have stayed in the labs until they’d added a front-facing webcam (even if it will give me a double chin), support for a full operating system and not a mobile one(including flash player and Adobe AIR support), external interfaces (USB, anyone?), less weight and probably other things that I haven’t even thought of but they surely would have been able to – had they taken the time.

Let’s see what version 2.0 looks like – or wait for the best Windows 7 or Android tablet that comes along instead. My money’s more on Windows 7 or something like it here than on Android, but we’ll see…

Now. Must go and wash my hands…

PS: As a side note: Have you also wondered at how many accessoires there seem to be to make the iPad into a desktop monitor (stands) or even terminal-like device by adding a keyboard? Doesn’t this miss a point?