A Playbook for Block Style Editor (BSE): Text Styling, Block Components, Misc Functions & Theme Switcher
Block Style Editor
;Block Structure Editor
; New-Gen Editor
; WYSIWYG Markdown Editor
; Modular Visual Components
; Structured Content
; Web-based Text Editor
; Rich Content Editor
; CMS
;
-
Background of Block-Style Editor:
- Markdown, for its high readability and simple syntax, has been adopted widely; Pure Markdown editing is WYSIWYM
- Most Web-based RTF editors follow WYSIWYG interaction pattern
- Block Style Editors provide a Markdown-like but WYSIWYG editing experience
- On UX and interaction level, BSE provides a similar experience to Typora, MarkText, but with integrated Mini-App Blocks
-
Features of Block-Style Editor:
- Follow a structure of [ Markdown (Template) + CSS + Fonts ]
- Inherent the text styling rules of Markdown, keep its simplicity and content-focusing approach; Remove features like: line spacing, font size, font color
- Expand text editing into Text Editing & Styling and Mini-App Customization
- Mini-App Blocks: table, image container, advanced code block, prefabricated UI view, embeds.
- A web-based Content Editor that, take Interactive Document and Modular UI as guideline, use Block / Paragraph as content unit, use Markdown as its Template Structure.
Block-Style Editor has its roots in CMS(content management system), SSG (static site generator), GitHub& Markdown, MDX, JSX, and Low-code Site Building.
In a sense, a Block Style Editor is a Modular CMS for web document use case.