小编：@C7210Sketch毕竟没有什么学习曲线，颇易上手，相应的也时常导致新手在一开始就忽略掉一些重要的、高频的使用小技巧，而将一些稍许费力耗时的方式一路沿用下去。这篇内容所针对的便是这样的情况。几乎没有进阶的要点，只针对初学的同学培养正确习惯，还望各位老司机们见谅。下面进入正文。关于对象、图层、画板的使用技巧1.通过快捷键调整图形的形状选中图形，按住 Command 键，然后通过上、下、左、右方向键即可按1像素为单位调整图形形状。同时按住 Command Shift 方向键，则可以按10像素为单位进行调整。​2.复制元素选中某元素，按 Command D 即可进行复制；复制出的新元素默认与原有元素的位置相同，且覆盖于原有元素之上。此外，按住 Option 健，同时拖拽目标元素，同样可实现复制；保持复制出的新元素仍处于选中态，并连续使用 Command D 快捷键，即可按照之前手动拖拽的距离为间隔单位实现多重复制。​3.智能选择按住 Option 键，面向多个元素拉选择框，最终只有完全处于选择框内部的元素会被选中，而其他元素会被忽略。​4.分组与解组选中多个元素，按 Command G 将其合并为一组。选中某个组，按 Command Shift G 则可实现解组。 ​5.组内单选要选中某分组内的特定元素，无需到图层列表中寻找，按住 Command 键，同时用鼠标直接指向该元素， ...继续阅读 (13)

小编：扁平化风格大行其道的同时，并不是说明不需要掌握那些写实风格的技能，今天给大家带来一个轻写实“刷子”icon的教程，教程很简单，勤动手，多思考，才能成长的更快。 转载请注明：学UI网»轻写实icon绘制【教程】 ...继续阅读 (23)

喜欢逛书店的人应该都有过这样的经验：即使没有想买的书，但走进书店，眼睛总会被长相俊美的书吸引，甚至会因此产生拥有它的欲望，虽然它们的归宿很有可能是看了几页就被堆在了角落里。包装的神奇之处就在于，即使你并不是很需要这件东西本身，但貌美或特别的包装会让你产生“似乎我是需要它的”幻觉。图书封面也是文字的包装，好的文字同样需要好的包装使作品更加完整和完美，也更能在茫茫书海中脱颖而出。▲英国封面设计学院奖（The Academy of British Cover Design）的logo 2014年，书籍设计师Jamie Keenan和Jon Gray设立了一个专门表彰上一年书籍封面设计的奖项——英国封面设计学院奖（The Academy of British Cover Design），奖项涉及儿童图书、青少年图书、文学小说等十个类别，任何封面设计师的作品都可以参赛，包括电子书封面。但有一点遗憾的是，这个奖项只向英国范围内的设计师开放。 英国封面设计学院奖2017年获奖名单– Children\’s 儿童类 –Designed by Dominica ClementsArt directed by Anna BillsonIllustrated by Oliver Jeffers – Young Adult 青少年类 –Desig ...继续阅读 (14)

引言随着人工智能、自然语言技术的逐渐进步，产品不再是冰冷的呈现在用户面前，你可以同他对话交流。掌握着前沿科技的行业老大们都相继开发出各自的人工智能对话产品，比如siri、微软小冰、Google Assistant、度秘。当然，对于大多数的产品来说，现阶段还不具备接入如此前沿的科技技术。设计师可以运用一些视觉化的方式，让无生命的产品界面充满人情味，实现与用户对话。siri／微软小冰／Google Assistant／度秘 一.深入了解用户，把产品想象成他的伙伴人工智能的对话，是机器通过与用户的交流，进行语言积累后自我学习成长，再形成更贴合用户习惯的交流方式。而通常的产品不具备人工智能的自我学习，但是作为产品背后的设计师，可以通过深入了解用户群体，提炼用户画像。通过熟悉用户行为特征，模拟用户性格喜好，最后以设计的洞见赋予产品贴合用户的人格。以微供业务为例，通过调研得出微供业务的微商群体多集中在26～30岁女性，以宝妈为主的兼职小微商。 微商做生意的最大特点是通过微信，微博等社交平台进行商品的发布和交易。与传统电商平台最大的不同是：普通的电商平台，商家和顾客之间完全不认识，甚至不需要沟通这笔生意就达成了。而微商的顾客，大多是从身边的朋友、熟人开始。所以微商在做生意上非常看重朋友这一关系属性。 基于上述的用户特征，我们将产品的人格定义为“朋友”。希望界面能够给用户带来一种与温暖贴心的好友交 ...继续阅读 (14)

当初自己是因为学习成绩不理想，因为美术生高考，文化课分数线可以很低，慢慢的爱上了画画，最后走上了设计的“不归路”。（PS：不知道还有多少银和我一样…）后来工作很久后，发现要学的东西太多太多。当然，如果你愿意做“二八理论”中的“八”，设计这个行业可以解决你的温饱，暂时不要想什么“诗和远方”。不知道你有没有过突然很厌倦？做做简单的设计，无非就是某素材网站的素材搬来搬去，根本找不到丝毫设计的灵魂，这个时候是该停下脚步，反省下自己了，问问自己“真的爱设计吗？”如果爱这个行业，就要考虑如何去规划自己，提高自己，不要满足于现状，相信“一万小时理论”会让你的能力得到巨大的飞跃。如果满足于现状，那么，你就离淘汰不远…转载请注明：学UI网»你真的热爱【设计】这个行业吗？–（深度自省） ...继续阅读 (13)

小编：设计机构及个人网站推崇的是个人品牌。随着网页趋势的发展，全屏模式＋大字号／大图片更受设计师们的青睐。如果你喜欢这种形式而公司的产品确不适合这种形式，那设计师们可以考虑在自己的博客或网站上应用。Wokine Monsieur Caillou Alexander Engzell Riccardo Zanutta Thieb Big Youth Nicholas Ruggeri north2 Corentin Portfolio Lionel Durimel Hannah Purmort Veintidos Grados Megan Ross STRV Richard Rodrigues Portfolio Vanderlanth Portfolio Y78 Alexandre Rochet Sean Klassen Zero Interactive Agency Whitelist Ludmilla Maury Portfolio of Ruslan Siiz Project Sunday Nightshift MING Labs Charlie Isslander – Portfolio Ali Sharaf Cappen WE ARE YOUNGBLOOD 文章来源：设计之家 转载请注明：学UI网»30个国外设计机构网站欣赏 ...继续阅读 (18)

小编：信息罗列如何明确展示？常用的是有序列表和无序列表，那何时使用？使用时该注意什么？这篇文章让你避开7个陷阱，更完美的使用无序列表功能来展示信息。摘要：小圆点有助于分割大段文字，使得复杂的文章和博客更容易消化，突出关键信息。有时候，最好的信息展现方式就是无序列表。无序列表能吸引注意、便于浏览、简化文本，并且表达出项目之间的关系。网站不是一个适合长篇大论的地方。相比之下，网站的读者更喜欢文案以某种易于浏览的形式组织起来，能让他们轻松跳过大段文字，直达自己感兴趣的部分。有许多种网页文本格式的技巧，能够分割大段内容。无序列表和加粗、缩进、行间距、彩色文字，都是辅助网页内容高效阅读的重要手段。区区几个小圆点能够吸引视线，并且让复杂的概念易于理解。小圆点能让读者感知到内容的简明和重要。这并不奇怪，在可用性研究中，我们观察到读者对无序列表满怀热情。网页的读者希望快速消化内容。我们可以对比下面这两个版本。你会发现第2个版本中的内容更易阅读。这是因为它以纵向列表的形式展现。相比之下，在第1个版本中，读者只能在结构不太清晰的段落中寻找。版本1我们的Spa度假套餐包含了2晚住宿，2次50分钟的任选spa项目，1顿两人份的上门早餐，到达时还有礼品篮相赠。版本2我们的Spa度假套餐包含:2晚住宿2次50分钟的任选spa项目1顿两人份的上门早餐到达时赠送礼品篮不必担心版本2占了更大的纵向版面。如果（或者说 ...继续阅读 (9)

淘宝2017系列文章：《淘宝2017UI设计风格改版升级》《淘宝2017-提示信息的情感化设计》《淘宝2017-商品详情改版设计》《淘宝2017-可能是迄今为止最懂你的“我的淘宝”》《淘宝2017－店铺体验和商业价值的设计升级》《淘宝2017-大公司里的“小产品”设计》 所谓 “事毕回复” 说的是该回复时就要即时回复，根据事情的轻重缓急做出答复。手机淘宝新即时回复的设计我们希望用户在多链路上使沟通效率更为便捷，减少以往操作上跳转成本的痛点问题，减负用户认知，使在交流的过程中更为顺畅，商业成交过程中 “短” “快” “平”现有问题分析产品要最大化商业价值，设计要在用户体验和商业目标之间做权衡。在遵循市场的需求下实现设计最大化，让用户体验推动商业价值，在使用的基础上提高愉悦性。同样的设计方式“能用”和“好用”是两码事，设计师像一个医生，哪里有问题去就症下药，医治解决。来看看消息前期的痛点问题。问题一：当用户在逛淘宝，浏览购物车、详情页等其它页面进行浏览内容时，卖家发来的消息无法在当前页面进行快速回复信息，需用户点击提示后跳转页面编辑文字才可发送，如返回上一级需再点击返回按钮才可以。这个过程痛点是 “哪怕用户只需要回复一句简短的答复，跳转页面的方式成本也为之过大”  反复和不同卖家沟通来回切换，长时间会增 ...继续阅读 (11)

小编：今天一起来学习PS里的3D功能——元素合并，不会3DMAX等设计软件的小伙伴们可以看过来了。这是一个很简单的功能，学会了后会作出非常棒的3D效果海报。感谢作者@airisgreen的讲解，而且文末还有作者分享的PSD源文件，大家可以去下载参考。利用PS里的3D的元素合并功能，进行经常的创作吧一个简单的功能，不过能弄出不少效果来哦。希望诸位受用。这个用到做UI样机上也是极好的，等有空出一个试试看。另外希望教程能让大家对3D产生兴趣。然后去学C4D、3DMAX、MAYA这些更高大上的软件。源文件在底部，如果有错别字请原谅。 文章来源：UI中国作者：airisgreen 转载请注明：学UI网»3D教程-元素合并［PS教程］ ...继续阅读 (12)

设计一个logo吧？但是，那些越来越华丽越好的方法，现在还行得通吗？​这一次为大家介绍的是能够长时间耐用，最适合商业的logo设计制作时所需要的9个要点。创新且具有印象的logo设计，在图形设计的素材中是非常重要的项目之一。因为成功离不开客户的支持，所以商业设计从最初就进行正确的设计是非常重要的。因为品牌设计的制作周期很长很复杂，所以品牌标志必须显而易见，将想要传达的信息与概念很好的反映出来是非常有必要的。这一次，就让我们一起来看看logo设计制作时重要的9个要点吧。1. 与品牌设计相关的知识logo必须体现企业的愿景、价值观或目标这些基本的东西。为了与市场相结合，我们有必要制定营销策略保证目标受众的完整性。牢记以上事项，我们再开始考虑logo设计的过程。2. 回到基础很多设计师都提醒你过这句话：注意设计的易懂性。让我们来强化简易性，一致性，辨识度，说服力。在这种情况下，能帮助你的设计不会变的混乱。同样的方法，也可以用于制作强化了用户体验的人性化网页设计。3. 成功的关键 – 信赖之物分析竞争网站的商标了解他们的倾向将有助于工作，但这并不是必要的。为了减轻商业logo制作难度，更好的表现品牌，试着使用别人没有用过的东西吧。与特定的流行趋势相反，打破设计规则来表现出品牌独特的性格吧。4. 个人设计过程创造性的设计灵感，并不意味着用简单的方法就不能实现。为了适应自己的工作风 ...继续阅读 (16)

小编：做UI行业的都应该知道404页面是非常重要的一部分设计，当页面出现错误时它是增强用户体验的很好的做法，其遵循的理念是： 提供简明的问题描述，消除访客的挫败感。提供合理的解决方案，辅助访客完成访问目标。提供个性化的友好界面，提升访问体验。今天就跟随作者@化流水躺湖底一起来谈谈404页面的情感化设计。关于设计，关于404申明:这篇经验为我在看了来自知乎、简数、站酷等平台上很多大神的文章总结而出。很多词汇并非原创，再次向原作者表示感谢。文章将以下面4个问题展开，大家可以挑自己需要的着重阅读。什么是404页面？404页面存在的作用有什么？怎么设计出符合情感化的404页面？404设计误区 什么是404页面404页面是客户端在浏览网页时服务器无法正常提供信息，或者是服务器无法回应，且不知道原因而返回的页面。一般404页面出现在没有网络时、主页更名或搬迁地址时、输入网址错误时、以及编程人员的疏忽写错地址等原因时。 404页面存在的作用有什么？作用1：告知用户错误所在，缓解用户焦虑；作用2：提供错误解决方案；作用3：影响用户对网站体验的情绪，即发生错误之后给用户留下一个是很坏的印象(可参考峰终定律)；终极作用：将访客和潜在客户留在网站上诺贝尔奖得主，心理学家DanielKahneman经过深入研究，发现对体验的记忆由两个因素决定：高峰（无论是正向的还是负向的）时与结束时的感觉，这就是峰终定律 ...继续阅读 (14)

小编：当灵感迸发，想画上两笔，却发现出来的“成果”惨不忍睹。日前，谷歌推出了一款名为“AutoDraw”的智能画图软件，堪称手残党福音。  它结合人工智能与艺术，AutoDraw系统自带AI能充分解读并将之替换为所绘物体的专业的线条画。别看界面设计很简单，功能却异常强大。AutoDraw在线即可体验，适合多平台：手机、电脑或平板电脑。 我已经画上瘾了，你不去试试？如果你有兴趣了解AutoDraw的背后故事，请查看“Quick，Draw！”（一个AI实验）。Quick，Draw！当你涂鸦时，它不停地猜想你当前画的是什么，并会告诉你它的判断，它的猜测是对你画得像不像的极好反馈。这个游戏还可以随着时间及涂鸦内容来提高学习能力。 界面 开启AutoDraw网站后，点击首页的Start Drawing打开软件界面，前方高能：AI人工智慧的强大威力！若想知道AutoDraw如何使用，点击Fast How－To会有简单的功能介绍。 绘图步骤1.开启AutoDraw绘图工具后，在左侧选择AutoDraw功能开始画图。 2.画图、工具<1.用鼠标随意画图，当你绘图后，上方Do you mean就会出现各种可能相关的插图。点击列出的图案就立即把你刚才画的图替换成图库插图，可以调整位置、放大缩小等等。<2.想要调整画笔粗细、插入文字、填充颜色、选择形状、调整颜色都从左侧菜单中选择相应功能。<3.缩放画布 ...继续阅读 (12)

又到了金三银四人才招聘的高峰期，不知道各位小伙伴们，内心会不会躁动呢。一场接一场的招聘是否把你的心撩拨得蠢蠢欲动。跳槽的话题不少，今天我们一起聊聊什么原因会让我们的UI设计师想要换工作呢。薪资低，不管各行各业，薪资待遇大概都是一个离职的重要原因吧；改改改，产品经理需求无止境的改改改；发展空间受限，遇到瓶颈，没有再大的进步空间；无止境加班，加班过多，身体吃不消，身体是革命的本钱啊；缺少一枚大牛，没有人带，设计氛围不够。不知道大家觉得还有什么原因是如果让你遇见，会让你想换工作的理由，不妨闲下来大家一起来唠嗑唠嗑。不过不管怎酱紫，建议大家理性抉择。坚信越努力越幸运，奋斗终会有结果滴~转载请注明：学UI网»金三银四的高峰期，你是否蠢蠢欲动 ...继续阅读 (16)

小编：大家都知道3D效果的海报是非常有视觉冲击效果的，那种吸引人眼球的立体效果可以让自己的作品很快脱颖而出。今天就来教大家如何用PS制作出来，主要运用到PS的3D功能。最后非常感谢作者@EricD_w的分享讲解！PS\’s 3D features make three-dimensional posters方法是使用了PS里面的3D功能，一句话介绍方法就是：3D菜单－深度映射到－平面详细教程往下看：1.找到一张高清图片，最好层次分明，色彩饱和度高些，不同的图片最后的效果差异很大2.选择3D菜单－从图层新建网络－深度映射到－平面3.3D标签选择当前视图，调整视图视角、尺寸等4.3D标签选择场景，预设里选择－为照亮的纹理5.切换到图层标签，转换为智能对象方法介绍完了，效果还不错吧，放大图看下细节制作的海报效果如下文章来源：UI中国作者：EricD_w 转载请注明：学UI网»利用PS的3D功能制作立体海报 ...继续阅读 (23)

小编：在UI设计行业想要成功是需要很长一段时间去学习去练习…一个人摸索着前进时费力的，今天就为大家带来一份UI设计师设计基本指南，非常感谢作者@应昼雨成的分享，这17个技巧每一个都结合案例讲解，有对比参考，希望对大家有帮助！文章来源：站酷作者：应昼雨成 转载请注明：学UI网»UI设计师设计基本指南 | 《第一话》 ...继续阅读 (5)

今天的作业是三个偏平小icon的绘制哦，而且之中有一个大家之前是做过的哦！如果大家不会绘制可以去网站翻翻教程看看哈~~注意：注意颜色的运用色调的统一图标造型的风格一致不透明度的运用建议软件PS sketch要求：提交的作业在背景的右下角或评论框署名，格式为：(N群-XX）原作者：Pixelbuddha各位童鞋请选择适合自己现阶段的练习：新手作业进阶练习中高级作业转载请注明：学UI网»可爱扁平风格图标绘制【做作业】 ...继续阅读 (15)

小编：@TTTing你知道电商里最常用的颜色是什么颜色吗？你知道该怎么玩好关于红色的色彩搭配吗？看这篇兴许有帮助！～写在前面不知道大家有没有发现一个规律和现象，就是国内无论是综合电商平台还是垂直型的电商平台亦或是导购平台的品牌色一般都是红色系或暖色系的，而红色占了大边天，其次是偏女性化的玫红色／粉色，再或则是橙色黄色等，我挑选了一些电商平台的品牌logo给大家看下：同时，在一些大型的活动专题页设计里，红色也应该算是电商设计里运用的最为广泛的一种颜色了，但其实很多人对红色该在什么时候用，或者该怎么用依然很缺乏了解，红色用的好则是兼大欢喜，用得不好要么会显得俗气和不干净，或者会显得页面很压抑很腻。再一个红色寓意红红火火嘛，我自己本身也最爱红色，所以呢，今天我干脆来讲一下红色在电商页面设计中的运用好了噢！～我先给大家列一个提纲：1、红色的释义。2、红色在电商设计里的运用。3、与红色有关的常用色彩搭配有哪些？4、当红色运用在不同的质感纹理或形状环境时会怎么样？5、红色的使用禁忌或注意事项有哪些？接下来我们一条条来说吧，let’s go！！！～1、红色的释义。从性格色彩的层面来说，红色代表热情／热闹／刺激／欲望／奔放／喜庆／血腥暴力；从颜色的层面来说，根据色相／明度／饱和度的不同红色也分很多种红啊，比如大红／深红／品红／粉红／枣红／朱红／橙红／紫红等等；从作用的层面来说，红色代表危险警示／突 ...继续阅读 (16)

小编：动效如今也是很受欢迎的一种设计表现形式，它不仅可以缓解用户在等待的焦虑情绪，还能大大的提高用户的使用体验。动效是强大的，好的动效可以让你的作品很快的脱颖而出即使是最常规的交互。一起来看看使用动效的3个关键点！随着技术的快速发展，动效不再是视觉上的华美，更多的用户所要求的期望功能。动效解决了很多功能问题和接口，可以真正与用户互动。下面让我们探索动效的关键策略，提高界面接口的功能增加情感的力量。1.系统状态在你的程序在后台总发生一些过程，如正在从服务器下载数据，进行计算。这总是需要一些时间的。你需要让用户知道这个程序没有冻结，显示正在处理的状态。视觉交互给用户一种控制程序的感觉。加载完成度加载时间对大多数产品是不可避免的。而动效虽然不能解决这个问题，但会减少一点问题。当我们不能缩短时，当然可以使等待变得更愉快。有创意的过程动效可以减少用户感知的时间。动效影响用户感知你的产品，使它看起来比实际上更好。如果一个应用在加载时为用户提供了一些有趣的事情，这会使得用户更少关注等待本身。图片来源：Ramotion下拉刷新这组很流行的动效是“下拉刷新”，它发起一个移动设备上的内容更新的过程。图片来源：Zee Young提示：刷新动效应该与设计整体匹配——如果应用很小，动效也应该是。通知因为运动会吸引注意力，动效是一个令人愉快的方式可以与没有太多经验的用户进行交互。移动的对象立即抓住了用户的注意 ...继续阅读 (10)

经过长达1年半的开发，Adobe和谷歌于4月3日联合发布了全新开源字体“思源宋体”（Adobe 将新字体命名为Source Han Serif ；Google 将其命名为 Noto Serif CJK），这距离之前公布的“思源黑体”（Source Han Sans）已经有三年时间了。“思源宋体”同“思源黑体”一样以 “SIL开放字体许可证”开源发行。 这次思源宋体与黑体相配套，主要为东亚 15 亿人口提供统一的字体显示，避免多语言文本中的乱码问题。 该字体支持4种东亚语言（简体中文、繁体中文、日语和朝鲜语）以及7种粗细，每一种都有 6,5535 个字形，总字数有45,8745 个字型。目前已开放下载及免费使用。官方介绍：https://source.typekit.com/source-han-serif/ 字体下载思源黑体（Source Han Sans）https://github.com/adobe-fonts/source-han-sans/tree/release/步骤：打开页面，下拉至“Region-specific Subset OTFs”，选择相应的地区进行下载 思源宋体（Source Han Serif）https://github.com/adobe-fonts/source-han-serif/tree/release/步骤：打开页面，下拉至“Region-s ...继续阅读 (13)

小编：今天带领大家解锁一项很厉害的PS技巧—融合效果，非常感谢作者@无梦不欢的分享与讲解。过程很详细而且不懂的小伙伴们可以去文末下载PSD源文件呦，参数不重要，大家一定要先明白其中的原理，这样才能真正的掌握！大家好，欢迎来到无梦不欢的设计教室，时隔一年我又出来写教程了。分享经验的过程也是我自身学习成长的过程，我想将平时工作的一些设计技巧和心得分享给大家，同时也敦促自己不断学习更多的知识。如果能对大家有所帮助，这也使我的教程有了很重要的意义，也是我坚持写下去的动力。我将PSD源文件放在附件里了，需要的同学可以下载。如转载，请署名，谢谢~首先用【椭圆工具】绘制两个正圆填充为黑色，背景设为白色；在【属性】面板里设置形状的“羽化”值达到下图效果即可；为两个圆建立一个组（起名为“融合组”），打开调整层，选择色阶将其放在“融合组”内最上面；调整色阶滑块，将黑色和白色滑块拖拽到中间，挨在一起，如图可看到，经过色阶的调整，羽化过的圆又变的清晰起来；原理：白色滑块右边都是白色，黑色滑块左边都是黑色。黑白滑块中间是由黑到白的过渡区。调整色阶，将黑白滑块挨在一起时，代表黑色更黑，白色更白，中间没有过渡，变成了一个点，点以左都是黑色，点以右都是白色。那么圆形的边缘就变得清晰起来。为两个黑圆添加颜色首先，在“融合组”内最底层新建一个白色图层然后，打开“融合组”的“混合颜色带”按下图调整白色滑块（隐藏组内白色 ...继续阅读 (15)

搜索框虽小，搜索功能却在一个网站的用户体验中发挥着非常重要的作用。好用的搜索功能能够快速提升用户的愉悦感，而糟糕的体验，可能就会让一个产品面临着失去用户的危险。热衷于细节的设计师怎能放过这个要点，今天我们来聊一下关于搜索结果的问题。考虑到用户体验，就不能忽视页面中的搜索功能。用户想要的信息是否能够清晰的展示出来，与之后的回访率和转化率密切相关。这次介绍一下改善搜索结果页面用户体验的七个要点。1.搜索后保留关键词 保留搜索框里输入的关键词，因为用户可能会有想要更改关键词的一部分等各种各样触及信息的操作。用户进入搜索结果页之后，又要从零开始输入的体验是不可取的。2.展示有正确关联性的搜索结果大多数用户希望看到有正确关联性的信息。必要的信息在一个页面的上部显示，就可以方便用户轻松的收集信息。搜索结果的正确与否关乎转化率的高低。对于用户来说，两三次搜索不到自己想要的内容，就会放弃使用这个产品。3.让自动预测功能发挥效果虽然自动预测功能非常便利，但是如果起不到恰当的效果就会对用户体验造成相反的影响。在搜索框内输入几个文字，关键词就会在输入完成之前被预测出来，但是如果是不完善的预测变化却会导致转化率的下降。4.改正错误格式搜索关键词格式错误时有发生。用户在搜索的时候不小心输错了关键词，让系统在能够感知的情况下，显示修正后的正确结果吧。搜索关键词输错的时候，展示“搜索结果为空”的页面，并要求用户 ...继续阅读 (16)

小编：今这次的教程系列叫给界面“穿衣服”，这篇是基础的单个样机的运用，相信跟着Miya宝宝的步伐，小伙伴一定能很快掌握哒~给我看看你们界面的新衣呢~Miya的站酷链接：http://uimiya.zcool.com.cn/ 转载请注明：学UI网»给界面穿衣服系列之单个样机模型【教程】 ...继续阅读 (16)

@Yjjj  最近有个很好的机会来做了一次视觉改版，感谢team(良辰、圆圆、小马哥、珂珂、妖子)的努力，我们一起来完成这次极具挑战性的任务。我们发现了许多问题，也学到了许多方法。不知道大家在遇到视觉改版的时候第一个想法是什么，是参考竞品？还是主观猜测？还是问问用户喜欢什么样的？其实都不正确，改版通常会分以下几种情况：1.只改视觉，不动交互。2.视觉交互一起改。3.改交互不改视觉。第3点的情况不多，主要是第1点和第2点，如果视觉交互一起改，还相对更简单一些，但是交互的改动往往伴随着产品的整体规划调整。如果只改视觉不改布局，那限制条件就更多了。那么，究竟视觉改版要如何开始做我们一起来分析一下：目标首先我们需要明确我们改版的目标是什么？在确定改版目标之前，我们先问问自己，目前的产品出现了什么问题，也就是为什么要改版？改版是一件工程量非常巨大的事情，因为首先风格的推导过程不是一蹴而就的，不能说你几个人拍板，从自身经验出发说：我们就要这样改！这是不对的。其次改版之后的规范组件库要相应的更新，再次开发资源的分配更捉襟见肘，需要在完成产品功能需求的开发同时来完成改版需求的开发，最后改版的效果我们如何来衡量？是否是一次成功的改版，如果不是，哪些地方需要重新调整？这是一整个改版需要做的闭环工作，从前到后都是需要感性发散，理性执行的。所以我们改版的原因是视觉和品牌定位不匹配，还是产品的用户体验很差劲 ...继续阅读 (12)

小编：《攻壳机动队》的“故障艺术”海报风靡起，小编被众多小伙伴追着要教程。故障艺术（Glitch Art）的产生来自电子设备成像技术里的图像错误（有点像以前电视或电脑花屏的效果），后来就发展成了一种独特的审美偏好，并被艺术家接受。蒽，先给你们安利一个网站，可以轻微制作出故障艺术的效果。ImageGlitcher 使用教程：1. 拖放图片到框中，尺寸建议别大于1024×1024；2. 调整参数：GLITCHINESS：调节故障的强度BRIGHTNESS：调节画面的明度SCAN LINES：设定是否显示扫描线3. 点击左下角“Glitch It”，稍等片刻就能获取满意的图片啦～就这么简单粗暴 视频教程不过瘾的话，扒一个Lincung Studio的教学视频来，你们自行感受，别问我哈。看不懂说明你ps工具不熟悉。ps当然比较强大啦～不清晰可前往此处观看：http://us.sinaimg.cn/002oNYq3jx07a6Qb4yCb01040100j3nf0k01.mp4?label=mp4_hd&Expires;=1491835071&ssig;=ee7QPkF6JF&KID;=unistore,video转载请注明：学UI网»“故障艺术”的制作教程及必安利的利器！ ...继续阅读 (14)

记得某次公开课狼哥给大家讲过gameboy。今天就来检验大家有没有认真听课了~~今天的作业一个gameboy的临摹 ！gogogo~~注意：注意整体颜色的搭配注意高光阴影的体现注意电子屏边界的细节要求：提交的作业在背景的右下角或评论框署名，格式为：(N群-XX）原作者：Kelly Nichols各位童鞋请选择适合自己现阶段的练习：新手作业进阶练习中高级作业转载请注明：学UI网»gameboy临摹【做作业】 ...继续阅读 (11)

小编：由于周六出了个小小的意外，公开课的视频被狼哥哥吃掉啦~但是狼哥哥觉得小伙伴在上班的时候看视频不方便，所以把这次公开课的内容以文章的形式发了出来。狼哥哥是一个……呃……比较……好（dòu）玩（bī）的大男孩……下面我们就请狼哥哥来给大家分享兄弟们！姐妹们！大家好！我是你们人见人爱，花见花开的英俊帅气萌萌哒狼哥哥（伯毅狼）O(∩_∩)O狼哥哥喜欢和大家聊聊设计的事也许在某个地方，我们已近聊过了呢狼哥哥我是一个爱生活又童心未泯的美工大人前两天工作烦闷的时候把两个妹子啊……呸！是杯子，放在一起的时候突发奇想！不如玩点小创意于是乎，就有了下面这个作品这可真是一个悲伤的故事……哈哈~O(∩_∩)O~ 本来我只是想画两个杯子而已 于是打开AI，画了一根线 画上左边的杯子 画上右边的杯子 再画上最左边的小墨水瓶 总觉得这样很无聊啊两个杯子挨得很近，墨水瓶却孤零零的有点……有了！来点小表情表情不好画？我们可以用颜文字啊！又方便又可爱 嗯，看样子剧情是有了但是还是觉得太单调那么我们就把角色塑造的丰满些墨水瓶：“矮丑穷”的小屌丝蓝色杯子：英俊潇洒的高富帅粉色杯子：没见过世面的傻白甜高富帅表白傻白甜傻白甜娇羞答应矮丑穷悲伤流泪 角色特征有了来点道具丰富下剧情和人物高富帅和傻白甜沉浸在爱情的海洋里矮丑穷伤心欲绝，连花瓣都掉了…… 将二次元和现实结合也是挺好玩的呢 其实，故事在一开始就已经注定了……其实 ...继续阅读 (18)

假设你是一名兽医。因为你非常善于利用人们对弱小可爱动物的爱心，所以Instagram账号经营得风生水起。但这对你来说还不够，你决定开发一个移动应用来拓展你的宠物帝国。这款应用能把人脸模拟成猫猫狗狗的脸。（承认吧，你14岁的时候肯定构想过类似的模拟马脸和猪脸的应用。毫无疑问。）那么你的这款改变世界的应用，肯定也需要一个图标，猫咪图标。这时候Icons8就派上了用场。在搜索框里输入“猫”，下载你喜欢的“iOS”风格图标，因为你觉得Appstore还不够拥挤，差不多就是这样。然后，你发布了应用。你的秘书向你祝贺，从那一刻起，你的名字被载入兽医的史册。我想表达什么？兽医真是个好职业。好吧我只是在搞笑。人们往往有各种奇怪的兴趣。他们会搜索一些含糊不清的图标，例如“新闻”、“工作”等。用在他们的应用、网站、T恤上。试着搜索一下工作图标，你就能了解我们的搜索算法的厉害之处，它能囊括所有几乎能与“工作”沾上边的图标。问题是，每个人对于相关与不相关都有自己的理解。更要命的是，即使同一个人，在某些因素影响下也会对一个图标的相关与不相关做出不同的判断，比如说文字标签。给图标加上文字标签，或许就能改变人们的认知。我们不知道怎么应对这种情况，因为我们有两种显示模式：我下文中会把这两种模式成为纯图标模式和图标 文字模式。哪种更好，图标还是图标 文字？哪种更适合作为默认模式？人们看到太多不相关结果时，会感到挫败 ...继续阅读 (8)

大公司里有很多“小产品”，手机淘宝里的卡券包就是。卡券包是手机淘宝用户的权益仓库，存储着用户在平台内获取的众多权益，比如店铺优惠券、红包、会员卡等。本文男主，在寸土寸金的“我的淘宝”有套刚需房“小”是相对“大”而言的，手机淘宝是一艘流量航母，每天使用手机淘宝的用户数接近两亿。相比航母甲板上动则数百万上千万的拳头业务，卡券包的用户数显然少得多。图片来自电影《Gulliver\\’s Travels》卡券包具有较强的工具属性，大部分用户访问卡券包是为了查看自己获得的权益，来去匆匆，查完即走，对用户的购买行为并没有直接的推动作用。可能在商业回报和KPI的双重考量下，卡券包改版的紧迫程度并不高。事实上，在此次改版之前，由于业务调整、人员变动，卡券包和其它的“小产品”一样，年久失修，存在诸多体验上的问题。图片来自电影《WALL·E》看到这里，你可能会觉得卡券包十分可怜。既然这么不受待见，为何不直接把这块业务干掉。与其活着被人诟病，不如有尊严的“狗带”。不要着急，我们再看一组数据，你一定会对卡券包改观：2016年双11期间，卡券包的单日访问峰值达到了日常流量的近20倍。试想，如果这个月你领到的薪水是往常的20倍，你的内心会受到怎样的冲击。不难看出，卡券包是典型的“大促怪物”，体形会随着 “大促”报复性增“大”。平台大促，权益密集发放，查询权益的用户数和权益的查询频次会激增。这个时候 ...继续阅读 (13)

找份合适的工作的确不容易。虽然，我们无法在面试前得知面试官询问你的每个问题的答案，但这有一些常见的 UX 设计面试问题，或许你可以提前准备下。当然，只是盯着这些答案不能保证你能搞定这份工作，但却可以提升你的面试成功率。而你只需要记住它们，并根据所面试公司的工作描述，将它们合理的贯穿到每场面试中就可以了。下面我将总结分享 7 个基本的 UX 设计面试问题，并为大家展示一些作答的提示和技巧。1. 什么是 UX 设计？ 为什么它很重要？你将如何解释 UX 设计的流程？通过这些问题，面试官们想弄清楚的是：你是否具备 UX 设计基础知识？虽然这是一个比较笼统的问题，也没有统一的答案。但你只需要专注具体的定义，并以设计师的角度作答即可。而你的解释则应该清晰、易懂。（可以想象下，你在解释给一个 10 岁的孩子听。）对于“为什么它很重要”这个问题，则正好是表现出你对公司设计理念认可的机会。同时，你还可以站在自己的设计视角来讲述相关的背景故事，并着重强调人性化设计的重要性。TED：人性化设计在回答“你将如何解释 UX 设计的流程？”时，请关注以下几个方面：用户研究可用性信息架构用户界面设计互动设计体验策略提示：你可以围绕同理心来定义你的 UX 设计，同时需要着重的了解你所面向的用户群体。这通常意味着作为 UX 设计师，你应该着力进行设计调研，并基于调研的用户数据进行设计。2. 请阐述下你的设计过程， ...继续阅读 (5)

小编：作为设计师每天都会看到各种图，除了走马观花的看，你学会了分析了吗？还是只是收藏进你杂乱的收藏夹，嘘，也许你看了假图。今天继续跟随@UISTAR来学习下如何思考和分析你看到的优秀的图们。作为设计师的我们，每天都会去各大设计网站寻找灵感，比如Dribbble / Behance / Pinterest上面有大量的优秀作品，看到那些赏心悦目的作品会忍不住采集收藏下来，但是你有没有想过，你可以做的不只是让它们安静的待在收藏夹中长草。对这些优秀的作品进行理性的分析，会比你走马观花的看一遍收获更多，如果再进一步思考，甚至可以获取到当前网页设计的流行趋势。下面是我选取Dribbble上面一些优秀的网页作品，我试着带大家从排版布局、色彩搭配、包装展示等方面一起来分析这些优秀的作品。1.排版上左右对称的设计带给我们很强的信赖感，几何元素的加入使得头部深色背景充满活力，红黄蓝适中的饱和度也看起来很高级。 2.同色系配色加上浅灰色背景让头图整体看起来简约干净，配合柔和的大投影让右边的卡片得以突出，几何元素也再一次得到运用。 3.上面这个例子就是典型的Instagram风，主要通过去除多余颜色，使用超大留白，信息流尽量使用大图尺寸，通过降低信息密度来突出内容，配图也选择的是性冷淡风，整体让页面看起来极简高逼格。 4.黑色加金色耐看又安全，深色的头图让文案一目了然，加上两侧的数据折线图，不但丰富了画面 ...继续阅读 (4)