请选择 进入手机版 | 继续访问电脑版

【设计篇】在界面设计中新手不知道的那些事系列(一)

发表于 2017-12-26 09:30 显示全部楼层 15 223

本帖最后由 孙傲 于 2017-12-26 11:24 编辑

一、前言      

  

自从大学毕业一转眼已经在设计行业摸爬滚打一年半了,这是我在这将近两年的工作中积累的一些小小的经验想分享给大家,希望对于刚入坑的小伙伴有些帮助。接下来是我个人的见解,如有不妥的地方欢迎批评指教。


对于我来说,刚开始是带着期待和懵逼的表情来到了UI设计行业,我在刚开始接触UI的时候,是在大二的时候,是一次偶然的机会在网上了解到UI设计,这个听起来不知道是什么东西的东西,感觉还挺高大上!于是就习惯性的打开百度,搜索UI设计。。。。



1513653451588007.png

blob.png



这才知道,哦!原来就是大家使用手机或者电脑浏览网页的界面既用户界面(User Interface简称UI),有了这个概念之后,我就开始收集一些关于UI设计的视频教程,在我自学的这段时间里,过程比较漫长而且要有足够的自制力才可以,前前后后对UI设计有初步的认识,并在大四实习中找了一份UI设计的工作,当然实习的过程中有一个师父待着,然后学了很多关于UI设计的必备技能。往事不再多说,接下来开始进入正题,我将在这个帖子中和接下来后续的帖子中展开这些话题:UI设计工作主要是做什么?UI设计师需要必须会的哪些技能?设计师在工作可能遇到的那些问题?




二、UI设计工作中主要做什么



随着互联网的发展,UI设计已经是设计行业中不可缺少的一个分支,从事UI设计的行业的工作人员被称作为:UI设计师(设计狮、设计尸)或者是视觉设计师,当然也有比较low的称号:美工(主要工作美化图片)。


为什么同样是设计为什么名字却不一样?


这个实际上是有他们的工作内容决定的,那首先要弄明白一个职能的分配


UI设计=界面设计+交互、美工=修图


三、设计界中有哪些主要的界面设计?


1、网页界面设计





网页设计(web design,又称为Web UI design,WUI design,WUI)是一种大家接触最早,最常见的一种界面设计,网页设计大多数是使用浏览器打开,主要使用的设计工具包括Photoshop、Illustrator、Flash、 After Effects,开发工具主要包括Dreamweaver,sublime,现在随着H5和CSS3技术的更新,网页设计也发生了很大的变化,出现了更多的炫酷的、用户体验更好的、交互性更强的界面设计。随着移动设备的出现,网页设计分为:PC web,APP web,iPad web,因而一种随设备变化的而改变网页版心的设计就是响应式设计。



2、APP界面设计





APP设计是UI设计行业中最热门的一个分支,主要原因是因为大家无时无刻都在使用手机,它和我们的生活紧密相连,同时也自然激发了APP界面设计的快速发展,目前APP设计主要的载体设备是IOS系统的苹果手机,和Android系统的安卓手机,主要使用的设计工具是Photoshop、Illustrator(图标绘制)、Mac系统下的sketch(图标绘制)软件。


3、后台界面设计



blob.png



后台界面设计大多是给专业人士使用的办公软件,用于处理数据,提高办公效率用的软件,比如常见的点餐系统、crm系统等等。使用的载体通常是浏览器和平板,设计时要求界面是宽度是自适应,这样可以试用多分辨率屏幕。


4、自助终端界面设计




自助终端设计是比较冷门的一个,虽然在生活中随处可见,但相比移动设备它的使用率还是非常低的,一般都是特制的屏幕大小



5、VR界面设计


随着VR技术的推广,更多的VR产品的出现,目前VR界面设计也慢慢的火了起来,可能不久的VR设计也会慢慢扩大市场。


四、在界面设计中有没有通用的设计法则?


那么好看的界面都可以设计出来,通用的设计法则肯定是有的


界面设计=Kit设计+图片素材;


Kit指的是界面中所用到的组件或者元件,例如:按钮,表单,图标/icon,你可以把它理解为是盖房子用的“砖”。


那么问题来了,这些砖从哪里来呢?


答案是自己造


设计每个APP界面或者网页界面等都有一个叫做设计规范的东西,而这个设计规范就是用来制作上边所说的Kit,而设计规范哪里来呢?答案就是你存在我深深的脑海里!what?不明白?


对于一个刚刚从事UI设计的新人来说,设计的界面就像一个零散的队伍一样,无拘无束,看起来很混乱,自己也不明白为什么会这样。其实是忽略了一样东西,那就是设计规范。常说无规矩不成方圆,所以同样的道理再设计界面的时候,规范也是必不可少的一部分。


我们在设计中会设计一些图标,那你有没有想过图标大小有哪些规范呢?图标也是有很多规范,比如风格统一(线性图标、填充性图标),大小在视觉上保持一致,这些规范都是为了保证界面的统一性、工整性、避免界面出现混乱。


在设计中间距也有规范,模块之间的间距,字体的行间距,同样按钮、表单、图片、交互、都有规范。

设计规范文档分享


链接:https://pan.baidu.com/s/1slNtKZV

密码:9ik3


图片素材主要是有美工提供,比如淘宝里面的banner图,以及产品图。但如果你们公司没有美工,那么,UI设计也就包括美工了。


五、在界面设计中还有一个很重要的要素:交互



交互是在界面设计中贯穿整个界面的灵魂,它不单单只是一个操作,它还决定着你设计界面时的布局,还有美观度,交互和界面之间相互影响。好的交互可以搭配出很好的视觉感的界面,以及给人很好的用户体验。所以一个好的产品原型和一个好的交互决定着产品的灵魂,它可以决定界面的整体效果,以及产品的成败。


六、界面设计之后切图标注也很重要



UI设计师还要做的就是配合后台开发人员进行切图,还有界面的标注,在设计的过程中会有设计规范,所以在标注的时候就要严格按照设计规范进行标注,切图也要按照设计规范切图。


设计工具大全网站

http://tool.ui.cn/



3、结语

    

在UI设计这个行业中其实一开始比较困难,会觉得这个行业比较坑,但坑的原因其实不怪别人,只怪自己的技术水平还很低,所以与其抱怨不如来点努力,无论是哪个行业不努力终将都会淘汰,只有不断的学习才可以跳出重围,迎来光明。同样努力的同时方法更重要!



UI设计师都知道的网站:https://huaban.com/qpwslqtkgx

偷偷告诉你这个是我的个人主页,介不介意互粉一个




1514175881211518.png


个人微信号,欢迎来扰



往期好文


【设计篇】在界面设计中新手不知道的那些事系列(二)



回复 使用道具
举报
nettman

发表于 03-02 21:09 显示全部楼层

回复 支持 反对 使用道具
举报
biubiuamy

发表于 02-22 18:13 显示全部楼层

回复 支持 反对 使用道具
举报
我不想静静

发表于 02-14 16:18 显示全部楼层

回复 支持 反对 使用道具
举报
paschen

发表于 02-08 01:57 显示全部楼层

回复 支持 反对 使用道具
举报
我爱大菠萝

发表于 01-28 02:35 显示全部楼层

回复 支持 反对 使用道具
举报
你讲咩话

发表于 01-24 07:26 显示全部楼层

回复 支持 反对 使用道具
举报
森之树

发表于 01-18 17:28 显示全部楼层

我思故我在,我在我就回

回复 支持 反对 使用道具
举报
张比亚

发表于 01-12 20:56 显示全部楼层

祝愿小码哥越来越红火!!红红火火恍恍惚惚!

回复 支持 反对 使用道具
举报
中华高露洁

发表于 01-05 10:49 显示全部楼层

给楼主32个赞!!!!!

回复 支持 反对 使用道具
举报
12下一页

发表新文章
孙傲

小码哥会员

0

学分

251

学币

263

积分

小码哥会员

Rank: 3Rank: 3

积分
263

关注新浪微博

Ta的主页 发消息
精华帖排行榜

精彩推荐

  • 关注小码哥教育