Software

OpenLaszlo Makes Full Blown AJAX Apps on Flash

The fact that Flash is commonly used for ads, and that those ads annoy everyone and cause many people to hate Flash, doesn't detract from the high quality user interfaces that you can build with it, if you use it for good instead of evil.

Since usability guru Jakob Nielson wrote Flash: 99% Bad in 2000, a lot has changed about Flash. He worked with Macromedia to improve Flash's usability, and he sells a report with 117 design guidelines for Flash usability. So yes, it is possible to develop usable applications in Flash.

OpenLaszlo is an open source language and set of tools for developing full fledged rich web applications, which are compiled into SWF files that run on the Flash player. Laszlo/Flash is presently much more capable of implementing high quality cross platform user interfaces than dynamic AJAX/HTML/SVG currently is.

Laszlo is a high level XML and JavaScript based programming language. It's independent of Flash in the same way that GCC is independent of the Intel instruction set and Windows runtime, because they both compile a higher level language, and can target other runtimes and instruction sets.

Currently Flash is the most practical, so that's what Laszlo supports initially, but it can be retargeted to other runtimes like SVG, XUL, Java or Avalon, once they grow up and mature. But right now Flash is the best way to go, because of its overwhelming installed base and consistency across multiple platforms.

Dynamic Pie Menus

The pie menus in The Sims are context sensitive, and hide inappropriate items, but the context depends on the state of the object and the selected user, so there are many different contexts which change dynamically over time.

So part of the game is figuring out how to manipulate the objects and people into the right state to enable the menu items you want.

Since The Sims game design requires that the menu items do change over time, that trumps the rule of thumb that pie menus should be used for static menus. User interface design involves weighing conflicting rules and making trade-offs according to the application and user requirements, so it's ok to break a few rules for good reasons.

An inactive TV set just has a "Turn On" menu item. When you activate it, the "Turn On" item disappears and is replaced by a bunch of items like "Turn Off", "Watch TV", "Change Channel," etc.

If you click on another Sim character, you get a menu of interpersonal interactions that the currently selected Sim can perform with the other Sim you clicked on. Those can change according to their relationships and moods.

AJAX is old NeWS, Laszlo is non-toxic AJAX

AJAX is a new buzzword for old (but not bad) ideas.

Don't take this as anti-AJAX. That kind of architecture is great, but it's the notion that the new AJAX buzzword describes new ideas that annoys me.

Of course Microsoft has been supporting it since the 90's, but it goes back a lot further than that.

For a long time, I've been evangelizing and more importantly implementing interactive applications that run efficiently over thin wire (dial-up modems, ISDN, early internet before it was fast, etc), which are locally interactive and efficient because there's a programming language on each side of the connection that implements custom application specific protocols and provides immediate feedback without requiring network round trips.

Before he made Java, James Gosling wrote the NeWS Window System.

I did a lot of work with NeWS, as a user interface researcher, commercial product developer, and a gui toolkit engineer for Sun, implementing distributed applications as well as user interface widgets and gui construction tools.

I've programmed NeWS to implement many user interface widgets (pie menus, tabbed windows, terminal emulators, graphics editors), gui toolkits (Suns TNT Open Look Toolkit, Arthur van Hoff's HyperLook user interface construction tool), and applications (UniPress and Gnu Emacs text editor interfaces, Ben Shneiderman's HyperTIES hypermedia browser, PSIBER visual PostScript programming and debugging environment, PizzaTool for customizing and ordering pizza via FAX, a cellular automata lab, a port of Maxis's SimCity), and lots of other stuff.

Now I develop distributed applications with OpenLaszlo, which embodies all the great qualities of AJAX without the horrible compatibility problems and shitty graphics. Macromedia though OpenLaszlo was such a great idea that they made a proprietary knock-off called Flex, for which they charge $12,000 per CPU. The future of Laszlo is secure since it's free software with an open source license, but Flex is in Flux since Adobe is buying Macromedia.

I'm quite happy to have found OpenLaszlo, since it's got all the advantages of NeWS, it runs beautifully and consistently on all platforms, the people developing it really understand what they're doing, and most importantly it's open source. NeWS was a technological success, but a commercial failure, because Sun refused to release it like X11. But OpenLaszlo applications really do run everywhere consistently, support XML standards and rich dynamic graphics vastly superior to anything you can do in DTHML, and they're great fun to develop.

The Sims 1 Crowd Sitter

It turns out you can get a whole lot of The Sims 1 characters on the screen at once! But then you need some crowd control and coordination.

Here's an object that I'm developing for The Sims 1 as part of the Simprov wedding playset, and some screen shots of what it does.

This is the new "Crowd Sitter" object for The Sims 1. Donna and I came up with an idea for an icon to represent this magical crowd control object, which will only be visible in build mode. But for now it looks like an altar.

I named it "Crowd Sitter", like "baby sitter" but it's for all ages and lots of people at once, and it can also make them stand. It's an essential tool for orchestrating weddings, but it's useful for other purposes like parties and concerts and boxing matches.

When in play mode, you can turn a Crowd Sitter on and off with a pie menu, and it directs all people to sit down in front of it, or stand up facing it if there aren't any seats left. It has an effective radius of about 7 tiles (more now), with a quarter pie slice shaped footprint. You can strategically deploy as many sitters as you need, to cover all the seats you want people to sit in or areas you want them to stand (like rows of pews in a church or a circle of benches in a stadium). I made a special routing slot that has a maximum size 54 tile footprint (more now), based on the TV set's routing slot, but on steroids.

I stress tested it by making four of these Crowd Sitter objects, and facing them in different directions, to make people gather around the center in a circular crowd.

Then I made at least 8 * 20 = 160 people (Sim clones), and turned on all the sitters at once facing outwards, to make them all gather around the center! But of course if there are no seats to sit in, the poor people have to stand.

In the following scene, I'm cheating by using the faith based initiative "placebo field" (aka Fox News), which is a special effect built into the altar, that supernaturally makes everybody always happy, fills their tummies, drains their bladders, keeps them clean, etc, so they're willing to stand around tirelessly without complaining, for as long as I tell them to, and not questioning anything they're told, while totally believing their government is looking out for them.

OpenLaszlo is more Portable and Prettier than AJAX

In the Slashdot discussion of "The Current State of Ajax", Henry Minsky posts:

OpenLaszlo is more portable (Score:3, Informative)
by hqm (49964) on Friday August 19, @03:23PM (#13358719)

OpenLaszlo is an open-source tool for building Rich Internet Apps that compiles them down to Flash applications. The advantage is that the graphics are smooth, it runs pixel-for-pixel identical in virtually any browser, no cross-platform incompatibilities.

An OpenLaszlo app behaves essentially like an Ajax app; data requests are made for XML data (or media) in the background, and the user interface is presented as a seamless window-system style desktop app.

Simple Example

Sims Content Catalog in Laszlo and Python

This is a large project I'm developing in OpenLaszlo: creating a rich web application for browsing, searching, exploring, collecting, personalizing, shopping and downloading Sims content.

I'm working with SimFreaks to put their entire catalog of thousands of Sims objects and characters into this database driven catalog. I'm using Transmogrifier to automatically export pictures of all the Sims objects.

Besides simply searching the catalog for interesting objects, you can navigate and explore collections of objects, and even interactivally compose your own scenes.

It's like a cross between colorforms playsets, hypercard and graphical adventures, with Sims room backgrounds, objects and characters, including interlinked image maps and text annotations.

The front-end is implemented in OpenLaszlo, and the back-end is implemented in Python, using SQLObject.

It also includes an administrative database interface for browsing and editing the SQL database that is used to model the site, and keep track of the users, objects, collections, pictures, etc. It's extensible by plugging in customizable Laszlo widgets for displaying and editing special data types, like pictures, checkboxes, color selectors, date pickers, pie menus, OPML editors, etc.

Pie Menus are Better than Screen Corners

Pie menus address many of the complaints of this slashdot article, and they've been around a long time.

I'll start by comparing screen corners to pie menus:

To quote Tog on Fitts' Law: "The time to acquire a target is a function of the distance to and size of the target." He points out that "the screen edge is, for all practical purposes, infinitely deep."

But the advantage of "screen corners" is just an indirect and wasteful application of Fitts' Law, which pie menus exploit much more directly, efficiently and flexibly than "screen corners". Tog's "screen corner" argument is just an ex post facto application of Fitts' Law: an after-the-fact rationalization, not the reason they originally designed the menu bar that way. If Fitts' Law was really the reason Apple designed their menu bar that way, then why aren't there four menu bars, one at each edge of the screen? Apple never mentioned Fitts' Law in their infamous menu bar patent.

Pie menus "slices" are better than "screen corners" or "menu bars" because:

Constraints and Prototypes in Garnet and Laszlo

Garnet is an advanced user interface development environment written in Common Lisp, developed by Brad Meyers (the author of the article). I worked for Brad on the Garnet project at the CMU CS department back in 1992-3.

One thing I like about Brad Meyers is that he's a strong programmer, as well as an excellent researcher, so he had a first-hand understanding of the real-world issues involved in programming languages and user interface architecture, unlike many academics who talk a lot of theory but never get their hands dirty. Brad Meyers understands where the rubber hits the road, and how important it is to have good tires.

At the time I worked on it, Garnet didn't have pretty graphics like Flash, but the underlying programming system had some advanced features that are sorely lacking from most modern user interface development environments.

Laszlo is an modern open source GUI programming system, with many of Garnet's advanced "natural programming" features like prototypes and constraints. Laszlo currently uses Flash as its virtual machine, but it's a much higher level way to program dynamic interactive web based applications, without using the proprietary Flash authoring tool.

Laszlo Database Interface

I'm developing a reusable Laszlo component for browsing and editing SQL databases.

Currently it's up and running, built into the Sims Content Catalog Laszlo application, and it talks to a Python/SQLObject/MySQL back-end. But I'm factoring it out and redesigning it to work on its own, and support multiple back-ends.

Laszlo is ideal for implementing specialized user interface components for editing custom data types, like checkboxes, pie menus, color selectors, date pickers, OPML editors, picture viewers, map browsers, etc.

Flex is an Expensive Knock-Off of Laszlo, but OpenLaszlo is Free

Flex is outrageously priced, and its future is in Flux now that Adobe is going to buy Macromedia.

Flex was inspired by Laszlo (in spite of the fact that Tim O'Reilly is confused and mistakenly thinks it's the other way around).

OpenLaszlo is an excellent open source web programming language based on XML and JavaScript. Your class declarations, object instantiations and configuration constraints are all defined in XML, with JavaScript expressions in attributes and JavaScript methods in text content.

OpenLaszlo strikes an elegant balance between XML and JavaScript, so Laszlo code is quite clean and easy to read and maintain. IBM has developed an Eclipse IDE plug-in for creating Laszlo applications with drag-and-drop and XML outline editors.

You can see for yourself how easy it is to develop interactive graphical web applications in XML+JavaScript with OpenLaszlo: Laszlo in 10 minutes. You can actually see, modify and run Laszlo scripts over the web, to learn how it works.

If you like Laszlo and want to learn more, then you can download the entire Laszlo source code, documentation and examples for free, and start developing your own Laszlo applications, without paying any exhorbinant licensing fees like Flex requires (on the order of $12,000 per server).

Syndicate content