Giter Club home page Giter Club logo

recursive-drawing's People

Contributors

electronicwhisper avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

recursive-drawing's Issues

Add textual instructions or help

When this app was submitted to Hacker News, I wrote a comment with textual instructions. This comment was the top-voted, with 27 points, which indicates that many people want textual instructions.

The app should show instructions somewhere. An easy place to add them is the home page, though that leaves users unable to reference the instructions while they use the app. But it’s better to put them on the home page than nowhere at all because it’s too hard to add them anywhere else. You are free to use my instructions, verbatim or edited:

Textual instructions (if you don't want to watch the demo video):

The left column is the shapes library. The center area is the canvas/workspace. The right area is an outline view of the shapes in the canvas.

To add a shape to the canvas, drag your mouse from the shape in the shape library to the workspace.

To move a shape, drag inside it, when the whole shape is highlighted red.

To resize and rotate a shape, drag the edge of it, when it is outlined red.

To delete a shape on the canvas, right-click it and choose Delete Shape. (You currently cannot delete shapes directly from the outline, nor can you delete shapes from the shape library.)

To resize a shape non-uniformly or add skew, hold shift while dragging its outline. You can use this to make line segments and rhombuses, among other things.

Click the + button in the left column to start editing a new shape.

Remember that you can add any shape to the canvas by dragging it from the shape library. This also applies to shapes you create yourself.

Click on any shape in the shape library (except for the starting circle and square) to edit it in the canvas.

You can see the thumbnail of what's in the canvas in the current shape in the shape library. You can also see the shapes your shape is composed of in the outline. Everything is updated live.

To pan across the canvas, drag outside of any shape, in the white area. To zoom into or out from the canvas, scroll with the mouse wheel while pointing inside the canvas.

You can drag even the shape you are currently editing from the shape library into the canvas. That is what makes this recursive drawing rather than merely nested drawing. You will see the current shape repeated relative to itself. (You might call the shape inside itself a "recursive shape instance".)

You can move, rotate, and resize a recursive shape instance to change its repetition pattern. For instance, if you resize the recursive shape instance to be smaller, you will see a line of recursive shapes shrinking forever. If you edit one of the repetitions of a shape, it will edit the whole pattern.

You can go back and edit a sub-shape, and every shape including that shape will update live.

If you don't know what to draw, try drawing one of these: any kind of fractal tree (https://www.google.com/search?q=fractal+tree&tbm=isch&biw=1280&bih=1252), Koch snowflake (http://en.wikipedia.org/wiki/Koch_snowflake), Sierpinski triangle (http://en.wikipedia.org/wiki/Sierpinski_triangle), Sierpinski carpet (http://en.wikipedia.org/wiki/Sierpinski_carpet), or any other fractal (http://en.wikipedia.org/wiki/List_of_fractals).

In my instructions, I made each step build on the previous ones, like a tutorial, and I also covered all features of the app, like a reference. Since my instructions are a compromise between a tutorial and a reference, if you want a tutorial and a reference separately, my instructions should be adapted for each format. An interactive tutorial (shown in a floating window with a Next button) could show one paragraph per step, but it might leave some less-useful steps out so as not to bore the reader, and link to the full reference at the end. A reference might be written as bullet points instead of sentences, and have the features organized in sections – perhaps a section briefly describing the three columnar views and then one section per view describing the actions you can do in each.

The last paragraph of my instructions is a bit different from the others – it suggests tasks to give the user something to do and spark their imagination, instead of explaining a specific feature of the app – so it’s possible that you’d want to move it somewhere else.

Undo, and share

Pretty cool project! I'd love to be able to see what other people do with things using this, so could I perhaps suggest some sort of sharing mechanism be implemented as well?

The other thing that I found wanting when poking at it this morning was the ability to undo the last (n) action(s), usually when I forgot to create a new layer before dropping an object on its own layer (hey, the coffee wasn't done yet..)

Uneditable outwardly recursive object

So its reasonably straightforward to make an outwardly recursive object where you can zoom out indefinitely, but somehow I ended up making one where editing is disabled (hovering over objects doesn't do anything). Also, the preview on the left and all the previews on the right became blank.

http://imgur.com/gdA3h

recursion with image transforms

Your project lead me to play with image feedback recursion in Meemoo, and I like it.

http://meemoo.org/iframework/#gist/3656955 (draw something, move the x,y pads, press start)

I think that my way is dumber than yours, but faster (and more colorful). But I'm missing the direct manipulation of recursivedrawing's interface.

I'm in the process of pulling apart Meemoo's views from data flow, which will make alternative views easier to code. I think that it would be possible to make a recursivedrawing module that could use any canvas in a Meemoo data flow as the base shapes, instead of the black square and circle. Those base canvases could be animated...

I guess this isn't a question or issue, just something I have been thinking about.

recursion incorrectly applied.

This seems odd, but perhaps is "by design" in some way?

  1. drag a square into a new canvas
  2. drag the canvas into itself (voila! recursion)
    ...but!....
  3. drag a circle into the recursing canvas.

The circle also recurses, even though it was in no way "dragged onto itself" during the process.

This seems like a bug?

(reproduced in Safari 5.17 and Firefox 15 on Mac OSX 10.7.4)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.