Skip to content

New experiment: Content Generation #297

Description

@jeffpaul

Feature Overview & Value

Summary: This feature allows users to generate full post content or expand upon specific ideas directly within the Block Editor as a native "Co-authoring" experience. The AI should assist in drafting content based on the post title or user prompts, effectively curing "blank page syndrome."

Why it matters: Starting a post is often the hardest part of creating content. By allowing users to generate a "First Draft" or expand a set of bullet points into prose, we significantly reduce the time-to-publish.

Use Cases

The "Zero to One" Draft: A user has a Title ("Top 10 Trends in AI") but an empty body. They click "Generate Draft" to get a structured outline and introductory paragraphs.

Section Expansion: A user writes a subheading or a bullet point and asks the AI to "Write a paragraph about this."

Tone Adjustment: A user selects a paragraph and asks the AI to "Make this more professional" or "Shorten this."

User Interaction Flow

1. Entry Points

Empty State (The "Kickstarter"): When a user creates a new post and the content body is empty, a visible "Generate Draft" button appears in the main content area (similar to the "Start writing or type / to choose a block" placeholder).

Toolbar Action: A permanent "AI Assistant" icon (Sparkle? Open to other, better options here) is added to the top Gutenberg toolbar. Clicking it opens a small input panel to provide instructions (e.g., "Write a conclusion for this post").

Slash Command: Users can type /ai in a paragraph block to trigger the generation prompt inline.

2. The Generation Process

Input: The user provides a prompt or confirms the use of the Post Title as the prompt.

Context: The system sends the Post Title and any existing content (up to the token limit) to ensure the generated text stays on topic.

Streaming: The content streams into the editor in real-time (if supported by the provider) or shows a "Generating..." skeleton state.

3. Review & Acceptance

Block Integration: The output is rendered as native WordPress blocks (Paragraphs, Headings, Lists).

Undo/Keep: A floating toolbar appears above the newly generated content:

  • Keep: Removes the UI and commits the blocks.
  • Try Again: Re-runs the prompt.
  • Discard: Removes the generated blocks.

Technical Requirements

Supported Providers:

  • Must support text-generation models via the standard AI Client (OpenAI, Google, Anthropic).

Output Formatting:

  • The AI must be prompted to return Markdown or HTML that acts as a valid intermediary for Gutenberg blocks (unless WP markup is feasible).
  • The system must parse this output and convert it into actual Block Objects before inserting it into the editor (unless WP markup is feasible).

Authentication (Just-in-Time):

  • If the user clicks "Generate Draft" and no provider is connected, trigger a Connectors Component immediately (if available), else display an error message and direct folks to Settings > Connectors.

UI Mechanics & Component Definitions

1. The "AI Command Bar" (Toolbar Action)

  • Behavior: When the "Sparkle" icon in the top toolbar is clicked, open a Popover / Command Bar centered below the icon (similar to the Link control or Spotlight search).
  • Anatomy:
    • Input Field: Multi-line text area with placeholder "Describe what to write..."
    • Context Pill: A small tag showing what the AI is reading (e.g., "Context: Post Title" or "Context: Selected Block").
    • Action Button: "Generate Draft" (Primary) and "Cancel" (Secondary).
    • Presets (Optional): Small chips below the input for common tasks: "Write Intro", "Outline", "Conclusion".

2. The "Rewriter" (Inline Selection)

  • Trigger: When a user highlights text, the native Gutenberg hovering toolbar appears. Add an "AI Edit" button to this toolbar (alongside Bold, Italic, Link).
  • The Interface: Clicking "AI Edit" opens a strictly inline dropdown with options:
    • Quick Actions: "Shorten", "Expand", "Fix Grammar", "Change Tone..." (note this relates to the Content Resizing functionality and Tone Adjustment controls).
    • Custom Prompt: A small field to type instructions (e.g., "Make this sound more like a pirate").
  • The "Diff" State: When the AI rewrites text, do not just replace it instantly.
    • Proposed UX: Show the new text highlighted in a subtle color (e.g., light purple) with a "Accept / Reject" tooltip floating above it.

3. The "Streaming" State

  • Visuals: As content is generated, use a "Ghost Typing" effect.
  • Cursor: Show a distinct AI cursor or a "sparkle" animation at the end of the streaming text to indicate it is active.
  • Stop Button: The Command Bar must change to a "Stop Generating" button during this phase.

Credits

Props to @linawiezkowiak, @lwoodmansee, and @rachaelcortellessa for the product definition, and @dkotter for technical review.

Metadata

Metadata

Assignees

Labels

No fields configured for Enhancement.

Projects

Status
Backlog

Relationships

None yet

Development

No branches or pull requests

Issue actions