CodePlayField

CodePlayField provides a way to learn audiovisual editing using open source software and programming with Python 3 using many simple demonstration programs.

The following video was created from the software. The demo that created this allows using the arrow keys to move people around depending on where they are in the scenes.

The software can be run a few different ways.

Use a simple editor and run Python using a terminal or from Idle. This documentation mostly describes using Windows and Ubuntu. Some changes may be required to run on other operating systems.
Use Jupyter Notebooks.

Get CodePlayField

Get the software here: https://github.com/animatedb/codeplayfield
Select the "Code" button, then select "Download ZIP". Another option is to use the "Download" link and download from releases. The releases may not be as up to date as the ZIP method.
Unzip in a local folder.

Using Jupyter

Skip this section if you would like to use Python without Jupyter.

Install Jupyter
The recommended method to install Jupyter is to first install pip.
Install Jupyter using https://jupyter.org/install and use the pip method.

Run Jupyter

  cd codeplayfield
  jupyter-notebook CodePlayField.ipynb

In Ubuntu, jupyter notebooks is normally installed at "~/.local/bin/".

  cd codeplayfield
  ~/.local/bin/jupyter-notebook CodePlayField.ipynb

Using Python

The rest of this document shows how to use Python without using Jupyter, but the same programs and documentation is available using Jupyter.

Startup	Programming	Support	Tools
Setup Download from Github Install Python Running Running Programs Editing Programs Solving Problems	Steps Storage Values Types Flow Loops Functions	Editing Problems Images Sound	Edit Images Edit Images (Shapes) Edit Sound Edit Music (Notes) Edit Music Edit a Video Grab a Screenshot (Image) Grab a Screencast (Video)

Startup

Programming

Support

Tools

Setup

Running

Demos

Graphics

Graphic images can be created from shapes such as circles and lines. Graphics can also be things like pictures.

Graphics - Display Image

Edit the program fields/graphics/1-drawImage.py
Open a terminal move to the "fields/graphics" folder and enter:


    $ python3 1-drawImage.py

Things to try
Learn About Steps
Learn About Images

Graphics - Display Comic

Edit the program fields/graphics/2-drawImageComic.py
Open a terminal move to the "fields/graphics" folder and enter:


    $ python3 2-drawImageComic.py

Things to try

Draw Simple Shapes

Edit the program fields/graphics/3-drawSimpleShapes.py
Open a terminal move to the "fields/graphics" folder and enter:


    python3 3-draw-SimpleShapes.py

Learn About Steps
Things to try

Draw Triangle and Mouse Input

Edit the program fields/graphics/4-drawTriangle.py
Open a terminal move to the "fields/graphics" folder and enter:


    python3 4-drawTriangle.py

Learn About Storage
Learn About Values
Things to try

Draw Line

Edit the program fields/graphics/5-drawLine.py
Open a terminal move to the "fields/graphics" folder and enter:


    python3 5-drawLine.py

Learn About Flow
Learn About Loops
Things to try

Draw Rectangle

Edit the program fields/graphics/6-drawRectangle.py
Open a terminal move to the "fields/graphics" folder and enter:


    python3 6-drawRectangle.py

Learn About Functions
Things to try

Game

The game folder requires installing the "pygame" package.

Airport with Birds

Edit the program fields/game/1-airport.py
Open a terminal move to the "game" folder and enter:


    python3 1-airport.py

Things to try
Learn About Images Learn About Steps

More Advanced:
Learn About Storage
Learn About Values
Learn About Flow
Learn About Loops

Dolls

Edit the program fields/game/2-dolls.py
Open a terminal move to the "fields/game" folder and enter:


    python3 2-dolls.py

Edit the program fields/game/5-dolls-scenes.py


    python3 5-dolls-scenes.py

Edit the program fields/game/6-dolls-scenesObj.py


    python3 6-dolls-scenesObj.py

Things to try

Bugs

Edit the program fields/game/3-bugs.py
Open a terminal move to the "fields/game" folder and enter:


    python3 3-bugs.py

Things to try
Learn About Images

Tickle

Edit the program fields/game/4-tickle.py
Open a terminal move to the "fields/game" folder and enter:


    python3 4-tickle.py

Learn About Sound

Graphs

Web

These demos can be run by double clicking on the html file, or by running "sensible-browser" in a terminal

Display a Comic

Move to the "web" folder and double click on the "1-page.html" file.
To edit the html file from a folder, right click on the html file and choose an application like "Text Editor" or "Notepad".