# Interactive/Animated graphics a-la scratch.mit.edu?

**URL:** <https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772>\
**Category:** General Usage\
**Created:** [June 4, 2020, 11:20pm UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772 "2020-06-04T23:20:21Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![dlakelan](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/dlakelan/32/8491_2.png) [@dlakelan](https://discourse.julialang.org/u/dlakelan)\
**Post date:** [June 4, 2020, 11:20pm UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/1 "2020-06-04T23:20:21Z")

</div>

Suppose someone wanted to teach computer programming concepts using Julia through interactive graphical animations a-la [scratch](https://scratch.mit.edu)? Are there any packages that let you open a window and draw objects/move them around/animate them?

I’ve seen Luxor, but it seems like it’s designed around drawing static image files (like png or svg files) and/or maybe combining them into a static animation/movie.

---

<div class="post-metadata">

**Author:** ![Tamas\_Papp](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/tamas_papp/32/25949_2.png) [@Tamas\_Papp](https://discourse.julialang.org/u/Tamas_Papp)\
**Post date:** [June 5, 2020, 11:17am UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/2 "2020-06-05T11:17:51Z")

</div>

> [@dlakelan](#):
>
> Suppose someone wanted to teach computer programming concepts using Julia through interactive graphical animations a-la [scratch](https://scratch.mit.edu)?

I would recommend that they just use Scratch directly.

Julia is an extremely powerful language, but it contains a lot of ingredients that are not suitable for an audience that Scratch is perfect for.

Simple generic concepts (variables, loops, control flow, etc) from Scratch will just carry over to other languages, including Julia.

---

<div class="post-metadata">

**Author:** ![dlakelan](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/dlakelan/32/8491_2.png) [@dlakelan](https://discourse.julialang.org/u/dlakelan)\
**Post date:** [June 5, 2020, 3:04pm UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/3 "2020-06-05T15:04:13Z")

</div>

Yeah, the audience here has already learned some scratch, and wants to move up to something a little more useful to control stuff on an RPi but the motivating factor of watching graphics move around on the screen is still strong.

---

<div class="post-metadata">

**Author:** ![Tamas\_Papp](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/tamas_papp/32/25949_2.png) [@Tamas\_Papp](https://discourse.julialang.org/u/Tamas_Papp)\
**Post date:** [June 5, 2020, 3:15pm UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/4 "2020-06-05T15:15:50Z")

</div>

Personally I would go for

[https://racket-lang.org/](https://racket-lang.org/)

which has books on programming for children.

A very nicely designed Lisp dialect. After which one can move to Julia, which is another very nicely designed Lisp dialect 😉

---

<div class="post-metadata">

**Author:** ![dlakelan](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/dlakelan/32/8491_2.png) [@dlakelan](https://discourse.julialang.org/u/dlakelan)\
**Post date:** [June 5, 2020, 4:12pm UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/5 "2020-06-05T16:12:33Z")

</div>

Awesome I had never heard of Racket but will check that out quite thoroughly!

---

<div class="post-metadata">

**Author:** ![Tamas\_Papp](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/tamas_papp/32/25949_2.png) [@Tamas\_Papp](https://discourse.julialang.org/u/Tamas_Papp)\
**Post date:** [June 7, 2020, 12:49pm UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/6 "2020-06-07T12:49:55Z")

</div>

In particular,

> **[Bootstrap](https://www.bootstrapworld.org/)**
>
> Teaching Algebra through Computer Science

seems very nicely designed.

---

<div class="post-metadata">

**Author:** ![nurban](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/nurban/32/5278_2.png) [@nurban](https://discourse.julialang.org/u/nurban)\
**Post date:** [June 11, 2020, 9:17pm UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/7 "2020-06-11T21:17:55Z")

</div>

The responses here give a lot of examples of alternative teaching languages to Scratch, but I’m still interested in the original question. Are there Julia packages for live sprite-like object animation and interaction (e.g. collision detection) in a window?

---

<div class="post-metadata">

**Author:** ![dlakelan](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/dlakelan/32/8491_2.png) [@dlakelan](https://discourse.julialang.org/u/dlakelan)\
**Post date:** [June 11, 2020, 9:25pm UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/8 "2020-06-11T21:25:59Z")

</div>

Yes. I’m still interested in that sort of thing as well. Right now I’m looking into doing a GtkReact based window for very simple Mandelbrot set drawing, zooming, interaction. I think you could probably do sprite based stuff this way too, but it’s all going to be fairly low level.

---

<div class="post-metadata">

**Author:** ![kolia](https://avatars.discourse-cdn.com/v4/letter/k/c68b51/32.png) [@kolia](https://discourse.julialang.org/u/kolia)\
**Post date:** [July 13, 2020, 2:56am UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/10 "2020-07-13T02:56:26Z")

</div>

If you are looking for general interactivity with few constraints, [Pluto.jl](https://github.com/fonsp/Pluto.jl) might be useful.

It displays arbitrary graphics, and if those graphics depend on parameters defined in other cells, the graphics will get updated immediately when their params change. You can also do animations by having variables that are bound to time.

On its own it is not geared towards kids though. But its reactivity probably does half of what you are looking for, and its generality should allow you to use it with whichever libraries you want. Using it to play with https://github.com/GiovineItalia/Compose.jl graphics might be accessible and fun.

---

<div class="post-metadata">

**Author:** ![fonsp](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/fonsp/32/222349_2.png) [@fonsp](https://discourse.julialang.org/u/fonsp)\
**Post date:** [July 26, 2020, 10:08am UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/11 "2020-07-26T10:08:03Z")

</div>

Hey! I am very interested in this question! kolia mentioned my Pluto.jl project, which is primarily designed for the undergraduate level. It does make programming and interactivity easier, but it does not provide anything exciting (graphics, games) on its own.

Pluto with Luxor might be nice for education, its author cormullion made [this cool GIF](https://zulip-uploads.s3.amazonaws.com/7178/0-xwCDwukEY5NEsEtV5jEio-/pluto1.gif?AWSAccessKeyId=AKIAIEVMBCAT2WD3M5KQ&Signature=BzMO4ssjCTVeoqrL2ZLu7fb%2BVlE%3D&Expires=1595757665). But Pluto’s interaction is always one-directional: sliders and buttons defined in different cells - it’s not a platform to make games ☹

At the school where I worked we had a lot of success with scratch! With more advanced students we started with python, with PyGame (also works online through repl.it, and students can share games with eachother), or by controlling a raspberry Pi. (also have a look at the micro:bit if you want to do electronics)

Minecraft Education edition looks exciting - there’s an in-game scratch-style programing language to control the world with. And this has a natural advancement to Julia: there is a Julia package [PiCraft.jl](https://github.com/JuliaBerry/PiCraft.jl) to control the minecraft world using Julia. Less intuitive than the control-flow-language, but you can do more powerful things like fractals!

---

<div class="post-metadata">

**Author:** ![cormullion](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/cormullion/32/49131_2.png) [@cormullion](https://discourse.julialang.org/u/cormullion)\
**Post date:** [July 26, 2020, 10:26am UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/12 "2020-07-26T10:26:14Z")

</div>

This one?

 ![pluto1](https://global.discourse-cdn.com/julialang/original/3X/e/2/e213dc127994c790e4f2819d83f99dd77ee2f6d6.gif)

---

<div class="post-metadata">

**Author:** ![Freya\_the\_Goddess](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/freya_the_goddess/32/36835_2.png) [@Freya\_the\_Goddess](https://discourse.julialang.org/u/Freya_the_Goddess)\
**Post date:** [June 19, 2022, 6:13am UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/13 "2022-06-19T06:13:34Z")

</div>

Hi @cormullion  
I was wondering do one needs Jupyter Notebooks or Juno / VS Code to create the interactive drawing/animation like above?

Is using Julia REPL only able to have the interactive widget like the one you created?

---

<div class="post-metadata">

**Author:** ![cormullion](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/cormullion/32/49131_2.png) [@cormullion](https://discourse.julialang.org/u/cormullion)\
**Post date:** [June 19, 2022, 7:49am UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/14 "2022-06-19T07:49:55Z")

</div>

You need an environment that provides some widgets, like sliders and checkboxes. Jupyter notebooks can use Interact.jl for these (if I remember right) but these days I’d use Pluto.jl for this kind of thing.

(Does VS-Code have widgets and/or Jupyter notebook integration? I haven’t looked yet.)

---

<div class="post-metadata">

**Author:** ![Freya\_the\_Goddess](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/freya_the_goddess/32/36835_2.png) [@Freya\_the\_Goddess](https://discourse.julialang.org/u/Freya_the_Goddess)\
**Post date:** [June 20, 2022, 12:12am UTC](https://discourse.julialang.org/t/interactive-animated-graphics-a-la-scratch-mit-edu/40772/15 "2022-06-20T00:12:52Z")

</div>

I will check with Jupyter notebooks, SO Pluto.jl is better than Jupyter Notebooks ?

We can simulate differential equations, surface plot with widget as well for changeable variable.