wiki:LivelyFabrik

LivelyFabrik

A wiki of ActiveObjects that can be programmed in JavaScript by wires and tiles.

Overview

LivelyFabrik is and end user programming environment for the web. It is implemented using the LivelyKernel using vector graphics and JavaScript to create a very responsive graphical environment for creating the user interface, programming and playing with the results. It uses both the visual data flow metaphor of wiring components and scripting.

Documentation

There are three kinds of elements:

  • Components
  • Pins
  • Connections

Components

There should be many kinds of components that the user can drop into its workspace, wire them together and create Programs out of them. Some components are simple, e.g. the TextComponent displays the values of its one and only Pin: "Text", other components are more complex. The FunctionComponent for example starts with two pins, an input pin and an output pin. When the value of the input pin changes in evaluates its function body and produces an out. In the function body the user insert arbitrary JavaScript code.

Pins and Connectors

By dragging one one to another a new connection is created and every time the value in the pin changes, this change is propagated through the connection to another pin.

User Interface hints

Lively Fabrik is work in progress and we are working on making it usable and self explainable, but in the meantime here are some hints:

  • Text fields need to be accepted to make the change propagate to the system. Unchanged text fields are indicated by and red box. To accept changes, use the Halo or press alt+s
  • LivelyFabrik is dynamically typed, we do not restrict the connection of components that do not fit together.
  • enable gridding by holding shift during dragging something
  • evaluate a selection or a line of code with alt+p

Literature

About the original Fabrik :

"FABRIK: APPLE COMPUTER, 1988 [Ingalls et al. 1988]. Fabrik is a computational construction kit in which pieces of functionality (procedures) appear as boxes with connectors. These boxes can be wired together to create a variety of programs (see Figure 26). The user is supplied with a parts bin that includes simple computational elements such as string and integer manipulation, as well as interface elements such as buttons, images, and lists. By dragging boxes into a working area and connecting them together, the user can create programs. As in Body Electric, Fabrik programs are always live so users can test as they are building. During development, user-interface elements and computational elements share screen space. However, once a program is finished, the user can choose to view only the interface elements. In addition, finished programs can be used as elements in subsequent programs so the user can extend the capabilities of the construction kit." (!KelleherPausch2005LBP)