活动卡片1080 × 1350
设计之夜
带上速写本。我们一起重新设计一张公交车票。
报名参加- 1. 调整
- 2. 生成
- 3. 评判
这张卡片坏了。把它修好。
先读客户需求，再使用设计面板。五项检查全部变绿后，让 AI 生成几个版本。
画框
在 Figma 中
按 F 绘制画框，然后在右侧面板中选择预设尺寸，比如 Instagram 帖子。画框就是你的画板。
尺寸
图片
在 Figma 中
把图片拖到形状上，即可用照片填充。圆角设置在 Design 面板里，就在尺寸旁边。
显示
叠加层
文字
布局
在 Figma 中
自动布局（Shift + A）可设置内边距和元素之间的间距，内容变化时间距依然均匀。
对齐
文字
在 Figma 中
按 T 添加文字。把字体和字号保存为文字样式，让文件中的每个页面保持一致。
字体
文字颜色
填充
在 Figma 中
填充就是图层的颜色。点击色块即可粘贴十六进制色值。可以用 Stark 等插件检查文字对比度。
背景
按钮
- 层级
- 对比度 1.7:1
- 按钮突出
- 留白
- 嵌套圆角
- 适合画框 ok
请先让五项检查全部变绿。
每天都会用到的 Figma 基础
就是你刚才用过的那些操作，换成真正的 Figma 快捷键。在第 1 单元打开 Figma 时试试看。
- F
画框
绘制一个画框（即画板）。在右侧面板中选择预设尺寸。
- T
文字
添加文字。在 Design 面板中修改字体、字号和行高。
- RO
矩形和椭圆
绘制基础形状。按住 Shift 可保持正方形或正圆。
- ShiftA
自动布局
将元素堆叠排列，内边距和间距会随内容变化保持均匀。
- Ctrl/⌘D
复制
原位复制一个图层，然后移动它。这是做变体最快的方法。
- Alt
测量
选中一个图层并按住 Alt（Option），即可看到它与鼠标悬停对象之间的距离。
- Ctrl/⌘AltK
组件
把图层变成可复用的组件，比如一个到处都会用到的按钮。
- Shift1
缩放至适应
一次看到画布上的全部内容。Shift 0 恢复到 100%。