Skip to content

Project List

raclim edited this page Feb 6, 2023 · 11 revisions

Project List

+ Add ability to make sketches private

Captured as processing/p5.js-web-editor#91. Currently, all projects are public. This project would allow users to make sketches private if they chose. A possible advanced feature could authorize certain users to see a sketch.

  • Expected Outcomes: a public/private switch for all sketches
  • Skills Required: JavaScript, HTML, CSS, Github
  • Possible Mentors: Rachel Lim
  • Difficulty: Easy

+ Adding Test Coverage

Currently the framework exists for adding tests, using Enzyme and Jest. This is a great project as it would make contributing to the web editor easier, and is self-contained and modular, which makes it easy for a variety of skill levels to work on it.

  • Expected Outcomes: Testing files added to web editor repository
  • Skills Required: JavaScript, HTML, CSS, Github
  • Possible Mentors: Rachel Lim
  • Difficulty: intermediate

+ Internationalization and Localization

Currently the p5.js website supports translations for Spanish and Simplified Chinese; however, the web editor includes no translations. This project would add the framework for adding internationalization, and add the mostly finished translations for Spanish.

  • Expected Outcomes: Integration of a React internationalization library, and addition of one translation
  • Skills Required: JavaScript, HTML, React, Github
  • Possible Mentors: Rachel Lim
  • Difficulty: intermediate

+ Mobile/Responsive Design Implementation

Currently, there exists designs for mobile/responsive views that have not yet been implemented. This project would consist of implementing a subset of these views.

  • Should the focus be on sharing, editing, or both?
  • What does a simplified version of the editor look like that works on mobile?
  • What are iterative steps to get here?
  • Offline mode could help with this.
  • Expected Outcomes: Improved functionality of web editor on tablets and phones

+ Asset Uploading Improvements

The web editor supports the usage of images, videos, and other assets. There are a few open tickets to improve this workflow:

+ Library Management

One of the oldest tickets, p5.js-web-editor#4 allows users to upload and manage different libraries as part of their sketches.

  • Expected Outcomes: A UI for managing library dependencies
  • Skills Required: JavaScript, HTML, React, CSS, Github
  • Possible Mentors: Rachel Lim
  • Difficulty: advanced
  • Tasks
    • What does it look like in the sidebar? Are p5 files under "Sketch Files" or in a "Resources" section?
    • What does the modal overlay look like to add a library?
    • Filter/Search? List of p5 libraries + (Tone.js and ml5.js) above adding a separate library
      • are their other libraries people use with p5 often?
    • Should we edit the HTML file? If so, how?
      • how do we tell the user that the web editor is programmatically changing their file?

+ Development Contribution Improvements

  • Design principles document, as reference p5.js design principles
  • Issue label management, and an actual system
  • Developer/Designer Outreach
  • File Structure Documentation
  • How to prioritize and brainstorm features?

+ Interface

  • Design principles document/system for adding

+ Accessibility

  • Reviewing current state of app for keyboard users
  • Reviewing functionality with p5.accessibility library
  • Color contrast review (there are some open issues)

+ Offline Mode

Use p5.js Web Editor offline.

  • Uses service worker/Offline Web Applications API
  • Uses localstorage via localforeage.
  • Explore Chrome Extension or Mozilla Add-ons

Autocomplete

  • How to make this work in Codemirror? See Jen Kagan's previous work.
  • This should be a preference item that users can turn off if they choose.

Integrated Reference

  • Reference that doesn't require going to the p5.js website. This could be autocomplete, or it could be within the editor in a different way.

Code Refactoring Ideas

  • Break apart large components
  • Figure out what should be in Redux and what should not be in Redux
  • Fix deeply nested callbacks in server-side controllers.

Rearrange files within Sidebar

  • Be able to move files within folders

Sketch and Collection Thumbnails

  • create pictures from canvas
  • how to keep down hosting costs?

Searching Global Users, or maybe creating groups

  • some way to search users across the application
  • or maybe know about a group of users, say within a class? but also, don't want to recreate a learning management system