UI设计初学者应该如何入门?

简介: 1、UI设计师是什么?不说UI设计师,就连设计师,很多人都以为只是P图的美工,这里有必要先明确一下UI设计师的概念。当我们要学习一门技能,进入一个行业的时候,此时此刻正确的认知对于我们来说太重要了。

1、UI设计师是什么?

不说UI设计师,就连设计师,很多人都以为只是P图的美工,这里有必要先明确一下UI设计师的概念。当我们要学习一门技能,进入一个行业的时候,此时此刻正确的认知对于我们来说太重要了。行业是什么,做什么,学什么,怎么做等等基本正确认知一定要知晓,我们先来看下官方的定义。

维基百科对于UI定义:

UI,也即用户界面(UserInterface,简称UI,亦称使用者界面)是系统和用户之行交互和信息交换的媒介,它实现信息的内部形式与人类可以接受形式之间的转换。因此,UI设计师也就是设计用户界面的人。

这段话前面两句可能大家不太熟悉,最后一句UI设计师就是设计用户界面的人,这个相信大家都能理解,也就是说,我们手机所看到的所有界面都是由UI设计师所设计的,就例如打开微信,微信的界面,聊天窗口,朋友圈等等这些界面都是UI设计师所设计出来的。

那么前面这段话:是系统和用户之行交互和信息交换的媒介,它实现信息的内部形式与人类可以接受形式之间的转换。

这是什么意思呢?这里也有必要让大家深刻的去了解一下,作为零基础小白人来说,用最通俗的话来去解释再好不过,如果还是官方话术,那就等于白说。我这里举例来说明,就例如我们要研发一个聊天软件,起名为微信(举例),我们前期要策划,规划,对不对,怎么聊天,怎么发语音,怎么发视频通话,这些功能都要实现出来, 好,此刻我们研发好了,但是我们要以眼睛能看到,以及用手去触摸的形式来操作啊,例如,按钮啊,图标啊,界面的设计啊,这些都要视觉设计师来完成,好了,此刻我相信大家明白,UI设计师是干什么的了吧,对,就是视觉设计,把那些功能全部视觉化出来,给人们以能看懂的方式来展示,然后去交互去产生行为互动。

OK。我们UI设计师就是主要做这个,当然随着时代的发展,我们UI设计师其实需要掌握的东西会更多,以后我们在继续交流,这里就给大家解释这么多。

所以毫不夸张地说,在这个颜值当道的年代,UI设计师的水平,直接决定了互联网产品(网站、App、网上店铺等)的颜值。

无论产品的质量怎样,用户接触产品的第一幕,就是UI设计师给产品设计的这张脸,一个好的UI设计师,能润物于无声,在浑然天成的设计中为产品注入新的价值,绝不是普通的打杂美工。

2、UI设计师的基础修养

设计总体认知

在进入一个未知的领域前,我总倾向于先梳理这个领域的架构,待有了比较全面认知后再深挖。

这其实也是大学专业课程设置的思路,先学习一门导论课,了解基本概念,再进入细分领域。

学习UI设计也是一样,先对整个设计专业有总体认知,再去学技法层面的内容、规则,慢慢把知识库填充完整。

如果有条件,可以尝试了解一个新的互联网产品出炉的工作流程。这样,在局部学习前,就能对重难点、课程框架都心中有数。

就例如我们的UI设计师培训班,90%都是以企业实战案例为主,讲解的都是已经上线的产品APP,学员学习之后就等于直接有工作经验,符合企业用人标准,拥有项目经验,能快速上岗工作。

技术基础

如果说程序员一天中大部分时间都在码代码,那么设计师的时间都留给了Photoshop、Axure、 Illustrator,After Effects涂涂修修确实是常态,而这里,也是“美工”称呼的发源地。

娴熟的技法,是完美展现设计作品的必备条件,作为UI设计师,也应当熟练掌握这些常用软件。

稍低一点的要求,是至少能精通其中一款软件,各种操作都已经形成自然反应,其他软件也能通个七八分。

不过,学完这些软件之后,切忌炫技,学到这步,你只是学会了修图,还只在美工的地步,并谈不上设计。

因为往往就有一部分人会有错误的认知,一提到学习设计,就想到学习软件,同时埋头在软件一学就是一年两年,有的人甚至更久,可以说是盲目学习,所以这里给大家重新认知一下,设计并不等于软件。

绘图基础

有人以为,设计师只要去图库网站找一些素材,借助工具进行修饰即可,其实这只能锻炼你的借鉴能力,当你的技法娴熟到一定程度,就可以尝试临摹。

通过临摹,一则用来强化技法层面的能力,二来也能提升初学者的创新能力。

临摹的内容,可以有两方面选择:一种是系统自带的图标。

比如Mac OX、Windows,或者移动端iOS、Android的原生图标,都是精心打磨过,既能帮助初学者了解平台设计规则,又能在临摹中逐渐巩固常用软件的技术。

另一种则是行业牛人的设计作品,捉摸他们的设计风格、思想和细节,都能加深对设计的认识。

各平台设计规则

iOS、Android、WP、Windows、Mac OX各个平台都有自己的设计规则和偏好。

在移动端,连每款机型的分辨率、状态栏高度、导航栏高度、图标尺寸、字体、颜色值都有严格的规定。这些平台的设计规则,在搜索引擎上都能被检索到。

理解能力

作为设计的上游,产品经理常常会直接发需求文档给设计,能读懂产品文档、快速分析需求,定位出风格、色调、元素,最后迅速把产品需求视觉化,就是产品经理们最爱合作的设计师了。

对于新手来说可能有点慌,不知如何下手,同时如果是自学的人也会比较困难,自学的人一般都是没有实战项目经验,当你真正去工作的时候,肯定会表现出一些慌张无法下手,这也是我接触很多自学的人所倾诉的内容,他在公司不可能问领导,问同事也不好意思,有时只能到网上找帮助,或者问老师来解决。

所以对于新手来说,前期的学习是至关重要,你所接受的知识体系会决定你以后的工作发展,系统的学习UI知识是非常关键的。

总结:技术基础,绘图基础,各平台设计规则,理解能力,思维能力等,这是我们学习UI设计的大步骤,但是这只是笼统的,那么我这边也给大家整理了一份,UI设计师必须的内容,以及要达到什么层次,学习到什么结果,分享给大家,内容会非常干。

一、UI设计美术阶段 

学习内容:素描关系、光照现象、光影绘制、透视、基础造型、构图原理、手绘图标

完成作品:UI设计手绘图标


二、UI设计软件阶段 

学习内容:PS+AI+AE+ARP软件从基础到精通

完成作品:熟练PS+AI+AE+ARP软件


三、UI设计案例阶段 

学习内容 : 布尔运算技法、扁平化图标、拟物化图标、系统图标

完成作品:系统图标、拟物化图标、扁平化图标


四、UI交互设计阶段 

学习内容:交互原型图、交互逻辑理论、线框图设计、头脑风暴讲解、ARP软件运用

完成作品:低保真原型图、高保真原型图


五、UI视觉设计阶段 

学习内容:广告banner、APP界面、版式布局、安卓规范、苹果规范、色彩搭配、用户体验

完成作品:APP设计作品


六、UI动效设计阶段 

学习内容:AE软件运用、UI图标交互动效、UI界面交互动效

完成作品:APP交互动效作品


七、UI网页设计阶段 

学习内容:Web界面设计规范、多风格多类型界面设计、网站宣传品设计、电商专题、产品宣传页设计、网页Banner广告设计

完成作品:企业网站与个人网站作品


八、就业指导阶段 

学习内容:如何找工作、和面试官如何谈话、作品集如何制作、简历如何制

完成作品:面试作品集+高逼格作品简历

总结这么多,可以说是非常之详细了,这也是UI设计师必须要掌握的技能,get到了也希望大家多多支持,点个赞转个发。

3、UI设计师的进阶修养

审美意识

很多人遇到这个问题,都会说我没审美,还能不能学习UI设计啊,或者还有同学会说审美差怎么办啊?

其实审美,并不是天生就有的,审美全是后天培养的,不管是设计,还是其他的一些事情,对于美与丑,都是后天的学习与指导产生的,也就是说这都是从小就开始养成的,从小就开始培养的,就跟小时候大人教我们那些事物是好的,那些事物是坏的,是一样的道理。

美这个词是说不尽的,就比如说我们和西方国家,针对美的看法就不一样,我们觉得西方的美女很冷艳,高大,这就造成审美不一样,他们反过来他们也会觉得我们也不一样,这也是环境导致的,从小接受的事物决定的。

那么设计也是一样的道理,刚学习UI设计的零基础学员,应该怎么样提升自己的审美呢?答案就是多看,看大量的好的UI作品,还得坚持看,每天看,自然你的审美就提高了,提升审美就是这么简单,但是要坚持才行。

所以审美意识要如何培养、提高?唯有日积月累地浏览、学习、思考、联系,大概就是逐渐提升的可能途径吧。

用户体验

从前,除了设计界面的UI设计师之外,互联网公司会专门设置专门的用户研究中心来处理用户体验的种种问题。

但如今多元的趋势下,一个互联网产品的视觉设计,需要懂一点产品、懂一点用户体验,才能更有效的推进合作流程。

同时也会培养自己多元化的思维方式(用户研究以缜密的逻辑发展,而UI设计则更加追求审美)。

交互设计

分不清交互和UI的人,可能一抓一大把,事实上,这还是有区别的。从一般意义上说,UI主要做的是图形用户界面,也可以称为GUI设计师;

交互设计主要做处理点事人机互动的界面,任何与机器打交道的过程,都需要交互设计师来参与。

但坦白说,现在的App中,有多少操作能把UI和交互完全清楚地剥离开来呢?

一个好的产品,需要美观的界面和顺滑的交互,也就离不开设计师两种能力的相辅相成了。

尤其现在,设计趋向扁平化的时期,只要遵循设计规范,交互设计甚至能出了设计稿后直接给开发去实现,单纯UI设计的存在感日益弱化。

所以我们纵观以前和现在,行业的发展,时代的变迁,导致我们各行各业都是多元化,真的是,你不多学点东西,根本没人要你啊,最后真的只是淘汰的名额,每日提升,保持终生学习的态度是每个人必须要有的。

4、资料

下面推荐一些适合入门的书籍与网站,以供参考。

阅读书籍

《Don’t MakeMe Think》(点石成金)

这本书已经了好几版了,能这样一遍遍修订出版的,除了学生用的教材,就是业界的圣经了。

这本书主要讲的是如何通过网站设计来提高网站的可用性,除了网页设计外,也包括了一些用户心理研究等内容,语句晓畅,读起来十分轻松。

里面的案例虽然有点久了,但经典的案例永远不会过时。作为初入学者,能从一本书里看到整个领域的大局,也有逐渐养成设计师的思维,是入门启迪型书籍。

《写给大家看的设计书》

一本Robin Williams大师写的老生常谈,本书主要围绕对比(Contrast)、重复(Repetition)、对齐(Alignment)、亲密性(Proximity)四个设计基本原则展开。

短短200页,门外汉读起来也不费力,但读完这本书你会明白设计的重要性。另外,这本书的排版、文字编排也很有设计感,读起来更加舒服。

《破茧成蝶:用户体验设计师的成长之路》

前面的书是理论型的,这本是则比较注重实践,结合本土互联网公司案例解释了很多落地的问题,甚至还有具体岗位介绍,面试细节,工作流程等,可以作为工作的工具书。

《设计之下》

通过搜狐新闻客户端UED团队的设计过程,完整展现真实的设计流程。全书分为三个部分。

第一部分为“交互设计”,主要总结了大局观、操作流程简捷、形式新颖且统一、各种特殊情况等交互设计要点。

第二部分为“视觉设计”,阐述了界面、颜色、图标、质感、动画、等具体方法。

第三部分为“他们眼中的优秀设计师”,

通过产品经理、程序员、运营、市场经理的视角,阐述了如何成为一名优秀的设计师,同样是1-2岁的设计师学习的好书。

《腾讯传》

这本书主要讲的是腾讯公司的成长经历,吴晓波花了五年时间写的,

写的非常的细致,腾讯公司在中国互联网行业是非常牛的,

比如这个公司开发的产品,微信,QQ,王者荣耀,

全是非常火的产品,通过这本书的阅读

可以让我们对中国超级互联网的产品设计有一个很深的认知,

产品设计指的就是UI设计,到于学用户体验帮助非常的大。

用户体验也称UE是学UI必学的知识点。

《乔布斯传》

这本书讲的是全世界第一的互联网公司,

苹果公司的创始人乔布斯的故事,是所有UI设计师都值得一看的书,

要知道现在的UI设计之所以这么火,

很大一部分原因就是苹果手机引起的,

自从苹果4上线以来,全球的手机市场,UI市场,发生了非常大的变化,

增长非常的快,乔布斯也号称全世界最伟大的产品经理,

通过本书的学习可以让我们了解全世界第一的UI设计作品是怎么设计出来的。

优质网站:

灵感枯竭的时候,觉得自己审美不够的时候,都可以去下面网站逛逛,寻找灵感,提高审美,陶冶情操。

下面是互联网公司UED部门网站:

干货很多,值得学习,百度搜索名称

腾讯CDC

腾讯ISUX

阿里巴巴UED

百度用户体验中心UXC

网易用户体验设计中心UEDC

360 UXC用户体验设计中心

各类App:

各种榜单、推荐应用的账号上新出来的App都可以关注,App集邮能力,就是你资历的一部分,很多超越也是在巨人的肩膀上改出来的。


4、练手

光说不练假把式啦~

参加比赛:

现在手机主题设计、App皮肤设计各种比赛到处都是,有一定技术之后可以参加比赛,都是锻炼人能力,崭露头角的好地方,作品被选上的话就直接拿奖金了。

网上接单:

虽然听上去有点微妙,但临摹能力、技术能力,这些都能在接私活中慢慢培养起来,而且还有真实收入。很有可能,你之后面试的作品就是私活带来的。

就业实习:

既然要入行,当然要去里面自己体会下个中滋味,如果有幸去了大公司,很好你就能熟悉一套规范的设计工作流程;

如果去的是小公司,那你可能就要成为独当一面的全能手了。总之,出去历练,是走向社会的第一步。


5、一点醒脑剂

最后说一点自己的想法

很多人说互联网寒冬来了,眼看着找不到工作的学弟学妹逃离北上广深,缩招裁员越来越明显,

就极力游说周围的人别再从事程序员、设计师、产品经理等与互联网相关的岗位。

其实我始终不太赞同这个观点,这只是前几年互联网过度乐观膨胀发展后终于回归理性而已。

回归理性,意味着已经过了人有多大胆,地有多大产的时代。

回归理性,意味着行业从野蛮生长逐渐转向遵循市场规律。

回归理性,意味着企业对人才需求仍在,但要求渐高。


所以,做一个不那么恰当的比喻,

多才多艺的设计师就像一线城市的房价,尽管开价很高但还是供不应求。

学艺不精的设计师就像十八线城市的房价,在一路下跌的颓势再也硬不起来。

核心技能点是人才流通市场上永远的硬通货。

那么有想真心想学好UI设计,掌握一门技术,从事UI设计师,请点击文字链接,查看我们的全能UI设计师培训班课程,来进行系统的学习。

课程介绍:UI设计全能就业班,零基础学习UI,四个月入职互联网公司,逆袭成为年薪20万的UI设计师。

目录
相关文章
|
3月前
|
开发框架 前端开发 .NET
七天.NET 8操作SQLite入门到实战 - (1)第七天BootstrapBlazor UI组件库引入
七天.NET 8操作SQLite入门到实战 - (1)第七天BootstrapBlazor UI组件库引入
|
1月前
|
XML API Android开发
【Android 从入门到出门】第三章:使用Hilt处理Jetpack Compose UI状态
【Android 从入门到出门】第三章:使用Hilt处理Jetpack Compose UI状态
26 4
|
1月前
|
存储 XML 编译器
【Android 从入门到出门】第二章:使用声明式UI创建屏幕并探索组合原则
【Android 从入门到出门】第二章:使用声明式UI创建屏幕并探索组合原则
48 3
|
7月前
|
Web App开发 Dart 开发工具
谷歌移动UI框架Flutter入门
谷歌移动UI框架Flutter入门
|
JSON 小程序 前端开发
uni-app入门:小程序UI组件Vant Weapp
Vant Weapp 是一个轻量、可靠的移动端组件库,于 2017 年开源,是由有赞前端团队开源的小程序UI组件库,可以简化小程序开发。
uni-app入门:小程序UI组件Vant Weapp
|
资源调度 前端开发
阅读源码入门实践系列之 element ui(1)
阅读源码入门实践系列之 element ui(1)
130 1
|
Kubernetes 关系型数据库 数据库
基础设施即代码(IAC),Zalando Postgres Operator UI 入门
基础设施即代码(IAC),Zalando Postgres Operator UI 入门
115 0
基础设施即代码(IAC),Zalando Postgres Operator UI 入门
|
移动开发 前端开发 JavaScript
HaaS UI小程序解决方案进阶教学之一:Canvas画图入门
canvas的应用场景非常多,主要运用在一些需要操作图形的场景,如绘制曲线、特效、粒子特效、图表、游戏、二维码、条形码等等场景。
HaaS UI小程序解决方案进阶教学之一:Canvas画图入门
|
前端开发 JavaScript 程序员
layui(类ui)入门指南
开始使用 - 入门指南 l        ayui(谐音:类UI) 是一款采用自身模块规范编写的前端 UI 框架,遵循原生 HTML/CSS/JS 的书写与组织形式,门槛极低,拿来即用。
2934 0
|
前端开发 JavaScript .NET
菜鸟入门【ASP.NET Core】14:MVC开发:UI、 EF + Identity实现、注册实现、登陆实现
前言 之前我们进行了MVC的web页面的Cookie-based认证实现,接下来的开发我们要基于之前的MvcCookieAuthSample项目做修改。 MvcCookieAuthSample项目地址:http://www.
2026 0