EditorDesign.md

• For every feature, lay out at least one accidental "path" through which the user can stumble on this feature organically.

  • Express this path in a data structure that can be checked in CI.

• When browsing a hierarchy, make it really easy to quickly see the list of all parents

• Do not make the user make changes that they don't know how to cancel. (even without ctrl-Z)

  • Cancelling should generally be as easy as "Remove object I just created"

• Make "git diff" visible in object hierarchy

  • For instance, if an object has just been added, have a green outline on the left.

• Mark variables / object nodes as having a semantic representation, with hooks that are called when the variable is highlighted (like DOM nodes in Chrome Devtools).

• Gutters must have a common minimum width; to avoid the pain point where the user adjusts a gutter by eyeballing the current tab, but ends up adding a scrollbar to another tab in the same gutter

• Have "proposed actions" for newly added objects/resources. For instance, a newly added spritesheet can have the proposed action "Identify sub-sprites". Have a "I'm interesting!" pop-up icon (like the blue circle on github's bell) at first, which can be dismissed. Also have a "Proposed actions" right-click menu.

• Have objects in hierarchy be represented by dumb text format; that can be edited quickly with eg multi cursors and the like.

• Mouseover text should appear instantly

2D editor

• What should the user see when opening / creating a new 2D level.

  • What will be initially onscreen?
  • The whole level.
  • A general environment, LBP style?
  • Some kind of "room", to constrain the user?

• The scene hierarchy should already include an editable camera/viewport/screen node

• The viewport outline should be hidden and the coordinate base should be displayed differently when displaying a node which isn't a Root Scene. (eg when editing an enemy, you don't want the enemy to be shown on the top-left of the screen)

• When dragging click-and-dragging an item (or edge or corner) in 2D space, press Ctrl to temporarily zoom, Alt to unzoom.

• When running the project, the editor should include shortcuts to switch between views (eg camera that follows the player / bigger camera / entire world / free moving camera, etc), open devtools, pause the game, etc.

Video editor

Have cooperative online editing.

Have a "graph" of scenes/shots instead of just a timeline.

Populate the graph by pre-processing the rushes:

• Speech-to-text, correlate with the script
• Identify shots and scenes in rushes
• Identify multiple takes of the same shot, put them in parallel in the graph
• Identify backgrounds, actors, objects, add them as tags to the scenes
• Correlate sounds to associate audio with video (eg associate camera sound with sound from mike perch)

Have universal search that can select commands, filters, transitions, scripts, etc. Have text search that can search tags, speech-to-text output of video, etc, with some very fuzzy searching.

Text editor

• Ctrl-up = prev search result / prev empty line?

• Avoid clickable mouseover text, especially if getting from the initial pos to the clickable pos takes effort / precision

  • If clickable, have the "disappear-on-mouse-exit" hitbox be bigger than the image.

• Have a "refactor declaration" mode that restricts your cursor(s) to the decl(s) and tries to compute a linear list of changes from the text you make.

• select-to-next-word should include parentheses in a smart way (eg a way that's more likely to get matching parentheses when copy-pasting)

Tutorial mode

• Read-only

  • Or is it?

• Zelda-style textboxes appear at the bottom

• Shortcuts to move to prev/next textbox

• A green effect highlights the current interesting section; a shortcut switches focus to that section (with a small "wave" effect to say "I'm here"). For instance, if the tutorial is editing an object's property, the matching property field has a green background color; the "Properties" tab is also green-colored.

  • How do you show that something has been removed?

• See also Roll20 tutorial

Command system

• Be able to quickly browse through scene parameters in a single command; eg

print (scene.enemies[0].health)

Visual map

Have a visual (as in, a .png) map of the entire codebase.

That map is use to represent code items visually, eg:

• In stack traces
• In find-and-replace results

(intended for big screens / multi screens)

Use wordpress-style auto-generated avatars associated to each function / class / etc.

Be able to create a map for a stack trace copy-pasted from outside.

Visual debugging

• For some functions/methods, have a "canonical" command or build preset, and present it in a discoverable way, to quickly test the function/method -> When a newbie experiments an picks that canonical command, it should be signaled very clearly that the function's inner code is being demonstrated.

Remote control

Have a editor-remote-control app for Ipad, with additional data

debugger-remote-control for devtools?

Other

TODO: write/find text editor benchmarks (eg how long to open a 1GB text document, etc)

Write/find test suite for text navigation (ctrl+arrow, home/end, etc) Write/find test suite for menu navigation (ctrl+arrow, home/end, etc)

• Text editor idea: slightly different per-project color