Page Layouts

[machuu]

Sketches/Wire Frames of Main Editor UI/UX

[machuu]

Matt's initial layout

This is for desktop layout. Mobile layout would have an expandable top bar to use Project/Scene/Card menus.

• Main area of Page is the Text Editor, with minimal distractions
  • Large Text Editor
  • Save Button
  • Config/Settings Button
• Top of Page is Site Navbar. from left -> right:
  • Project Selector
  • Current Project Name
  • Settings (editor config, account info)
• Left side is Scene Navigator
  • Collapsible sidebar
  • Populated with list of Scenes
  • Button to create a new Scene
  • Each Scene has a "three-dot" button to edit Scene Config
  • Clicking a Scene loads it in the Text Editor
• Right side is Card Navigator
  • Collapsible sidebar
  • Populated with list of Cards
  • Button to create a new Card
  • Each Card has a "three-dot" button to open Card in Edit Mode
  • Clicking a Card opens a floating window with Card in Read Mode