当前位置: 首页 > news >正文

【UI设计】Figma_“全面”快捷键

目录

  • 1.快捷键与键位(mac与windows)
  • 2.基础快捷键
  • 3.操作区快捷键
    • 3.1视图
    • 3.2文字
    • 3.3选项
    • 3.4图层
    • 3.5组件
  • 4.特殊技巧

Figma 是一个 基于浏览器 的协作式 UI 设计工具。【https://www.figma.com/】
Figma = Sketch(UI 设计)+ InVision(原型设计) + Zeplin(标注)+ Dropbox(云端同步)+ Abstract(版本历史)+ Craft-Freehand(实时讨论) + Liveshare(实时分享)+ Team Library (团队组件库)+ Web API(第三方接入)+ …

1.快捷键与键位(mac与windows)

  • Ctrl=control

  • Alt=option

  • Cmd=command=win键

  • 显示键盘快捷键:Ctrl+Shift+?

  • 打开菜单搜索:Cmd+/

2.基础快捷键

名称快捷键
移动工具V
Frame工具(选择制作尺寸)F或者A
钢笔工具P
铅笔工具Shift+P
文字工具T
矩形工具R
原形工具O
直线工具L
油漆桶(锚点状态下内填充/去除)B
移除填充Option+/或Alt+/
移除描边/
切换填充与描边颜色Shift+X
箭头工具Shift+L
添加/显示评论C
编辑图形或形状Enter
取色I或Ctrl+C
切片工具S
描边轮廓(Outline)(将描边与主体分离形成两个图层)Cmd+Shift+O/Ctrl+Shift+O
合并图层/文字转化成路径Cmd+E/Ctrl+E
连接锚点Cmd+J/Ctrl+J
删除猫点并闭合路径Shift+Delete/Shift+Backspace
导出Cmd+Shift+E/Ctrl+Shift+E

3.操作区快捷键

3.1视图

名称快捷键
拖动画布(抓手)Space+鼠标
放大+
缩小-
缩放至100%Shift+0
缩放至适应屏幕Shift+1
缩放至所选项Shift+2
跳转至上一个Frame并且放大(切换到上层画板)Shift+N
跳转到下一个Frame并且放大(切换到下层画板)N
上一页Fn+⬆️/Page Up
下一下Fn+⬇️/Page Down
找到上一个FrameFn+⬅️/Home
找到下一个FrameFn+➡️/End
显示边框Ctrl+Shift+3
像素预览设置Cmd+Alt+Y
显示/隐藏布局删格Ctrl+Shift+4
显示/隐藏像素删格Cmd+`
显示/隐藏侧边Cmd+|
显示/隐藏协作者光标Cmd+Alt+|
显示/隐藏选中项Cmd+Shift+H/Ctrl+Shift+H
锁定/解除锁定图层Cmd+Shift+L
切换到Layes(图层)Alt+1
切换到Assets(组建)Alt+2
切换到Design(设计)Alt+8
切换到Prototype(原型)Alt+9
切换到Inspect(代码)Alt+0
合并编组Cmd+G/Ctrl+G
取消编组Cmd+Shift+G/Ctrl+Shift+G
转化成FrameCmd+Option+G/Ctrl+Alt+G

3.2文字

注:Mac与Windows中有关文字的快捷键command与control键相反,如下:mac–Cmd/windows–Ctrl

名称快捷键
加粗Cmd+B/Ctrl+B
斜体Cmd+I/Ctrl+I
下划线Cmd+U/Ctrl+U
文字左对齐Cmd+Option+L/Ctrl+Alt+L
文字右对齐Cmd+Option+R/Ctrl+Alt+R
文字居中Cmd+Option+T/Ctrl+Alt+T
文字两端对齐Cmd+Option+J/Ctrl+Alt+J
复制文字图层样式Cmd+Option+C/Ctrl+Alt+C
粘贴文字图层样式Cmd+Option+V/Ctrl+Alt+V
文字编辑状态下去除样式并粘贴文字Cmd+Shift+V/Ctrl+Shift+V
减小字号Cmd+Shift+</Ctrl+Alt+<
增大字号Cmd+Shift+>/Ctrl+Alt+>
减小字间距Option+,/Alt+,
增大字间距Option+./Alt+.
减小行高Option+Shift+</Alt+Shift+<
增加行高Option+Shift+>/Alt+Shift+>

3.3选项

名称快捷键
全选Cmd+A/Ctrl+A
反选Cmd+Shift+A/Ctrl+Shift+A
取消选择项Esc
选中最里层Cmd+鼠标点击/Ctrl+鼠标点击
显示图层菜单Cmd+鼠标右击/Ctrl+鼠标右击
选中子级Enter
选中父级Shift+Enter
选中后面相邻的元素Tab
选中前面的相邻元素Shift+Tab
复制Cmd+C/Ctrl+C
剪切Cmd+ X/Ctrl+X
粘贴Cmd+V/Ctrl+V
粘贴去替换Cmd+Shift+R
连续复制Cmd+D/Ctrl+D
水平翻转Shift+H
垂直翻转Shift+V
遮罩Cmd+Option+M/Ctrl+Alt+M
添加图片Cmd+Shift+K/Ctrl+Shift+K
裁切图片Alt+双击
透明度1~0

3.4图层

名称快捷键
图层前移Cmd+]/Ctrl+]
图层后移Cmd+[/Ctrl+[
移动到最前Cmd+Shift+]/Ctrl+Shift+]
移动到最后Cmd+Shift+[/Ctrl+Shift+[
水平居中对齐Option+H/Alt+H
垂直居中对齐Option+V/Alt+V
水平均匀分布Cmd+Option+Shift+H/Ctrl+Alt+Shift+H
垂直均匀分布Cmd+Option+Shift+V/Ctrl+Alt+Shift+V
整理图层Cmd+Option+Shift+T/Ctrl+Alt+Shift+T

3.5组件

名称快捷键
打开团队库Alt+3或Cmd+Option+O/Ctrl+Alt+O
切换到组件面板Option+2
转为组件Cmd+Option+K/Ctrl+Alt+K
解散组件Cmd+Option+B/Ctrl+Alt+B

4.特殊技巧

  • 鼠标放置与右侧数据上,按住option/alt左右拖动鼠标可改变数值大小
  • 图层锚点状态下,按住command键盘可调取拖拽锚点

参考链接
[1]: https://zhuanlan.zhihu.com/p/361036797

http://www.lryc.cn/news/207050.html

相关文章:

  • 计算机网络(谢希仁)第八版课后题答案(第一章)
  • argparse模块介绍
  • 分布式、集群、微服务
  • Android Studio的debug和release模式及签名配置
  • 【深蓝学院】手写VIO第8章--相机与IMU时间戳同步--笔记
  • 【Java集合类面试二十一】、请介绍TreeMap的底层原理
  • Go语言Channel
  • java 编译 引用 jar 包进行编译和执行编译后的class文件
  • Linux系统之部署Tale个人博客系统
  • 【跟小嘉学 Rust 编程】三十三、Rust的Web开发框架之一: Actix-Web的基础
  • 算法通关村|黄金挑战|K个一组进行反转
  • 【Android Studio】工程中文件Annotate with Git Blame 不能点击
  • Ant Design Vue
  • ATA-P2010压电叠堆功率放大器-直流偏置对压电叠堆测试的重要性
  • 短视频矩阵系统搭建/源头----源码
  • 基于.Net CEF 实现 Vue 等前端技术栈构建 Windows 窗体应用
  • qt中怎么在鼠标停留的位置上显示该点的坐标位置
  • 两个list中实体某个属性值相同的实体和不同的实体
  • Linux下利用Docker快速部署Kafka
  • 竞赛 深度学习图像分类算法研究与实现 - 卷积神经网络图像分类
  • jvm摘要
  • GZ035 5G组网与运维赛题第1套
  • MySQL数据xtrabackup物理备份方法
  • vue3 使用 elementUi: ./lib/theme-chalk/index.css is not exported from package
  • [ROS系列]ORB_SLAM3错误版本(仅记录)
  • APP盾的防御机制及应用场景
  • Unity性能优化一本通
  • Mysql,SqlServer,Oracle获取库名 表名 列名
  • errno变量和显示错误信息
  • Centos 7 安装 Docker Enginee