Skip to content

Commit

Permalink
revision and creator first content complete
Browse files Browse the repository at this point in the history
  • Loading branch information
brettfiedler committed Feb 29, 2024
1 parent 5abbae8 commit 72acfa6
Show file tree
Hide file tree
Showing 84 changed files with 414 additions and 263 deletions.
80 changes: 25 additions & 55 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,70 +1,40 @@
# Paper Playground
# Paper Playground Docs branch

[![Documentation](https://img.shields.io/badge/documentation-website-yellow?logo=markdown&logoColor=yellow)](https://phetsims.github.io/paper-land/)
[![Matrix Server](https://img.shields.io/badge/matrix-chat-green?logo=matrix&logoColor=green)](https://matrix.to/#/#interactive-paper-programming:matrix.org)
[![Youtube Channel](https://img.shields.io/badge/youtube-channel-red?logo=youtube&logoColor=red)](https://www.youtube.com/@PaperPlaygroundCommunity/)
[![License](https://img.shields.io/github/license/phetsims/paper-land?color=blue)](./LICENSE)
This is a branch of Paper Playground dedicated to the MkDocs documentation website.

![logo](docs/assets/hand-with-dots.png)
## MkDocs

## Interactive Play Meets Multimodal Web Experience
Our documentation uses Mkdocs and is statically deployed with a pre-configured plugin (mkdocs-gh-deploy) for Mkdocs to GitHub Pages.

Paper Playground is an open-source project for collaboratively creating multimodal web experiences by means of mapping JavaScript* code to real pieces of paper and manipulating the code in your **physical space**.
The built website is created on the `gh-pages` branch.

(*written directly or using a no/low-code component-style interface!)
mkdocs.yml is a required file and sets up the navigation tree and theme for the website.

**We aim to support a community interested in bringing physical interaction as a means to collaboratively solve problems in codesigning virtual technology**.
## MkDocs Theme
This build makes heavy use of the MkDocs theme, [Material for MkDocs](https://squidfunk.github.io/mkdocs-material/setup/). Use the Setup and Reference pages to add customized content.

Paper Playground is based on the [Paper Programs](https://paperprograms.org) open-source project and has been extended to incorporate the library stack used by [PhET Interactive Simulations](https://www.github.com/phetsims/community) as a convenient 2D scene creator and manager. The project focuses on enabling quick prototyping of web projects, with a particular emphasis on easy addition of audio features (like sounds and sonifications), speech description (both TTS engines and screen reader-like descriptions), and other non-visual features that are often difficult to design and develop alongside visual elements in these projects.
## How to Make Changes

The ideas behind Paper Playground are simple, but the possibilities are infinite.
**Commiting to the docs branch will kick off GitHub Pages to run a deploy Action, automatically build, and push to the gh-pages branch. (see [workflow](./.github/workflows/page-deploy.yml))**

1. Create programs, as many as you would like, to represent your project.
2. Map data variables, parameters, and functions to paper position, size, shape, rotation, proximity, and use optional marker positions for more functionality.
3. Print out the dot-covered papers that belong to those programs.
4. Put those *paper programs* in front of a webcam.
5. Watch and interact with the output of that code in your browser.
6. Move programs around and trigger the mappings between your papers position in space and your code!
7. Change your program code, make new papers, and keep the creativity going!
### GitHub Website

![Paper Playground setup detecting paper programs that create a moon lander and control vertical thrust](/docs/assets/full-interface.png)
Make changes directly through GitHub with direct edits or pull requests.

## Installation
(See [Contributing Guidelines](./docs/CONTRIBUTING.md))

See the [Paper Playground Docs website](https://phetsims.github.io/paper-land/setup/install/) for the most up to date installation instructions.
### Local Machine
To edit (and optionally deploy) to the documentation website from a local machine (same steps GitHub Actions does):
- Install Python (3.11 last supported at deploy)
- Install module requirements using `pip install`. Install using the requirements.txt file in this directory.
- Bare minimum as of 2/21/2024:
- `pip install mkdocs-material=="9.5" mkdocs-minify-extension`
- run `mkdocs serve` to locally host the directory and preview changes in real-time in your browser.
- Commit and push changes to `docs` branch
- `git add .`
- `git commit -m "your commit message"`
- `git push origin docs`
- If deploying from your local machine: run `mkdocs gh-deploy` and it will automatically build and push to the gh-pages branch and kick off GitHub Pages to run a deploy Action.

![Paper Playground setup detecting paper programs that create a moon lander and control vertical position](/www/web-assets/lunar-lander-craft.gif)

## What is coming?

Our team is focused on a few large initiatives for integrating other projects into Paper Playground and for making it more friendly for non-technical, non-JavaScript users and designers.

⭐ If these projects interest you, please [join our community](https://phetsims.github.io/paper-land/community/) and take part in the development and discussion!

1. :unlock: Creator Interface: Abstracting the JavaScript code through means of a no/low-code component style interface that assembles the data components of your programs and highlights the relationships between your programs (e.g., At a quick glance, what information is needed and passed between programs?). **Check out our progress by opening the Creator page in the tool!**
2. :robot: AI Support: Using LLMs to support a user answer the question: "How do I turn my idea for a multimodal interactive into data variables, functions, and entire programs?". **We are working toward this goal by adding an optional AI assistant inside the Creator page to help generate custom JavaScript code for more complex functions!**
3. :outbox_tray: Easier API integration for paper programs to control or output to other browser displays (besides our [scenery](https://github.com/phetsims/scenery)-focused Board and the legacy canvas-focused Projector), as well as new inputs such as microcontroller integration via Bluetooth and WebSockets. See our [example with the Weavly educational coding project](https://youtu.be/eZo0asFXJz4?si=xiexw7O04gPZW_Sc)!

However, there are **many other areas** that the project can be expanded (see Community below for Contributing guidelines and suggestions)!

## :earth_asia::earth_americas::earth_africa: [Join our Community!](https://phetsims.github.io/paper-land/community/) :earth_asia::earth_americas::earth_africa:

## :clipboard: Roadmap

### Docs
:books: Updated setup and tutorial!

### Tool
:page_with_curl: More examples in the hosted database highlighting the power of multimodal design!

:computer: A UI for creating basic Papers without deep JavaScript knowledge!

:robot: Investigating use of LLMs to help users go from ideas to your suite of paper programs!

## License

This software is licensed under the MIT license. For more information, see the [LICENSE](https://github.com/phetsims/paper-land/blob/main/LICENSE) file.

## Acknowledgments

This tool was adapted from [Paper Programs](https://paperprograms.org/) by JP Posma, which was inspired by the work at [Dynamicland](https://dynamicland.org).
14 changes: 0 additions & 14 deletions docs/docs-deploy.txt

This file was deleted.

2 changes: 1 addition & 1 deletion docs/requirements.txt
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ mkdocs==1.4.2
# -r docs/requirements.in
# mkdocs-material
# mkdocs-minify-plugin
mkdocs-material==9.1.13
mkdocs-material==9.5
# via -r docs/requirements.in
mkdocs-material-extensions==1.1.1
# via mkdocs-material
Expand Down
Loading

0 comments on commit 72acfa6

Please sign in to comment.