p5.js Web Editor Mission Statement Process

What is important to the P5.js web editor?

Quick Overview

Here we list a few key ideas we wanted to highlight around the editor, its relationship to p5.js, and some key features relating to usability and sustainability.

Community / Contribution
- Developer docs finalization
- How to get contributions outside of internship/payment
- How to advertise contributors?
- Finding morally sound ways to ask for help from community.
Interface
- Style Guide
- System for choosing whether to add something
- How to add something (contributors).
- Accessibility Features (P5 accessibility library)
Features / Engine
- How to prioritize features?
- How to brainstorm them?
- How to source them from community
- Make ideas accessible. If I want to contribute, how do I pick something up? (Similar fashion to p5.js issues? Issues can be too granular...)
  - Office hours?
Features to Add
- Library Management / Addition
- Offline Mode / Desktop App Electron / Cordova / Phonegap
  - Local networking?
  - Physical Computing?
- Mobile Friendly
- Making custom instances of the editor
- Sound Recording in Editor?
- Asset library / Default image and sound assets?
- Internationalization / Localization
- Making the web editor API public
- Sketch Collections.
- Beginner Friendlify?
- Auto Complete
- Inline-Reference
- Exporting to application
Project Management and Sustainability
- Controlling Hosting Costs
  - Spinning own instance / decentralization.
  - Schools pay for things like hosting custom server? (Look at discourse).
  - Can we make a Dat / Github Pages version that absorbs most users?
How is the editor different to p5.js?
Entry point
No frills, simplicity is key.
Sharing p5 sketches, “you know it’s a p5 sketch.”
- “Community Constraint”
  - Ton of advice, don’t know where to start? P5 is good because it’s constrained... You’re writing p5 and only p5. You have a path forward.
  - It’s not a portal.
    - There are other tools for that.
It shouldn’t be hard to switch from the editor to VS Code or other, or vice versa.

P5.js Web Editor Mission Statement

Notes on the mission statement. What should we include? What’s important from a design/development perspective?

The Name?
- Does the editor need it’s own name
- Is it too wordy
- P5.js gives it a good association, but is this association complicating things in any way.
- Does it need “web”. Just P5-editor
The p5.js Web Editor is an in-browser editor for creative coding, specifically for writing p5.js sketches.
- Not strong enough
- Doesn’t explain what the web-editor is?
- When you see this sentence, you have to explain what p5.js is.
- Does this need to explain how it is different from other editing environments.
p5.js, a separate open source project, is a JavaScript library with the goal of making coding accessible for artists, designers, educators, and beginners.
- The web editor exists to support p5.js
- It has the same mission
The web editor shares the same spirit as p5.js
It is designed with the beginner in mind.
- No distraction
- No Frills
- No interface confusion
When using the web editor, you don't need to download or configure anything, you can simply open the website, and start writing code.
- Part of the “other environments” comparison.
- Being able to open the editor and start is vitally important
- “You can’t get started wrong”.
- You are going to make a p5.js sketch.
You can also host your work online and share it with others
- Sharing easily is important
- Remixing is an important part to the sharing process
- Not portalesque. (Not codepen/scratch/newgrounds)

Existing Editors

Here we list some notes on existing web and desktop editors. How do we compare? What do we like? What doesn’t work for us?

Jsbin
jsfiddle
Repl.it
Code Sandbox
- Templates
- Geared at professional
Code Pen
Iodide
observable
Glitch.com
- Focus on building community
- Focus on Remixing
- Website directs you to do a lot of different things
  - Invokes “What do I do?”
  - Getting to the part where I edit a project is hard.
  - Immediately distracted
That angular editor
Brackets
- Focused on editing/code creating
- User experience in brackets is similar to web-editor / High focus on html/css
- Takes away bullshit of setting up server
Eclipse
- FRILLS GALORE
- Has everything, and does everything for you
- Requires base knowledge
Atom
VS Code
Openprocessing
https://bl.ocks.org/

Mission Statement / Overview Drafts

P5.js Web Editor Original Mission:

Hello! The p5.js Web Editor is an in-browser editor for creative coding, specifically for writing p5.js sketches. p5.js, a separate open source project, is a JavaScript library with the goal of making coding accessible for artists, designers, educators, and beginners. The web editor shares the same spirit as p5.js–it is designed with the beginner in mind. When using the web editor, you don't need to download or configure anything, you can simply open the website, and start writing code. You can also host your work online and share it with others.

P5.js Editor Mission Statement Luca Draft 1:

There shouldn’t be a wrong way to start working with p5.js.

**The p5.js Editor is designed to make coding accessible to artists, designers, educators and beginners. **The editor shares the same spirit as p5.js, with a focus on simplifying the experience of creating p5 sketches for beginner audiences. It is designed to limit distractions, avoid confusion, and allow users to easily share their work online with others. Creators don’t need to download or configure anything to get started; just open the editor, and start writing code.

P5.js Editor Mission Statement Cassie Draft 1:

Hello! The p5.js Editor is a platform for creative coding, with the goal of making coding accessible for artists, designers, educators, and beginners. Simply by opening the website you can get started writing p5.js sketches, without downloading or configuring anything. All of your work is hosted online, which makes it easy to share your work or remix others’ work. It is free to use and open source. You can even host your own instance of the p5.js Editor, giving you full control of your data.

P5.js Editor Mission Statement Combined Draft 2:

The p5.js Editor is a platform for creative coding, with a focus on making coding accessible for artists, designers, educators and beginners. Simply by opening the website you can get started writing p5 sketches, without downloading or configuring anything. The editor is designed with simplicity in mind. The editor is free and open-source; you can even host your own version.

P5.js Editor Mission Statement Combined Draft 3:

The p5.js Editor is a platform for creative coding, with a focus on making coding accessible for artists, designers, educators and beginners. Simply by opening the website you can get started writing p5 sketches, without downloading or configuring anything. The editor is designed with simplicity in mind by limiting features and frills. We carefully consider every feature added, asking “who is this helping?” “who is this hurting?” and “is this needed?”. The editor is free and open-source; you can even host your own version.

P5.js Editor Mission Statement Combined Draft 4:

The p5.js Editor is a platform for creative coding, with a focus on making coding accessible for artists, designers, educators and beginners. Simply by opening the website you can get started writing p5 sketches without downloading or configuring anything. The editor is designed with simplicity in mind by limiting features and frills. We strive to listen to the community to drive the editor’s development, and to be intentional with every change. The editor is free and open-source; you can even host your own version.

P5.js Editor Mission Statement Combined Draft 5:

The p5.js Editor is a platform for creative coding, with a focus on making coding accessible for artists, designers, educators and beginners. Simply by opening the website you can get started writing p5 sketches without downloading or configuring anything. The editor is designed with simplicity in mind by limiting features and frills. We strive to listen to the community to drive the editor’s development, and to be intentional with every change. The editor is free and open-source because we believe software, and the tools to learn it, should be accessible to everyone.

You can even host your own version of the editor!

P5.js Editor Mission Statement Draft 6:

The p5.js Editor is a platform for creative coding, with a focus on making coding accessible for artists, designers, educators, beginners, and anyone else that wants to learn. Simply by opening the website you can get started writing p5.js sketches without downloading or configuring anything. The editor is designed with simplicity in mind by limiting features and frills. We strive to listen to the community to drive the editor’s development, and to be intentional with every change. The editor is free and open-source.

We also strive to give the community as much ownership and control as possible. You can download your sketches so that you can edit them locally or host them elsewhere. You can also host your own version of the editor, giving you control over its data.

Notes: Needs commitment to digital accessibility.

P5.js Editor Mission Statement Draft 7:

The p5.js Editor is a platform for creative coding, with a focus on making coding accessible for as many people as possible, including artists, designers, educators, beginners, and anyone who wants to learn. Simply by opening the website you can get started writing p5.js sketches without downloading or configuring anything. The editor is designed with simplicity in mind by limiting features and frills. We strive to listen to the community to drive the editor’s development, and to be intentional with every change. The editor is free and open-source.