machine501

This is a student documentary I worked on with another student back in college. We couldn’t use the computer to edit, so there you go:

When I talked to my wife about the iPad I mentioned that I was glad I was a programmer because it would give me an opportunity to buy it, otherwise, I wouldn’t bother. I wouldn’t bother buying it because I saw it as a machine on which I couldn’t make stuff, which mostly meant I wouldn’t be able to program in it.

So there’s a meme out there that the iPad is mostly about consuming media, that you can’t really monkey with it because of its closed nature.  For example, in his post about the iPad, Alex Payne thinks that if this is the future of personal computing then he finds it to be disturbing.  He sees it as the possible “tinkerer’s sunset,” that it’s closed nature will prevent someone from messing with the machine, poke it, test out dangerous stuff, to develop  an interest in what makes it tick, and eventually lead them to discover programming. I’m a bit more optimistic, since I’ve been thinking about this since I wrote similar thoughts in another post, only then I had the iPhone in mind.  Let’s talk about how much things have changed and how much they have stayed the same.

A Consumer Device

The iPad looks like the ultimate consumer device.  You can watch video, read books, read the web.  Yes, they showed you can do spreadsheets and docs, that you can do work.  But can you really work?  During the presentation we saw Steve Prang demo his great Brushes application.  This is an application I use on my iPhone whenever I can’t take my pochade box or plein air watercolor kit with me.  Yeah, the screen is not pressure sensitive like my Wacom tablet, but I’m not looking for it to replace my dedicated Photoshop setup.  Restrictions like these have only given me a new way to learn to work with paint and a new way of having to think about how I approach a painting solution given that I’m missing certain capabilities I was already used to both from real life and from my Wacom table.  I’m always making drawings that I share with folks, and drawings that are studies of light and color.  It’s not a computer related activity, but it’s not just a consumer experience.  It doesn’t have garageband, but maybe someone will write an application that’s a scaled down version of Reason or just an entirely different application for musical live performances.  Something that is small and useful for on the go.  Again, it won’t replace your dedicated setup for the really professional work, but it’ll let engage in your work in contexts where you might otherwise have been limited.

If you’re in IE you won’t be able to see the above videos. Seems like I can’t get it to work in FF either. =(

Maybe someone will write a game like chipwits, where you control a tiny robot on rollerskates, and start some young person’s journey into computer science.  Even game consoles awaken the desire to learn how it works, to look under the hood, yet not only are game consoles systems on which you can’t build stuff, but they often require significant investment in time and money, AND the blessing of the company before you can develop on it.

I can imagine a photographer or a web designer showing up at a client’s with an iPad in hand and showing off their portfolio.

Here’s a quote from IO9: “But those activities are not the same thing as programming the device to do something new.”  That’s just lack of imagination.  Most computer users don’t open up a terminal and start programming.  They don’t install OS X dev tools, or download the free edition of visual studio, install python, or even do something as simple as open up a text editor and write .BAT file.  Can you do that on the iPhone or on the iPad?  Not in the same way.  Most likely because it’s in Apple’s business plan to keep people from writing applications that circumvent the AppStore approval process.  But the physical nature and mode of interaction doesn’t lend itself to that type of customization either.  I wouldn’t want to program anything on my iPhone and I probably wouldn’t want to write an extended program on an iPad.  Maybe there ought to be a way to upload stuff to the machine and make it do stuff.  But you can!  You can edit an HTML file on some server and load it on the browser, or you could download the SDK, pay $100 and upload to your own phone. I have written apps on my iPhone that my 19-month-old can play with.  Maybe your app won’t be approved for the AppStore, but you got the chance to mess with the device.

Human curiosity is enormous and we will always want to know what makes things work.  We’re still going to need developers and developer machines to write stuff for these slick, opaque, personal computing devices.

A Closed System

There’s no denying the iPhone and the iPad are closed systems.  You have to play by Apple’s rules (stated or unstated) or you’ll get booted or denied access to the system and your app will not see the light of day.  What if you want to jailbreak your iPad? Will Apple detect this and brick it? With DRM on products from the BookStore you’ll most likely not be able to share or loan your eBooks.  When it comes to books, it’s not all on Apple’s hands to force publishers to provide books without DRM.  And, like the Joe Hewitt and others point out, when it comes to control over apps, the door is wide open for webapps.

NIMBism

One thing I’m a little ashamed of is my NIMBism (Not in My Browser) when it comes to Flash.  I’m ashamed that I’m glad Apple has decided for me that I won’t have Flash content in the iPad’s browser.  I guess it just saves me the trouble of installing FlashBlock.  I could say that I don’t want Flash on my browser because it’s a CPU hog or because I’m annoyed by intro screens, but the truth of it is that my naive hope is that this will push forward HTML5 adoption by the sheer power of Apple’s muscle.

This feeling goes completely against my political, moral, and ideological leanings.  Nobody’s perfect ;)

Connected

The thing I see missing here, and the biggest weirdest thing that struck me while watching the presentation was that there was little talk about connecting to other devices.  You can synch up to your desktop.  But, that’s so old-timey.  Here’s where my desire was not fulfilled. I wanted the tablet to know there were other devices it could talk to and interact with them.  I wanted to do this wirelessly, instantly.  To be able to transfer information, collaborate and engage in activities, and begin to bring all those disparate little devices into a web.  I wanted a machine that would take a giant step towards a vision of ubiquitous computing.  Instead, I got a white cable.

So Now What?

I’m doubtful about iPad adoption.  The iPhone took off because there was a ready market out there: cell phone users.  Can the iPad reach people in the same way?  If it does, and it becomes the way most people interact with computers then I’ll be glad because it just might be the product that pushes other companies to make polite, pleasant, enjoyable computing devices.

As a developer, I see it as a tremendous opportunity to develop and try out applications for people in different contexts.

As a consumer, I could imagine it replacing my laptop.  But only if I had to travel often and I only if I didn’t need to code while traveling.

We all had too much riding on this.

In honor of Dread Cthulhu and the Twitter Fail Whale.

Click on the image to enlarge.

One final reminder that today’s the first Los Angeles Google Technologies User Group. Jason Robbins of Google will talk about collaborative development environments like Google Code.

The talk is at the Google Santa Monica office from 7-9pm.

We’ll be raffling off the following books, courtesy of O’Reilly:

Using Google App Engine

Android Application Development

and

Erlang Programming

You can RSVP at the group website or just show up.

http://www.losangeles-gtug.org/

Let me start by providing examples of Flex Framework Frameworks (FFF): Cairngorm, PureMVC (I know, it’s not just Flex), Mate, Swiz.  You get the idea.  All these frameworks provide ways to deal with Event Handling, Command or Action handling, ease separation of concerns so you can code in MVC, some provide inversion of control, or some combination of Enterprise Patterns.

Developers who are looking for a solution to bootstrap their application development are looking at the wrong abstraction level when they evaluate these frameworks.  You can’t base an entire application on just these frameworks.  If you do, you’ll be coding at too low a level.

What is needed is a library or framework above MVC, a framework that provides a core set of services that are present in most run-of-the-mill applications you’ll code in Flex, and a standard way for you to write your app on top of these services.

What’s a run of the mill Flex application?  I’m talking about business applications that may be deployed over a browser or in AIR and that allow the user to enter information in a form, to create a dashboard.  I’m not talking about other types of online apps like Blogs where you just read information and post (sure, there’s a form, but whatever), advertisement sites like movie websites (these mostly use Flash and are highly interactive but the focus is not to gather information from the user.   I hope you get the picture.  If I had more time I’d come up with a better bullet point list.

So, what are the base services for these applications?  I’ll try to describe them without resorting to Enterprise pattern names like Commands or Actions and just describe what I want my app to do.

I want to …

1. be able to have buttons, menu items, links, and other UI widgets through which the user can perform the same action.  So there might be an undo button, an undo menu item, and an undo menu item in a context menu and clicking or selecting it should execute the same action.  They should be enabled or disabled automatically for me, their visibility should be set to true or false automatically.  I should be able to declare their enablement/view states and their position on a toolbar or menu without my having to add any code or have any giant switch statements.
2. have undo/redo
3. handle long running operations with the ability to provide feedback to the user and the ability to cancel them
4. have the same button or menu option perform what seems like the same action based on what thing I currently have selected or what view I currently have selected
5. global item or resource selection handling
6. Modularity so that functionality can be added by providing another module and not by recompiling the whole thing
7. Context based action enablement

Ok, I’ll stop there because that last one is very jargony.  I’m basically talking about something like the Eclipse Rich Client Platform (RCP) but for Flex.  Moccasin, a Flex framework for graphical editor apps has history  management and editor functionality.  I want a library that goes further.

If you’re not familiar with the RCP, that’s OK, let me explain how this mythical framework might handle the features up there:

Commands and Handlers

The RCP has the concept of a Command, which is just a declaration of an intent to perform some action. It doesn’t actually do anything, it’s just a marker.  For example, “Cut” is a command.  It doesn’t actually know how to perform anything.

In order to actually do something you have to provide a Handler for a command and tell the framework when your handler should be invoked.  For example, let’s say your application has a tree on the left that shows a hierarchy of files.  And there’s a text editor on the right, which just shows the contents of the selected file.  If you currently have a file selected on the tree and you click on the “Cut” button then the Cut File Handler is invoked.  It knows how to take a file, delete it from the current location and store the contents in the clipboard.  If instead your text editor had focus and you had selected a piece of text then clicking on the Cut button would invoke the Text Editor Cut Handler which knows what part of the text is selected and can yank it out of the editor then store that in memory.

How did the framework know which handler to invoke?  When a handler is declared in the system you must also provide an “activate when” expression.  The activate-when for the Cut File Handler might be something like:

if Selection == Resource of type File

for the Text Editor Cut Handler it might be:

if selectedView == editor and and selection length > 0

Handlers can also be declared with “enabled-when” and “visible-when” expressions that allow the framework to dynamically, automagically enable buttons, menu items, links or whatever other UI widget is currently hooked up to a command, if the expression executes true.  ”visible-when” expressions would remove or add the widget if the expression were true.

That’s how we deal with 1, 4, and 7.

Undo/Redo - History Management

This one’s easy, but I haven’t seen any framework address it directly. It’s a pretty generic feature and even if your app is whiz bang it can still use the same basic generic solution.  The solution is simple:

Execute stuff in an undoable operation interface (call it IUndoableOperation).  Put it in some manager that has two stacks, an undo stack and a redo stack.  Implement an redo/execute method or methods and implement an undo method.

If you want to get fancy, use Undo Groups so that you can group together a set of operations that should be undone/redone as a group though each operation by itself may be undo/redone independently.  That takes care of 2.

In order to do this right in Flex, however, the history manager should anticipate having to perform its undo/redo/execute asynchronously because some operations may require network access and their completion can only be determined asynchronously.  Which brings us to my next topic:

Long Running Operation

In fact, the spark that started this post brewing in my head was when Ted Patrick tweeted about their being so many Flex Framework Frameworks.  The conversation turned into creating a library of useful patterns that Flex developers could use and feel confident in using them.  That the benefits it would provide would be to cut down on development because we wouldn’t have to reinvent the wheel, that we could share projects more easily because they wouldn’t depend on different libraries that performed the same thing though slightly different.

Anyway, one of the features or patterns requested was a way to perform long running operations, something that looks like threads (there’s a google code project for this in Flex).  I think this is a useful pattern that should be available in this framework I’m dreaming about.  And that there’d be support in the UI for monitoring its progress and canceling it.  It seems easy, have the method implement an ILongRunningOperation interface which can report progress as well as human readable information like the task it is currently performing.  This interface can take an IProgressMonitor interface object to which it can report its progress.

On the UI side, the framework can provide a simple, standard, sample progress bar that implements the IProgressMonitor and that is hooked into the Long Running Operation manager of the framework, so that all the developer has to do is declare a long running operation, give it to the manager, and the manager knows to perform this operation when all other ops are done, or maybe concurrently if the operation does not have to block.

That takes care of 3.

Global Resource Selection Handling

I’m not talking about the Flash global selection handler, I’m talking about a manager above that to which your views can set the selection of native objects in a standard way.  For example, if I have selected a node in the tree example above then the selection would show as an array of one object of type FileResource.  If I’d selected several nodes then the selection would be a flat list but would have an associated hierarchical selection.   If, instead I’d selected text in the editor it would be a one element array with an object of type TextRunSelection (or something) that encapsulated the start, end and any other attributes of the text.

This selection manager is an essential component that can be used by the command/handler framework when evaluating active-when, visible-when, enabled-when expressions.

That takes care of 5.

Modularity

This one obviously would use Flex modules at its core, but would add a layer above it that would provide the following:

Extension Points: Extension points are basically where you declare your application hooks and in which other modules or plugins can hook into to provide functionality.  An example extension point is an Editor, for example.  Let’s say that I can have different types of editors based on the extension of the file I have selected.  My main application would declare that there’s an extension point called editor through which other plugins or modules can add their own editors.

Extensions: These are the actual things that modules or plugins provide.  My XML editor plugin can provide an extension to the editor extension point that says: If you have selected a resource of type file with the filename ending in “.xml” then use this editor.

The framework would not provide a set of defined extensions, but just the ability to declare extension points.  And it would provide an easy way for applications to request what extensions are declared for some extension point.

If we wanted to get fancy, the plugin framework would allow the developer to provide all this in a plugin descriptor as well as initial proxy objects that would delay the actual loading or instantiation of a plugin until it was actually needed.  I think this level of delaying might not be desirable, however, as it would add a level of complexity to the extension user because they’d have to account for the asynchronous nature of module loading when accessing proxy classes.

One additional benefit of a layer above Flex modules is that developers would not have to worry about adding the latest best practices to flex module  handling that are discovered as bugs and other “features” of Flex modules pop up.  It would also relegate the need to deal with application security mostly to the plugin framework and away from the application developer.

That takes care of 6.

Stuck in the Weeds

My old business partner had a great expression: Whenever I’d start proposing solutions in terms of MVC or using httpservice vs. remoteobject he’d tell me: “Robert, you’re stuck in the weeds!”  It’s obvious what he means: I’m focusing too much in the details without stepping back and looking at the whole problem.  What am I trying to accomplish?

When I picked up Flex I started without a framework, then I started with Cairngorm.  The application grew in complexity and it seemed Cairngorm just made it too hard to keep going.  Then we stepped back and we thought about MVC and how we could use the basic stuff that Flex provided to code in MVC rigorously.  It worked, but we were still stuck in the weeds.  It was hard to add stuff to our application.  One sign of the problem with just thinking in MVC was that when we talked to the client they didn’t talk about views or models or controllers, they talked about editing things, loading resources, selecting stuff, undoing this, selecting that file, selecting this text.  Cutting and pasting that, adding a page.  (forget about use cases and user experience for now)

So I stepped back and started thinking about application level services.  I’d worked with Eclipse for a long time before Flex and I remembered how easy it was too think in terms of what the application does.  I’ve written some complex stuff in Eclipse and it wasn’t trivial but it was fairly easy.  Why couldn’t I do the same with Flex?

I don’t mean to say that the frameworks out there are focusing on the wrong things; they are targeted at the layer they are meant to target.  I think many Flex developers are stuck in the weeds, however.  They’re looking at the wrong level when they’re looking for a framework to build their apps on top of.  Where the focus is wrong, I think, is in the energy devoted to creating these frameworks and advocating their use as the solution to Flex application coding difficulties.

Why don’t I start this framework?  I may. I’m not sure what the level of interest is.  I felt the need to put this out there to see if I can make the case that the majority of Flex developers are stuck in the weeds.

I’m happy to announce that Jason Robbins will be our guest speaker for the first Los Angeles Google Technologies User Group. He’ll be talking about Google Code.

When:
8/19/2009, 7pm to 9pm

Where:
Google Santa Monica
604 Arizona Ave
Santa Monica (right by the 3rd street promenade)

What:
Jason Robbins on Google Code.

Find out more about Jason and the meeting at the LAGTUG home page: http://www.losangeles-gtug.org/

See you there!

I just got my developer sandbox account for Google Wave.  I’m testing it out.  My dev wave account is robert dot cadena at wavesandbox dot com. If you don’t see the content between the two lines below then you don’t have Google Wave sandbox access. I’ll post a screenshot later.

---

[edited: the wave used to be here but I removed it after the beta period ended]

---

It’s a bit slow to show up and on Safari you get a huge white vertical space.

There are a few things I’m a little confused about but hopefully some docs will tell me what to do. For example, I thought I’d change my settings via the settie robot, but when I click on him nothing comes up. I’m not sure how to interact with settie.

I wanted to change my photo so I thought I could do it through that. But, it turns out you can do so by clicking on your photo on the bottom left “contacts” window and selecting Change Photo. Here’s a screen cap:

You then get taken to a Google Apps account where you can click on Settings and select change your photo.

These names are also something I’ll have to get used to. I’m trying to imagine myself saying: I sent you a blip, ma! Or, blip me the link. But, I guess I got used to saying “I twittered about it”.

August 19th is the first meeting of the Los Angeles Google Technologies User Group in Santa Monica.

The meetings will feature presentations from Googlers and non-Google people on Google technologies like GWT, Android, Wave, and Chrome.

We’re still working on the topic for the first meeting and I’ll post an update on this blog about it and twitter about it.

The meetings will take place from 7-9pm on the 3rd Wednesday of every month at the Santa Monica Google offices at 604 Arizona Avenue.

Check out the website for updates http://www.losangeles-gtug.org/ and follow us on twitter @LosAngelesGTUG

Come by and introduce yourself!

This post is also available over at my company’s blog, Applied UX, but I thought I’d post it here because lots of Flex developers come by this blog and I think they might find it interesting, too.

Code editors are like toilet paper: Seriously … how can you possibly improve on it?  You type some code, you hit compile, you debug.  I have this attitude lots of times, opting for VIM with simple syntax highlight over something like Eclipse, with syntax highlight, code completion, incremental compilation, code folding, and refactoring support.  But, when I’m full into a project, whipping out Java code, I’m really glad I’m using Eclipse, where these features often help me code faster, with fewer errors.

So, I was thinking of a few features I wish I had.  If you have any or examples of some you like, please send them in.  Include a screenshot if you can.

Scope Spotlight

The first feature I was thinking about was something I’m calling scope focus.  The basic idea is that the you use background colors to identify the current scope level.  If your background is white, then the current scope your cursor is in would be full on white, as the you move away from that scope the background color would gradually darken.  The darkness levels would be a function of the innermost scope in the current file.  Funny, enough, however, XCode has this feature.  I would not have seen it if I had not recently started doing iPhone development.

Here’s a screen shot:

1. Is the scope my cursor is currently in.  You don’t see the cursor, but it’s there.
2. Is the enclosing scope, and it’s darker than the inner
3. The next enclosing scope is darker still
4. The gutter shows the scopes again, with code folding widgets.  If you notice the gutter above the “4″ you’ll see a slightly darker rectangle, that indicates that there is another scope at that location.

This is really useful and I could imagine that for a language like Python where indentation is used to indicate scope.  For example, if I keep to the 80 columns convention, then I sometimes have to add carriage returns for long lines and this sometimes adds a little indentation.  If the scope is long it can get tricky trying to figure out where the next scope is.  This is specially true if it’s midnight and I’m having a hard time seeing anyway.  This would also be really useful when hand-editing XML.

Back when I was in my early 20s, 10 point was my choice for editing code.  As I get older, I’ve had to crank up the size of my type.  So anything that helps with vision as a programmer gets older is welcome.

I’d like to see this in Eclipse and TextMate.  Maybe it’s there already, and, if not, someone can probably write a plugin or a bundle.  One problem with XCode is that I have to mouse over the gutter to get this effect.  Maybe there’s a way to turn it on?  It would be ideal to turn it off with one keystroke, too, so that I can navigate the file without seeing the effect, then turn it back on again as I focus on a piece.

This feature makes me think of the full-page editing modes in Scrivener and other word editing programs.  I’d like to try full-screen for coding, but I tend to have a few resources open at the same time so maybe it wouldn’t really work.  I also navigate a few files at the same time, so project resource navigation would have to be there.

Current Line Zoom

Make the type of the current line larger.  Here’s a TextMate screenshot I altered to show this feature:

This is another vision/text related wish.  Many editors have a feature to change the background of the current line you’re in.  I don’t know if this was its initial purpose but I use it to find out where I am in the code after I come back from a meeting.  Nowadays cursors are small slim lines and not chunky blinking blocks, which often makes it hard to see where you last placed it after an interruption.

Notice I added another gutter, which would show perspective lines to indicate that the 183 applies to the line.  I could have resized the line number too.  I couldn’t decide which method would work better.

One thing I noticed while modifying the screenshot is that the feature would have to keep the left-alignment, so a simple “expand” won’t do, since the text to the left of the “private” keyword would push the keyword to the right, and then you lose the formatting often helps us determine scope.

I also thought of decreasing the zoom from the current line to adjacent lines until the zoom reaches the default type size.  This is not shown in the screenshot above.  The idea would be that adjacent lines would get gradually smaller.

Breathing Space Auto Scroll

This other feature is related to scrolling.  Let’s say you start with a blank file.  As you code, your cursor goes lower and lower towards the bottom of the window or view.  When you get to the bottom, your cursor stays there and any new line you enter is at the bottom of the view.  If the editor supports it, I use a key combination to scroll the view up, so that the cursor is a little more than halfway up the visible area.  Then I keep coding until I get to the bottom and repeat the process.

Sometimes I end up having to add a bunch of carriage returns at the end of the file so that I can get enough “breathing room” to let me scroll the last line to the middle of the view.  This sucks.

Therefore, I’d like to see the following feature:

1. As you type, if you are getting near the bottom of the page, scroll the page so that the cursor doesn’t go all the way to the bottom of the view.
2. Allow the user to scroll a little past the end of the last visible character so that the last line of the file is not at the bottom of the view.

This could be implemented by adding a “virtual” view over the actual view.  The top and bottom of the virtual view would be maybe a third of the way (or some configurable distance) from the top and bottom of the actual view.

I think I’ve seen this feature in Emacs.

Have a look at the Natural Programming Project if you’re interested in these sorts of ideas.

I’d like to be able to actually test if these improve quality of code and speed of coding.  Or maybe it doesn’t negatively or positively affect qualitative measures of coding but it does make for qualitative differences in the experience of coding.  In, other words, maybe it makes your coding a little more fun and a little more enjoyable.

I’m not at SXSW this year, so I’ve spent my time working on a few new media projects.  I was looking around for some ideas for putting together a mechanism for one of the projects and I came upon these wonderful videos of wooden automata on YouTube.

Below are some of my favorites:

The Barecats

Luppa Turca:

The Man from Limerick:

Manet’s Olympia:

Fertilisation:

You can see more from Cabaret Mechanical Theatre on their YouTube page: http://www.youtube.com/user/CabaretMechTheatre or at their site: http://www.cabaret.co.uk/