The Pytch web app

TODO: Fill in structure of below.

The Pytch web app has three main areas:

• The code editor, where you write the Python code for your project.

• The stage, which is very much like Scratch’s stage, and is where your project runs.

• The information area, which allows you to work with your project’s images or sounds, and also shows you any text output your project prints, and any errors your project encounters. If your project is following a tutorial, the tutorial content is part of the information area too.

TODO: Screenshots, more details.

• Working with graphics and sounds, or a tutorial, ‘wide info pane’ is more useful layout

• Once working mostly with code, ‘tall code editor’ layout more useful

Resizing the stage display

When in ‘wide info pane’ mode, you can drag the horizontal divider (separating the code editor and stage above from the info pane below) up to make more room for the info pane, or down to see the stage more clearly.

If you click on the already-active layout selection button, the stage size is reset to its normal size.

Whatever size the stage is displayed on your scree, as far as Pytch is concerned, the centre of the stage is always at (0, 0), its bottom-left corner is always at (-240, -180), and its top-right corner is always at (240, 180).

TODO: This needs to be more discoverable.