企业官网建设流程全解析

ScreenArc 是一款跨平台屏幕录制与视频编辑工具，它的画框美化功能可以一键切换 16:9、9:16 与 1:1等画框比例，帮你把录屏内容轻松适配到YouTube、TikTok、Instagram 等各大平台。本指南将带你从零完成比例切换、背景美化与电影感圆角阴影的设置，几分钟就能做出专业的视频画框。

为什么需要切换画框比例

不同平台的"黄金画框比例"各不相同。同一个录屏，如果比例不对，发出去就会被裁切或留黑边。ScreenArc 在录制前就让你选定目标比例，从源头保证构图正确，省去后期二次裁剪的麻烦。

💡 比例类型在 src/types/index.ts 中定义，共 5 种可选，覆盖主流社交平台。

一键切换画框比例的步骤

切换比例不需要任何计算，整个过程只需两下鼠标：

1. 进入编辑器，在顶部预览控制栏找到Aspect（比例）下拉框。
2. 从16:9 Landscape、9:16 Portrait、1:1 Square等选项中直接选择目标比例。
3. ScreenArc 会自动重算画布尺寸，让输出分辨率贴合你的屏幕并保持目标比例，同时保证宽高为偶数以兼容视频编码器。

这套"选择即重算"的逻辑由 src/store/slices/frameSlice.ts 中的setAspectRatio与recalculateCanvasDimensions共同完成，全程零手工干预。比例选择器的界面代码见 src/components/editor/PreviewControls.tsx。

为画框选择精美背景

录屏内容之外的空白区域，就是画框的"舞台"。ScreenArc 提供了4 种背景类型，在右侧面板的 Background 分组里通过标签页即可切换：

• 🖼️Wallpaper（壁纸）：内置一套高清壁纸，点一下缩略图即可套用，是营造氛围感最快的方式。
• 🎨Color（纯色）：16 个预设色板 + 自定义取色器，适合极简风。
• 🌈Gradient（渐变）：起点/终点双色 + 10 种渐变方向，做出柔和的过渡背景。
• 📷Image（自定义图片）：上传本地 PNG / JPG / GIF（10MB 以内），完全自定义。

背景面板的完整交互见 src/components/editor/sidepanel/BackgroundSettings.tsx。无论是科技感的光束、自然的雪山，还是大气的沙漠，都能找到合适的素材。

调出电影感的圆角、阴影与边框

真正让录屏"高级"起来的，是画框本身的细节。FrameEffects 分组把参数拆成三个可折叠面板，每一项都带一键复位：

把这些参数组合起来，画面就会像悬浮在背景之上的一张"电影卡片"，这正是 ScreenArc 主打的 cinematic 效果来源。字段定义见 src/types/index.ts，交互实现见 src/components/editor/sidepanel/FrameEffectsSettings.tsx。

导出前检查清单

• ✅ 比例与目标平台一致（横屏16:9/ 竖屏9:16/ 方形1:1）。
• ✅ 背景与内容风格协调，无刺眼配色。
• ✅ 圆角、阴影、边框已按品牌基调微调。
• ✅ 预览区确认画面无黑边、无意外裁切。

更多功能与使用说明，可参考 README.md 与 docs/ 目录下的项目文档。

小结

ScreenArc 的画框美化把"比例 + 背景 + 圆角阴影边框"三件事整合进一个可视化界面：一键切换 16:9、9:16 与 1:1适配 YouTube 与 TikTok，再用内置壁纸、渐变或自定义图片铺底，最后加上电影感圆角与投影，就能快速产出一支专业的平台化视频。上手只需几步，效果立竿见影。✨