> For the complete documentation index, see [llms.txt](https://doc.playturbo.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://doc.playturbo.com/playable-tools-content-editor/content-editor-user-guide/editing-page-module-intro/work-preview-area.md).

# 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>

#### Q: Why can't I select certain layers/assets directly on the canvas?

**A:** If multiple layers share the same position and size, or if a larger layer on top overlaps the layers beneath it, only the topmost layer can be selected directly on the canvas.

To edit an overlapped layer, select the corresponding layer from the Layers panel on the left.

[Layer Area](/playable-tools-content-editor/content-editor-user-guide/editing-page-module-intro/layer-area.md)

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