# Work Preview Area

The Work Preview Area consists of 12 small modules: Canvas, Scene View, Horizontal/Vertical Screen Editing Mode, Multi-language Preview, Play the Scene, Quick Layout,Preview Size, Quick Positioning,Help Center, Package Size Estimate, Canvas Ruler, and Reference Lines.

This area is the most essential operational area in the Content editor.

(Note: “Quick Layout” only appears in Content Creation of some templates.)

<figure><img src="/files/lVGIHW9mEQIDKZjkH3qy" alt=""><figcaption><p>Work Preview Area</p></figcaption></figure>

## <mark style="color:blue;">Basic operation of canvas</mark>

💡The resolution of the canvas is **750x1334**, and when designing, ensure all elements are fully displayed within the canvas. (Assets like background images can extend beyond the canvas. Related reading:  [Screen adaptation](/playable-tools-content-editor/content-editor-user-guide/editing-page-module-intro/parameter-setting-area/screen-adaptation.md)  [Creation Tips - Adaptation](/playable-tools-content-editor/content-editor-creation-tips-center/common-creation-tips/creation-tips-adaptation.md)).

* Click to select a layer.
* After selecting a layer, you can directly drag it to adjust its position.
* After selecting a layer, you can resize it by dragging the small squares at the corners (holding the Shift key while dragging maintains the aspect ratio).
* You can drag-select multiple layers by dragging on the canvas. Hidden or locked layers cannot be included in the drag-selection.
* Grouped layers have a higher priority of selection than the individual elements within the group.
* <mark style="color:red;">To select elements within a group,</mark> <mark style="color:red;"></mark><mark style="color:red;">**double-click**</mark> <mark style="color:red;"></mark><mark style="color:red;">to activate the group before selecting the elements. Once a group is activated, the current group cannot be selected again.</mark>

<figure><img src="/files/BG641uo2UVXCmm9PJgt8" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://doc.playturbo.com/playable-tools-content-editor/content-editor-user-guide/editing-page-module-intro/work-preview-area.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.