ui规范建设思路(通用)7篇

2024年ui规范建设思路 篇1

5分钟快速了解UI设计规范

每位UI设计师,想必都有一套属于自己的设计规范,今天我就来教大家在5分钟快速建立一套自己的设计规范。

我今天讲苹果版本的(尺寸:750*1334),因为现在很多的设计师就做一套UI图,安卓版本的基本就已经省略掉了,原因很简单,是的没错,就是节约时间哈。底部栏与顶部栏的规范

下面第一张图是底部栏的设计规范,第二张图是加图标展示,底部栏高度为49px,在我以往的设计工作经验中,常见的分为3种情况,3个图标、4个图标的、5个图标的,不管是那种我们应该按照规范来,这样前段在开发时就会比较方便,按照几等分(n/375),底部的图标我习惯用28*28px(尺寸:375*667,最后导两倍的图给前段开发),底部文字都用10px。

底部栏

接下来我们看第三张顶部栏的设计规范图,顶部栏的高度一般为64px,标题文字我喜欢使用18px,不过还是要看自己的设计风格。

顶部栏

字号与字色的规范

字号的大小使用也是非常的重要,之前我的一个客户,希望我能够把字体设计大些,他的原因是字号越大会体现一个企业的大气感,其实这样往往适得其反。

你们一般在进行设计时,会使用几号字体呢?正文我最喜欢用的是14号、16号,我已经把我经常用的字号整理出来了,大家可以看下面的图哦。

字号

字色

两侧间距及模块上下间距的规范

在设计时,我们有必要两侧留间距,常见的有14px、16px、24px,上下间距常用10px,在开始做UI图的时候,最好确定好一个值,在后面设计其他页面的时候,都可以用同一个值,保证自己设计的风格,不会让人误以为随便留的。

两侧间距

模块上下间距

按钮及模块高度

按钮是UI设计中最常用的一个元素,几乎每个项目都会有它的出现,在不同的UI设计中,Button本身会根据主体风格制作,不同大小的按钮样式会有所不同,下面是我画出来的几种常用的按钮大小。

按钮

模块高度

图标及辅助线的规范

在画图标的时候,务必将图标限制在正方形中并创建为组件,这样既方便以后修改也方便开发。图标

16*16:非可单独点击;22*22:最小可单独点击按钮;24*24:表单小图标;28*28:底部标签栏,其他的视情况而定。

辅助线

UI设计中我们看见的辅助线一般分为两种:投影型、画线,我个人认为投影型是非常实用的,看起来不会那么死板,而且有一个好处,可以确定文案的位置,保证了设计的规范性,细节可以让整体看起来更完美。

图片、视频大小的规范

图片常用的比例为1:1、2:1、4:3;视频常为16:9,这里我讲的是我平常经常会用着的尺寸,还有其他的情况就个人而定哦!

总结:我们在平常的设计中只要能够把握这些设计的规范,对你所做的产品足够了解,就能高效的设计好的作品啦,唯有坚持,方能不负所爱,加油!

打字不易,欢迎点赞及评论,说说你们在UI设计中常用的规范是什么?

点击头像关注我,私信回复007,免费获得UI设计相关规范源文件,谢谢支持!

2024年ui规范建设思路 篇2

今天我来和大家讲讲UI设计需要学习什么理论知识?

1. 色彩搭配和版式处理,这块主要就是学的就是我们平时在UI设计中,设计时用的颜色和界面的版式这块。

2. 用户体验和交互逻辑,这块学习的就是UI设计中的UE和交互逻辑,这块主要讲的就是UI设计中的设计核心,及逻辑程度。

3. 透视原理,有良好的透视把控对于整个UI设计中的观察力可以得到进一步的提升。

4. 设计规范,这块讲的就是UI设计中的一些手机和平板的规范,比如苹果手机的各种尺寸等。都是UI设计中需要掌握的。

5. 手绘技法,手绘这块对于UI设计中的整个工作会有非常好的辅导作用。

6. 切图适配,主要是用来适配多种UI规范的方法。

这些就是U设计中的需要学习的知识,希望对大家有所帮助。

今天到此讲解完毕,希望对大家有所帮助

2024年ui规范建设思路 篇3

UI设计学习门槛不高,0基础也可以学习,如何快速提升呢??

我之前是在十月驿教育面对面培训的,可以分享一下我的学习课程和学历流程,整个周期是5个月,我当时是全日制学习的,提升比较快,目前工作也比较稳定,学的都能用得上,起薪是5K+五险一金。

第一阶段:设计软件(PS、AI、CDR)

我的第一堂课是CDR,试学了3天,之前咨询过很多学校,有一些学校课程是没有CDR课程,反正目前工作还是会用到,但不是很多,个人建议还是学一下,操作简单,易上手,作为新生,可以拿来过渡学习。。。我反正第一天比较楞逼,搞不清方向,总感觉自己有点弱智。。。。

我第一堂课的练习:

第二门课程是PS,此软件乃是设计的核心,你需要灵活互通,UI,网页,平面行业等都需要掌握,有了CDR的学习积累,学PS期间,感觉自己还没有那么弱智,哈哈!主要涉及到了修图,扣图,做合作,调色,图层样式,混合模式,滤镜特效等。。

做的练习都非常炫,个人在这个上面找到了点自信,觉得还蛮有意思的。。。

第三门课是AI,主要是做一些绘图排版,不过学了AI之后,觉得CDR可能不会在爱了,AI绘制的东西会更精细一些,效果更多。这个阶段我做了很多图标和LOGO,还有一些banner广告。。。

第一个阶段学完总结;学软件不能记步骤,要灵活运用,多做练习。

第二阶段:设计软件(素描、色彩、板式、字体、商业修图,C4D)

当一个小白来做设计,一定得具备一些设计上的思维空间,要不然会的仅仅是软件。。。

这个阶段,我积累了很多设计上的理念,设计思路。比如在色彩的运用,对比,色心里等等,看了非常多的优秀作品。当然大家有看书的习惯,也可以多买一些设计基础类的书籍,多积累一些思维素材。

美术基础2周的课程,主要是了解透视造型,光影明暗,手绘造型等,感觉还不够,下来自己买了一个手绘板,偶尔还是会玩玩!!!哈哈

字体和数码修图,这个阶段基本就开始做一些自己的作品了,毕竟现在设计都是图文排版,要把自己的品质提高,设计的元素,文字和图像一定的是更精细。

这个阶段感忽在设计上,建立了一些自己的思维,对后面的课程充满了自信心。。。。

第三阶段:WEB端界面实训

这个阶段主要是做整站网页,当然我也尝试到了所谓的“代码“,个人英语差,数学差,学代码的时候,头发都掉了一大把,调兼容,调bug,调对齐。。。。等等,反正目前工作确实还没用到,不过在和前端开发工程师沟通的时候,还是懂那么一丢丢,沟通上还不是那么困难,希望你能顺利拿下这个阶段。。。。

设计上是从电商过渡的,毕竟电商banner,详情不需要调尺寸什么滴,还算是比较简单,最后就是做的网页整站,做了2版,老师基本上都是会1对1去修改,目前工作做网页的时间还比较多,,,

这个阶段基本上把之前学的基础综合运用起来了,做的banner若干,电商详情3套,网页整站2套,我还算是比较刻苦,哈哈哈!!

第三阶段:APP应用界面实训

不好意思,时间原因,我长话短说了,APP除了考虑美观以外,还需要多关注一下用户群体的行为习惯,可以去看一些心理学之内的书籍,尽量满足到用户的需求。

后面还学了Axure 原型软件和AE动效设计。。。。

这些仅仅是一个建议,想要学的更好,除了老师的指导,更多的是个人,多花点心思。。。。。希望对你有帮助。。。

2024年ui规范建设思路 篇4

系统学习肯定是要报班学习的。毕竟网上的东西都比较碎片化。建议看看线上培训,不耽误自己任何时间。可以看看腾讯课堂里面,里面有很多UI免费体验课程的。

腾讯课堂里面米你课堂UI课程是唯一被腾讯认证的课程可以搜索看看。免费听听体验感觉一下。享受老师一对一指点的。

解答一些疑问

第一点疑问:我要学习什么软件?

01.Photoshop (图像图形绘制工具)

一般用于界面UI,图标以及简单插画的运用工具

02.After Effects(动效设计制作工具)

一般用于界面交互和动效制作的工具

03.Axure (原型图绘制工具)

一般用于脑图以及低保真线稿图制作的工具

第二点疑问:UI到底涉及哪些内容?

01. App的设计以及交互动效设计

02. H5的策划以及设计

03. 官网的Redisign

04.公司宣传画册的设计

05. 形象的品牌设计等

06......

所以之前有朋友问我,UI到底是做什么的,我一时半会说不上来,因为涉及的领域很多,你做的东西也很多,当你涉及的方面多了,你自身的优势就体现出来了,你的价值也体现出来了。千万不要想着,“我去的公司肯定让我做喜欢的,我就专门做网页设计,等等”,这不太现实。

现阶段,我的建议是,查找出自身的擅长热爱领域,专攻一项达到极致,其他方面用来辅助你,就够用了。

第三点疑问:如何开始学习?

01.AE

针对第一点学习软件,在这一点继续强化一下。首先为什么说要学习AE,因为从2016年开始,大家应该都意识到一点,那就是微交互时代的来临。你单纯做的静态稿已经无法满足客户的需求了,你需要有一些有意思的验,也对用户层非常关键。

(作者:雨成同学)

怎么学?我的建议是看看:doyoudo 以及 站酷的高高手课程,首先,上面的课程对于你学习动效基础入门都是很大帮助的,当你学会了,在进行自己思维得尝试,会做出很多酷炫不同的东西,当然取决于不同的人,你必须下定决心学好来。

你要做的,是不断的分析大量的优秀动效,不管是概念还是线上,你必须掌握了强大的技能,才能在将来处理各种动效得心应手,有时候,思维到位了,技术不到位,也只是扯淡。不断的看,不断的分析,不断的练习,你就可以在动效这一块学的很好,体验做的很好。

02.Axure

这款软件是针对产品经理比较多的学习模块,对UI要求不大,但是这一个软件也必须是要接触的,可以方便和产品沟通,有时候自己也可以充当这一角色,对自身很大帮助。

首先想讲讲,一个优秀产品上线的流程

01.需求分析(产品经理或者客户)→ 02.交互原型设计(产品经理或UI设计师)→03.界面设计(UI设计师)→切图注释交接开发→修改→进入开发→测试→上线....

不同的企业会有不同的操作方式,可以看到,从第二步开始基本上都是UI设计师可以接手的领域了,你如果对Axure这款软件操作明白,就可以做出非常棒的交互稿,不论是上线产品或者是自己的概念作品,都有很大的逻辑上帮助,也能看出你的专业性。

有关Axure的学习路劲可以到人人都是产品经理网站查阅,软件本身难度不大,稍微学习一段时间和一些简单的交互,你就能吧这项技能做的很好。

2024年ui规范建设思路 篇5

1、什么是UI设计?

UI设计英文叫User Interface翻译成中文意思就是(用户界面)。UI设计是指对软件的人机交互,操作逻辑,界面美观的整体设计。

说到这个界面设计,其实非常好理解,因为我们每天都在使用。我们手机里面的APP软件,QQ和微信的界面图标设计都属于UI设计师的工作内容

移动端互联网时代,每位同学都有一部智能手机,手机里面看APP界面图标,我们可以称为用户界面,也就是我说的UI设计。简单的来说,UI设计师就是负责设计这些在电子屏幕上显示的产品,(包括游戏UI,网页端,手机,以及目前比较火的VR,AR,其他设备端等)

比如微信界面、里面的图标 文字 图片整个操作点击 都属于UI设计师要设计的范畴。所以UI设计一直存在于我们的生活!

UI设计起源于美国硅谷,UI设计是2012年由硅谷传入中国,UI设计随着互联网行业的兴起和智能手机的普及而火的一发不可收拾。

UI设计是最近几年在国内火起来的,目前UI设计师的平均薪资是国内设计界薪资最高的行业,在北上广深杭这些一线城市UI设计师的平均薪资1万以上。从薪资不难看出UI设计这个行业目前在国内真的很火。

2.没有美术基础可以学习UI设计吗?

当然可以,美术基础并不是决定你能不能学好UI设计,能不能找到UI设计工作的关键。

学UI设计不需要美术基础,但是有一些手绘功底肯定是好的。

而且在 UI 设计风格越来越统一和组件化的趋势下,设计师的能力要求会越来越广,没有美术基础可以在其它方面得到弥补,比如说去年和今年比较火的插画,现在找UI设计工作很多互联网公司都要求需要会插画。

3.学历低可以学习UI设计吗?

当时可以,学历和美术基础差不多,并不是决定你能不能学好UI设计,能不能找到UI设计工作的关键。

没有学历也是可以学习UI设计的,但是学历高的人比学历低的人找工作有一丢丢的优势,

比如两个人同时被阿时巴巴选上当实习生,一个是博士后,一个是初中毕业,在能力相当的情况下,大部分被选中的肯定是博士后。

一般UI设计工作的公司都为互联网公司,互联网公司主要看的是作品和能力

对学历的要求较低,不像传统企业卡学历那么严格。一般大型互联网公司有大学学历就行啦,

如果你有足够好的作品,就算学历真的是初中学历也是可以去大型互联网公司的。

而且学历其实也是可以提升的通过成人高考,远程教育,自考等方式都可以提升。

4.想学UI设计,但是审美很差怎么办!

其实审美,并不是天生下来就会有的,

而是通过后期训练出来的,

那么如何训练才能提升审美呢。答案就是多看,看大量的好的UI作品,之后审美自然就提高了。

关键在于这个看,到底是看什么作品。

这是关键,看的作品一定要是大神的作品。

也就是高手的作品,只有这行内的大神的作品才值得我们去看。

因为他们能称为大神,其作品质量肯定很高,这些设计师的审美也是极高的。

那么我们如何找到UI设计大神的作品。这里推荐的一个网站做站酷网。

首先百度一下站酷网

看首页推荐的作品,这里共有作品不到2500个,也就是50万中选择出来的。

全中国十多年时间,只有二千多个能上首页。这些全是大神之作,

审美已经达到了高级的水准,这块设计师基本上月薪在3万以上。

同时作品的阅读量也是达到了5万以上,这些是大家公认的设计高手。我们可以多看这些作品,

5.什么人适合转行学习UI设计?

只要你想学习UI设计,对UI设计感兴趣,想改变自己,都可以来学习,

高门大户成功转型的人有职场新人、在校学生、宝妈、

程序员、平面设计师、 电商设计师、网页设计师、

工厂工人、电子厂工人、文员、会计、等。

6.没有任何基础的人可以学习UI设计吗?

可以,没有人天生就会,都是从零基础开始学起的

现在大学很少开设有UI设计这个专业,

UI设计是一个新型的行业,即使是平面设计转UI设计,

也需要从零基础学起,因为UI设计的技法和平面设计是有很多不一样的。

所有也不用担心自己没有基础而学不会了。零基础是完全可以学习UI设计的。

7.26岁了现在学习UI设计晚不晚?

不晚,在我看来学习不分时间和年龄,只要你有一颗热爱这行业的心,并能坚持做好它,那就为时不晚。

摩西奶奶77岁才开始学画画,80岁还办了画展,黄忠60岁跟刘备混,姜子牙80岁为丞相。不过大家有木有想想自己,当你老了,你还有学习的热

情和改变命运的雄心吗?这都是因为心里热爱,心中有梦。

年轻是资本,年长是经验,前者我们每个人都曾拥有,后者就要靠自己积累沉淀了!如果嘴上一直说自己年龄小、年纪大,学不好学不会,那都是借口!问题的关键不是年龄,而是学习的心态!

8.女生适合学习UI设计吗,会不会很难啊?

不少女生对UI设计行业都充满着向往,都想加入到这个高薪行业中来。那么女生适合学ui设计吗?女生学习UI设计会不会很难?UI设计相比较编程或者其它行业而言,还是非常适合女生学习的。

其实相比男生来说,女生更适合做UI设计师。

为什么这么说呢?

因为女生对色彩更敏锐,心思细腻,天生的审美能力等

UI设计师需要非常有时尚感,对色彩的把握要非常的敏锐,在这方面,女生要远远优于男生。所以女生学UI设计会更容易入门一些。

而且女生天生心思就很细腻,更容易注意到其他人注意不到的细节。科学家研究也表明:女性朋友思考问题是用左右脑同时思考的,考虑的东西往往会比较全面。

除了时尚感和对色彩的敏锐,女生也更容易揣摩客户心理,在实际工作中设计师需要与客户进行沟通,在沟通与交流中,女性明显也是有优势的,这对UI设计师来说也是非常重要的。

2024年ui规范建设思路 篇6

我们的移动端的UI设计规范也层出不穷。很多APP设计师也要在年底给公司或者是团队做一个总结。那么一个像样的APP ui设计规范也是很有必要的作品回顾。

在创业公司做着一位独立设计师,说好听点是独立设计师,难听点,就是唯一的设计师。创业型公司,UI UE你要全包。但是我还是很有追求的在每个版本改版之后,更新设计规范。我的设计规范没有大公司那么高大上,只包含了字体选用,配色运用,ui kit这些东西。

很多设计师做这个设计规范,纯粹只有两个原因:

1、要设计的界面太多了,而且产品迭代很快,来不及一个个界面标注重复性的东西,于是我就出一个字体运用规范,让开发看一个文档就好了。有个设计文档和UI设计规范,可以减少很多设计与开发之间的沟通。

后来给开发团队引进了zeplin,安卓小伙伴持续用着,ios开发,一直看着我的sketch源文件,在我教会开发sketch后,我连字体规范都少写了很多。

2、把这些东西一个版本的整理迭代好了,哪天来一场说走就走的旅行,没有交接成本,即使公司找不到设计师,开发哥哥直接用这个规范,就可以分分钟上岗党设计师了。直接甩这个规范的sketch源文件就可以了。

移动端一套完整的UI设计师也就是包含8个方面:

1、标准色

2、标准字

3、图标

4、 按钮

5、公共控件

6、模块

7、布局

8、APP效果展示图

换句话说就是

配色 字体 排版 布局 按钮 表单 提示框、标记、标签

弹窗、提示框 图片尺寸(banner、模块图片、头像图片)等元素进行规范整理。

也就是每一位APP设计师都会经历的一个过程。也是APP设计师学习和进步的过程

2024年ui规范建设思路 篇7

UI设计是指对软件的人机交互、操作逻辑,界面美观的整体设计,也叫界面设计,而我们常用到的领域是软件开发,游戏开发,网页设计制作。

UI的职能大体包括三个方面∶

一.图形设计,软件产品的产品“外形”设计

二.交互设计,主要在于设计软件的操作流程,树状结构,操作规范等,一个软件产品在编码之前需要做的就是交互设计并且确立交互模型及交互规范。

三.用户测试/研究,这里所谓的“测试”,其目的在于测试交互设计的合理性及图形设计的美观性,主要通过以目标用户问卷的形式衡量UI设计的合理性。

UI的发展我们大致了解一下

最早出现UI模型是Windows1.0,那个时候还没有固定的概念,就连创造者也未发现其定义。当移动端UI的出现,特别是iphone的出现,让大家开始关注;UI的兴起时期在60年开始的,手机,平板及WEB UI对用户的体验越来越专业,对用户的体验也表现的越来越重视,这对UI设计师来说是个美好的时代,经过十几年的积累,每个UI设计师都有独特的一面∶

懂需求的UI,他们都是折翼的天使,当需求给到UI的设计人员,设计师懂产品,懂UE,懂用户体验,懂数据,还能在还原度上有所开发,这样的设计师,是现阶段,最原汁原味的,最资深的UI

懂代码的UI,UI也要懂代码吗,太扯了吧?你没看错,我想说,如果你会代码,你就不用听码农在那跟你说这个不行那个不行的时候,你自己撸起袖子码给他看!你简直就是设计界的战斗力,你的想法不再是一张张YY出来的只能看的图。

懂运营的UI,这可能是个更高境界的UI了,他可能是UI中的总监,它将摆脱那些扁平的需求,将平面设计能力,手绘造型能力,创意表达能力结合起来,创造更具个性化的产品,用户的体验,用户的情感都将调动起来,说用户像膏药一样黏着你的UI也不为过。

然而,想要成为一个出色的UI,你学习的东西越多,你越能越专业,下面就简单列出一些基础的学习内容∶

一.设计基础,字体,构图,手绘,平面,二维及三维。培养视觉敏锐度和绘图能力

二.软件应用,Photoshop,Illustrator,字体专项设计,平面项目设计。

三.WUI设计基础,Fireworks,Flash,Web网站设计,HTML5语言。

四.交互设计,手机主题,界面与图标设计;拟物化与扁平化设计;系统性学习苹果Ios设计规范;系统性学习Android设计规范。

猜你喜欢

热门内容