切图崽的自我修养－[TOOL] 用Omnigraffle绘制UML

前言

不会画图的程序员不是好产品经理

~~喜欢装逼~~有品位的程序员都有一颗产品经理的心，但印象中产品经理经常要画一些奇奇怪怪七七八八的图，在请教了一些立志做产品经理的程序员之后，发现他们都有一套自己喜欢用的精致小巧的工具，其中经典的一套为Balsamiq mockups(线框原型)+Omnigraffle(通用图形)+Markdown(文本编辑)+Keynote(演示汇报)的Mac全家桶. 满满的都是逼格有没有.

所以今天稍微鼓捣了一下Omnigraffle,发现真的非常好用，暂时贴上一点点心得，慢慢补上一些前端程序员经常用到的图表绘制的方法.

常用快捷键:

移动:v
形状:s
线条:c
文字:t
格式刷:w
磁化:m
缩放:z
连接图:d

P.s: 按住快捷键不动可以暂时切换到该快捷键对应的功能状态，另外同时按下opt键会有配合效果. 比如格式刷，按住opt+w，再单击某个元素为暂存某个元素的样式. 直接按住w，再单击某个元素，就是把格式刷暂存的样式应用到这个元素上

流程图

Ominigraffle有流程图的样式模版，点击文件－>资源浏览器－>型板－>软件->流程图,里面有流程图的基本样式. 然后根据具体流程逻辑补上连接线即可

树状图

双击工具栏中的连接图按钮(快捷键d)
在页面空白处点一下，生成一个节点
选中某一个节点，什么都不按在空白处点一下，会生成这个节点的子节点
选中某一个节点按住option在空白处点一下，会生成这个节点的兄弟节点
选中一个节点，按住shift在空白处点一下，会生成这个节点的父节点

结语

鼓捣了一阵子才发现，使用Omnigraffle熟练的掌握快捷键和基本操作就够了，很多时候我们并不会自己去从无到有构建具体样式，而是会去借鉴别人的stencil，即图形模版. 你工作中想要画的图，不管是UE/UX/流程图/思维导图/还是UML, 社区里都有一些精美的模版，你只要把这部分模版的样式拷贝下来，根据自己的逻辑应用到自己的图里就好，这能让我们更加专注于图形本身的逻辑和流程，而不是纠结于图形的样式.

分享几个stencil的下载站点,当然有些精美的stencil并不是免费的,但在你需要的时候，一定会物超所值

https://www.graffletopia.com/
https://stenciltown.omnigroup.com/

切图崽的自我修养－[TOOL] 用Omnigraffle绘制UML相关推荐

切图崽的自我修养－规范CSS元素命名
前言为什么我刚才写的样式乱了?! 如何给变量,文件命名是程序员的老大难问题.命名为什么会这么难,因为它太重要了.可以这么说,准确的命名可以提高代码的可读性,让人容易理解,方便调试,也给以后修改和维护 ...
切图崽的自我修养－[ES6] 编程风格规范
前言没有规矩不成方圆用let替换var来定义变量. 如果是常量,使用const 静态字符串统一用单引号'' , 动态拼接成的字符串统一用反引号`` let staticString = 'Thi ...
css hat,论切图仔的自我修养
编者按:作者糯米是个工具控,让我们来看看他都私藏了哪些好用的工具吧. 不过,据说都挺贵. Adobe Photoshop CC 2015 Adobe Photoshop 是设计师的必备,所以也是前端切 ...
cad 切图_CAD如何绘制并标注剖切图
三视图里面其实剖切图比较需要想象力,我们使用CAD绘制完剖切图之后还需要标注.下面是学习啦小编带来关于CAD如何绘制并标注剖切图的内容,希望可以让大家有所收获! CAD绘制并标注剖切图的方法 1.确定 ...
js设计模式与绘制UML图 - 打车的面试题
题干描述打车时,你可以打快车和专车无论什么车,都有车牌号和车辆名称打不同的车价格不同,快车每公里 1 元,专车每公里 2 元打车时,你要启动行程并显示车辆信息结束行程,显示价格(假定行驶了 ...
宏观经济学第四章思维导图_宏观经济学思维导图_宏观分析师的自我修养手册：资深从业者万字方法论总结...
宏观分析师的自我修养手册:资深从业者万字方法论总结在我印象中,宏观经济学家大概分为两种,一种是三好学生经济学家,典型的英美牛... 你应该可以画出下面这张思维导图,并且如果在其中一个变量里给一个冲击 ...
《Web全栈工程师的自我修养》读书笔记
<Web全栈工程师的自我修养>读书笔记 [声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://w ...
TinyCrayon-iOS-SDK：强大到使人惊讶的 Mask 及切图工具库
原文链接:https://github.com/TinyCrayon/TinyCrayon-iOS-SDK TinyCrayon-iOS-SDK:强大到使人惊讶的 Mask 及切图工具库.# 为开源点 ...
一个运维老将的自我修养
作者:huashionxu,腾讯 TEG 业务运维专家运维同学作为站在研发团队背后的男人们,一直在担任着举重若轻的角色,而这两年盛行的 Devops.研效变革也直接影响到运维同学岗位职责的变化, 腾 ...

切图崽的自我修养－[TOOL] 用Omnigraffle绘制UML

前言

常用快捷键:

流程图

树状图

结语

切图崽的自我修养－[TOOL] 用Omnigraffle绘制UML相关推荐

最新文章

热门文章