Table of Contents
The OpenLaszlo platform allows you to build applications of unpredented grace. Fully exploiting this potential requires good software engineering skills, plus something of an artist's eye and a magician's ability to direct attention. Sometimes these skills are all resident in the same person, but often they are divided among members of an OpenLaszlo development team, with software engineers responsible for good orderly code, and graphic designers, information architects or user experience designers responsible for art and magic.
However your team is set up, this Guide is for those persons responsible for the aesthetic experience of the application you're building.
Some thoughts on how OpenLaszlo is different as a web design technology:
-
You have complete control of the end user experience. Most web design technologies cause the application to look different depending on the OS and browser used to deliver it. This is often a design challenge that can lead to unwanted compromises. With OpenLaszlo, especially when you compile to SWF, you have control of every pixel and gesture.
-
Fast prototyping: OpenLaszlo offers a complete set of UI components that includes UI controls supported by HTML (radio buttons, checkboxes, etc.) along with standard desktop UI (windows, menus, tree control, tabs) and more. These components in the context of a concise declarative XML for application layout and event-based interaction login allow for high productivity.
-
Object oriented programming: You can organically move from prototyping to serious application development though Laszlo's powerful class declarations that support full inheritance.
-
In-page transactions: OpenLaszlo applications do not require a "page refresh" when you get data from the server. This allows for data to be delivered to the user in a way that is integrated seamlessly into the UI. It also allows for "ambient" data —data updates asynchronously and is provided in context.
This book is written for graphic designers and user experience engineers who have at least some familiarity with basic Laszlo concepts. In order to get the most out of this Guide you should be comfortable with the topics covered in Laszlo in Ten Minutes, and it would be better still if you worked through the tutorials.
The topics in this Guide overlap those covered in the Software Developer's Guide, and indeed they share some chapters in common.
This Guide contains many "live" examples, that is, Laszlo Applications that are embedded in this page. You'll have more fun and get more out of this document if you "play with the code." To do so, simply click on the "Edit" link at the bottom left corner of each example. This will cause a new window to pop up that is a self-contained environment for modifying and executing Laszlo applications. Edit the sample code then click "update" and see the results displayed in the right-hand side of the window. To return the sample code to its inital state, click "Reset."
If you would like to save a copy of the application for later use, click on the "Save As" button.
Code is displayed thus: var a = f(2). Longer sections of code and other verbatim information is displayed in a separate paragraph:
An example file that spans several lines
Example programs are shown thus:
<canvas height="20"> <text>Hello World!</text> </canvas>
Some example programs are run within the page. The running application is shown first, followed by the application source code, followed by an Edit button that allows you to try out the effect of making changes to the application source code.
<canvas height="20"> <text>Hello World!</text> </canvas>
In addition to this User Interface Designer's Guide, please see also
-
The Software Developer's Guide to Laszlo Applications, the comprehensive explanation of how to write and test Laszlo programs.
-
Working with Laszlo Components shows how the various Laszlo components (such as Window, Button, Tabslider, etc) were put together.
-
The LZX Reference Manual. This online, hyperlinked, comprehensive reference for LZX contains entries for each LZX tag and API. Its format will be familiar to users of JavaDoc(tm) and similar systems.
-
The online tutorials and sample applications at http://www.laszlosystems.com/demos provide a hands-on instructional overview of the LZX language.
The best way to use the LZX Developer's Guide depends on your experience.
Experienced Object-Oriented programmers: We suggest that you start by reading Chapters 1, 2 and 4 of this Guide. If you have never worked with JavaScript, you can learn the basics quickly at one of the JavaScript tutorials at W3Schools, WVDL, or PageResource.com. Then visit the Laszlo Systems website and play around with the tutorials and sample programs; as you read the sample code be sure to look up appropriate entries in the Reference Manual. At that point you'll know what further reading you need to do in this guide.
Web/Flash developers with no Object-Oriented experience: We suggest that you start with the tutorials in order to get a general feel for LZX programming. Don't worry about mastering the subjects they cover; your goal is to begin to get comfortable with the language.
If you need to, learn the basics of XML.
Then read the rest of Part II, “Overview”.
The best way to learn any programming language is to draw upon the experience and goodwill of its development community (and to write code! as the saying goes, nobody learned to ride a bicycle by reading about it). The LZX developer community has a home at http://www.laszlosystems.com/developers/forums/. There you will find an active discussion of all aspects of the language, and a place to ask questions of your own.