您还没有专辑

开端创建本身的专辑吧

创建
您可在小我中间-我的专辑处检查
以后地位:首页 > UI设计 > 『UI入门』带你梳理视觉层次

『UI入门』带你梳理视觉层次

手机不雅看

扫一扫下载虎课app

支撑离线缓存,随时随地进修

VIP优惠升级 21大年夜分类,畅享49000+设计教程特权!

为本身充值升华进修
昔日残剩进修次数:1

按住画面移动小窗

『UI入门』带你梳理视觉层次

播放卡顿?建议切换线路

宽屏撤消宽屏

学设计上虎课网

进修意犹未尽?成为VIP,持续晋升

收费进修行将停止

封闭持续进修>

发表评论
收起宽屏
分享给同伙:
手机不雅看

扫一扫下载虎课app

支撑离线缓存,随时随地进修

添加到专辑收藏已收藏收藏成功,可进入小我中间-课程收藏 检查!
EthankDesign
EthankDesign

存眷人数:26913

目次信息笔记
图文教程学员评价 (1041条评论)视频字幕检查优良作品>

1.不合的视觉层级,带给人不合的视觉感触感染。

2.可以经过过程【卡片突显】、【图标突显】、【列表弱化】等方法,来表示视觉层级。

3.用户和产品的存眷点是我们存眷层级的重要缘由。

4.好的层级应当具有【从强到弱】、【公道分布】的属性。

检查更多
课程综合评分:9.9
课程难易程度:太简单(30)简单(202)适中(717)有点难(32)太难了(6)
您须要进修后才可以评价,急速进修
课程综合评分:9.9
课程难易程度:太简单(30)简单(202)适中(717)有点难(32)太难了(6)
您须要进修后才可以评价,急速进修
评论列表
仅显示有内容的评论
仅显示带图评论
排序方法:

大年夜家好 我是EthankDesign ,那明天此次课程给大年夜家带来是我们 ,UI体系课程中的视觉层次梳理 ,那么讲到视觉层次梳理的时辰我信赖 ,很多同窗们会有个小困惑 ,师长教员甚么叫层次性呢 ,那在答复这个成绩点的时辰呢 ,我们想结合一个 ,改版前后的案例 ,来给同窗们停止成绩的讲解 ,起首我们来看一下改版之前 ,我们可以把这个页面停止不雅察一下 ,这个页面它其实不管是在一个 ,设计角度上照样在一个 ,排版的角度上都没有很大年夜成绩 ,那么没有很大年夜成绩的页面 ,我们若何经过过程 ,层次性这个角度 ,把这个界面做的加倍优良 ,我们带这个成绩点可以来看一下 ,改版以后 ,改版以后这个页面呢 ,其实我们可以经过不雅察发明 ,左边左边这个界面停止比较一下 ,同窗们也能够跟随我的角度 ,来停止一路比较一下 ,变更最大年夜的其实其实不是说 ,改版后它的在设计清楚度上 ,有了多么多么大年夜晋升 ,其实我们感到改版以后 ,它为甚么做得加倍好呢 ,就是由于我们层次性做得加倍好了 ,我们重点来看一下改版以后 ,为甚么改版以后层次性做得加倍好呢 ,它有哪些点的一个别现 ,那么表如今哪些点呢 ,我总结了有以下这三点 ,第一点就是卡片的突显 ,第二点就是图标的突显 ,第三点是?列表的弱化 ,就是我们可以不雅察到发明层次性 ,若何做好层次性 就是 ,把该重要的版块把它突显出来 ,把弱化的板块把它弱化下去 ,有强有弱就是我们的层次性 ,那经过这类简单的文字阐述 ,信赖大年夜家不会很笼统 ,我们照样要结合界面 ,来停止详细不雅察一下 ,起首我们可以看到卡片的突显 ,在这个页面中 ,用户欲望重点看到哪个版块 ,比如说用户欲望看到 ,

重点看到如许一个 ,资金罗列的版块 ,那么用户既然想 ,重点看到这个版块 ,那我们能否可以在设计角度上 ,把它应用一个卡片化的设计 ,把它突显出来呢 ,我们可以经过不雅察发明 ,应用一些卡片化的设计以后呢 ,我们在一些版块的一些 ,重点视觉划分上是做得加倍优良的 ,那第二个点就像我们之前所讲的那样 ,图标做到了一个突显 ,用户在用这个界面的时辰 ,他重点会用哪几个功能 ,用户在用这个界面时辰 ,他肯定不会说 ,他每个功能都邑用 ,这类情况是根本上不会存在的 ,那比如说用户会重点用这四个功能 ,那我们能否可以把这四个重点功能 ,在设计角度上把它突显出来 ,那第三个点就是 ,用户假设不太会用的 ,一些帮助功能的时辰 ,我们在视觉角度上 ,能否可以把它停止恰当弱化 ,所以说我们可以把它再停止总结一下 ,一个好的层次性我们在 ,设计角度上就要做得有强有弱 ,有强有弱的一个界面我们才 ,在用户体验中才能够把它称之为是一个 ,比较不错的界面设计 ,那总结完改版前后这三点以后 ,我们往复到全部界面本身 ,我们来停止总结一下 ,就是为甚么要存眷层次性 ,存眷层次性以后 ,好处是在哪里 ,那这个成绩那我把它停止了个总结 ,那么经过多年的一些职业沉淀 ,我们认为 ,设计它实际上是一门办事型的角色 ,办事于产品办事于用户 ,你要想站在用户这个角度来思虑一下 ,用户在用你这个界面的时辰 ,他会重点存眷哪些功能 ,别的产品在设计全部 ,界面原型阶段时辰呢 ,他欲望它突显哪里一下 ,所以说设计要做好办事 ,就是说要办事好用户办事好产品 ,把用户和产品他存眷一些重点 ,在设计角度上把它突显出来一下 ,

这就是设计师为甚么要存眷 ,层次性的一个出发点 ,那下面我们就要停止一些迷信的梳理 ,把若何做好层次性给大年夜家梳理清楚一下 ,课程整领会经过过程以下这 ,三个版块来给大年夜家停止讲解 ,我们起首来看一下第一个版块 ,版块层次的三种层次性次序是怎样样的 ,那在讲到三种层次性划分的时辰呢 ,这边我罗列了网易严选这个产品设计 ,那么在全部课程中 ,我会给大年夜家罗列很多一些成绩点 ,欲望大年夜家可以或许 ,带着成绩一路参与到 ,全部课程的互动中来 ,那么如许呢 ,大年夜家全部课程的吸见效力 ,才能够更好的晋升下去 ,我们可以不雅察一下全部界面 ,从上到下逐一不雅察一下 ,大年夜家认为这个界面的层次性是怎样样的 ,或许说全部界面中 ,层次性比较强的是在哪里 ,层次性比较弱的是在哪里 ,可以简单的不雅察一下 ,那么经过一些不雅察以后 ,我们可以发明层级最强的 ,那就是它的全部 ,banner版块为甚么banner版块它层次性比较强 ,主如果由于它这边 ,用到了一个图片 ,所以我们可以总结出图片 ,是在全部层级性上 ,是划配划分比较强的一个版块 ,那不强也不弱的版块它就是一个图标 ,那最后也固然是一个层次性最弱 ,最弱的一个版块那必将是一个文字 ,那经过这些由强到弱的总结以后 ,有甚么好处呢 ,总结完以上这三点我们认为 ,你只要做到一个由强到弱的 ,一个划分的时辰呢 ,你全部界面才能够做到一个 ,公道分布 ,所以说大年夜家前面再做一些 ,原型设计需求优化的时辰呢 ,可以有如许一个思想点 ,是否是可以把它层次性做得加倍好一些 ,从图片图标再到文字 ,一个界面把一个视觉强弱划分上 ,比如加倍公道的排版分布 ,

那我们可以来看一下第二个版块 ,第二个版块我们讲的是 ,三种板块突显性的后果 ,我们来看一下第一点 ,卡片式的一个设计 ,卡片设计时辰呢 ,我们这边照样要罗列一些案例 ,来给大年夜家停止一个深刻的讲解 ,我们可以简单不雅察一下这个界面 ,我们可以不雅察这个界面时辰呢 ,比如说我们模仿一个 ,在平常设计中 ,常常会碰到的一个产品成绩 ,比如说产品有天跟你说 ,我们认为小我信息里 ,一个取一级主图标区很重要 ,很重要时辰怎样办呢 ,你应当如安在设计角度上 ,把它做的加倍突显一些 ,怎样做得加倍突显逐一些呢 ,图标 把它纯真做得加倍大年夜一些 ,小我信息区域 ,一些色彩做的加倍艳丽些吗 ,这两种做法其实我们认为他是一个 ,异常浅显或许说比较 ,不是一个最好的处理筹划 ,那若何把它做的可以加倍优良些呢 ,就像我们方才给大年夜家讲的第一种办法 ,我们可以采取一个卡片式的一个突显 ,我们结合改版前后 ,我们可以不雅察到改版以后 ,我们应用了一个卡片式的 ,一个突显以后呢 ,它在一个视觉层级上 ,确切有一个异常大年夜的晋升 ,那这边我们要停止一个 ,设计方面的一个总结了 ,假设让大年夜家可以或许精确的控制好 ,如许一个卡片式的设计处理后果 ,我们看一下就是 ,你想要把一个卡片的设计后果 ,做得加倍优良的时辰呢 ,这边有一个设计的小技能 ,是大年夜家不克不及够错过的 ,那就是合适的?暗影弥散形的一个设计 ,那我们讲到如许一个界面实操时辰呢 ,肯定也离不开PS的一个上手操作 ,那么下面就结合PS这个软件 ,来和大年夜家一路来分析一下 ,一个弥散式的暗影后果应当若何把它 ,完成出来让我们全部 ,课程的讲解不只仅逗留于ppt的 ,一些播放还可以或许 ,对应到一些PS的软件实操 ,那进入到我们全部Photoshop的任务页面 ,

这边为了更好的讲解全部暗影后果 ,我是把一些UI中的界面版块停止了简化 ,并且在暗影这个角度上 ,罗列了两个案例停止一个比较 ,我们可以经过一些简单的不雅察发明 ,左边我们采取的是 ,Photoshop 它自带的一个投影后果 ,左边的是我们经过两个图层 ,羽化以后模仿的一个弥散暗影后果 ,那么经过简单的阁下不雅察发明 ,其实我们可以不雅察左边 ,如许的弥散型的暗影后果 ,它在一个设计角度上 ,会来的加倍美不雅并且加倍的柔和一些 ,那我们如今就来简单说一下 ,我们如许一个比较柔和 ,比较优美的一个弥散后果 ,我们应当若何快速的 ,

登录后检查更多
换一批

为你推荐

每周一练

急速参与
虎课网为您推荐『UI入门』带你梳理视觉层次视频教程、图文教程、素材源文件下载,学员课后演习、作品和评价等外容。『UI入门』带你梳理视觉层次教程讲师:EthankDesign,难度等级:低级演习,视频时长:23分09秒 检查全部
入门教程:
PS (CC2017)教程Illustrator教程After Effects教程CorelDRAW 教程SAI教程Sketch教程Indesign教程Lightroom教程Dreamweaver教程AutoCAD(室内)教程Maya(玛雅)教程SketchUp教程C4D教程Premiere教程3DS MAX教程Axure教程ZBrush教程DaVinci(达芬奇)教程Animate(Flash)教程Lumion教程Keyshot教程Excel教程虚幻4引擎教程AutoCAD(机械)教程PPT教程Word教程Principle教程SolidWorks教程Audition教程C#游戏开辟基本教程Hype 3教程Unity3D引擎教程Rhino(犀牛)教程Substance Painter教程Mockplus教程Nuke教程Pro/Engineer教程Vegas Pro 14教程墨刀教程Final Cut ProX教程Unigraphics NX教程Xmind 8教程EDIUS Pro 9教程PAINTER教程酷家乐室内设计教程蓝湖教程xiaopiu教程Keynote教程Houdini教程MUSE教程PPT教程PS (CC2018)教程Adobe XD教程Twinmotion教程Realflow教程图怪兽教程SPSS教程Python教程Acrobat Pro DC教程VBA教程Mastercam教程Numbers教程Pages教程会声会影教程WPS(2019)教程Axure(9.0)教程Visio教程R说话教程JDBC教程Maven教程Servlet教程AJAX教程Rhino(6.0)教程Revit教程Amos教程PHP教程Creo(5.0)教程C4D(R20)教程CSS教程HTML教程Dimesion教程Java教程JavaScript教程Maya(2019)教程Blender教程Oracle教程SQL Server教程OBS Studio教程AE(CC2019)教程PR(CC2019)教程Camtasia studio教程CATIA教程FL Studio教程Cubase教程Redis教程AutoCAD(修建)教程SQL教程Vue.js教程JQuery教程VideoScribe教程C++教程PowerMill教程Alias教程

同窗,小虎知道你异常尽力的想进修!

师长教员录制课程真的也很辛苦

赞助一下吧
限时老手义务
额外取得 4 次进修教程次数

肯定进修吗?

您每天可收费进修一个教程。

成为VIP可无穷进修 !

成为VIP吧!

成为VIP吧!

您曾经收费进修 1 个教程 !

我们录制教程很尽力的,赞助下吧 !

升级VIP吧!

您曾经进修 5 个教程啦!

我们录制教程很尽力的,赞助升级下吧 !

您曾经累计下载5个源文件


您在以后分类下不是VIP,赞助VIP享用无穷下载


您曾经累计下载5个素材文件


您在以后分类下不是VIP,赞助VIP享用无穷下载


您曾经累计下载5个源文件


您在以后分类下不是VIP,赞助VIP享用无穷下载


您曾经累计不雅看5个图文教程


您在以后分类下不是VIP,赞助VIP享用无穷不雅看


进修后才能评价哦!

进修后才能提问哦!

取得30虎课币

评论提交成功,将在审核经过过程后显示

×

下载素材/源文件:

收藏成功
撤消成功
特惠
充值
客户端
虎课桌面客户端
置顶播放器,边看边进修
虎课移动APP
支撑离线缓存,随时随地进修
领福利
微信扫码存眷领5G 2019年全新素材包
建议看法
官方客服

官方客服

您可以与在线客服停止沟通或许拨打客服热线取得赞助

客服热线:400-862-9191任务日:9:30-18:30

在线咨询:接洽客服任务日:9:00-22:00

节假日:9:00-18:00

虎课积分
收费进修49000+个教程!
配套素材、源文件一键下载!
昨日学员已进修了149,884
并提交了2,064份作业!
登录后急速进修!
loading
微信扫码存眷便可登录
登录后急速进修!
手机号
验证码
急速登录
您须要赞成协定才可以停止登录
已持续签到0
第一天
5个虎课币
第二天
10个虎课币
第三天
15个虎课币
第四天
20个虎课币
第五天
40个虎课币
第六天
20个虎课币
第七天
20个虎课币
急速签到
已签到
每周一重置签到嘉奖
已持续签到0
本周斩获110个虎课币,下周也要来哦
我知道了
已持续签到0
哎呀,签到掉败了!
再次签到
哎呀,体系出现缺点,请稍后重试!
祝贺!签到成功,取得 10 个虎课币
上上签 ·21August.2018
虽然眼下非常艰苦,可往后这段经历说不定就会开花成果
— 唐朝文学家 韩愈
练习营保持完成打卡义务 报名费全额返更多>>
直播地下课学员好评率95%以上更多>>
全站49000+课程收费学!昨日已有34508位学员收费支付~点我支付