TweetFollow Us on Twitter

Learning from Leonardo

Volume Number: 15 (1999)
Issue Number: 10
Column Tag: Programming Techniques

Learning from Leonardo

by Joseph J. Strout, La Jolla, CA

Visualizing and understanding algorithms forward and backward

Introduction

Though many readers of this magazine will have forgotten, programming does not come naturally to the human mind. New programmers struggle with burdens at several different levels: learning the syntax of a language, comprehending the step-by-step flow of program code, and grasping abstract algorithms. It's especially hard to learn these skills from a book or chalkboard; we understand better when we see things in action.

A source-level debugger can let a student step through a program, which helps clarify how the computer is interpreting the code. It doesn't help much with following complex algorithms at a more abstract level, though. In addition, a traditional debugger can only step forward; it's like a VCR with no rewind button. This means that if you miss a step or want to see a computation again, you have to restart the program from the beginning. This is where Leonardo comes in.

What Leonardo Does

Leonardo is a C development environment made specifically for teaching and learning. It provides two major improvements over a traditional IDE. First, it provides a mechanism for visualizing computations graphically as they happen; by attaching graphical representations to key variables in a program, it's relatively easy to get a high-level understanding of what the algorithm is doing. Second - and this is the one that really amazes me - its source-level debugger runs both forwards and backwards! In addition to the usual step forward, step down (into a function), step up (out of the function), and run, the Leonardo control panel has buttons to step backwards, step back out of a function, step back into a function, run backwards, and reset the process.

Code written with Leonardo is completely reversible. Variable assignments will be undone, output sent to the console will disappear, graphics drawn will be undrawn, and so on. You have access to the full set standard ANSI functions, and yes, those are reversible too. The number of program steps you can undo is limited by available memory, but in practice, this did not seem to be a serious limitation.

Leonardo does this magic by running your code on a "Virtual CPU" that not only provides reversible execution, but also catches memory errors, invalid parameters to standard function calls, leaks, and so on. You can't produce stand-alone applications with Leonardo, and programs written in it run much slower than they would as native Mac applications. But for illustrating programming concepts, or even debugging a complex algorithm, Leonardo's graphical state display and reversible execution are hard to beat.

Using Leonardo

Leonardo ships as a PowerPC application plus standard C headers and libraries. It also comes with a large and neatly organized set of ready-to-run samples.

To get a feel for Leonardo's animation capabilities, simply launch the program and pick any of the samples from the Program hierarchical menu. Most of these illustrate common data structures and algorithms, like a sorted heap or the mini-max game-playing algorithm, but the collection also includes a few games and utilities. Choosing an item will run the corresponding program, which comes already compiled. Most programs present both a text console interface, and one or more graphical displays to give you a peek at what's going on inside. See Figure 1 for a typical example (from the "RedBlackTrees" sample).


Figure 1.A Leonardo text console and graphics window.

As a consequence of running the already-compiled executable, you have only a limited control palette and no access to the source code. This is fine for observing the graphical illustration of an algorithm, but to dig any deeper, you'll want a full set of controls.

For that, use the Open C Project menu command, or simply double-click one of the project files in the finder (they all end in ".µ" like the old Metrowerks convention). This presents a project window similar to that in other IDEs; it lists the files in the project, and has buttons for running, setting project options, and so on (see Figure 2). The first thing you'll want to do is open the project settings window, by clicking the rightmost button. Project settings in Leonardo are mercifully simple; it's just a matter of setting a couple of memory partitions, and toggling four build options on or off. I recommend you turn all four on - in the pre-built projects, "Debug Mode" is turned off, which is why access to the code was so limited before.


Figure 2.Leonardo's project window (top) and project settings dialog.

With debug mode turned on, running the project presents a full debug console (Figure 3) as well as a source-code display. This will be familiar to anyone used to other source-level debuggers; you can step through your code in various step sizes (e.g., step down into a function, or run until the current function returns). The surprising controls are the buttons at lower left, which allow you to roll a program backwards. While delightful, the use of these buttons is staightforward and little more needs to be said about them.


Figure 3.Leonardo's debug-mode process control panel.

The visualization commands are another matter. The graphical display that accompanies most of the sample projects is created by embedded commands in the source code, in a special declaration language called "Alpha." While you don't need to understand Alpha to make good use of the sample projects, making your own graphical displays will require a bit of study.

Speaking Alpha

Alpha commands are embedded in the C code within block comments. As such, they are ignored by a C compiler, but can be interpreted by a special Alpha preprocessor. This processor sets up graphical elements and inserts calls to update those elements when a relevant variable changes value.

One starts by declaring a window for the graphical display. There can be multiple windows, so each is given an ID number used to refer to it later, as follows:

/**
	View(Out 1);	// declare a window with ID 1
**/

This creates a window entitled "View 1" to appear, as soon as the code containing this block is executed. If it is at global scope, the window will appear as soon as the program runs, before entry into the main() function. When the code block containing the above directive exits, the window will disappear. The Alpha preprocessor acts as if it is converting these directives into C++ object declarations; they can occur anywhere in a code block, and they disappear automatically when that code block is finished.

A blank window is not very informative, so let's add a "Rectangle" declaration, based on the width of a variable, like so:

	// make a rect with ID=0, left=20, top=10,
	// width=i, height=10 in view=1:
	Rectangle(Out 0, Out 20, Out 10, Out H, Out 10, 1) Assign H=i;

The frequent (but not constant) repetition of the keyword "Out" before parameters, as well as the need to use the "Assign" keyword rather than simply specifying "Out i" in the correct position in the parameter list, are mysteries difficult to fathom without a complete manual (see below). However, Leonardo comes with literally dozens of examples of graphical displays using Alpha, so for most purposes you should be able to find a similar example and adapt it to your specific needs. My example here (shown in complete form in Listing 1) was adapted from an example given in the "Read Me" document, with reference to Appendix A of the manual, and was fairly easy to produce. It displays the state of two variables with two different rectangles - a sort of dynamic bar graph, continually updated as the program runs.

Listing 1.

int main(int argc,char* argv[])
{
	long j;
	long i;

/**
	View(Out 1);	// declare a window with ID 1
	// make a rect with ID=0, left=20, top=10,
	// width=i, height=10 in view=1:
	Rectangle(Out 0, Out 20, Out 10, Out H, Out 10, 1) Assign H=i;
	// make a similar one to track j
	Rectangle(Out 0, Out 20, Out 25, Out H, Out 10, 1) Assign H=j;
**/
	
	for (i=0; i<100; i++) {
		j = (i*i) % 100;
	}
}

Documentation & Support

Leonardo is written by two developers in Italy, and is distributed free of charge, so commercial-level technical support is not to be expected. The chief support venue is the Leonardo web site (see URL at the end of this article), which is clean and well designed, and which (fortunately for most American users at least) is in well-written English. It includes an overview; a number of images, including animations; a program library; and an on-line manual. The manual is also included with the distribution.

Unfortunately, the manual is still "under construction" and stops just when it was getting interesting. Only the first two chapters, "Installing Leonardo" and "Let's write a C program" are present; the rest of the manual is outlined but not yet available. Still, these two chapters are an excellent introduction to the system, and provide enough to get you started. There is also an appendix which provides a brief reference for all the Alpha predicates used to provide graphical output.

Sending email to the authors appears to be the only way to get interactive support. A mailing list would have been nice for such a complex and powerful tool. Nonetheless, when I sent some questions and suggestions to the authors, I received a helpful response fairly quickly.

Limitations

Despite the version number (3.4.1 at the time of this writing), Leonardo is clearly not a finished product. The manual is mostly unwritten, and there are menu items which are apparently not yet implemented. For example, the Preferences command is present in the Edit menu but perpetually disabled.

Functionally, Leonardo measures up fairly well. Its most serious shortcoming is that, surprisingly, there is no way to view or change the values of variables in the debugger. That is unfortunate; graphical visualization is very helpful for getting the big picture, but often one needs to inspect or tweak individual variables in order to fully understand the code. The omission of this feature will leave some users having to go back and forth between Leonardo and another IDE. In addition, it's not possible to set or change breakpoints while the program is running; breakpoints can only be set by adding a #pragma to the code and rebuilding. But these were the only functional limitations found; overall it is quite solid.

The interface, on the other hand, has a few more problems. First, it frequently displays black or red text against a thick marbled background, making it nearly illegible. This is true even for the Windows-style bar at the bottom of the screen that displays context-sensitive help - a poor substitute for balloon help. The windows have a very annoying habit of expanding to fill the entire screen whenever you touch anything, regardless of whether they have any actual data to display in all that space. There are interface widgets on each document-style window which look like they may be pop-up menus - and sometimes they are, but sometimes they aren't. Checkbox items can't be toggled by clicking on their text, as is usual in the Mac interface, but only by clicking on the box itself. Also in the "minor quibbles" category, the integrated editor does not support the standard F1-F4 editing keys, and it'd be nice to be able to change the font.

As a piece of software engineering, Leonardo is excellent; as an example of interface design, it's somewhat lacking. Hopefully this will improve as the program matures. In my email to the authors, I complained about some of the worst problems (such as the marbled background), and was assured that future versions would correct at least some of them. It's worth repeating that this is free software, and none of the limitations mentioned above are very serious; overall the quality is superb.

Conclusion

Leonardo is a very remarkable application. While perhaps not as polished as a commercial IDE, it is extremely well polished by the standards of free software, and it was rock solid in my hands. The visualization provided by the Alpha predicates allow one to watch an algorithm at work in a very powerful and intuitive way, and the ability to step ordinary C code forward and backward is nothing short of amazing.

This application would be most useful in computer science and programming courses. It comes with a large library of common data structures and algorithms right out of the box, ready to illustrate their workings in animated color, and more could easily be written from these examples. Any one of these could feature prominently in a class lecture, and is likely to engage the students and foster comprehension much better than abstract discussions or static diagrams. Since Leonardo is free, students can be encouraged to download a copy and play with the programs on their own. When they do, they'll find Leonardo's reversible execution to be an extremely helpful way to explore any algorithm.

Leonardo's only real drawback is that, as yet, it is unfinished - a state especially regrettable in the manual. The authors are doing this work with no financial support from the users, so it's the users' responsibility to support them in other ways. Write to them, let them know what you like and don't like, tell them how you're using it, and ask if there is anything you can do to help. With the concern and support of a strong user base, Leonardo is sure to become an indispensable tool for teaching, learning, and debugging.

Useful URLs

The Leonardo home page:
http://www.dis.uniroma1.it/~demetres/Leonardo/


Joe Strout works as a software developer in a neuroscience lab in southern California. While not helping to unravel the secrets of the brain, he enjoys pursuits ranging from martial arts to 3D modeling. He welcomes your comments at joe@strout.net.

 

Community Search:
MacTech Search:

Software Updates via MacUpdate

Lyn 1.8.9 - Lightweight image browser an...
Lyn is a fast, lightweight image browser and viewer designed for photographers, graphic artists, and Web designers. Featuring an extremely versatile and aesthetically pleasing interface, it delivers... Read more
Tweetbot 2.5 - Popular Twitter client.
Tweetbot is a full-featured OS X Twitter client with a lot of personality. Whether it's the meticulously-crafted interface, sounds and animation, or features like multiple timelines and column views... Read more
Monolingual 1.7.8 - Remove unwanted OS X...
Monolingual is a program for removing unnecesary language resources from OS X, in order to reclaim several hundred megabytes of disk space. If you use your computer in only one (human) language, you... Read more
Dash 4.0.3 - Instant search and offline...
Dash is an API documentation browser and code snippet manager. Dash helps you store snippets of code, as well as instantly search and browse documentation for almost any API you might use (for a full... Read more
Posterino 3.3.6 - Create posters, collag...
Posterino offers enhanced customization and flexibility including a variety of new, stylish templates featuring grids of identical or odd-sized image boxes. You can customize the size and shape of... Read more
Apple Numbers 4.1.1 - Apple's sprea...
With Apple Numbers, sophisticated spreadsheets are just the start. The whole sheet is your canvas. Just add dramatic interactive charts, tables, and images that paint a revealing picture of your data... Read more
Apple Pages 6.1.1 - Apple's word pr...
Apple Pages is a powerful word processor that gives you everything you need to create documents that look beautiful. And read beautifully. It lets you work seamlessly between Mac and iOS devices, and... Read more
iClock Pro 3.4.9 - Customize your menuba...
iClock Pro is a menu bar replacement clock for Apple's default clock. iClock Pro is an update, total rewrite and improvement to the popular iClock. Have the day, date and time in different fonts and... Read more
Typinator 7.2 - Speedy and reliable text...
Typinator turbo-charges your typing productivity. Type a little. Typinator does the rest. We've all faced projects that require repetitive typing tasks. With Typinator, you can store commonly used... Read more
ExpanDrive 5.4.6 - $49.99
ExpanDrive builds cloud storage in every application, acts just like a USB drive plugged into your Mac. With ExpanDrive, you can securely access any remote file server directly from the Finder or... Read more

Latest Forum Discussions

See All

Minimalist puzzle game, Cuts, free on iO...
If you're looking for a gorgeous puzzle experience on iOS devices, developer Gamebra.in's aesthetically interesting puzzler, Cuts, is discounted to free on the iOS App Store right now. [Read more] | Read more »
Anime tactical RPG, War of Crown, comes...
If you're looking for another tactical RPG fix to go alongside your Fire Emblem Heroes campaigns check out Gamevil's newest, anime-inspired tactics RPG, War of Crown, which comes out tomorrow. [Read more] | Read more »
Fantasy MMORPG MU Origin adds new modes,...
MU Origin, Webzen’s highly popular fantasy MMORPG is getting ready to shake things up for the second time this year, as a new update makes its way to the Google Play and App Store from today. Introducing new systems, modes, and events, the land of... | Read more »
Blizzard is looking to hire a mobile dev...
A new thread on the popular video game rumor forum, NeoGAF, uncovered an interesting job listing over at Blizzard Entertainment. It appears the studio behindStarCraft, World of WarCraft, Hearthstone,andOverwatch is looking to bring on a new hire... | Read more »
Legend of Zelda meets Cooking Mama in ne...
Dungeon Chef is what happens when you mix the RPG elements (and style) of a Legend of Zelda game, with cooking elements. Although, now that The Legend of Zelda: Breath of the Wild also has cookingelements, so maybe the gameplay is not so novel.... | Read more »
ChordFlow (Music)
ChordFlow 1.0.0 Device: iOS Universal Category: Music Price: $6.99, Version: 1.0.0 (iTunes) Description: ChordFlow is a chord sequencer with a unique 4-track polyphonic arpeggiator, extensive chord library, MIDI out and Ableton Link... | Read more »
The Walking Dead: A New Frontier is out...
The newest season of Telltale Games'The Walking Dead is well underway. After the release of the third episode, "Above the Law" about a month ago, episode four, "Thicker Than Water" is hot and ready for more zombies and gut-wrenching emotional... | Read more »
Best games we played this week
Another week, another new wave of mobile games do dive into. We've dug through the list of apps that came out this week to tell you which apps are worth your sweet time. And while there weren't too many games this week, there were some big ones.... | Read more »
Vignettes (Games)
Vignettes 1.0.1 Device: iOS Universal Category: Games Price: $2.99, Version: 1.0.1 (iTunes) Description: Vignettes is a casual but unique exploration game without text or characters, where objects shapeshift as you spin them around... | Read more »
Get Me Outta Here is an 80s retro shoote...
Are you ready to fight some aliens? Because Crescent Moon Games has released the retro shooter Get Me Outta Here on iOS devices today. [Read more] | Read more »

Price Scanner via MacPrices.net

HyperX Ships Pulsefire FPS Gaming Mouse, Winn...
Your reporter is a longtime fan of gaming mice for general purpose coomnputing use, finding them typically superior in comfort and performance. HyperX, a division of Kingston Technology Company, Inc... Read more
Penske Truck Leasing Unveils “Penske Fleet” M...
Penske Truck Leasing has introduced a free mobile app called “Penske Fleet” to benefit its full-service truck leasing and contract maintenance customers. The mobile app enables Penske’s customers to... Read more
DEVONthink To Go 2.1.3 For iOS Adds New Declu...
DEVONtechnologies has updated DEVONthink To Go, its iOS companion to DEVONthink for Mac. Enhancements and bug fixes in Version 2.1.3 include DEVONtechnologies’ new decluttering service for clipping... Read more
Use Apple’s Education discount to save up to...
Purchase a new Mac or iPad using Apple’s Education Store and take up to $300 off MSRP. All teachers, students, and staff of any educational institution qualify for the discount. Shipping is free: -... Read more
Apple refurbished Apple Watches available sta...
Apple is now offering Certified Refurbished Series 1 and Series 2 Apple Watches for 14-16% off MSRP, starting at $229. An Apple one-year warranty is included with each watch. Shipping is free: Series... Read more
15-inch Touch Bar MacBook Pros, Apple refurbi...
Apple is offering Certified Refurbished 2016 15″ Touch Bar MacBook Pros for $360 to $420 off original MSRP. An Apple one-year warranty is included with each model, and shipping is free: - 15″ 2.6GHz... Read more
13-inch MacBook Airs on sale for up to $150 o...
Overstock.com has 13″ MacBook Airs on sale for up to $150 off MSRP including free shipping: - 13″ 1.6GHz/128GB MacBook Air (sku MMGF2LL/A): $869.99 $130 off MSRP - 13″ 1.6GHz/256GB MacBook Air (sku... Read more
15-inch Touch Bar MacBook Pros on sale for $1...
B&H Photo has the new 2016 15″ Apple Touch Bar MacBook Pros in stock today and on sale for up to $200 off MSRP. Shipping is free, and B&H charges NY sales tax only: - 15″ 2.7GHz Touch Bar... Read more
15-inch 2.7GHz Touch Bar MacBook Pros on sale...
Amazon has 2016 15″ 2.7GHz Apple Touch Bar MacBook Pros in stock today and on sale for $150-$200 off MSRP. Shipping is free: - 15″ 2.7GHz Touch Bar MacBook Pro Space Gray (sku MLH42LL/A): $2599 $200... Read more
Apple now offering Certified Refurbished 13-i...
Apple is now offering Certified Refurbished 2016 13″ Touch Bar MacBook Pros for $270-$300 off original MSRP. An Apple one-year warranty is included with each model, and shipping is free: - 13″ 2.9GHz... Read more

Jobs Board

*Apple* Engineering Specialist - CSRA (Unite...
Apple Engineering Specialist All times are in Eastern Daylight Time Requisition ID Job Locations US DC Washington DC Posted Date Category Engineering Sciences Read more
*Apple* Mac Computer Technician - GeekHampto...
…complex computer issues over the phone and in person? GeekHampton, Long Island's Apple Premium Service Provider, is looking for you! Come work with our crew Read more
*Apple* Retail - Multiple Positions - Apple,...
Job Description: Sales Specialist - Retail Customer Service and Sales Transform Apple Store visitors into loyal Apple customers. When customers enter the store, Read more
*Apple* Solutions Consultant - Apple (United...
# Apple Solutions Consultant Job Number: 56881986 Middletown, NY, New York, United States Posted: Apr. 17, 2017 Weekly Hours: 40.00 **Job Summary** As an Apple Read more
*Apple* Mobile Master - Best Buy (United Sta...
**489879BR** **Job Title:** Apple Mobile Master **Location Number:** 000402-Utica-Store **Job Description:** **What does a Best Buy Apple Mobile Master do?** At Read more
All contents are Copyright 1984-2011 by Xplain Corporation. All rights reserved. Theme designed by Icreon.