Home
Welcome netizens to the netnet.studio wiki! Here you'll find general info on what netnet is and how it works, as well as guides for how to contribute to the netnet.studio repo.
We like to say that netnet is an AI-TA (artificial intelligence teaching assistant).
For those just getting started on their creative coding journeys netnet is here to help you navigate the studio's various edu materials (hypermedia tutorials, interactive examples/demos and various other guides/references). netnet is also a fairly functional realtime code editor in it's own right (with unique beginner-focused helpers), which can be used to sketch/experiment and can even connect to your GitHub account to host/publish sketches and projects.
For creative coding educators netnet can be leveraged in a variety of ways: as an online studio for implementing a "flipped-classroom" model; it can also be used to create and share simple code examples with students, which not only include all of netnet's beginner-focused helpers, but also the ability to create interactive code annotations; we're also working on tools to make it easier for other educators to create and contribute their own hypermedia tutorials!
- Learning: [NEEDS UPDATING]
- Sketching: part of what makes netnet tutorials so interactive is the fact that you can pause the video and directly edit/experiment with the code at any time. This is because we've built an entire code editor into netnet with all the standard features of a modern code editor as well as all sorts of additional features geared towards beginner creative coders!
- Data Privacy: [NEEDS UPDATING]
- Anatomy of a netnet URL: you'll find netnet's one and only "page" (SPA) here: https://netnet.studio, but there's loads of ways to to view that page and preload it with examples, sketches and tutorials.
If you'd like to help us work on the project, you'll of course need a GitHub account before getting started. Some contributions are easy to make directly on GitHub (like editing netnet dialogue), but most will likely require you setup a local environment so you can work on code in your preferred editor on your computer.
- Setting up a local environment: how to setup the repo and run the server locally, as well as some other general development notes.
- Project Architecture: overview on how the code in this repo is organized and our thoughts behind it.
- Creating Dialogue: netnet's dialogue system is what handles it's text bubbles that show up when interacting with netnet. this doc explains how it works, how to edit dialogue (to fixing grammar or spelling for example) and how to create new dialogue (to accompany a widget for example).
- Creating Widgets: netnet's widget system is used to create all the various windows that pop up, from information boxes like the privacy policy to full blown code generators like the color widget.
- Creating Examples and Tutorials: netnet includes hidden "meta-widgets" for creating shareable code examples and hypermedia tutorials (like those found in netnet's Learning Guide).
- GitHub Integration: [NEEDS UPDATING]