57 lines
1.4 KiB
Plaintext
57 lines
1.4 KiB
Plaintext
@startuml artifact-editor-design
|
|
!theme plain
|
|
|
|
skinparam backgroundColor #f5f5f5
|
|
skinparam component {
|
|
BackgroundColor #e1f5ff
|
|
BorderColor #01579b
|
|
}
|
|
skinparam rectangle {
|
|
BackgroundColor #f3e5f5
|
|
BorderColor #512da8
|
|
}
|
|
|
|
rectangle "Artifact Editor MVP - Design Layout" {
|
|
component "Left Panel (50%)" as left {
|
|
component "Text Editor" as editor
|
|
note right of editor
|
|
PlantUML syntax
|
|
Syntax highlighting
|
|
Line numbers
|
|
Error markers (red underlines)
|
|
end note
|
|
}
|
|
|
|
component "Right Panel (50%)" as right {
|
|
component "Visual Canvas" as canvas
|
|
note right of canvas
|
|
Live preview
|
|
Selection handles
|
|
Draw mode affordances
|
|
Error indicators
|
|
end note
|
|
}
|
|
|
|
component "Bottom Bar" as controls {
|
|
component "Render Button" as render
|
|
component "AI Generate" as ai
|
|
component "Voice Input" as voice
|
|
component "Save" as save
|
|
}
|
|
}
|
|
|
|
editor -down-> canvas: "Bidirectional Sync"
|
|
canvas -down-> editor: "(critical requirement)"
|
|
render -up-> editor: "Update"
|
|
render -up-> canvas: "Update"
|
|
ai -up-> editor: "Generate code"
|
|
voice -up-> editor: "Transcribe → code"
|
|
save -up-> editor: "Output ARTIFACT_SAVED"
|
|
|
|
note bottom of controls
|
|
Clear visual affordances
|
|
Consistent with orchestrated-discussions styling
|
|
Keyboard shortcuts for power users
|
|
end note
|
|
|
|
@enduml |