Sunday, June 16, 2013

Demo Interaction

I've finished adding some basic interaction to the Thinker v0.12 WebGL online demo. This includes adding, editing, and deleting elements.

Here's a list of the basic interactions.

  • To reposition a node - Click and drag the node. All child nodes will also move with the node, radiating out from the center of the world.
  • To adjust the curve of a link - Click and drag the link node. This curve will be maintained if you move either of the connected nodes.
  • To add a new node - Click on some empty space, and select the Add icon from the menu. A new node will appear. Click again to place the node where you want it, or optionally, click and drag to adjust the size of the new node. The edit field will automatically appear, allowing you to enter the text of the new node.
  • To add a new child node to an existing node - Click on a node, and select the Add icon from the menu. A new node with a new child link will appear. Click on some empty space to place the node where you want it, or optionally, click and drag to adjust the size of the new node. The edit field will automatically appear, allowing you to enter the text of the new node.
  • To add a new link from one node to another - Click on a node, and select the Add icon from the menu. Move the cursor over the other node that you want to link to. You should see the link change to a dashed associative link to the other node. Click to create the link to this node.
  • To edit the text of a node, link, or world - Click on the item, and select the Edit icon from the menu. The edit field will appear, allowing you to enter the text of the new node. Press enter, or "apply" to submit changes, or select something else to cancel.
  • To change the type of link - Click on the link node, and select the Link icon from the menu. This will toggle the type of the link between associative and hierarchical. You can use this method to reparent existing nodes.
  • To delete a node or link - Click on the node or link node, and select the Delete icon from the menu. (Currently there is no undo in the demo!)

I hate written instructions... Hopefully these are all much more intuitive in practice. The eventual introductory video should be worth a few thousand words.

Anyways, some screenshots of the demo in action!

Thursday, June 6, 2013

Computer ~ Thinker

As you may have seen on the Treehouse ads, not knowing how to code is the new illiteracy of our age.

I was watching some YouTube videos of Steve Jobs and the origins of personal computers and I came to a startling realization: computer applications with graphic user interfaces were one of the saddest things to happen to the computer. They made us computer illiterate. In as much as they made the computer accessible as a tool for solving specific problems, they removed us from the real power of the computer as a tool for solving any problem. In the beginning, when you first got a personal computer, the primary way that you used that tool was by programming it.

There's just one problem with computer programming: coding sucks.

Don't get me wrong. I love the raw creative power of code, and I can get totally absorbed in the process. But as I was learning how to bring my vision for Thinker into working reality, I couldn't help but think how genuinely stupid the whole process was. I firmly believe that that feeling is one of the most valuable assets that I could bring to the creation of this tool. I never want to forget it. I think one of the worst things a developer can do is get lost in the complex technical details of the code and forget how to think in simple intuitive ways. It's a constant challenge.

Code is already an abstraction. Binary code is abstracted to assembly language which is abstracted to a higher level language... so why do we stop there? Because it's typically too complex for a basic user to handle anyway. There are too many details to control. Visual editors tend to bog things down and are typically hideous.

But Thinker aims to harness the power of emergence. Extremely complex results can be achieved with very simple and intuitive building blocks. For example, take the world of Minecraft. The ability of users to intuitively and easily manipulate the basic building blocks of the world, leads to some of the most vast, complex, and intricate systems ever seen in a game...

 The Winter Palace - a Minecraft creation
Maybe in this way, Thinker can help restore some of the true power of the computer and help put that power into even more hands.

Computer - A tool used to compute. ~ Thinker - A tool used to think.