UI Preview 设计稿手机预览

About this plugin

介绍

UI Preview 是一款专为设计师打造的 Figma 插件，可以快速将设计稿导出并上传到腾讯云 COS，生成手机预览链接。让设计评审和真机预览变得简单高效，无需繁琐的手动导出和文件传输。

功能说明

1. 一键导出上传：选中画板后，一键导出并上传到腾讯云 COS，自动生成预览链接
2. 多倍率支持：支持 1x、2x、3x、4x 四种导出倍率，满足不同屏幕密度需求
3. 文件管理：内置 COS 文件浏览器，支持文件夹创建、文件删除、目录导航等操作
4. 灵活配置：支持自定义上传路径，可为不同项目设置独立存储位置
5. 即时预览：生成的链接可直接在手机浏览器中打开，实现真机预览

使用方法

1. 点击右上角"设置"按钮，配置腾讯云 COS 参数（Bucket、Region、SecretId、SecretKey）
2. 在 Figma 中选中需要导出的画板
3. 选择导出倍率（推荐 3x）
4. 点击"导出并上传所选画板"按钮
5. 等待上传完成，复制生成的预览链接
6. 在手机浏览器中打开链接即可预览设计稿

注意事项

1. 需要提前开通腾讯云 COS 服务并获取访问密钥
2. 确保 COS Bucket 权限设置为公共读，否则生成的链接无法访问
3. 画板名称不能重复，否则会导致上传失败
4. 建议使用子账号密钥，并限制权限范围以保证安全
5. 支持通过文件浏览器管理已上传的文件和文件夹

Introduction

UI Preview is a Figma plugin designed for designers to quickly export artboards and upload them to Tencent Cloud COS, generating mobile preview links. It makes design reviews and device testing simple and efficient, eliminating tedious manual exports and file transfers.

Function Description

1. One-Click Export & Upload: Select artboards and export them to Tencent Cloud COS with one click, automatically generating preview links
2. Multi-Scale Support: Supports 1x, 2x, 3x, and 4x export scales to meet different screen density requirements
3. File Management: Built-in COS file browser with support for folder creation, file deletion, and directory navigation
4. Flexible Configuration: Customize upload paths and set independent storage locations for different projects
5. Instant Preview: Generated links can be opened directly in mobile browsers for real device testing

Usage

1. Click the "Settings" button in the top right corner to configure Tencent Cloud COS parameters (Bucket, Region, SecretId, SecretKey)
2. Select the artboards you want to export in Figma
3. Choose the export scale (3x recommended)
4. Click the "Export and Upload Selected Artboards" button
5. Wait for the upload to complete and copy the generated preview link
6. Open the link in your mobile browser to preview the design

Notes

1. Requires Tencent Cloud COS service activation and access credentials
2. Ensure COS Bucket permissions are set to public read, otherwise generated links won't be accessible
3. Artboard names must be unique, duplicate names will cause upload failures
4. Recommended to use sub-account credentials with limited permissions for security
5. Supports managing uploaded files and folders through the built-in file browser