科学之家

设计创作 · 入门指南

Penpot 使用教程

开源的界面设计与原型工具,支持在浏览器中制作设计并与团队协作。

软件介绍

开源的界面设计与原型工具,支持在浏览器中制作设计并与团队协作。

  • 界面设计
  • 交互原型
  • 开源设计工具

使用前了解

支持设备:网页浏览器;可使用官方云服务或自行部署。

中文支持:提供多语言界面,中文翻译覆盖依当前版本而异。

注册要求:官方云端工作区需要账号;自部署账号由相应实例管理。

免费范围:提供免费的核心设计与协作功能。

付费区别:付费方案主要扩展团队、管理、支持及部署能力;自部署仍有服务器维护成本。

功能与套餐会随地区、账号和版本变化,开通前请核对下方官方资料中的当前说明。

官方图文介绍

开源且支持自行部署,设计稿围绕网页布局思路组织,适合希望掌握数据与协作环境的产品团队。

根据 Penpot 官方资料(新窗口) 整理

Penpot · 官网 / 官方文档介绍配图
Penpot · 官网 / 官方文档介绍配图查看官方图文来源(新窗口) · 核对 2026-09-26

图片为官方发布素材或标明的官网页面实拍;中文介绍由本站根据官方资料整理。平台与版本不同,界面可能有所差异。

能用来做什么

  • 设计网站和应用界面

    用画板与元素搭建页面,讨论内容结构、布局和视觉风格。

  • 演示页面操作流程

    连接不同画板,制作可点击原型,说明用户如何完成一个任务。

  • 协作交付设计方案

    邀请团队查看、评论或编辑同一个文件,减少反复传递截图。

快速上手

设计一个简单页面原型

  1. 进入设计工作区

    打开 Penpot,登录后在自己的项目中创建一个设计文件。

  2. 建立页面区域

    添加画板,用文字、形状和图片组织页面内容。

  3. 整理样式和交互

    调整布局与颜色,按需要连接画板中的交互和页面跳转。

  4. 预览并分享

    在预览中检查流程,确认分享权限后邀请伙伴查看和讨论。

使用提示

先用少量画板说明完整流程,再逐步补充视觉细节和可复用组件。

常见问题

  1. 为什么导出后字体、排版或透明背景变了?

    核对字体是否安装或获准使用,检查画布尺寸、导出格式、颜色设置与透明背景选项。先用一个小文件试导出,再在目标设备上打开检查。

  2. 付费素材或高级功能可以直接用于所有项目吗?

    先查看当前素材、字体、插件和软件方案的使用说明,确认适用场景与导出条件。软件的会员权益与第三方素材授权不一定相同。

官方资料

界面名称可能随版本或语言有所不同,可通过官方资料继续了解。