Discuss Scratch

clintonb
Scratcher
19 posts

Demo of Scratch with a Timeline

Hello everyone.

I'm working on a mod (of Scratch 1.4) to add a timeline to Scratch. The timeline lets you see what the code was doing when it ran so that you can better understand it.

Here's the demo video.

Why am I doing this? It is clear to me that many kids do not understand what their robot programmed with Enchanting is doing, and I want to make a new version of Enchanting, one that runs on the Raspberry Pi with the BrickPi as a brain for LEGO robots, with features like this to make it easier to understand. In working on it, I can see there is value in having a version of “regular” Scratch with a timeline mod.

I'd love some help, and a lot of the help doesn't require any coding skills.

For example,
  • What should I call this mod? (It can't have “Scratch” in the name.)
  • What should the user interface look like? Should I add a separate pane for the timeline, and do I need way to hide/show each of the panes (the parts palette, the scripting area, the stage and list of sprites area)?
  • How does one zoom in and out (and should it work both horizontally and vertically)?
  • Do you want to be able to see the timeline for multiple sprites at once? (How?)

Also, I want you to know that this is just a demo so far. While I do have a change set advanced users can ‘file in’ to Scratch 1.4 , there are a number of things that don't work.

Known shortcomings:
  • scrolling the timeline area is not really implemented. (It works in the demo because I placed a command block down and far to the right).
  • there is no keyboard control for scrubbing through the timeline
  • not all blocks yield sensible results when you hover over them.
  • I have no idea what the performance is like.
  • I need to make it forget the oldest information when the timeline has gone on too long.
  • Only ‘motion’ state information is stored and restored currently. (Doing the same for most of the other settings, such as ‘sound’ and ‘looks’ settings is straightforward. The pen commands will be tricky, though, as I’ll need to take regular snapshots of the stage.)

Other desirable features:
  • allowing someone to change a variable and see the results change the timeline, without making them run it again
  • making it so you can see the entire path that a sprite will and has traversed (mapping time onto space).
I'd love to hear your thoughts.
k9lego
Scratcher
1000+ posts

Demo of Scratch with a Timeline

Cool!!! You know a lot!

Since your a scratch vet, I would add a profile pic. That makes you look more expert to go with being expert. Get my point? Nice job at that, keep It up, k9lego.

- Let's Eat  Grandma! This is a hidden advertisement for the Collab Hyper Cloud Inc. :)
- Let's Eat, Grandma!
Commas Save Lives!























Nothing Much here…



















If you want to reply to me, please comment with the link to the topic “On my profile page”. thanks. k9lego
Hardmath123
Scratcher
1000+ posts

Demo of Scratch with a Timeline

This is positively amazing! I love the idea. It would be so cool to have a feature like this in a Scheme editor, to (for example) illustrate the difference between a recursive and iterative process graphically—my CS class grappled quite hard with this.

The Worrydream link is pretty interesting. It reminds me of a lecture I heard a couple of years ago: an artist should be as close to the product as he can possibly be. He had a demo where some JavaScript drawing code could be edited “graphically”: hovering over “#00FF00” would pop-up a color picker, and the result changed instantly. Beautiful stuff.

I noticed you considered Snap! as a good option for your 4.0 platform. Go for it. Snap! is amazing to hack on because it is extremely open. Jens and Brian are extremely supportive of others developing on Snap! (unlike the Scratch Team, who keep development strictly within the Team because they have too big a community to handle code snippets from).

In fact, regardless of what you do with Enchanting, I think the timeline feature should be a part of Snap!.

Technoboy10 has already built several plugins, one of which can do rudimentary NXT controlling (he demoed this at Barcelona this year—very exciting). Of course, you should keep compiling to LeJOS because you can do so much more with it! Go LeJOS!

GitHub is great. I don't care much about version control, etc., but it gives you a great way to track issues, host code/releases/Wikis/READMEs/Licenses that you would otherwise have to hack together yourself.

(By the way, I was one of the big Enchanting fans back when it was released—we came 4th at Robofest with LeJos/Enchanting. Thanks! Hack on!)
bharvey
Scratcher
1000+ posts

Demo of Scratch with a Timeline

Hardmath123 wrote:

In fact, regardless of what you do with Enchanting, I think the timeline feature should be a part of Snap!.
Yes, please! It's asking a lot since our code base is totally separate from either Scratch (1.4 or 2.0), but I'd love to have this. It would help enormously in our Snap!-based classes.

scratchisthebest
Scratcher
1000+ posts

Demo of Scratch with a Timeline

Here's my 2 cents:

What should I call this mod? (It can't have “Scratch” in the name.)
Think of variations on the word “Temporal”, e.g. tempora, try pulling a tumblr with temporl, try making a typo with temopral, etc
What should the user interface look like? Should I add a separate pane for the timeline, and do I need way to hide/show each of the panes (the parts palette, the scripting area, the stage and list of sprites area)?
I really don't think this is needed. 1.4's “small stage” mode should leave enough space.
How does one zoom in and out (and should it work both horizontally and vertically)?
Zooming would sort of be silly imo
Do you want to be able to see the timeline for multiple sprites at once? (How?)
oh, that's a tricky one… maybe tabs at the bottom you can switch between? Or you could assign shapes to sprites, like the first sprite uses round dots and the second square, or something.

You are super talented – pleaseplease try working on Snap! - it's based off of morphic.js so you should have no trouble

I am a Lava Expert
clintonb
Scratcher
19 posts

Demo of Scratch with a Timeline

Hardmath123 wrote:

This is positively amazing! I love the idea. It would be so cool to have a feature like this in a Scheme editor, to (for example) illustrate the difference between a recursive and iterative process graphically—my CS class grappled quite hard with this.

Oh, I agree. I hope that by actually implementing this, I can help raise the bar and inspire other coding environments to include such features.

Hardmath123 wrote:

The Worrydream link is pretty interesting. It reminds me of a lecture I heard a couple of years ago: an artist should be as close to the product as he can possibly be. He had a demo where some JavaScript drawing code could be edited “graphically”: hovering over “#00FF00” would pop-up a color picker, and the result changed instantly. Beautiful stuff.

I agree. You've got to see the worrydream video "Stop Drawing Dead Fish". (Bret has put up lots of other interesting and inspiring videos and essays, too.)

Hardmath123 wrote:

I noticed you considered Snap! as a good option for your 4.0 platform. Go for it. Snap! is amazing to hack on because it is extremely open. Jens and Brian are extremely supportive of others developing on Snap! (unlike the Scratch Team, who keep development strictly within the Team because they have too big a community to handle code snippets from).

In fact, regardless of what you do with Enchanting, I think the timeline feature should be a part of Snap!.

Technoboy10 has already built several plugins, one of which can do rudimentary NXT controlling (he demoed this at Barcelona this year—very exciting). Of course, you should keep compiling to LeJOS because you can do so much more with it! Go LeJOS!

Wish I could've made it to Barcelona. I hope to make it to MIT next year if they have another Scratch conference. I'll post some comments on Snap! in reply to Brian, in a post below.

Hardmath123 wrote:

GitHub is great. I don't care much about version control, etc., but it gives you a great way to track issues, host code/releases/Wikis/READMEs/Licenses that you would otherwise have to hack together yourself.

(By the way, I was one of the big Enchanting fans back when it was released—we came 4th at Robofest with LeJos/Enchanting. Thanks! Hack on!)

That's great! Thank you, I appreciate it.
clintonb
Scratcher
19 posts

Demo of Scratch with a Timeline

bharvey wrote:

Hardmath123 wrote:

In fact, regardless of what you do with Enchanting, I think the timeline feature should be a part of Snap!.
Yes, please! It's asking a lot since our code base is totally separate from either Scratch (1.4 or 2.0), but I'd love to have this. It would help enormously in our Snap!-based classes.

Hi Brian!

Wow, three people asking for support in Snap! in one thread.

I wish I didn't feel apprehension about hacking on something based on HTML5 technologies. It's been 14 years (!?) since I've worked with JavaScript in earnest. I'm sure it is not a big deal, but I must say, working in Squeak has spoiled me. (I think about that now and again when writing scripts in Python, which is a great language, but I can't ‘see inside’ and tell what is going on. If I thought any future coworker would have a hope of figuring out what I'm doing, I'd sure look at using Pharo for small projects at work.)

I suppose that one of these days I need to download the Snap! source and dive into it. (I don't suppose I could arrange a video conference (or skype call) and get a tour of the code?)

Here are my current thoughts:
  • I'm speaking in 5 weeks on programming robots, and would really like to have something to demonstrate using the timeline
  • I'd also like it to work on the Raspberry Pi (which isn't going to run Snap!)
  • although, it could possible run a server that Snap! talks to. I've wondered about that.
  • having help, of course, can change the balance of my decision :-)

The most straightforward approach I can see at present is to make it work as a Scratch 1.4 derivative.

That said, it is a very interesting idea, and I'll think about it. Maybe I can find time come December. I have wondered about having multiple UIs for the next version of Enchanting – especially since it'd be handy to support different devices that way (ex. native app on a Raspberry Pi, web app on an iPad) – but it does seem like a lot of work.


clintonb
Scratcher
19 posts

Demo of Scratch with a Timeline

scratchisthebest wrote:

Here's my 2 cents:

What should I call this mod? (It can't have “Scratch” in the name.)
Think of variations on the word “Temporal”, e.g. tempora, try pulling a tumblr with temporl, try making a typo with temopral, etc

Hmm… Not a bad idea at all.



scratchisthebest wrote:

How does one zoom in and out (and should it work both horizontally and vertically)?
Zooming would sort of be silly imo

I rather think it'll be important. Drawing a polygon required scrolling and it is a really simple program.



scratchisthebest wrote:

You are super talented – pleaseplease try working on Snap! - it's based off of morphic.js so you should have no trouble

Morphic.js sounds like a good thing, I must admit. Thanks for putting the request in; it does make a difference. As I said to Brian, I'll think about it, but it may have to wait.

drmcw
Scratcher
1000+ posts

Demo of Scratch with a Timeline

That is fantastic. Very nicely done. Such a shame Scratch 2 dropped even the minimal debug support from 1.4.

10 !
ScratchVaders or Galaga?
Maybe Eliza can help you decide?
clintonb
Scratcher
19 posts

Demo of Scratch with a Timeline

Hmm… Really struggling with a name.

I'll start with a few that I like but can't use for trademark reasons:
  • DeLorean
  • The Wayback Machine
  • Tardis

Here are some other thoughts:
  • Ephemera
  • Trails
  • Crumbs, or maybe Breadcrumbs
  • Jigawatt
  • 88
  • Scrubber
  • Skein, or Hank
  • Vinyl
  • Deep Groove
  • Temporal Loop
  • Relativity

Hmm… I'd love to have some more ideas.
djdolphin
Scratcher
1000+ posts

Demo of Scratch with a Timeline

How about something with “chrono” in the name, like ChronoBlocks?

Edit: It turns out Chrono Blocks is a Chilean board game.

Last edited by djdolphin (Oct. 16, 2013 21:14:03)

technoboy10
Scratch Team
1000+ posts

Demo of Scratch with a Timeline

Wibbly-wobbly timey-wimey? JK.
I like Jigawatt(s?) and Breadcrumbs.

my github | my blog | scratcharchive.cf
“I may not have gone where I intended to go, but I think I have ended up where I needed to be” -Douglas Adams
Hardmath123
Scratcher
1000+ posts

Demo of Scratch with a Timeline

Rewind?
nathanprocks
Scratcher
1000+ posts

Demo of Scratch with a Timeline

Hardmath123 wrote:

Rewind?
I like that one.


Want to write text in rainbow? How about uʍop-ǝpısdn? Or just sdrawkcab? Get the TextTools Chrome extension!
My browser / operating system: Macrosoft Winding XO, Internet Exploder 6.0, Angel Player ver.:1.2.5
;
drmcw
Scratcher
1000+ posts

Demo of Scratch with a Timeline

Theseus for a name? (He's the one who killed the Minotaur by following thread through the labyrinth)

10 !
ScratchVaders or Galaga?
Maybe Eliza can help you decide?
clintonb
Scratcher
19 posts

Demo of Scratch with a Timeline

One of my co-workers suggested “Tracks”.

There are several of these names I like. Love to hear more.

Clinton
clintonb
Scratcher
19 posts

Demo of Scratch with a Timeline

Thank you for the thoughts on the name. I've decided to go with “Breadcrumbs”.

I have put up a very preliminary release, here:

http://static.robotclub.ab.ca/source_code/breadcrumbs/

You only need the .image file. No, there is no installer yet.

The easiest way to use it is to go to your Scratch folder, rename Scratch.image, and then rename Breadcrumbs-0.1.image to Scratch.image, and then run Scratch.


How to use

  • Build and run your programs like normal.
  • When you are ready to see what happened, click on the timeline button, which is found right beside the buttons to change the stage size and enter presentation mode.
  • Move your mouse over the timeline to see what happened, when, and how.
  • Or, use your keyboard. Once you move the mouse into the timeline window, the border will change. At that point, pressing the left and right arrows will move to the previous and next command executed. Alternatively, press shift and an arrow key to see the last or next time a certain command was executed.

If you try it out, please let me know what you think.

(And now I need to make this work with robots!)
nathanprocks
Scratcher
1000+ posts

Demo of Scratch with a Timeline

clintonb wrote:

The easiest way to use it is to go to your Scratch folder, rename Scratch.image, and then rename Breadcrumbs-0.1.image to Scratch.image, and then run Scratch.
An easier way would be to open Breadcrumbs-0.1.image with Scratch.exe because you can not change files in Program Files unless you are an administrator.


Want to write text in rainbow? How about uʍop-ǝpısdn? Or just sdrawkcab? Get the TextTools Chrome extension!
My browser / operating system: Macrosoft Winding XO, Internet Exploder 6.0, Angel Player ver.:1.2.5
;
davidkt
Scratcher
1000+ posts

Demo of Scratch with a Timeline

Awesome! So you're continuing Enchanting? Great!

Remember when I looked like this? I still do.


Float, my Scratch 2.0 mod | My (somewhat under-construction) blog
clintonb
Scratcher
19 posts

Demo of Scratch with a Timeline

nathanprocks wrote:

clintonb wrote:

The easiest way to use it is to go to your Scratch folder, rename Scratch.image, and then rename Breadcrumbs-0.1.image to Scratch.image, and then run Scratch.
An easier way would be to open Breadcrumbs-0.1.image with Scratch.exe because you can not change files in Program Files unless you are an administrator.

Ah. Good point. Right-click on the .image file and choose “Open With…” (or whatever the specific term is for your operating system) and then choose Scratch.

Thanks.

Powered by DjangoBB

Standard | Mobile