原标题:Adobe XD从入门到精通(上)

Adobe XD是一款免费的轻量级的原型制作软件,功能大致分为“设计”(静态界面设计)和“原型”(实现动态交互),他最大的优点是快速制作和展示。目前来看虽然和其他交互专业的原型制作软件相比它的功能比较有限,但是满足基本的操作是没问题的,如果想要制作出复杂的交互原型需要和Ai,Ps配合使用。这篇文章马克笔设计留学的MUzi老师主要介绍 “设计”部分的功能使用

首先双手奉上Adobe爸爸官方的快捷键大全。

XD在兼容这一块非常友好,可以兼容Ps,Ai,Sketch,Zeplin,Protopie文件。

但是这里要注意的是如果直接将文件拖入XD是没有反应的,正确的打开方式为选中元素在软件中复制Cmd+C / Ctrl+C,然后进入XD中黏贴Cmd+V / Ctrl+V。

XD中的矩形和椭圆是比较简单的功能,矩形圆角可以每个角分别设置圆度,如图:

XD的直线工具提供对直线的粗细,端点,描边方式的设置。端点有平头、端点圆头端点和矩形端点;描边方式有中心描边,外部描边和内部描边。

此外还有虚线设置选项,可以设置虚线的密度(在XD中叫做虚线)和间隙。

XD的钢笔工具比较基础,可以用来绘制简单的图案和icon,需要注意的是XD没有描点选择工具,需要双击路径后才能编辑。

XD的文本工具可以说是简单好用,简单是说它的字符面板非常简单,相比Ai中的字符面板,只能设置字符间距,行距,段落间距;好用是指段落文本可以随时在点文本和区域文本之间随时切换。

画板工具,快捷键A。选中画板工具后点击空白处即可新建画板,也可以选中已有画板复制黏贴。

每个画板的名字可以通过双击来修改,单击画板名称或者全选画板可以拖动画板。

是XD独有的功能,它是用来横向或纵向复制内容的工具,一般用来填充制作列表,卡片类的页面。此外还可以拖动调整填充的间距。

XD中的剪切蒙版共有两种方法,第一种是全选图片和图形,右键选择创建剪切蒙版,或者使用快捷键cmd+shift+M / ctrl+shift+M。这种方法创建的剪切蒙版不保留图案的边框,可以修改可以撤销。

第二种方法是直接将图片拖进图形中,这种方法得到的剪切蒙版会保留图形的边框,需要手动去除,可以编辑但是不能撤销。

XD的模糊工具有两种选项,背景模糊和对象模糊。其中背景模糊是将图片或图案变成一个遮罩,作用于它下面的图片,相当于制作一个毛玻璃用来罩在图片上。

对象模糊是直接对图片进行模糊,类似于Ps中的高斯模糊。

XD中提供了贴心的网格工具,分为方形网格和版面网格两种。

方形网格工具可以定义方格的大小和方格的颜色。

版面网格工具可以设置列数间距,列宽和颜色,是一个可以极大提高效率的工具。

文章作者:MUzi

南安普敦大学交互设计硕士

擅长交互设计与用户体验相关专业辅导和课程知识体系建立

任何关于院校和作品集的问题

欢迎随时和马克君沟通

知无不言,言无不尽

欢迎关注公众号:马克笔设计留学,更多院校信息以及作品集攻略都在这里哦!返回搜狐,查看更多

责任编辑:

xd怎么制作年月日选项_Adobe XD从入门到精通(上)相关推荐

  1. xd怎么制作年月日选项_Adobe XD 入门教程-如何在 Adobe XD 中创建交互式原型?

    完成屏幕设计后,您可以将各屏幕互相连接,以便直观地了解用户如何体验您的应用程序或网站.Adobe XD 允许您创建交互式原型,直观地展示如何在屏幕或线框之间导航.您可以预览交互,验证用户体验并对设计进 ...

  2. xd怎么制作年月日选项_XD中文用户手册:如何用AdobeXD制作交互原型

    可以在 XD 中的画板上设计快速简单的设计.然后,将画板连接在一起以创建可与利益相关者共享和迭代的交互式原型. Adobe XD 已与 Photoshop 和 Illustrator 良好集成.您仍可 ...

  3. xd怎么制作年月日选项_XD教程| 如何使用Adobe XD CC制作动画原型

    原标题:XD教程| 如何使用Adobe XD CC制作动画原型 前几期,我们教大家如何使用Photoshop将一系列静止图像合成简单的GIF动画图像.常言道,温故而知新,学会了也要记得勤加练习和复习! ...

  4. xd怎么做页面滑动_Adobe XD中的滚动组功能详解!

    Hi,米娜,在制作ui设计稿交互演示的过程中,我们经常需要对一些内容做滚动设置. 这里解锁一个Adobe XD的隐藏黑科技,这个功能可以快速地制作滚动的交互演示内容,非常适合使用多面板的界面,地图卡片 ...

  5. 轻量级3d模型查看器_Adobe XD+AI+DN完成智能手表逼真3D效果

    在为新产品创建界面时,二维只是设计过程的第一步.通过生成产品本身准确的可视化 3D 效果,考虑 UI 设计在现实世界中的效果也很重要.Adobe Dimension 是易于使用的 3D 场景设计工具, ...

  6. xd怎么做页面滑动_XD教程 | 如何在XD中制作拖拽手势”

    原标题:XD教程 | 如何在XD中制作"拖拽手势" 今日主题:设计一个滑动交互 使用工具:Adobe XD 预计时长:1-2分钟 实用指数:★★★★★ 难度系数:★ 本期教程,我们 ...

  7. 轻松打开查看xd文件!这个免费软件秒打开xd格式文件

    如果你收到设计师发来的.XD文件而不知道如何打开它,不用担心,有一个非常省时省力的方法--使用即时设计. 1.什么是.XD文件 .XD 文件实际上是 Adobe XD 文件格式.Adobe XD 是一 ...

  8. 使用Excel制作带有选项、筛选、提示的日报表

    使用Excel制作带有选项.筛选.提示的日报表 1. 效果截图: 2. 前言 在日常工作中几乎避免不了与Excel.Word等文档打交道,如果你的工作性质恰恰又常常与文档打交道那么你必须要掌握相关技巧 ...

  9. 《网页制作与网站建设从入门到精通》第一部分 入门篇

    第一部分 入门篇 第1章■ 网页设计基础 第2章■ HTML入门 第3章■ 网站建设基础 第4章■ 网页中的色彩知识 第1章 网页设计基础 为了使网页初学者能够对网页设计有个总体的认识,本章首先介绍了 ...

最新文章

  1. Network| ICMP
  2. C语言指针数组和数组指针
  3. I/O多路转接之 select
  4. SimpleDateFormat和DateFormat类不是线程安全的。
  5. 项目总是有红叉叉,打开又没错,Build path contains duplicate entry: '...' for project 'X
  6. 查找字段 如何 过滤
  7. struts2 配置
  8. ps里面怎么插入流程图_流程图很难画?学会这3个方法,5分钟能绘制出好看又高级的流程图...
  9. 4WD机器人运动控制MDK工程(实现ROS与STM32F407通信)
  10. 操作系统读写者问题实验报告_备战秋招——操作系统(2)
  11. php条件语句中大括号必须,PHP条件,括号需要?
  12. 初了解IsPostBack
  13. 金山PDF转WOED 1.3.0.1007版本
  14. [Qt] 基于Tcp协议的聊天室实现(Chat Room 局域网通信)
  15. 如何设计三极管控制继电器电路
  16. 安装和配置NFS服务器
  17. (python) 1200000有多少个约数(只计算正约数)
  18. 如何做好机器人方向的毕业设计?(毕业论文基本流程+机器人课程学习计划)
  19. 北大igem生物计算机,iGEM介绍
  20. mysql——查询优化案例计算

热门文章

  1. 我读研时通过实习和比赛收入五十万
  2. 程序员:你见过哪些要命的奇葩代码?
  3. c语言中读取内存的文件,c++从内存中读取文件内容,内容写到内存 实现文件的内存共享代码实例...
  4. 未捕获typeerror: $形象。cropper不是函数_没有学不会的python--细说函数
  5. 502 bad gateway php-fm,php+nginx 上传大文件 502 Bad Gateway
  6. python如何改颜色_python和networkx:如何更改节点的颜色
  7. 电脑小米路由器设置虚拟服务器,小米路由器在Win7系统中设置网络映射教程
  8. oracle10g rman备份有效性,验证RMAN备份的有效性
  9. java并发编程之美-阅读记录5
  10. Solr安装(单机版)