UI设计师常用的软件只说几个，需要有经验的来？

一、项目前期准备：流程图工具-Visio

在正式进行UI界面设计之前，UI设计师需要对产品整体的流程进行思考。此阶段可以使用流程图软件Visio或XMind对需求的流程进行认真梳理，相信这会给你后期的沟通减少很多不必要的麻烦。

二、在线原型设计协作平台-摹客

摹客的早期产品是Mockplus，Mockplus是一款简单、便捷的国产原型工具，可以快速将你的想法以线框图形式展现出来。软件内封装好了常用的一些组件及素材图标，拖出即可用，非常方便。作为专业的原型设计工具，Mockplus能快速、高效地进行原型设计。现在摹客已经发展升级为设计+协作的一站式产品协作设计平台，支持全流程协作、高保真原型设计、自动标注切图和Sketch/PS/XD/Axure/Figma设计稿交付。从产品、设计到开发，All in One。

三、矢量绘图工具-AI

AI是目前最强大的矢量图绘制工具之一，主要应用于印刷出版、海报排版、专业插画、多媒体图像处理和互联网页面的制作等。在新版中新增了任意形状渐变、全局编辑、自定义工具栏、裁切视图、内容识别裁剪等全新功能，非常实用。

四、划参考线工具-GuideGuide

GuideGuide是一款可以应用于PS、AI、Sketch及XD里面的划参考线插件，安装非常方便。此外，它支持一键生成参考线，也可针对画布或者自定义选区新建参考线等。

五、UI界面设计工具-Sketch

Sketch可以说是一款专为UI设计师而生的矢量绘图工具。相对于PS，SKetch定位更加精准， *** 作更简单及轻量化。其“设计，修改、演示”一站式功能，可以帮助UI设计师快速完成界面设计，元素批量修改及快速演示等。但是目前只支持在Mac上使用。当然，没有Mac的，也可以使用PS或XD进行界面设计。

六、配色工具- Material Design Color

对于UI设计师来说，配色是极其重要的一个环节，有人称之谓“成也配色，败也配色”也不为过。一个好的UI配色可以起到诸多作用，如：显示界面整体架构、明确层级关系及提升转化率等等。其重要性可见一斑。而配色一直是让UI设计师非常头疼的，对于新手小白更是如此。当然，有了配色工具-Material Design Color，这些问题都不用愁。其 *** 作非常简单，便捷，灵活。

七、标注、切图、高保真原型工具-摹客

UI设计师做好界面设计后，就到了最让人恼火的环节了-如何将自己的设计稿快速交付（标注、切图、高保真原型等）给前端开发？

相信很多设计师都会在心里大骂，我是设计师，不是切图仔！到底什么时候才能摆脱这些密密麻麻的标注？到底什么时候才能摆脱熬夜，加班？好了，直到我发现了开发阶段的协同平台-摹客，UI设计师的春天来临了。那么，我们用一张表来看看，摹客能给设计师解决哪些烦恼？

八、圆角工具-Corner Editor

这是一款在PS上运行的插件-圆角工具。与PS里面的自带圆角编辑功能相比，Corner Editor *** 作起来更加简单便捷。除了可以单独设置圆角大小外，就算元素变形了，一样可以进行圆角处理。

开发一个简单的聊天APP可以分为以下几个步骤：
1 确定功能和需求
在开发任何应用之前，首先需要确定应用的功能和需求。例如，这个聊天APP需要有哪些功能？聊天记录怎么存储？如何处理用户注册和登录？等等。明确了这些问题之后，才能进入下一步。
2 设计UI界面
设计一个好看的、易于使用的 UI 界面对聊天 APP 来说是非常重要的。你可以借助现有的设计工具例如Sketch或Figma等来构建你的用户界面。
3 选择适当的技术栈
选择合适的技术栈是关键。如果你使用React Native或Flutter等框架来构建移动应用，可以快速进行开发并且轻松实现跨平台。另外，你还需要选择合适的后台服务和数据库。
4 构建后端服务
为了支持聊天 APP 的功能，你需要创建一个能够接收和发送消息的服务器。你可以使用Nodejs等技术来构建服务器并采用实时通讯协议（如WebSockets）以便实现即使通讯。
5 实现前端和后端交互
前端与后端交互可能涉及到API调用、WebSocket连接以及其他网络协议。确保您按照所选技术栈的最佳实践来处理数据传输和网络通讯。
6 测试和部署
在你发布之前，请确保应用程序经过了充分的测试，并且能够在真实的环境中运行。将应用发布到应用商店或设立一个云服务器即可完成部署。
以上是开发简单聊天 APP 的主要步骤，但是这个过程可能会更加复杂，具体取决于你实现某些功能所使用的技术栈和你自己的需求。

一般来说，UI会用到这些工具

1 Mason

现如今，视觉稿（Mockup）和原型（Prototype）是网页和 APP 设计过程中最常用的方法。两种方式都很有效，不过也都可能会在时间和花销上对整个项目产生压力，影响团队和项目的整体推进，尤其是在时间和精力都非常有限而项目又非常复杂的情况下。

Mason 提供了一个更好的解决方案，它让你无需设计线框图、原型和视觉稿，而直接拿现成的组件来编辑和设计，并且确保最终输出的产品既具备功能，也是像素完美的，最后通过 Mason 的平台进行部署，甚至你都不需要有代码编写的经验。

Mason 的设计方法看起来很激进，但是实际上非常的易用。无论是调整还是维护，Mason 都能确保控件和元素都很容易处理。在 Mason 中修改、发布，然后就能正常使用。无需亲手编写代码，诸如注册、登录等各种常见的功能都能够正常输出使用。

这款工具并不会限制你将网站投放到特定的平台或者托管环境下，你可以在你最熟悉的服务器或者服务商那边部署。这可以大幅度节省管理费和时间，并且你会发现团队协作更加高效了。

2摹客（国产UI设计神器，强烈推荐）

这款国产的工具快速易用，Sketch / PS / XD / Figma / Axure / Mockplus设计稿一键上传 ， 设计评审讨论 ， 自动标注一键生成，手动标注自由发挥 。

1 自动标注：
鼠标hover图层即可自动生成标注，一键转换为百分比标注，还可以放大镜查看细微标注。
2 手动标注：
文字、坐标、颜色、尺寸、区域5种工具自由选择，信息传达更准确。
-用文字工具添加备注说明；
-用坐标工具添加位置信息；
-用颜色工具吸取图层，色值智能生成；
-用线段工具标注尺寸，数值自动生成；
-用区域工具标注局部图层，宽、高自动生成。
3 单位自由转换：
支持iOS的pt，Android的dp，Web的rem，还可以保留0-3位小数，标注更自由。
4 完整的标注属性：尺寸、边距、不透明度、字体大小、字重、行高、字间距等。相关属性一键复制即可使用。
除了智能的标注方式，摹客的切图、交互、全貌画板、文档管理等功能也很实用。最值得一提的是，摹客基础功能完全免费。

3 Overflow

设计师讲述故事最有效的办法之一，是将故事中的节点连在一起，将用户历程线性地呈现出来。这样的方式会让访客更好的理解他们所看到的内容，同时能够更加专注于细节的呈现，并且构建有效的反馈机制。

作为世界上第一个为设计师量身定制的用户流程图工具，Overflow 可以帮助设计师更好地讲述故事。它为设计师提供了一种全新的方式来更好的呈现作品，讲述故事，以交互式的流程同用户进行沟通，吸引用户的注意力。

Overflow 是一款跨平台的工具，可以与目前最流行的设计工具无缝地集成起来，允许设计师在同一个平台上完成设计、展示、共享和打印他们的用户流程。

4 UXPin

UXPin 可能是目前对于设计团队来说最理想的快速原型工具，尤其是当产品的 UX 设计和研发高度依赖快速反馈循环机制的时候。UXPin 可以让设计团队在向开发交付原型之前，充分地进行设计、共享和测试。

开发人员所需要的数据，实际上在每个项目设计完成之时，就会自动生成。所以，在将设计交付给开发人员之前，甚至可以使用检测工具，验证一下产品的部署是否和设计元素相互匹配。

UXPin 还提供一个完整的设计系统解决方案，帮助你保持整个产品的 UI 元素的一致性。而每个产品的 UI 组件都可以使用一段代码记录下来，因此可以更加轻松快速的扩展产品的功能。

5 Creately

UI/UX 设计当然不仅仅是线框图和视觉稿，它是动态的，系统化的，而这也是 Creately 这款工具的价值所在。这款图标工具适合生成工作流程，支持不同的图表类型，包括流程图、思维导图、UML 图标、线框图等。它所提供的图表功能和协同工作的功能，可以帮助设计师完成一半以上的工作。

使用 Creately 来创建图表，可以轻松创建出足够漂亮的图表，其中配备的1000多个专业的设计图表模板，可以快速地完成各式各样的 UX 设计项目。

6 PowerMockup

有许多 UX 设计师会使用 PowerPoint 来构建交互式原型，有了 PowerMockup 之后，你再也不需要寻找其他的工具来辅助你的工作了，它就可以帮你创建高效可共享的交互式原型。

在构建原型的时候，只需要从 PowerMockup 不断增长的资源库找到对应的形状或者设计元素，拖拽到 PowerPoint 当中，然后进行设计即可。为了实现互动，你所需要调用的也无非是 PowerPoint 当中的幻灯片和动画功能，很简单。

7 Visual Inspector

Visual Inspector 让设计师、开发者和负责维护的人员能够实时地在网站中检查和解决各种 UI 问题，并且同其他的工作人员随时共享信息。

这款工具不需要你懂得代码，只需要几秒钟就可以启用 UI 工具，并且几乎可以任何类型的网站（使用 HTML 代码，或者 WordPress 系统的）进行协同工作。这款工具不是免费的，终身授权的版本只需要付费49美元即可。

8 Fluid UI

Fluid UI 是一款可以用来设计线框图、原型图和视觉稿的综合性工具，它还为项目经理和分布式设计团队提供了非常完善的协作功能。它拥有非常全面的组件库，横跨桌面端、iOS 和 Android 等主流的、必须的平台。

UI设计是指对软件的人机交互、 *** 作逻辑、界面美观的整体设计。UI设计师的职能包括很多人选择学习设计其实都是三分钟热度，最好在学习之前先来做一个小测试→点击测试我适不适合学设计图形设计：即传统意义上的“美工”，当然，他们承担的不是单纯意义上美术工人的工作，而是了解软件产品、致力于提高软件用户体验的产品外形设计师。交互设计：主要在于设计软件的 *** 作流程、树状结构、 *** 作规范等。一个软件产品在编码之前需要做的就是交互设计，并且确立交互模型，交互规范。用户测试/研究：任何的产品为了保证质量都需要测试，软件的编码需要测试，自然UI设计也需要被测试。这个测试和编码没有任何关系，主要是测试交互设计的合理性以及图形设计的美观性。测试方法一般都是采用焦点小组，用目标用户问卷的形式来衡量UI设计的合理性。学Ui设计可以到天琥教育，天琥经过严格审核获得办学许可证，是行业为数不多获得办学许可证的机构。并且天琥官网配备性格测评，在线报名以及客服咨询，全方位满足你选择的需求，根据自身性格选择自己适合的课程以及讲师。

工欲善其事必先利其器，好的工具不仅可以使得工作效率大大提高，更会节省大量时间，随着时代的进步，对UI设计师的要求越来越高，优秀的UI设计需要考察综合能力，纯UI的时代已经过去了，今天的UI设计师，除了掌握视觉设计还需要具备一定交互设计能力，动效设计，三维建模设计等等，或许你刚起航，或者已在半路上，但是只要每天都在进步一点点，终究可以成为更好的自己!

1、Sketch

支持平台：Mac

Sketch 是一款适用于所有设计师的矢量绘图应用。矢量绘图也是目前进行网页，图标以及界面设计的最好方式。但除了矢量编辑的功能之外，同样添加了一些基本的位图工具，比如模糊和色彩校正。

有经验的设计师花上几个小时便能将自己的设计技巧在Sketch中自如运用。对于绝大多数的数字产品设计，Sketch 都能替代 Adobe Photoshop，Illustrator 和 Fireworks。

2、Adobe Photoshop (简称：PS)

支持平台：Windows & Mac

Adobe Photoshop，简称“PS”，是由Adobe Systems开发和发行的图像处理软件。

Photoshop主要处理以像素所构成的数字图像。使用其众多的编修与绘图工具，可以有效地进行编辑工作。ps有很多功能，在图像、图形、文字、视频、出版等各方面都有涉及。

Adobe支持Windows *** 作系统 、Android与Mac OS， 但Linux *** 作系统用户可以通过使用Wine来运行Photoshop。

3、Adobe Illustrator (简称：AI)

支持平台：Windows & Mac

Adobe illustrator，常被称为“AI”，是一种应用于出版、多媒体和在线图像的工业标准矢量插画的软件。

作为一款非常好的矢量图形处理工具，该软件主要应用于印刷出版、海报书籍排版、专业插画、多媒体图像处理和互联网页面的制作等，也可以为线稿提供较高的精度和控制，适合生产任何小型设计到大型的复杂项目。

4、Cinema 4D (简称：C4D)

支持平台：Windows & Mac

Cinema 4D翻译过来是4D，不过其本身就是3D的表现软件，由德国Maxon Computer开发，以极高的运算速度和强大的渲染插件著称，很多模块的功能在同类软件中代表科技进步的成果，并且在用其描绘的各类中表现突出，而随着其越来越成熟的技术受到越来越多的公司的重视，可以预见，其前途必将更加光明。

Cinema 4D 应用广泛，在广告、、工业设计等方面都有出色的表现，目前在影视后期、产品建模、视觉设计、各种物体三维制作等方面有很强大的应用。

5、Cutterman

支持平台：Windows & Mac

Cutterman是一款运行在photoshop中的插件，能够自动将你需要的图层进行输出， 以替代传统的手工 "导出web所用格式" 以及使用切片工具进行挨个切图的繁琐流程。 它支持各种各样的尺寸、格式、形态输出，方便你在pc、ios、Android等端上使用。 它不需要你记住一堆的语法、规则，纯点击 *** 作，方便、快捷，易于上手。

6、蓝湖

支持平台：Windows & Mac

蓝湖是一款产品文档和设计图的共享平台，帮助互联网团队更好地管理文档和设计图。蓝湖可以在线展示Axure，自动生成设计图标注，与团队共享设计图,展示页面之间的跳转关系，功能非常强大，与团队协作非常高效率。

7、XMind

支持平台：Windows & Mac

XMind 是一款非常实用的商业思维导图软件，应用全球最先进的Eclipse RCP 软件架构，全力打造易用、高效的可视化思维软件，强调软件的可扩展、跨平台、稳定性和性能，致力于使用先进的软件技术帮助用户真正意义上提高生产率。

8、Adobe Dreamweaver (DW)

支持平台：Windows & Mac

Adobe Dreamweaver，简称“DW”，中文名称 "梦想编织者"，最初为美国MACROMEDIA公司开发 ，2005年被Adobe公司收购。DW是集网页制作和管理网站于一身的所见即所得网页代码编辑器。利用对 HTML、CSS、JavaScript等内容的支持，设计师和程序员可以在几乎任何地方快速制作和进行网站建设。

Adobe Dreamweaver使用所见即所得的接口，亦有HTML(标准通用标记语言下的一个应用)编辑的功能，借助经过简化的智能编码引擎，轻松地创建、编码和管理动态网站。 访问代码提示，即可快速了解 HTML、CSS 和其他Web 标准。使用视觉辅助功能减少错误并提高网站开发速度。

9、Adobe After Effects (AE)

支持平台：Windows & Mac

Adobe After Effects简称“AE”，是Adobe公司推出的一款图形视频处理软件，适用于从事设计和视频特技的机构，包括电视台、动画制作公司、个人后期制作工作室以及多媒体工作室。属于层类型后期软件。

Adobe After Effects软件可以帮助您高效且精确地创建无数种引人注目的动态图形和震撼人心的视觉效果。利用与其他Adobe软件无与伦比的紧密集成和高度灵活的2D和3D合成，以及数百种预设的效果和动画，为您的、视频、DVD和Macromedia Flash作品增添令人耳目一新的效果。

10、Axure

支持平台：Windows & Mac

Axure RP是一款专业的快速原型设计工具。Axure代表美国Axure公司;RP则是Rapid Prototyping(快速原型)的缩写。

Axure RP是美国Axure Software Solution公司旗舰产品，是一个专业的快速原型设计工具，让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。作为专业的原型设计工具，它能快速、高效的创建原型，同时支持多人协作设计和版本控制管理 。

Axure RP的使用者主要包括商业分析师、信息架构师、产品经理、IT咨询师、用户体验设计师、交互设计师、UI设计师等，另外，架构师、程序员也在使用Axure。

大多数时候，好用的工具都会收取一定的费用，国外的软件更是如此，我把一些优秀的收费软件盘点一下。

一、界面设计

1Adobe Photoshop

虽然Adobe以“抢钱”著称，但提到界面设计，Photoshop一定是广大设计师们入门的必备设计工具。作为平面设计神器，Photoshop有着强大的编辑和处理功能，设计创作、摄影修图，Photoshop都能完美搞定。如果非要为这款工具找一个缺点，那一定是让设计师们颤抖的年费。

费用：Adobe Photoshop CC2020      2975元/年

2sketch

Sketch是一款强大的界面设计工具，专为UI设计师打造。在Sketch中，用户能轻松地设置图层面板，可批量命名图层、智能标注页面、填充头像和文字等，可实现多层式填充、渐变、噪点等功能。此外，官方的插件市场非常丰富，设计师可以免费获得多种高效插件。在费用方面，Sketch也采用了年费机制，相对于Photoshop来说性价比更高，但缺点是只支持Mac系统。

费用：99美元/年

3AE

Adobe After Effects简称“AE”，也是Adobe公司旗下的工具，AE主要用于图形和视频处理。如今动效设计在UI界面设计中的应用越来越广泛，所以作为UI设计师，AE也是必须了解的设计工具之一。好的动效设计可以给用户提供强烈的视觉感受，从而加强与用户之间的交互体验。AE包含了上百种特效及预置动画效果，可与Premiere，Photoshop，Illustrator等软件无缝结合，创建无与伦比的动画作品。

费用：Adobe After Effects 2020      2975元/年

二、交互设计

1UXPin

UXPin编辑器是一款基于Web的原型工具，支持创建线框图和高保真交互原型。设计师还可以导入Sketch或Photoshop的设计稿，创建交互原型。 此外，此款工具还可为开发人员自动生成风格指南和设计规范，提升工作效率。目前 UXPin 没有免费版，但是提供了 14 天的免费试用。用户可以在他们的作品展示中提交自己的作品，如果被选为优秀作品，将有机会获得一年的免费使用资格。

费用：基础版  19美元/月

2Adobe XD

Adobe XD是一站式UX/UI设计平台，设计师可以使用Adobe XD进行移动应用和网页设计与原型制作。使用Adobe XD可以更高效准确的完成静态编译或者框架图到交互原型的转变。Adobe XD在发布后迅速占领了一部分市场，很大原因是因为其一反Adobe公司“抢钱”的常态，宣布可免费使用。不过目前Adobe XD在国外已经悄悄推出了付费版，费用为10美元/月。

价格：免费

3ProtoPie

ProtoPie是一款简洁易用的交互工具，能够实现很多动画效果，还具备复杂的条件和参数设置，支持多点触摸手势和手机传感器，可以导入到手机演示，支持 Windows 和 Mac 双平台，如果想要设计高保真原型，ProtoPie非常适用。

费用：个人版 11美元/月

三、交付设计稿

1figma

Figma与Sketch的布局与功能整体上非常相似，但相较于Sketch来说，Figma新增了多人协作、智能布局、评论审阅、 版本控制、标注等协作功能。因此Figma的优势在于，可以让设计师无需管理插件、存储，也不需要考虑同步和协同的问题，唯一要考虑的只是设计本身。不过Figma对中文的支持仍然不佳，此外，如果想流畅使用Figma，用户还需要为“科学上网”付出额外成本。

费用：专业版  12美元/月

2zeplin

Zeplin是专为UI设计师与开发工程师量身打造的协作工具。作为一名UI设计师，准确的开发交付是工作的重要一环，而Zeplin就是为了实现这一目标而生的。Zeplin *** 作很简单，设计师从Sketch上传UI界面设计稿后，开发工程师就可以直接在web应用中看到设计的标注、切图和代码信息。另外，UI设计师还可以直接在UI界面上给开发人员添加注释，标记，备注等。填补了开发与设计之间的沟通障碍，为设计师和开发人员节省了大量宝贵的时间。缺点是只支持Mac。

费用：基础版   17美元/月

3摹客

最后为大家推荐的就是压轴的产品摹客了。作为一款国内自主研发的全流程协作平台，摹客可以帮你完成上面除AE外所有产品能做到的事：原型设计、在线协作、设计稿评审与交付、设计规范管理……优质的国内服务器也免去了“科学上网”的烦恼。此外，为了帮助中小型企业降低成本，摹客基础版支持100人以下的团队永久免费使用，对于国内大部分团队来说，都大大减轻了设计负担。

费用：基础版  免费    团队版  99元/人/年

价格合理的服务或产品，相信设计师们都是乐于接受的。也希望我们国内的厂商能推出更多优质、高性价比的设计软件产品，进而推动整个设计行业的良性成长。

要开发移动聊天应用程序，您需要结合使用软件工具和编程语言。 以下是移动应用程序开发中最常用的工具和技术的列表：
集成开发环境 (IDE)：IDE 是一种软件应用程序，可为编码、调试和测试提供综合环境。 流行的 IDE 示例包括 Android Studio（用于 Android 应用程序开发）、Xcode（用于 iOS 应用程序开发）和 Visual Studio Code（用于跨平台应用程序开发）。
编程语言：移动应用程序开发最常用的编程语言是 Java（用于 Android 应用程序开发）、Swift（用于 iOS 应用程序开发）和 React Native（用于跨平台应用程序开发）。
后端服务：为了支持应用程序的聊天功能，您需要一个后端服务来处理消息传递和存储。 您可以使用 Nodejs 或 Ruby on Rails 等服务器端编程语言构建自定义后端，或使用 Firebase 或 AWS 等基于云的后端即服务 (BaaS) 平台。
数据库：要存储用户和聊天数据，您将需要一个数据库。 移动应用程序开发的流行数据库选项包括 SQLite（用于简单应用程序）、MySQL（用于更复杂的应用程序）和 NoSQL 数据库，例如 MongoDB 或 Cassandra。
设计工具：要为您的应用程序创建一个有吸引力且用户友好的界面，您将需要设计工具，例如 Sketch、Adobe Photoshop 或 Figma。
还有许多其他工具和技术可用于支持移动应用程序开发，您需要的具体工具和技术将取决于您应用程序的具体要求。 最好研究和试验不同的工具，以找到最适合您需要的工具。

---