UI设计基础

 

发布作品
  • 老师

    张静雅

  • 老师

    七天

  • 老师

    果子方

  • 老师

    大婷砸~

  • 老师

    李佳宾

  • 版主

    lily

  • 学设计电脑配置清单 全站置顶

    推荐系统与最低硬件配置:推荐操作系统:Windows 7  SP1  64位专业版或旗舰版(注意:不推荐使用XP系统,微软已不再对XP系统进行升级维护,相关专业转件已经不支持此系统安装使用。如有操作系统为XP的学员建议到当地电脑维修店安装Windows 7  SP1 64位 专业版操作系统。)  电脑参数:CPU     intel 酷睿 i5-7500主板    芯片组intel的(可选华硕、技嘉大品牌),一般750元以上的即可显卡    NVIDIA 系列(最好不要买A卡系列的,会和有些作图软件不兼容)750元以上即可硬盘    西部数据(比较稳定)500G以上内存    8G电源    400w机箱    400元以上的以下是推荐配置

    浏览:119 发布于2018.01.24
  • 双十二全场9折,就今天

    错过了双十一,还能错过双十二?这回我们不和天猫TMALL玩套路了啦,就9折,全场9折!仅限2017.12.12当天。猛戳这里领取9折优惠券>>>优惠券使用帮助>>>购买支付使用帮助>>>

    浏览:239 发布于2017.12.11
  • 12月,好课领领领!红包拿拿拿!

    ◆火星时代内部学员福利◆为感谢同学们对火星时代的支持,12月每一周我们都将赠送一套优质课程供大家学习,并且每次领取还有红哦!具体活动如下:                1、11月29日-12月7日晚8点-10点赠送  PS全套教程  +素材包+火星网校VIP                2、12月8日-12月15日晚8点-10点赠送  AE全套教程  +素材包+火星网校VIP                3、12月8日-12月15日晚8点-10点赠送  剪辑全套教程  +素材包+火星网校VIP                4、12月8日-12月15日晚8点-10点赠送  C4D全套教程  +素材包+火星网校VIP                              每次课程领取成功后,还将可以领取2-10元随机红包哦!!!                             仅12月每晚8点-10点有效 其他时间请勿领取否则无法赠送红包!                                                                            请扫描二维码关注领取

    浏览:1315 发布于2017.11.28
  • 3D圆

    浏览:84 发布于2017.11.18
  • 设计大咖集结 为Wacom产品体验会打call

    分享创意创作感悟,体验Wacom产品魅力。11月8日,Wacom产品体验会在北京成功举办。Wacom全球执行副总裁林强致欢迎辞Wacom全球执行副总裁林强,意大利宾利法里纳设计公司上海分部汽车设计师黄永诚,单喜品牌创始人、设计师张丹丹,上海绘灵学院创始人邵梁,资深电影游戏概念设计师王俊雄,电影《寻龙诀》的美术画师,著名美术指导李飙,第七届中国大学生电视节制片人袁成杰,以及来自汽车、服装、影视、IT等行业媒体编辑记者参加此次产品体验会。Wacom产品展示据介绍,此次体验会主要针对Wacom全新影拓Pro数位板,新帝Pro数位屏及Wacom MobileStudio Pro创意移动电脑/工作站等三款公司旗下的重磅级产品。全新影拓 Pro数位板的厚度不足半英寸,纤薄外观,配置触控环、多点触控和ExpressKeys可创建自定义快捷方式,进一步加快创作工作流程;采用Wacom Pro Pen 2技术的新帝Pro数位屏专为希望使用数位笔在屏幕上直观创作的专业艺术家和设计师而打造,无论是使用Mac还是PC,用户都可以直接在屏幕上创作,尽享自然的笔体验;Wacom MobileStudio Pro创意移动电脑/工作站,采用新研发的Wacom Pro Pen 2,压感笔的准确性和压力灵敏度要比公司之前推出的专业压感笔提高4倍,配有包括3D摄像头在内的强大创意工具,并且能够运行完整版软件,让专业2D、3D和CAD艺术家及设计师能够随时随地发挥创造力。Wacom产品体验会活动现场照片在体验会上,来自Wacom公司的产品经理详细介绍了上述三款产品的技术特性和独到优势。Wacom产品已在世界各地被广泛地应用于创作那些最激动人心的数字艺术、电影、特技、时装和设计,使商业和家庭用户能以自然丰富的方式表现自我。单喜服装品牌创始人服装设计师张丹丹精彩演讲在案例分析环节,意大利宾利法里纳设计公司上海分部汽车设计师黄永诚,单喜品牌创始人、设计师张丹丹,上海绘灵学院创始人邵梁,资深电影游戏概念设计师王俊雄分别结合各自的从业经历,分享了个人的创作体验,以及对Wacom公司旗下产品的使用感受。设计师们一致表示,Wacom产品内外兼修,外观美感实在,内在功能非常强大,设计也很人性化,技术上不断创新突破,帮助自己捕捉灵感、抓住创意瞬间。意大利宾利法里纳设计公司汽车设计师黄永诚分享创作感悟在汽车行业,设计师用一支Wacom笔可以画出逼真的玻璃效果、车身的金属效果、戏剧化的光影效果、内饰的皮纹与木材饰板的高质感,并使最终呈现的效果如同照片一般的真实, Wacom还能在以Autodesk Alias搭建的数字模型上以其灵活高效和精确的参数化表达来与提出修改与反馈意见与数字模型师。在服装行业,设计师在Wacom上完成从创意草图,到实际手绘,到最终成品,再到工业链,让设计师从繁杂的工序排列中解放出来,并让一些失误性的问题得到缓解,把失误降到最低,使服装生产工作变得更加有序。在影视行业,很多逼真的3D特效、叹为观止的美景、无边无际的飘渺仙境、恢弘壮观的场面,都是设计师运用Wacom从最初的草图,到建模、贴图,到完成最后的渲染效果。可以说,Wacom产品成功运用到越来越的行业,同时也深深地改变了很多行业,让这些行业呈现全新的发展面貌。这是Wacom的魅力,更是技术创新的力量。CG艺术家、上海绘灵文化创办人邵粱精彩演讲电影、游戏概念设计师王俊雄发表演讲Wacom全球执行副总裁林强表示,Wacom自1983年诞生以来,一直在践行通过自然直观的用户界面技术拉近人与技术的距离这一愿景,为包括数字艺术、电影、特技、时装和设计在内的行业提供产品和解决方案,让设计师自由发挥创意,让世界充满创意。

    浏览:137 发布于2017.11.14
  • UI 设计需要自问的 10个问题

    UI 设计师需要自问的 10个问题UI设计的魅力在于,你不仅需要适当的技巧,更要理解用户与程序的关系。一个有效的用户界面关注的是用户目标的实现,包括视觉元素与功能操作在内的所有东西都需要完整一致。1. 你的UI是否高度一致?用户来到你的站点,脑子里会保持着一种思维习惯,你的 UI 需要保持一致,以免用户的思维方向被打乱。比如,如果你的某个品目下的产品可以拖放到购物车,那你站点中所有产品都应该可以这样操作。将按钮放到不同页面相似的位置,使用相契合的配色,使用一致的语法和书写习惯,同时,让你的页面拥有一致的结构。2 . 用户能自由掌控自己的操作吗?你应当分析一下,自己的站点是否容易导航。用户应当可以自由掌控自己的浏览行为,确保他们能从某个地点跳出,能够毫无障碍地退出。那些在用户离开前弹出窗口的行为是 UI 易用性的一个大问题。3. 你知道谁是你的用户群吗?要设计有效的 UI,必须对你的用户群有所了解,不同的用户阶层对不同的设计元素有不同的理解,17~25 岁年龄段的人,和 40~55 年龄断的人有不同的喜好。你的 UI 设计必须针对你的用户群进行设计。4. 你是否有足够的预防错误的措施?应该尽可能检查程序中的错误和 BUG,虽然你可以弹出一个窗口告诉用户发生了什么,但为了更好的用户体验,最好减少这些东西。Beta 测试是消减错误的最好方法。5. 你是否首先将最重要的东西展示给用户?将重点放在重要的内容上面,首先为用户展示最重要的内容,以便用户更好地理解你的内容。6. 你的设计是否简约?很多站点的设计十分简约,简约设计可以增强 UI 的易用性,可以让用户不必关心那些无关的信息。你的 UI 应该是这样的,它的功能很强大,但设计很简约,拥挤的界面,不管功能多么强大,都会吓跑用户。7. 你是否使用了视觉提示?如果你使用了 Ajax, Flash 一类的技术,当内容在加载的时候,应当提供视觉提示,应当始终让用户知道目前在做什么。8. 你的UI 是否有操作提示?你的用户是否靠自己研究或 FAQ 文档学习如何操作?你应当在 UI 现场提供简单的操作提示,比如,使用 jQuery 在你的各个 UI 元素上显示操作提示。9. 你如何使用色彩?色彩是 UI 的重要元素,不同的颜色代表不同的情绪,你对色彩的使用应当和站点以及主题相契合。还应注意,有的用户是色盲,你应当考虑到他们的感受。色彩的使用应该一致,一旦选定了某种配色,就应该在整个站点一致使用这种配色。10. 你的UI 是否大象无形?UI Engineering曾经说过,”最好的设计不是用来看的,是用来体验的"。这意味着,你的 UI 应该让用户去体验,而不是放一些花哨的东西给用户看。UI 设计越简单,用户体验越好,不要滥用设计元素,不要使用拥挤的界面。来源:spyrestudios.com Diving Into The User Interface With Fundamental Questions(原文作者:Joel Reyes)

    浏览:150 发布于2017.11.10
  • UI入行“前规则”

    很多想入行UI设计行业的人需要了解的很多,其中有太多的问题,其实跟职业技能没大关系,重要且容易被忽略。所以特此开贴,普及一下就业的概念。    开贴一个月时间,给我留言的人,超过200人,首先非常感谢大家的关注,但是也发现了很多问题。因为加我的大多数是新人,所以主要问题都集中在行业以外,今天特意写一篇行业概念普及的文章,以供大家参考。     UI有很多问题,都跟本身的专业技能无关: 我遇到很多人提问都是:我要转行或者我要入行,首先该学什么? 我能给出的建议就是,先把那些知识都放一放,你首先应该了解这个行业。 我说个简单点的方法: 你可以去百度各种排行榜:设计网站,手持app,应用,游戏。你首先应该去了解这个行业里哪些产品是主流。你也可以去搜索QQ群以及论坛,进去跟别人沟通,了解一下工作类型和内容,待遇等等问题。 哪怕你的了解范畴再偏激,再稚嫩,起码你有了一个大致的印象,那么你就有了一个参考方向,也知道自己该往哪个方向去学习了。起码你会判断一下,自己是否对这些东西感兴趣。对吧? 你知道了产品,也就能查到这些产品都是什么企业开发的,去了解他们在行业中的地位,公司所在地理位置甚至待遇条件等等信息。因为就业是双方的选择,你不能因为你是新人,就谁给钱就跟谁走。因为每一个从业者都需要职业规划。稍后我们会详细聊一下什么是职业规划。 我甚至见过,职业技能还不错,但是对行业完全不了解的从业者。这类从业新人,还真不是少数。每一个人的提问,都表现出了对工作上的不满,领导的愤慨,客户的无理取闹等等信息。其实如果入行之前就能有个大概的了解,那么就不会有这么大的心理落差了。 所以我很强调兴趣,如果你对这些产品有兴趣,甚至是它的使用者,那么在接到工作的时候,你可以瞬间找到很多同类设计,大大提高你的工作效率,和收集资料的时间。 我认为第一重要的职业素养就是:自我进修的能力。 很多人的学习都是在工作中完成的,这是一种方法,但是这种方式效率不高。 设计分为两种:有限设计和无限设计 我们现实生活中的设计,必须都是有限设计,资金,市场定位,技术实现能力,硬件限制,时间,成本,人力,团队,等等,有非常多的限制,无法让设计达到自由。在这么多限制的情况下,工作就需要无比重视效率和可实现性。同时你学习的范畴也被限制了。 有没有那种,既不用为了赚钱糊口,又可以自由发挥的设计呢?有,就是业余时间。在个人的业余时间里,哪怕你每天只有半小时,这段时间没有任何限制,你可以自由创作。可以去适应各种不同风格,可以不用考虑他人意见,技术实现等等一些问题,去从事一个纯设计的自由时间。是最有效率的进步时间。它有两个作用:第一可以拓宽你的设计经验,第二不用多久你就会发现,它跟你的工作开始慢慢重叠,你的效率会越来越高。 经验其实就来自于你做过多少类型的设计,你完成设计的数量,这个事情的关键是在于你可以每天都有放空去尝试的习惯,而不是累死累活玩命的工作。这是完全不同的进修方式。 很多人不具备自我进修的能力,并不是因为不想,而是不知道怎么去自我进修,缺乏方向。因为今天的论题太大了,所以放一放,我们有机会再来聊自修问题。 勤奋不是没日没夜,蜡炬成灰泪始干,那种燃烧生命式的工作态度。 相反的,一个从业者,完成工作大概消耗掉4成个人精力体力就可以了。为什么这么说? 如果你从事一个工作两年还不能得心应手,觉得困难重重,一直无法放松。那么我能给你的建议,就是,你要不要考虑换一个工作?可能这份工作不太适合你。 敬业精神,不是玩命消耗体能,而是尽量提高工作效率,你只有有了更多的可以自由支配的时间,你进步的效率才会更快,敬业精神,是把自由时间用在提高个人能力上。能力的提高,才是效率提高的根本,而不是工作时间的长短。 有些人会反驳我说,不是我效率不够高,UI只是项目一部分,很多修改工作,以及加班时间,都是项目组和公司规章制度,流程造成的。那我只能说:你的先了解行业和企业,去选择一个适合自己的发挥和发展的环境。越是不规范的企业,效率越低,这是不争的事实。 有太多新人,不重视这个事情了。之前有说过,设计人员会做也需要会说,这里就不重复了。 说点新的,一个人能完成的工作很有限,一般从业2年,就会有机会带新人。向上的理解能力,平等的沟通能力,向下的沟通能力,都会需要。 向上的理解能力:不仅仅是听取,更重要的是需要实例,去不停的比对你与客户以及领导之间的词汇差异。同样一个词汇,每个人心里的度都不同。所以不能只靠语言沟通。 平等的沟通能力:与同级的人沟通,其实是最常有的,且目的最贴近工作的沟通模式。 向下的沟通能力:对待下级,你不仅仅需要交代清晰,在很多时候都需要鼓励,与明确标准。赏罚分明,才能提高全员效率。 沟通无论是学习还是工作,都是一个非常重要的能力。而且立场需要明确。 能够严格区分工作需求和个人需求是一个先决条件。请把那些大数据,用户体验,市场定位等大词汇放一放,如果你的工作不能首先满足你周围的几个人?你也满足不了那些大词汇。客观实际一点,去效率性的解决问题,因为UI只是项目很小一部分,你以UI来左右项目成败的可能性不高。还有很多机会可以修正。不要浪费时间在个人取舍上。 一个设计者的价值在哪里?从业多久?跟过多少项目?进过什么类型企业?职业技能多好?对行业多了解?个人思考模式成熟? 一个从业者必须要有个人的职业规划!这是对自己,对企业负责的一个职业态度。 我听过太多人抱怨工作不满意,策划上的不满意,程序技术的能力欠缺,老板的中二病等等。这些不满其实都来自于你对行业不了解。 首先你的知道企业类型,上市公司,研发公司,创业公司,外包公司。 你也的明白产品是怎么盈利的,你都不知道钱是怎么赚到你手里的,你凭什么可以做准确的职业规划?知道自己的发展空间以及有目的的提高自己的能力和待遇? 所以作为一个设计师,要了解行业企业,项目盈利方式,才能更有目的的参与相应的项目,积攒有效商业产品项目经验。 这个时候体现出了,沟通能力的优势了,沟通不仅仅在工作学习中有效,在就业人脉上的信息,是你晋升以及后路的一个保障。 这个时代,不再吃大锅饭,没有人一辈子就从事一种职业,特别是UI,当你对这个行业越来越了解,人脉积攒越来越广,能力与资源积攒越来越多。你到了一定年龄就一定会考虑,是不是要创业,独立,去做更多的事情。 而不是把一个职位,一口饭,当做理想。——————————————————————————————————————————————— 以上的都是给入行新人看的,都是概念,不是具体做法,因为交代太详细,会导致大家都按照一个逻辑去组织和完善。我特别鼓励新人多尝试,多犯错,这是成长的必经阶段,没人不走弯路,没人不浪费时间,这是客观事实。所以在心态上,也别想找什么捷径,你的环境条件越优越,你个人就越弱。这是一个冷暖自知的问题了。——————————————————————————————————————————————— 回答一下,完全无基础的新人提问:究竟应该是自学还是应该参加培训?首先我是做UI培训的,所以我的角度,实在是无法去评价职业培训机构的优劣。所以请不要在问我哪个培训机构好不好这种问题了。我能告诉你的事实就是,无论从哪里毕业,你都是行业新人,你的职业道路才刚刚开始。自学和培训其实各有优缺点:我们这一代人,其实都是自学的,因为没有那个环境,我从业的时候,国内别说培训机构了,连书籍和资料都没有,所以我走的路就是,我是一个画画的,去敲每一家公司的大门,问问,有没有需要绘画的工作,在工作当中摸爬滚打,一路折腾到现在。回想起来还有点小自豪。但是现在这个时代不一样了,因为中国行业发展近20年,市场需求与研发标准越来越规范,靠硬头皮去顶开职业大门这种事情,已经不太靠谱了。而且公司也不愿意花费人力去培养新人,新人带起来以后,就跳槽了。得不偿失。所以很多小企业是没有实习制度的,大型企业实习也不是对所有人都开放的。自学,现在网上资料多,项目参考也多,其实自学并不困难。但这也仅仅限制于最最底层的绘制而言。有了绘制能力,然后去找个工作,在工作中学习进步,也算是一条出路。但是工作这个事情是双向选择,不仅仅是企业需要人才,个人对企业的需求也很重要。找工作的基本原则:1学习环境(如果公司里有大神或者项目很牛叉,有机会在他人指导下工作,进步是很快的)2工作环境(UI的价值也在于你参与了什么项目,你是否喜欢这个项目,以及工作条件,人员环境,等等都适合,你才能心无牵挂的安心提高)3待遇(客观自我评价,你在什么阶段,就应该拿多少回报)自学确实是一个廉价的方法,但是自学的接触范围太狭窄,时间花费也是巨大的。参加培训机构:培训的优点有几个,第一学习环境,比起一个人在家,和一堆同学一起学习,这个氛围是自学无法获得的。有比较,有交流,有互相的督促,学习效率和兴趣都会高很多,毕竟一个人太寂寞,容易憋出病,呵呵。第二接触范围:UI的绘制能力是最最基础的职业需求,相对来说,设计能力,和设计表达能力,口语能力,硬件制约,项目流程等等,这些东西都不是自学能够接触的。第三工作机会:大多数培训机构都与商业公司保持良好的合作关系,人员输出相对便捷。第四可能没有人注意到:一般两年以后,你的同学校友,其实都在各个公司工作了,你的行业信息也会比较真实可靠。市面上培训太多了,说点大家应该注意和需要调整心态的问题吧。教师:说实话,没有几个大型公司高管会去当老师带新人的,有能力的当然去做项目了,第一大家不用期待你的老师有多牛叉,因为对于一个初学者来说,教师的能力只要足够教育新人就够了。一个培训机构好不好,还真不在于教师,而在于教学体系。就业:很多包就业的培训机构,其实这是一个伪命题,学员足够好,不用包就业,只要公布就业率就行了。速成:这是绝对反客观事实的宣传手段,如果速成那么容易,就不会有那么多岗位缺口了高新:确实现在UI行业有些人已经拿到月薪2w甚至超越很多概念设计师薪酬了,但是请注意,没有任何一个刚毕业或者就业新人,有这个机会,能力和薪酬是成正比的。绝难一步登天。所以总结下来:其实你培训和自学两者可能都需要,有一个学习环境,有老师带领,但依然需要你自己刻苦钻研职业技能。没有人生来就不走弯路,既然决定要走,就用跑的,才能加速前进。————————————————————————————————————————————————正常来讲新人的路:第一个要克服的其实是绘制障碍:这包括软件的应用,各种风格和效果的实现。没有人在有绘制障碍的时候可以高效的完成设计工作。第二是应该对行业足够熟悉:不仅仅是市场,项目,也包括企业信息。甚至是国内设计名人。对于团队合作,流程和规范都应该有一定的认识和理解。第三需要积攒个人独立设计:随着从业时间越久,因为个人喜好,情绪,逻辑等沉淀,你会越来越具有个人风格,这是个人品牌的积累。也是从服务别人,到别人需求你的一个转变过程。作者:铁木士 

    浏览:177 发布于2017.11.10
  • UI需要什么样的美术能力(二)应用篇

    UI到底需要什么样的美术能力?上一次只聊了绘画的原理与概念,这次浅谈一下绘画原理的应用。上一讲以后很多人给我留言,有各种问法:1不会画画影响大么?2做ui一定要会画画么?3会画画就UI做的好么?等等的问题吧总结下来,我觉得有必要讲一下,绘画理论在设计中的实际用途。这样才方便大家判断,绘画在设计中占的比重:其实吧,绘画没在UI设计中占多大比重,这个就像麻雀虽小五脏俱全一样,占的比重小,但是挺重要,少了就是残疾,多了,也不可能因为你一个器官过大,就对你身体有绝对的好处。相反可能影响你的健康。凡事都有度嘛。除了网店那种商品展示之类的,UI里的基本没有什么是直接使用照片的,都需要重新设计和绘制。那么我们怎么才能以最少的视觉元素,让用户快速识别信息内容呢?这是一只鸟,显而易见,它身上什么才是主要信息?嘴?眼睛?翅膀?我画什么才能让人知道它是一只鸟呢?其实都不用,剪影是最低的信息辨识方式。你会发现大量的UI原件,信息内容都是剪影转化而来的,根据不同风格,剪影外轮廓也会有不同的变形。风格不在今天讨论内容里,所以先忽略变形这个问题。我们今天只聊最基础的绘画原理。这玩意,基本上就难以辨认了吧?不是所有的物品剪影就能区分的,还是需要细节的。其实这是个钱包。。。。。那么是什么让我们确认了这是个钱包么?我先来假定一个命题,我们今天来制作一个钱包的icon。通过完成过程来熟悉绘画知识的,应用和理解。我首先翻转了这个钱包,理由嘛:一般来讲,不是特殊需求,一个物品的方向都是右侧为主!为什么呢?因为一般光源方向都是左侧打出的。这其实不光是人的视觉习惯,也是因为市场上的通用设计,导致了这个经验式的设计习惯。这不是一个一定要遵守的规则,仅仅是常规参考而已。的根据实际情况来判断物品方向和光源问题。我们今天只单独做一个icon,所以没有整体UI设计的影响,不会考虑太多其他因素。我们来看下四个草稿:一:只有外轮廓,无法判定是什么二:有了一个扣具的轮廓,依然无法准确判断三:扣具上有了扣子,这回容易判断一点了四:多了缝线的细节所以信息简化这个事情,是有极限的。你能用最少的视觉内容,让用户分辨出信息,这是一个很理想的状态。但是仅仅是识别,还不能满足UI的需求。比如做成这种草图,能认出来,多数情况下是不能直接使用的。那么我们现在就来复杂化这个钱包,第一个需要建立的就是结构:我们生活在三维空间里,所以所有的物品都应该有厚度H(三维世界无非是多了一个z轴方向的纵深),哪怕是一张纸。一个面片,哪怕只有一像素的高光,和阴影,也能直接从空间中脱颖而出。这是一个概念,并不是一个必须要遵守的规则。特别是在UI设计里,很多风格比如扁平化,等等,都是可以忽略厚度,纯拼颜色和构图的。但是为了方便大家理解绘画逻辑。所以我们今天的样例,是有空间和结构概念的。ABCD:分辨增加了不同方向的厚度。首先不会选择B,B增加的厚度部分,是没有机会展示钱包内部的,直接封死了增加细节的范围。其他三个都ok,都可以继续延续设计细节。我选择了C,别问我为什么,个人喜好而已,因为这个命题没有其他icon与UI界面的透视方向等参考,所以,选择随意。一般来说整体UI的光源,透视方向应该统一。除非特殊需求和目的,或者资源限制。我们首先在结构上增加这个钱包的“牛皮”厚度得到一个这样的结果。但是。。。。。。如果任何物体都有厚度,那么它最少有两个部分,就是受光部分,和阴影部分。所以我也要为钱包的边框,调整受光和背光,以增加它的视觉厚度。这个时候,问题就出现了。按照正常的光源方向,我应该在最上面的边上看到高光。理论让应该是这种打光方式。但是我没有选,我选择了打中光,因为按照正常的左上方式打光,钱包的边线会不清晰。因为icon很多都很小,所以光源越复杂,有时候就越难辨析。我这里是主观的选择了打光方式。以避免放大缩小带来的麻烦(icon制作一定要考虑尺寸大小,视觉可辨析度的问题)这是样例,所以也就不会深究了。我们逐步的增加了这个钱包面片的厚度。1,纯面片,一般适合扁平化与无透视的设计。2,有一定厚度,但是没有形状复杂变形,这种结构多数都是为了打光考虑的,毕竟纯面片是没有打光机会的。3,在稍微写实一点的设计里,钱包的厚度,不会是纯平面,是弧面的。所以我们现在来增加它的弧面厚度。弧面周围都是阴影部分,高光都集中在最高处。所以选好范围直接内阴影就行了。给了两个高光,因为一个是弧面是钱包正面的高光,一个弧面是钱包侧面的高光,当你理解了钱包的形状。你就很容易确定阴影与高光位置。那么你就更容易体现结构。我们现在来加入牛皮扣:首先这个绝对不ok,扁平化的牛皮扣可以这么做,但是有透视的不行。因为牛皮扣是附着在钱包上的,它必须遵守钱包的结构,才能包裹住钱包。同样面片向上移动就有了厚度,复制缩小,就留出了牛皮扣的边框。当你理解了空间,结构,光原理,其实你就很容易的利用一个最初的形状去做加减法,大大增加了绘制效率。牛皮扣,也不可能是完全平面,所以我们给出了弧面的高光和阴影。一个圆形,复制,移动,等于扣子。我们下面来为钱包增加细节,既然是钱包,那总应该有点钱吧?我们做了两个面片,一个硬币,但是看起来总有点问题,问题在哪呢?层级!用阴影遮挡住钱币以后,钱币才看起来像是放在钱包里。UI中有很多层级问题,都是通过阴影遮挡达到的。先后级问题,需要透视,光,结构,等原理一起解决。请注意第一个钱币的阴影,与第二个修正之后的阴影,第二个更尊重钱包本身的结构,也就看起来更舒服。所以结构影响光,阴影,阴影也必须跟结构的透视关系是一致的。我随便在网上找一个牛皮材质,覆盖在钱包之上,因为明暗关系都已经做完了,所以看起来直接就变成牛皮钱包了。我只要更改材质的颜色,就可以更改钱包的颜色。那么下一步就是手绘修正了,把材质的范围,收到牛皮部分,调整高光大小增加细节。差距大么?恩,貌似很大,因为这是一个网上的效果图。感谢作者,省了我很多时间。总结一下:这一讲,从剪影,到面片,到空间结构。我们在按照结构原理,光原理,透视原理,不停的复杂化一个物品。我的目的不是要讲,怎么画一个东西好看,我的目的是希望大家能够通过这些简单原理,去分析你要做的东西,无论做加法还是减法,都需要尊重这些原理。UI不是一个绘画工作,了解绘画原理是为了,拆解我们的工作过程,合理化,规划设计流程。其实UI里很少涉及到你需要大量手绘的部分。都是基本形状的应用。所以,绘画原理也可以浅尝即止。不需要每个UI都拥有原画师级别的绘画能力。作者:铁木士

    浏览:134 发布于2017.11.10
  • UI需要什么样的美术能力?(一)

    UI确实需要一定的手绘能力,但是跟画画是有很大不同的。很多人都私聊问我:学UI需不需要手绘能力。或者学UI需要什么绘画基础。 所以今天集体回答一下。我们先来看一下跟绘画有关系的行业:漫画:主要的不是绘画能力,更重分镜头,叙事能力,脚本编写能力,很多画的不好,但是依然存活很多年的漫画还真就不少,甚至可以证明,绘画能力的底线可以很低。游戏原画:虽然工作内容是在画画,但是游戏世界观多数都是架空世界观,历史以及文明的视觉搭建。所以对历史符号,架空世界观,产品类型,研发流程实现等行业知识更重要。影视:跟游戏差不多,但是你设计出来的东西的能实现。场景,道具,服装,你的对施工,材料,拍摄效果,后期等相关知识得有足够了解。简单说了,几个行业,我想说的是,那些看起来都是画画的工作,其实绘画只是表达手段。是最最基础的一个职业技能。但是并不是主要的职业需求。UI也一样,绘制能力是表达手段,基础需求,只是工作里的一小部分。在所有这些跟绘画有关系的行业里,绘画是为行业目的服务的,所以,所需要的美术基础也绝不相同。所以千万不要把跟绘画有关的行业一概而论,理解为艺术行业。跟绘画有关的行业多数都是商业行为,商业行为下,艺术这个词就褒贬不一了。在聊美术需求以前,我们先来聊一个跟绘画有密切关系的东西:素描多数想要学习绘画的人貌似第一个能了解到的绘画方式就是素描。。。。。。具象化超写实素描:像照相机一样的去画画,比照相机更主观,大量细节往往令人印象深刻。表现性素描:你大致分清楚绘画内容,但是表现素描里多参杂更多情感宣泄。抽象素描:你基本已经很难分清楚绘画内容了,抽象素描更倾向于情绪表达。其他很多素描形式就不一一列举了。我们做ui需要这种绘画能力么?肯定不是!我们回头来看一下,为什么会有素描这种绘画形式?你能找到的所有的历史名画,都有一个共同的特性:就是都有颜色。例如这张《奥菲利亚》在普通人的印象里,画家都是很牛逼的无敌存在,画一张这样的画,你别管他花多久,都是一次搞定!其实不是的!不是所有人,都直接有能力在大脑中完成创作,直接绘画的。任何你看到的一张完整作品背后,都有可能有十几张,几十张,上百张的小稿。素描是一种最节省资源的研习方式:因为你可以排除掉颜色的干扰,甚至排除掉,构图,等一系列的多余因素,去有目的的研习作品元素。比如纯结构:比如纯材质:比如人物景物记录:素描的存在,其实是绘画的一个过程。因为你可以不用张张精品的去绘制完成。只需要明确你的目的,去快速熟悉,比对,选择。聊到这里,主要目的是确立一个观念:作为UI设计人员,请把绘画能力当做一种辅助研习的手段,不要以其他行业绘画标准,去要求自己学习绘画,那会本末倒置,浪费大量的时间和精力。也确实没啥必要性。除非你打算转行,或者个人兴趣使然。回到正式话题:UI需要哪些绘画基础知识?结构:物体占据空间的方式。一般设计行业的素描都是结构素描。结构的重要性不言而喻。为什么素描要从几何图形画起?原因就是够简单。当你去处理一个复杂图形的时候,把它拆解成简单的几何图形最容易理解,和控制。我们是在二维世界里,去表现三维世界的空间,所以理解了结构,就能理解很多其他东西。比如光原理:光是一个永远的存在,影响光的因素,其实就是结构,其次是材质对光的反射比例。肯定也需要学习和了解透视原理因为今天这部分不是讲解美术基础,所以只能做简单介绍常规透视:基础透视原理平行透视:其实是平面设计行业用的最多的透视方式,不用考虑灭点形变之类的因素。视觉透视:人的视觉是有生理误差了,所以感官上来讲,很多透视都做了相应的修改,以适应人眼的观看方式。变形透视:特殊目的下,会使用变形透视,比如,你的手机其实并不是水平于你的眼睛的。很多时候都会有倾斜。ui设计的时候,根据目的也会做相应的调整。色彩原理:色彩是一个可以单独拿出来说事的知识:色彩是视觉引导,情绪引导,观感控制的一个重要手段。很多人都觉得色彩是很难掌握的一个能力,其实也不用太担心,因为有大量的现成的色彩构成,与色表等可以参考。在不能主观去使用的时候,至少学会收集色表,和根据需求使用它们。构图:因为无论是绘画还是做ui,我们看到的内容都是有边界的既然有边界,就要安排主要内容的位置。对于影视产品来说,就是镜头感。对于UI来说,就是观看舒适度,和操作舒适度。所以如果一个ui有绘画能力,有几个好处。第一:就是你可以短时间,高效率的方式,快速尝试设计和比对。大大提高工作效率第二:就是你绘画越熟练,你真的时工作效率越高。因为你对透视,结构,光原理,光色,的熟练,可以让你快速拆解你眼睛所见的一切事物,然后去根据需求改变和重新组合它们。第三:很多时候手绘是一种不可替代的存在。我重新审视一下绘画知识和UI的关系:结构:没有任何东西是没有厚度的,哪怕是扁平化设计,很多也都有厚度透视:结构的变形一定会在透视的框架下!光原理:能够理解结构,就能够自由控制光源。构图:其实是UI工作使用最频繁的原理,布局永远是整体控制的关键。色彩原理:无处不在,无法忽略。无论你做任何绘画练习,请一定要明确你绘画的目的。画画这个事情其实就是一个量的积累,哪怕你没有因为绘画而提高设计能力,但是长期保持绘画习惯,绝对大大提高你的设计效率是真的。其实就国内各行各业来看,其实没有哪个职位是工作内容范定的特别精准的。特别是一些小公司。除了UI本职工作以外,动画,特效,场景元件,角色切片,也都有可能遇到。手绘能力可以让UI职位锦上添花,拥有更强的适应力,更高的工作效率。也有更多横向扩展职业能力的机会。所以推荐多少都应该具备一些手绘能力。以及相关的绘画知识。---------------------------------------------------------------------------------------------------------------------------------------------------最后我想说的就是,以绘画的方法去 【理解】 视觉上的世界是一个很好的方式,也可以去尝试绘画,但是请明确你做这个事情的目的。不要为了画画而画画。---------------------------------------------------------------------------------------------------------------------------------------------------我其实更注重意识和态度问题,因为从业太久了,只有刚入行的时候才特别关心,基础,标准,等一些常规问题,工作越久,越对职业素养,设计理念,处事方针等这种思维逻辑上的东西无比重视。这也导致了我写的文章,比较重观念。作者:铁木士

    浏览:140 发布于2017.11.10
  • 层级对UI设计结果的影响

    任何设计都应该有它存在的理由。很多同学在设计练习的时候都无法确定设计命题,信息层级划分,操作的层级划分,甚至觉得命题练习很迷茫。所以今天我就带领大家一起分析一个实际已经上市的产品的UI样例。帮助大家分析UI信息中的必然因素。                                                    我今天查看天气的时候打开了一款天气app      很多人应该对这款app都很熟悉,我们首先可以看到,这款软件是可以横竖屏自动适应的。从构图比例来说,这款软件是以竖屏作为主要显示模式的。在竖屏的情况下,观看效果最佳。                                               我们先不谈层级问题,我们先来浏览一下完整的信息。                                         下拉信息框以后,这里出现了一个商用ui不应该犯的错误。      当信息全部下拉到底的时候,信息上边缘有一排未显示完全的文字,漏边了。这个琐碎的文字边角,破坏了整体的UI视觉完整性。      其实这个缺陷是可以避免的,只需要在程序上调整一下文字距离    (这种ui中的错误,其实不算多,但是也不算少)      因为这个软件,在横竖屏上都需要自适应尺寸,所以取的是一个平均距离,理论上,ui人员在检查UI的时候,是可以让程序人间进行修正的。      横屏的下拉信息也是不完整的。这种问题跟上面一样,都是可以通过程序坐标修改间距的。      那么这个问题严不严重呢?其实这就很主观了。因为可以拖拉的面板,除了最上和最下位置,它其实还有很多手动的中间位置,不可能保证所有信息的视觉完整性。是可以通过程序调整,让信息看起来更完整,但是这所花费的时间,精力,成本,和所获得的用户体验之间的性价比,那只有研发人员才能去权衡了。                                                                  下面我们来看一下操作栏。       最上面的按钮是添加城市,这个按钮几乎没有多少可操作性,除了第一次打开软件设置它以外,可能出差旅游,会点按几次。      有些软件的这个位置,属于频繁操作位置,但是在这里不是,因为当你单手持握手持设备的时候,这个位置其实并不好点按。      天气按钮:打开软件的时候是默认开启的。一般用户在看完天气以后,点按其他信息之后,很少会再点回天气了。所以这也属于一个很低操作的按钮。      时景:这个东西,其实存在感可有可无。                                                               关键的地方来了:指数按钮      指数按钮其实是一个跟天气密切相关的信息,为什么被放在第四位?      还被放在了可有可无的时景下面?      原因很简单:最易操作位置!      为什么这个位置最易操作?当你单手持握设备的时候,不是在你手旁边的按钮最容易按到,而是稍微远一点,的更容易操作,第一是因为视觉上看的清楚,第二是因为人的手指,伸展,比回拉更容易。                                                                                 地图按钮: 地图:天气的具体位置,也是非常频繁操作的按钮,但是相比较来说,地图点按几率,可能没有指标那么高。      下面三个按钮:      一个是用户登陆      一个是软件推荐      一个是设置      这三个都属于低操作需求的按钮,甚至都很少有人去碰它,几个月点一两次都正常,一年不点也正常。      但是他们为什么不排列在其他按钮的下面,而放到底下?      不仅仅是因为视觉区分的原因。      左侧触摸栏,最容易触摸的位置,其实最容易误操作,如果一个ui设计的太方便点按,一样也会给用户带来麻烦。所以最容易误操作的区域,能空则空。                                               所以我们来看一下操作难易度,与信息层级的对比      所以,当你去分析一个产品的时候,要多想一下,为什么,为什么它们在那里,而不再其他的位置上?                                                              我们再回过头来看一下横屏。。。      信息栏,因为自适应横竖屏幕,但是它的宽度依然保持不变,横屏的时候会发现,几乎等于浪费了一半的可视范围。那么我们能不能考虑把所有天气信息都放出来呢?不能!有几个原因:1太多信息一眼看上去你是无法一次性快速分辨的。2下拉的竖向浏览信息,其实效率很高。尽可能简化用户信息读取量才能尽可能的让信息交流效率更高。3从成本上考虑。比起分别制作不同显示方向上适应修改,这个成本多数情况下不值得。我们来看一下,在UI设计里,有哪些目的:1信息传达的效率2信息的传达顺序3操作的效率4视觉上的美观      信息的传达效率和传达顺序,不分先后,因为项目需求不同,这两者根据需求是可以互换的,但是前提是只有一个为主。      操作效率比美观更重要。      所以这里牺牲最大的就是视觉上好不好看这一点了。其实市面上是很难找到几个视觉上巨丑无比的UI范本的。因为UI本身并不复杂,所以哪怕是为各种目的做了牺牲和割舍,也依然有很多可调整空间。      去了解市场上的应用软件,游戏,网站,区分内容和信息,区分功能区域,然后去思考他们的设计目的,原始初衷,是很好的设计练习。做这种练习,记得一定要写个人笔记,因为工作以后,你会发现,你的工作与这些问题几乎相同。      在你还没有特别个性的设计之前,积攒市场上的产品熟悉度,也是学习的一个方法。甚至可以叫做职业素养。

    浏览:98 发布于2017.11.09
< 1 2 3 4 ... 9 >
学设计来火星,开启你的时代 立即体验