-
让品牌有温度、有情感
专注品牌策划15年
图形设计
界面设计
交互设计
设计规范
动效设计
ui设计流程进行的第一步是什么（ui设计流程进行的第一步是什么意思）
发布时间：2023-04-28 02:43:37
稿源：
创意岭 阅读：
439
大家好！今天让创意岭的小编来大家介绍下关于ui设计流程进行的第一步是什么的问题，以下是小编对此问题的归纳整理，让我们一起来看看吧。
创意岭作为行业内优秀企业，服务客户遍布全国，设计相关业务请拨打175-8598-2043，或微信：1454722008
本文目录:
一、什么是UI？它的设计原则是什么？
什么是UI？
UI即User Interface（用户界面）的简称。UI设计则是指对软件的人机交互、操作逻辑、界面美观的整体设计。好的UI设计不仅是让软件变得有个性有品味，还要让软件的操作变得舒适、简单、自由、充分体现软件的定位和特点。UI还有其它的意义，如Unit Interval，Univ of Iowa，Unlock Instruction，Urgent Interrupt。
UI的设计原则是什么？
1.简易性
界面的简洁是要让用户便于使用、便于了解产品，并能减少用户发生错误选择的可能性。 2.用户语言
界面中要使用能反映用户本身的语言，而不是游戏设计者的语言。
3.记忆负担最小化
人脑不是电脑，在设计界面时必须要考虑人类大脑处理信息的限度。人类的短期记忆有限且极不稳定，24小时内存在约25%的遗忘率。所以对用户来说，浏览信息要比记忆更容易。
4.一致性
它是每一个优秀界面都具备的特点。界面的结构必须清晰且一致，风格必须与产品内容相一致。
5.清楚
在视觉效果上便于理解和使用。
6.用户的熟悉程度
用户可通过已掌握的知识来使用界面，但不应超出一般常识。
7.从用户习惯考虑
想用户所想，做用户所做。用户总是按照他们自己的方法理解和使用。
通过比较两个不同世界(真实与虚拟)的事物，完成更好的设计。如：书籍对比竹简。
8.排列
一个有序的界面能让用户轻松的使用。
9.安全性
用户能自由的作出选择，且所有选择都是可逆的。在用户作出危险的选择时有信息介入系统的提示。
10.灵活性
简单来说就是要让用户方便的使用，但不同于上述。即互动多重性，不局限于单一的工具(包括鼠标、键盘或手柄、界面)。
11.人性化
高效率和用户满意度是人性化的体现。应具备专家级和初级玩家系统，即用户可依据自己的习惯定制界面，并能保存设置。
二、零基础如何学习UI设计？
零基础如何学习UI设计？在现目前UI设计是一个非常火的行业，很多人都认为UI设计可以拿高薪，便挤破脑袋的想要入门。在你接触UI之前，首先需要给自己一个定位，是否是真正的喜欢UI，不管做什么行业，喜欢、兴趣是第一的，只有这样下一步.
那如果学习UI我们要怎么去进行呢？
首先你总得知道UI是什么吧？
1、什么是UI（直接百度）
UI，即用户界面（User Interface）是系统和用户之间进行交互和信息交换的媒介。它实现信息的内部形式与人类可以接受形式之间的转换。
简而言之，UI设计师就是设计用户界面。一般我们手机上app的界面都是UI设计师需要设计的。
通俗易懂点说，UI就是做界面的，最重要的部分是app界面，看到手机里各种app没？大部分展现在你面前的东西，都是UI设计师需要做的。
当你理解了什么是UI的时候那么接下来我们要知道我们要会使用什么软件？
2、UI设计师需要会哪些软件
需要软件和基础学习的小伙伴可以到文件夹中下载哦！
分别是Photoshop，Illustrator，After Effects，Axure RP 8。
简称，PS，AI，AE，ARP软件。
PS主要用于制作UI设计中界面和图标设计，也可以对UI中的一些广告页进行设计。
AI主要用于制作UI设计中的图标设计，也可以对UI中的一些引导页的插画图进行设计。
AE主要用于制作UI设计中的交互动效，在现今的UI产品中很多都是需要用动效的。
ARP主要用于制作UI设计中的原型图，线框图，流程图的设计。
说了那么多废话，那应该怎么学习呢？
第一个，练习软件基础知识，现在网上有很多这样的软件基础知识视频，先把软件理解之后我们在来开始创作练习。
第二个，学习手绘知识，很多人觉得没有手绘知识，我也可以做UI设计，
但是手绘能带给我们的是
1.锻炼我们理解物体的形体、轮廓、明暗的思维。
持续的绘画练习，除了排线这些硬性的技巧，同时就是在锻炼我们对画面的专业思考能力，观察和发现细节的习惯，而有这样的思维训练，在以后我们绘制图形、图标、拟物风格作品的时候才能快速抓到要点。
物体的明暗关系，物体间交汇的阴影，各物体的轮廓，前后景的景深，画布的褶皱方式等……而这都是有意识的思考后动手才能完成的结果，构成一幅平稳准确细节丰富的作品。
这也是为什么很多人讲，不知道如何去提升，其实这就是一个关键点
2.学会构图
你需要把内容完整画进纸上，就需要在画布也做构图，是用居中还是三角，黄金三分还是螺旋，无论通过什么手段，最终都是找到一个你觉得好看的位置。而这个过程也是平面构成的实践操作。在未来如果学习摄影也会有良好的助力！
这会锻炼你的主视觉和排版的能力。
第三个，学习UI的设计理论
，软件只是一种工具，设计才是最终要体现的，这个时候你需要多看关于这方面的书籍。
先要了解的是三大构成（百度百科）即三大构成即平面构成、色彩构成与立体构成，是现代艺术设计基础的重要组成部分。
设计类的相关书籍可以买一些回来，比如《商业字体设计》、《版面设计的原理》等等，网上一搜就很多
第四个，前端的对应技能，作为UI设计师，是必须掌握前端的对应技能的，这不是可以完全无限制的发挥设计技艺的地方，你就要有取舍，要跟的上前端开发的逻辑，做出稳定可以被实现的设计稿，必须掌握前端切图流程。学会HTML5 CSS3 JQ的入门，安卓、IOS的实现规范！
第五个，那就是创作，我们先要从别人的身上吸收内容，简单的来说就是抱大腿，进行临摹，然后在进行创作，寻找到一个适合自己的风格
需要从以下方面来进行创作学习
最后一个那就是思维拓展，你要想走到时代的前沿，那你必须得多了解世界，了解其他行业的相关内容，尤其是现在的人，都很讨厌学习，你一样，我也一样，这是现在这个社会的通病，互联网充斥这我们的每一天，所以我们需要给自己制定一个目标，然后实施计划，严格的执行，在这过程中不断修正自己的计划，最后达到自己想要的结果，如果你想要做那么请请拿出你的态度。
学习ui你需要了解的知识
三、UI设计师如何与产品经理以及开发协同合作？
一般工作流程是：
1.产品经理(PM)提出产品方面的需求，输出PRD(产品需求文档)和原型图，并发起需求评审会议。
2.交互设计师接到PRD文档后进行梳理和确认，将模糊的需求和功能具体化，制作出低保真交互流程图和页面的结构信息框架，并以文字标注的形式进行交互说明，最终输出交互规范文档，并召开交互评审会议。
3.UI设计师接到交互文档后，第一步并不是马上动手去做，而是要先对需求进行理解，理解该产品的功能内容是什么?服务的人群有哪些特征?产品的目标是什么等等。有疑问的地方及时与PM或交互设计师进行沟通，最终达成对产品目标的一致理解;第二步，找竞品。对竞品的色彩搭配、结构布局、icon设计、字体规范等方面进行研究和分析，可作为参考借鉴，但不要抄袭;第三步，视觉设计。到这一步就可以真正开始动手做了，按照产品的需求，对重要功能和内容进行突出，弱化次要内容，注意整个页面的层级结构和比例关系，保持美观性和易用性之间的平衡。设计过程中参照移动端和PC端的设计规范，遵循一致性设计原则。
第四步，交付。在与PM和设计主管确认设计稿ok后，对页面进行标注和切图的输出。切图根据需要，对于iOS系统，需要提供1倍图、2倍图、3倍图，同时注意切图的命名规范(网上有很多关于切图命名规范的文章，这里不再赘述);对于android系统，主要提供hdpi、xhdpi、xxhdpi、xxxhdpi尺寸的切图，特殊情况还需要提供点九图。
4.开发工程拿到标注稿和切图后，对开始对页面框架进行搭建。这时候，UI设计师的工作并没有结束，跟进和验收也是UI设计工作的重要组成部分，即要保证设计稿的还原度。中途若出现问题，也要及时配合开发小伙伴一起解决。一个优秀的UI设计师，除了关注设计执行上的工作以外，前期的设计规划和后期的迭代跟进同样需要关注。
以上就是青藤小编关于UI设计师如何与产品经理以及开发协同合作的相关分享，希望对大家有所帮助，如果您想要了解更多相关内容，欢迎大家及时在本平台进行查看哦!
四、前端拿到UI设计的图 如何开始布局设计
前端拿到UI设计的图 开始布局设计的方法
布局是页面构成的前提，是后续展开交互和视觉设计的基础。设计者在选择布局之前，需要注意以下几点原则：
明确用户在此场景中完成的主要任务和需获取的决策信息。
明确决策信息和操作的优先级及内容特点，选择合理布局。
一、常用布局
网站展示页、Dashboard、列表页、表格页、详情页、表单页。在设计前先了解这些模板有助于让用户快速找到适合自己产品的页面布局。
1、网站展示页
网站展示页（即官网页）通常是用户了解网站或产品的第一步。这类页面通常会包含产品展示图，简短的产品介绍信息，以及用户登录入口等。在设计时我们建议：
明确你要传达的内容，保持简短而清晰的文案。
搭配清晰、直观的产品图片，有助于加深用户对产品的理解和记忆。
2、控制台页
控制台页（Dashboard）集合了大量多样化的信息（如数字，图形，文案等），需要一目了然地将关键信息展示给用户。因此，如何将庞大复杂的信息精简清晰地展示出来，是设计此类页面的关键。在设计时要注意以下几点：
按照信息的重要程度来组织页面排版，突出展示关键信息。
将数据可视化，让用户可以直观地了解关键信息及整体情况。
合理地使用颜色及栅格排版，减轻用户的视觉负担。
3、列表页
列表设计是并列式展现信息，方便用户能快速查看基本信息及操作。因此，信息的「可阅读性」及「可操作性」是设计的关键。在设计时要注意以下几点：
根据用户需求来定义信息展示的等级，仅展示关键信息及操作。
当信息内容较为复杂时，可将次要的信息折叠或放到详情页面中，以递进的方式让用户获得更多的信息。
4、表格页
表格作为多维信息展示的载体，使复杂的信息更易于阅读与理解。它的易读性，便捷性，易操作性对产品的体验起着举足轻重的作用。因此，我们在设计时要注意以下几点：
构造清晰的表格布局，有利于提升读者对信息的接收速度和理解程度。
更多地展示用户所必须的信息，通过视觉上的调优突出展示重点信息。
当界面需要在一个很大的多纵行表格中展示数据，或每一横列数据有多行信息时，可以巧妙地运用横向或纵向斑马条，使得信息条目之间更为分明，视觉上更易区分。
5、详情页
详情页面一般会承载大量的基本信息，扩展信息，或者状态信息。对于信息效率和优先级判定的要求会比较高。清晰的布局能帮助快速看到关键信息，提高决策效率。这设计时有以下几点需要注意：
清晰的排版格式，易于阅读的文本大小及间距，都是影响用户获取信息效率的关键因素。
图文搭配比单文本展示信息能更好地提高用户的理解。
6、表单页
表单页通常用来执行登录、注册、预定、下单、评论等任务，是产品中数据录入必不可少的页面模式。因此，舒适的表单设计，可以引导用户高效地完成表单背后的工作流程：
考虑用户的浏览方式，提供清晰的用户视线浏览路径；
内容是表单的核心，保证表单的内容精简（尽量避免多余的输入项）；
标签的命名要易于用户阅读和理解，避免模糊的描述给用户造成困扰；
醒目的提交或完成按钮，放在用户的浏览线的终点更有利于用户的完成操作。
二、栅格
我们通过定义网格、间距来呈现产品布局的最佳效果，设计师在设计时可按（移动：『页面总宽 750px，内容区 750px』，PC：『页面总宽 1440px，内容区 1208px』）来设定，并在此基础上以 12等分的栅格来划分整个设计建议区域。
建议横向排列的区块数量最多四个，最少一个，以保证视觉层面的舒适感。
注：图中灰色部分为栅格的列，定义为『Column』，白色部分为栅格的间隔，定义为『Gutter』。
栅格公式：
我们为页面中栅格的 Gutter 设定了定值，即浏览器在一定范围扩大或缩小，栅格的 Column 宽度会随之扩大或缩小，但 Gutter 的宽度值固定不变。
网站展示页和 Dashboard 的 Gutter 宽度为 24px。
列表、表格、详情和表单页面的 Gutter 宽度为 16px。
以上就是关于ui设计流程进行的第一步是什么相关问题的回答。希望能帮到你，如有更多相关问题，您也可以联系我们的客服进行咨询，客服也会为您讲解更多精彩的知识和内容。
推荐阅读：
mbr和gpt分区的区别（固态硬盘用mbr还是guid分区）
老婆偷偷和抖音男网友聊天（老婆偷偷和抖音男网友聊天被我发现离家出走了）
赣公网安备 50019002502384号
