Continuing discussion of the new Sharendipity UI, which was started here, now we turn to the new behavior editor.

The behavior editor is where a user controls component or application logic. This can range from simple rules to complicated programming. Our goal was to make the UI intuitive for non-programmers, but powerful enough for experienced programmers.

Previously, our UI was based on a tree-structure, and we presented all available options at each node in the tree, producing entries like this:

This UI included pull-down menus on each element that produced a multi-tiered menu, and a + menu on the right side that allowed addition or subtraction of other terms. The UI got the job done, but was intimidating and clunky. It didn’t give the user any indication of what to do, or whether a given selection made sense.

Our new behavior editor was inspired in part by Scratch from MIT, which in turn was inspired by Boxer.

The new UI is completely drag and drop. Actions, objects, attributes, and functions are presented in a navigator and dragged into the behavior editor. The action above now looks like this:

If I want to change the right-hand side from “0″ to some other value, say a copy of another object’s attribute, I simply drag in that attribute:

1. Initially, I can type in a value for orientation.
   
2. Instead, I’m dragging over the circle’s orientation attribute.
   
3. Now my orientation is set equal to the circle’s orientation.
   

But what if I want to add something to the right hand side? Previously the + menu provided access to addition or subtraction terms. In the new paradigm, I select a math function from the navigator:

And simply drag it onto the value:

1. Drag the plus function and drop on circle’s orientation.
   
2. The existing value, circle’s orientation becomes the first argument.
   

The comprehensive set of mathematical functions allows any equation to be created.

The logic for boolean operations is similar. Conditional statements are formed by dragging over logic blocks.

Again, a comprehensive set of boolean operations allow creation of arbitrary logic.

Notice that the boolean functions are displayed with a diamond shape that fits into the IF and and statements. This shape conveys to the user visually where a given function or attribute can be dragged.

The same shape is used for attributes. The boolean attributes below, such as ignore_collisions, have the same diamond shape.

The end result is an editor that provides comprehensive functionality in a straightforward drag and drop interface.

Give it a try and let us know what you think! If you’re an alpha user, you can examine the logic from popular games like Filla. If you’re not an alpha user, send an e-mail to alpha at sharendipity dot com and let us know a little bit about yourself.

We’ve just released a completely revamped user interface for Sharendipity! This project has been underway for the last month or so, driven by internal and external customer feedback. Our overriding goal was to make the software approachable and intuitive for both consumers and creators.

The slide-out galleries at the top and bottom of the screen? Gone. The radial menus? Gone. The complicated tree-based behavior editor? Gone.

Instead, we now have a paradigm based on characters that guide the user through the development process. These characters appear at the bottom of the screen and can easily be toggled on and off with the escape key. (Note that the graphics are temporary and may change.)

The director (currently a professor) guides the user through management of high-level applications and scenes.

The construction worker provides access to the basic building tools for creating circles, lines, joints, and other content.

The librarian provides access to the user’s collection of assets (the gallery) for the current application.

And on the right side of the screen, separated from the other characters, the Explorer acts as a gateway to the components and applications created by the community.

Clicking on these characters produces a menu or window corresponding to the character. For example, clicking on the explorer produces the search window:

(If you’ve used Sharendipity, you’ll see that the Search window is completely revised as well, providing access to more search results in a better organized list.)

Similarly, clicking on the construction worker produces the tool menu:

In the near future, these characters will also guide the user using word or thought bubbles - providing an interactive tutorial for new users.

A future post will explore the new Behavior window.

We would love to hear what you think about our new UI. Post a comment, or better yet give the tools a try and let us know what you think.