写前叨逼叨：这几种logo形式很受客户青睐，亲测有效。 大部分logo都很简单，但在这些同样都是简单的logo中，有些显得很有品质 感，有些显得很简陋，有些客户愿意出高价，有些却老被客户吐槽不值设计费，怎么办呢？葱爷给大家分享三个logo设计技巧，也可以说是三种logo形式，运用得当可以有效提升logo的品质感、价值感。 一、设计一个开放的圆圆是最完美的图形，所以把很多东西设计成圆形都会很好看，logo也一样，但如果设计成一个封闭的圆，可能会给人不够灵活、缺少变化的感觉，所以，我们可以尝试把logo设计成一个开放的圆，即只要一个半封闭状态的圆，或者是设计一个不完整的圆，比如下面这些案例：▲ 由于这种logo属于半封闭的图形，所以也比较容易处理成正负图形。 把logo设计成一个开放的圆有以下几个好处:❶ 视觉平衡。因为圆形本身是对称图形；❷ 视觉聚焦。圆形会让人的视觉往中心集中；❸ 有设计感。因为通常把一个图形设计成圆形都需要简化和规范，这会增加图形的设计感。 示例一几年前我接触了一个品牌名称首字母为“s”的电子公司，也用这种方式做了一个logo方案，字母S加上圆。在下面的两种组合方式中，很明显第二个更开放、更有设计感一些。但仅仅如此肯定还不行，一是这个S太普通，二是图形没有经过规范，所以我在草图上尝试了几个方向，最终选择了下图来执行，简单、抽象，在感性的柔和中夹杂着一点理性的坚硬 ...继续阅读 (34)

作为UI设计师来说，我们会经常关注着产品设计的变动，发现设计细节将有助于提升我们的思维。特别是在一些节庆和特殊时间段期间，你会在不经意间发现一些常见的设计细节被赋予氛围感。在已有的架构中改变表现层，是融入主题达到氛围感的常见形式。在UI场景中有三个最常见的主题化区域：底部标签栏、顶部视觉区、金刚区，下面黑马哥为大家列举几个案例看一下。 一、底部标签栏主题化设计1、底部标签栏图标主题在不改动结构的情况下，替换底部标签栏图标是最方便的形式。通过主题化的图标也非常容易传递氛围，无论是在节日庆典、购物季、主题活动等场景中，这个形式都是最直观的表达之一。比如优酷 APP 在中秋节的时候，就将底部标签栏图标替换为各式各样的月饼造型，主题营造也是非常的明显。将原本的图标造型融入到月饼图案中，镶嵌图案的设计非常巧妙，不仅保留原本的识别特征，也强化了主题氛围感。除了在图标造型上面发挥以外，也可以将主题文案融入到设计中，这也是较为直接的表现形式。作为特定主题来说一目了然，需要把控主题文案数量。 2、底部标签栏背景层底部标签栏的设计中，除了通过图标设计附和主题之外，也可以在背景层进行主题氛围营造。由于底部属于操作频繁区，背景层的设计不能过于抢眼，容易干扰功能的识别与操作。比如前段时间抖音 APP 将底部标签栏背景层进行主题营造的时候，在黑色层上面运用的色调比较深一些，与原本黑色的沉浸式体验有差异，在白 ...继续阅读 (21)

大家好，这里是设计夹，今天为大家分享的是「按钮设计」。按钮是界面设计中一个很重要的元素，可以吸引用户的注意力并将引导用户到不同的页面或完成特定的操作，在创建流畅、高效的用户体验方面起到重要作用。按钮看起来很简单，但有效且高效的按钮设计仍然受到很多设计原则的支撑。作为设计师，我们应该如何改进设计，让按钮更易于操作呢？一起来看看～ 一、UI设计中不同类型的按钮1、CTA按钮号召性按钮(CTA)是界面中的交互元素，用来执行特定的操作，例如联系我们、订阅信息、购买产品或加入购物车等。CTA按钮作为执行重要操作的按钮，在设计上应该更醒目，能让用户快速分辨出来。 2、文字按钮文字按钮是以可点击的文字作为按钮，文字底部没有图形背景。文字按钮的操作面积小，突出程度低，多用于不太重要的操作。 3、下拉按钮在有的网站导航栏中，单击选项会出现下拉列表，展示更多二级选项，方便用户可以查看并选择更多的操作。 4、描边按钮描边按钮是背景透明效果的按钮，用于辅助操作。当界面中有多个按钮时，使用描边按钮有助于划分视觉层次结构，高优先级的按钮使用填充效果，辅助按钮使用描边按钮。 5\汉堡按钮汉堡按钮隐藏在菜单栏中，当我们点击时，菜单将展开并显示所有的选项。汉堡按钮广泛应用于web和移动应用中。 6、悬浮按钮悬浮按钮(FAB)位于界面的最高层级，优先级高，通常为圆形，在界面中执行最常见的操作。FAB按钮常用于创建新 ...继续阅读 (21)

双十一马上要到啦，肯定要准备一波促销，今天刚好做了一个猫粮的海报设计，就整理了设计思路，一起来看看吧~首先我们先整理一下所需要的文案，这里将信息进行层次划分，用大小粗细做区分。接着我们可以思考一下如何去设计，如果没思路的话，简单点的方法就是先找参考去“抄”一下，今天我就找了一张日式海报，先来分析这个海报的特点，可以看出信息是居中分布，主体上下放置，风格比较轻松。OK，这时候就要开始头脑风暴了，画面显然要有两只猫咪，到这里可以去找一些猫咪的插画风格来参考来，不用着急找现成的素材，这不，我觉得这种风格就很好。多魔性的小猫咪，画起来也很简单，接着开始构思版式，稍作加工，画出草图上一步完成就已经成功一大半了，接着经过我的不懈努力，猫咪画的栩栩如生接下来我们将剩余的信息进行排版处理，划分好大小层次，主标题可以做成手绘字体，与整体画面更匹配。下一步我们将处理好的信息全部放入到画面中，调整好大小与位置。最后我们来完善画面，加上一些线条和元素来增加氛围，同时使画面联系更密切，背景加上小鱼干增加层次感，最后搭配颜色，海报就设计好啦。最后做一个样机，增强视觉展示效果，也可以用多种色彩搭配。OK，分享就到这里了，学会用草稿的形式去设计海报，会是一种很不错的思路哦，大家赶紧去上手尝试吧。 原文地址：趣设记（公众号）作者：趣趣熊转载请注明：学UI网»双十一海报没思路，这样“抄”真不错！！ ...继续阅读 (18)

色彩是我们视觉感知的首选，它随处可见，只要是有光的地方就有色彩；本期我们就来一起看下【色彩的感知】。小可爱们，我这里会定期推送插画、UI设计、排版等相关文章教程，有事没事来逛逛啊；设计路上在学习，永不停歇，我们一起加油~ 粉色是初恋，像情窦初开的你。渐变的粉色是成长的开始，折痕的肌理是爱情到来时内心的波澜。爱心做出半透明的玻璃模糊质感，尘封已久的内心已怦然心动。紫色是浪漫，像奔赴热恋的你。当我们一起仰望星空，不小心碰到你的手时，我感受到你的心跳。当我们一起仰望星空，这一次我想走进的你的心扉，建立属于我们的桥梁，在你内心的最深处直到永远。红色是挚爱，像真诚而付出的你。醒目的红色真诚而又直接，我们的心也将靠的更近。模糊的爱心肌理是我们试探彼此距离的那点小心机。看似朦胧实则清晰的情感在这一刻印记在我们心中。蓝色是冷静，像理想到现实的你红色的爱心旋涡久久不能离去，陷入的太深，无法自拔，找不到自己的方向。直到看清现实的你，慢慢的像沙漏一样，选择和自己过去的他和解。当这些色彩融合在一起时，就出现了爱情最真实的滋味，朦胧又梦幻，真实而脆弱。只有理解色彩给予的感受，朦胧又梦幻，真实而脆弱。做出来的设计就才会有真实的情感体会。 原文地址：修先森撩设计（公众号）作者：修先森转载请注明：学UI网»色彩的感知 ...继续阅读 (28)

作品集真的要放这些文字吗？有人说那你这不是搞的跟写论文一样，谁会去看呀！还真的别说，咱们就有同学最近靠着一套版式美观+分析全面的作品集拿到了互联网前三大厂的offer。小可爱们，我这里会定期推送插画、UI设计、排版等相关文章教程，有事没事来逛逛啊；设计路上在学习，永不停歇，我们一起加油~ 其实吧，作品集你到你放什么、怎么放，归根究底只要能展示出你独特的能力，我觉得都可以，比如你版式设计好，你可以只做视觉包装，分析推导不用谢。如果你设计方法和思维比较强，那么你可以侧重这方面的内容呈现，如果你两者都很棒，那就都结合一下。所以作品集是没有定式的。现在很多公司面试UI都会面试交互能力，问你设计方案的推导、怎么量化、怎么分析、怎么做深度的设计思考等等，所以呢大部分设计师在本身视觉能力没那么强的情况下，无奈在作品包装中加入了推导分析的文字部分，结果，问题又来了，这些分析过程和推导其实是经不起推敲的，因为往往在实际工作中，大部分设计师没有真的运用过这些方法、数据，靠的是参考市面上的作品集从而包装出来，也就经不起面试官的深问。最后作品集也成为了四不像的结果。那么如果我们的设计基本功没那么强，但又想展示自己的思维能力该怎么做呢？我在这里并不是教大家怎么去编和套设计流程的框架和理论，而是希望大家能明白，如果要放你的思维过程，应该怎么正确的去放，如果真的没做过，我建议不要去硬套，很容易漏洞百出。 设计师 ...继续阅读 (25)

近些年，凡是有新的logo出现，甭管是知名设计机构出品，还是设计大师出品，基本上都是差评居多，大众比较满意的，圈内人士不满意，圈内人士满意的，大众又不满意，当然，更多是两者都不满意。小可爱们，我这里会定期推送插画、UI设计、排版等相关文章教程，有事没事来逛逛啊；设计路上在学习，永不停歇，我们一起加油~ 究其原因，应该跟logo设计的门槛比较低有关，logo设计讲究简单性原则，比较好懂，执行难度通常也不大，所以，任何人都可以从审美的角度来说上几句，而不同人的审美差异是巨大的，可想而知，一个logo要被大部分人认可有多难。但即便如此，在我印象中还是有一些好评居多、差评很少的logo。20世纪的咱就不说了，葱爷列举了10个诞生于21世纪，口碑较好的知名logo，来看看它们长什么样？有什么特点？ 一、英国石油logo这个叫做太阳花的logo，一经面世就引起了社会强烈关注，除了传说中的设计费用打破历史纪录以外，该设计方案也确实让人眼前一亮，完全颠覆了英国石油以往的logo。该花朵采用对称构图，从里到外一共分三层，颜色从白色到黄色再到绿色，呈现出绽放的姿态，寓意生机勃勃，永不凋落。这个诞生于2000年的logo，至今看来依然时尚、美丽。 二、索爱logo2001年索尼与爱立信联姻，于是诞生了索尼爱立信这个品牌，新的logo也在这个时候应运而生，该logo一反主流的扁平风，采用了立体的渐变风，在 ...继续阅读 (29)

目前的设计行业如何提高生产力、行业前沿的解决方案有什么？本文主要通过对设计产品的现状的了解和调研，找到更适合B端产品提效的方案～互联网行业经过十几年的高速发展，已经进入了成熟期。在一个成熟的行业中，除创新突破外，有效的成本控制和提高生产效能是企业成败的关键。2020年疫情助推了在线办公的发展，也让数字化经济和数字化转型成了很多企业的选择，原本对用户体验要求不高的B端产品也得到了越来越多的关注。写这篇文章的初心也是基于在探索中后台产品的研发流程中，在保证较好的用户体验的前提下，通过C2D2C的模式提高产品研发的生产力，从而达到提升生产效率的目的。一、目前有哪些提升设计与前端生产力的方案1、D2C（Design To Code）D2C（Design to code）这个模式我们非常熟悉，其本质是将设计师的设计资产转化为代码，让前端工程师可以快速的复用，在这个成熟的领域主要分成两大类：「设计资产类」和「设计对接类」a. 设计资产类设计资产类是完整系统的规范和代码进行沉淀形成设计类的资产，这一类的产品在市面上目前是属于主流，产品有网易的Fish Design（网易自研）、Ant Design、Arco Design、Element 等，这些产品都是将组件化的设计资产转化为代码资产，方便前端工程师在开发 B 端产品页面时可以快速引用，提升开发的效率。b. 设计对接类设计对接类又分成「设计稿查 ...继续阅读 (27)

提到定性研究，我相信很多同学可以说出来不少定性的研究方式：1对1深访、小组座谈会、入户访谈等，但或许是因为疫情的限制，线下的访谈越来越受到无形的大手的限制，电话访谈在实际工作中出现的频率逐渐升高。 也许很多小伙伴会有疑惑，如今互联网如此发达的时代竟然还有这么多企业还在用传统的电话访谈，但是事实的确如此，不久之前小编在各大互联网大厂的朋友也都在吐槽堂堂互联网大厂竟然还在用专业用研领域即将淘汰的电访，电访依旧被重视我们总结了以下的几点原因： 1. 省钱省时：省去了线下访谈涉及到的各种差旅、会议准备、场地等经费的支出，随打随访的特性节省了时间成本的支出。互联网大环境不好，省钱也就无可厚非了； 2. 便捷快速：互联网节奏快、做事雷雳风行，瞬息万变的互联网环境同样要求用研也需要提速，而电话访谈只需几秒钟便可以和被访者建立联系，不受地域的限制，在办公室或在家都可以顺利进行。较完美的迎合了互联网领域对效率的要求； 3. 覆盖面广：互联网企业服务一般覆盖全国，甚至出海成功的企业业务覆盖全世界，电话访谈可以触达到大部分业务覆盖的地域； 4. 访问门槛低：也许会有小伙伴问为什么不用线上语音聊天、视频会议呢？要知道不是所有人都会下载职场上常见的办公工具，越是增加被访者的访问负担，越可能导致访问的搁浅；并且很多有电访经验的同学知道，电话打过去被访者所在的环境不可控，网络往往无法保证一直通畅，所以线上访谈往 ...继续阅读 (25)

今天给大家带来一个工作中插画小场景的项目优化轻立体的插画小场景在平时设计中应用到的地方有很多，我们来分享一下在这次项目绘制的过程中走过的弯路和流下的泪。先来看一下优化的整个过程吧！可以看出来第一版和最终版的效果对比是非常大的，第一版给人感觉如同一个半成品，场景轻飘飘的，颜色上几乎没有什么明暗对比，太过统一没有分清处层次，而且细节不够丰富。通过第一版我们可以看出可以通过一下几个方面去做层次方面的优化：一、增加主体细节1.刻画熊熊主体2.优化鸭子的造型二、加强明暗对比1.加强主体和椅子的明暗对比2.加强背景和前景的明暗对比 一.增加主体细节1、刻画熊熊主体之前的熊熊作为主体本身刻画的细节层次和背景的刻画程度近似，我们要把主体变得有看点才能分清前后的关系，可以在熊的五官和服装上进一步添加一些细节。例如给熊的五官添加表情，把墨镜添加一些装饰元素，让视觉可以集中在熊的五官上。同样我们还可以在服装上添加一些花纹的装饰让整个熊熊的主体看起来更加细致。同时要注意熊的姿势是头部在前，胳膊在后，可以在刻画的时候加入一些投影，加深胳膊的暗部，区分一下头部和胳膊的层级关系。 2、优化鸭子的造型鸭子的造型我们把游泳圈直接改成了小黄鸭漂浮物，游泳圈中间的镂空让视觉看起来不够紧凑，同时我们也优化了鸭子的眼睛和嘴巴，让鸭子看起来更精致一些。然后去加强头部和鸭子身体的前后区分，加入投影，让它更加立体。 二.加强明 ...继续阅读 (24)

继上次给大家聊过如何面试之后，又有些同学问了我一些与作品集相关的问题，我从中选出一个典型问题分享给大家，也希望可以对你有帮助。小可爱们，我这里会定期推送插画、UI设计、排版等相关文章教程，有事没事来逛逛啊；设计路上在学习，永不停歇，我们一起加油~问题如下：“我感觉相比于业务需求设计，我所做过的一些专业性的设计研究更能体现出我的设计思维。但这些内容是老板给我们布置的一些专业探索课题，不是工作项目上的设计需求，能不能做为主要项目放在作品集里面呢？”我之前因工作需要做招聘，也经常会看到很多同学把日常工作中做的设计研究课题放在作品集里面做为主要项目，比如组件库和设计系统的搭建；UI动效的研究和经验沉淀；插画库的设计建设等等。我接下来会从“能不能放”和“该怎么放”两个方面来回答这个问题。 一、能不能放？我们先来思考这个问题：什么样的内容应该放到作品集中？首先，能够放到作品集中的最好是已经实践和落地的工作项目，而且具备两个特点：一是能体现你的专长，即核心竞争力；二是满足你面试职位所需的能力要求。 你可能会想：那我做的设计研究类课题也能体现我的专长能力呀。但设计研究课题与实际工作项目和业务需求不同，研究成果和经验还要再具备两个特点：一是能够反哺和赋能到业务；二是会对你正在面试的业务有帮助。 你可能发现了，核心关键词是：赋能业务。我们也曾在文章：如何理解 “设计价值”，又该怎样体现？一文中详细介绍 ...继续阅读 (26)

问卷调查作为社会调查常见的一种研究方法，广泛应用到各类调查研究中。在日常工作时，我们常向用户投放问卷，来测试其网购行为或态度。同时，在问卷设计中我们也常会犯一些错误，从而影响了用户填答的质量、问卷数据的信效度。本文就结合风笑天老师《社会调查中的问卷设计》一书中对问卷设计原则方法的介绍与实际工作中的案例，和大家一起探讨如何设计一份问卷。 首先，我们需要了解，问卷作为一种通过书面形式与被调查者沟通的工具，它由哪些部分构成。大体来看，一份问卷通常包括以下几部分，即封面信、指导语、问题与答案、编码等。 1、封面信，即一封致谢被调查者的短信，由于它常常放在问卷的封面，故称封面信。一般需要说明以下内容，我是谁-即介绍调查的主办单位或调查者个人的身份；我们要调查什么-即说明调查的主要内容；我们为什么进行这项调查-即调查的目的是什么；我们为什么找你作调查-即要解释我们是根据什么标准和采取什么方法来选择调查对象的；我们的调查有什么用-即被调查者花时间和精力来填写问卷值不值得；我们的调查不会有损于被调查者的利益。在商业问卷调查中，为了保障填答率，我们还会设置一些填答奖励，这样奖励的细则同样需要在封面信上标记清楚。 2、指导语，就是告诉被调查者如何正确的填答问卷，包括如何回答问题的说明，对问卷中某些问题涵义的进一步解释；对某些特殊的、或复杂的填答形式的举例等。在指导语的设计方面，一个基本的假设是，被调查 ...继续阅读 (21)

字体设计是从事品牌设计、平面设计、广告设计等设计行业必须掌握的核心技能之一，掌握一定的字体设计能力很有必要。而新手如何学习字体设计比较高效呢？来看看······小可爱们，我这里会定期推送插画、UI设计、排版等相关文章教程，有事没事来逛逛啊；设计路上在学习，永不停歇，我们一起加油~ 一、临摹临摹是新手学习任何技能都需要经历的阶段，学字体设计自然也不例外。即你要去收集一些优秀的字体设计作品，然后照着它们来临摹。很多人会瞧不上临摹，认为照着参考一模一样做谁都会，事实上真要做起来，很多人都临摹不好，而且临摹的方法也不对。那么，如何正确地临摹呢？ 1、不要像抠图一样，用钢笔工具直接沿着参考的外轮廓描摹。而是要照着参考画出文字中的主要笔画，诸如：横、竖、撇、捺、点、提、勾等，然后，用这些笔画照着参考的样子一笔一笔把文字搭建出来。2、如果遇到相同的笔划，不要重新画。而应该把已有的笔画直接复制过去，有时可能需要做一点简单的变化，这么做可以最大程度上保证笔画的统一性。 3、刚开始可以直接在参考的基础上用笔画来搭建文字。就好似描摹一样，与参考一一对应，等熟练之后可以自行绘制笔画，通过视觉来确定笔画的粗细、长短、结构、摆放的位置等等。举个例子，如果要临摹下图的字体设计，我们可以先把它的笔划画出来，如果抓不住笔划的特点，或者线条画不流畅，可以在原参考上把笔划描摹出来。接着，再根据参考画出文字的字框，以确定 ...继续阅读 (25)

有的品牌更换 LOGO 是默默的，要是不留意都不知道原来换 LOGO 啦！而具备话题性的品牌或者 LOGO 设计，就会引起行业的广泛关注和自发传播。小可爱们，我这里会定期推送插画、UI设计、排版等相关文章教程，有事没事来逛逛啊；设计路上在学习，永不停歇，我们一起加油~ 就在最近估计大家就被抖音集团的新 LOGO 刷屏了，众多的自媒体都在传播，果然抖音的吸引力还是极强的，这一波传播也是众说纷纭。所以说，设计的话题性也是至关重要的，要嘛是品牌自身的影响，要嘛是设计团队在行业中的影响力。一个常规的设计也许很完美，但是不一定被大家所讨论，这样也就是默默的出现再默默的淡化和被接受。具备话题性的设计，无论是针对设计好或者不好的讨论，至少在营销的角度来说，传播性已经足够了。我们言归正传，今天黑马哥也随波逐流一下，也来和大家分享一下关于抖音集团的 LOGO 设计。“字节跳动”变成了“抖音集团”，LOGO 从原来的四条跳动的竖线变成了字母“d”和“y”进行艺术结合的图形。这也是为了和抖音产品 LOGO 形成视觉关联，整个造型非常柔和，就像飘动的丝带一样青春活泼。通过和抖音的 LOGO 进行对比，抖音集团的 LOGO 会显得更“正”和具备商务型的特征。而抖音产品的 LOGO 会更娱乐性一些，两者既有关联性也有差异化。借助抖音的影响力可以让公司的知名度更高，不过个人觉得字节跳动这个名字还是挺好的。在 L ...继续阅读 (17)

今天为大家分享的是「动画设计」。在设计过程中，动画的加入能为产品增加闪光点，让原本沉闷的界面更有活力，给用户带来更深的印象。小可爱们，我这里会定期推送插画、UI设计、排版等相关文章教程，有事没事来逛逛啊；设计路上在学习，永不停歇，我们一起加油~ 在设计过程中，动画的加入能为产品增加闪光点，让原本沉闷的界面更有活力，给用户带来更深的印象。通过汇总动画设计值得注意的十个方法，帮助大家进一步了解UI/UX设计中的动画应该怎么做～ 一、从原型设计开始无论是设计初学者还是经验丰富的设计师，在创建动画前都需要进行原型设计。在原型阶段，对产品和界面进行打磨推敲，能够避免在后期动画设计过程中花费时间返工修改。 二、符合物理定律这条原则是指动画设计要体现现实中物体运动的规律，符合重力、惯性、摩擦等物理定律。确保每个元素都沿着预设的轨迹移动，同时考虑到形状、大小和其他物理特性。通过遵循物理定律，动画能展现更多细节，为用户带来熟悉的感觉和更好的体验，避免动画过于生硬和单调。 三、挤压/拉伸元素在常见到的卡片式界面设计中，对用户的操作做出卡片收缩、放大、改变重心等反馈效果，让动画尽可能逼真。 四、确保平稳移动在现实生活中，物体不能一直匀速不变的运动，而是以抛物线的形式运动。把这个特性加入到动画设计中，用户与界面的交互会更加自然，缓入缓出的动画效果会更好。 五、注意屏幕间的过渡在APP中避免突然从一个屏幕切 ...继续阅读 (23)

这些天遇到了些问题，在进行视觉设计的时候，老是觉得自己设计上差点意思，总觉得哪里不太满意。也不是不好看，就是觉得还能够设计得更加深入些，不管是从板式、字体、图形、颜色等方面。为了找到解决的办法，我不断的去欣赏别人的作品，从站酷到behance，从behance到各类获奖作品。 嗯…为什么别人能够有这么新颖的设计想法？我总结来几点分享给大家。 一、借用大师的元素这是世界三大平面设计之一冈特·兰堡的作品。这是不是会给你一些灵感？我第一眼感觉这有点熟悉，似乎在别人的作品中运用过这种版式、元素。在这设计中，与冈特·兰堡的作品相似之处就有：黄底黑字的横条和蓝色调的背景，再结合一些设计图形，就能产生出一种新颖的设计风格。就是在大师的视觉中提取元素灵感进行转化，运用在我们的设计中会有不一样的视觉体验。我们接着看他的其他作品。这张作品就能给我很不错的灵感，把想要突出的地方用强烈的对比手法进行设计。或者将想要突出的元素进行特殊化处理。类似于这样的作品。当灵感有限的时候，我们就可以静下心来分析一下其他大师的作品，认真观察大师的作品，有哪些地方是可以提取灵感出来。再结合自己的设计让其提高升华，让自己的作品耳目一新，使作品获得新生。保持这种发掘思维去分析作品，久而久之你就会有源源不断的灵感浮现脑海里。 二、尝试做出差异化你走你的阳关道，我过我的独木桥，反其道而行，虽然在国内市场不太友好，但是 ...继续阅读 (23)

从19年开始，我就一直负责公司内部的微信矩阵，最开始是做微信小程序，后面开始接触企业微信，再加上我自己还开通了个人微信公众号。这3年以来，基本上我每天都在跟微信内这些产品打交道。关于小程序、公众号和视频号，我之前写过很多文章，但是从来没有提及企业微信，因为在我看来企业微信是腾讯最「复杂」与「曲折」的产品。「复杂」体现在从企业微信身上，我们可以看到腾讯过往多款产品的影子——从PC互联网时代的RTX和企业QQ到移动互联网时代的企业号；「曲折」体现在我们今天看到的企业微信跟最开始的版本已经是完全不一样的两款产品；我一直认为，我们要了解一款产品，最重要的是要弄清楚这款产品的市场定位，光记产品有哪些功能根本没用。定位是一切产品功能的本源，定位反映了产品经理对市场的认知——市场缺什么，这款产品应该做什么。当我们了解这款产品的定位，自然而然就能理解甚至自己推导出这款产品应该有哪些具体的功能。从2001年的初代RTX开始，腾讯「泛企业微信」总共有以下7款产品，每款产品都有一个清晰的市场定位。接下来我就从这7款产品来梳理一下腾讯连接人与企业的20年。 1 2001：RTX——企业内部的IM工具；2 2007：企业QQ——在线客服+营销平台；3 2012：公众号——企业内容发布平台；4 2013：服务号——企业轻量化服务承载平台；5 2014：企业号——依附于微信的移动办公协作平台；6 2016：企业 ...继续阅读 (26)

近期，产品进入了新的迭代周期，设计团队也进行了扩充，人多力量大，可以有精力主动做一些设计升级。另外现有产品界面风格存在不少问题，领导表达出了一些意见和想法。于是设计团队希望从设计侧发起一轮优化升级，推动整个前端组件的统一，沉淀出一套完整可用的组件规范，最终实现设计和前端开发效率提升。经过一段的时间准备，设计师共提交了3套视觉风格方案。但是评审并没有达到预期效果，没有确定下后续设计方向。根据多年来的评审会经验，今天谈谈我对评审会的理解和思考。 一、评审会的目标中后台B端产品「设计改版」通常是在保持现有业务逻辑不变的情况下，针对界面交互及视觉风格存在的问题，提出的升级优化方案。设计评审的目标也比较明确，可以分为「直接目标」和「间接目标」。 1、直接目标获得评审人员的建议，明确后续的修改方向；争取获得向更高层汇报的机会，得到认可后推进落地； 2、间接目标通过专业的设计输出，增强设计的正向影响；良好的评审互动，展现个人能力，为自己后续工作加分；达成这些目标并不容易。设计评审跟做产品是一个道理，需要能够向用户（评审人员）提供有价值（针对用户需求）的产品（设计方案），这样用户才会买单（过审）。所以除了做好设计方案，设计师还要思考评审人员的角色、关切点，并且充分论证设计方案的合理性后，才能让评审人员接受设计方案。 二、评审会的影响因素 1、评审人员的专业性之前文章中也提到过，设计评审有设计团 ...继续阅读 (22)

底部标签栏(也称导航栏)是移动端设计中必备的导航类型之一。虽然底部导航栏看起来相对简单，但要做到精准设计，仍然有很多问题值得注意。小可爱们，我这里会定期推送插画、UI设计、排版等相关文章教程，有事没事来逛逛啊；设计路上在学习，永不停歇，我们一起加油~ 一、标签栏样式分析底部标签栏可以是纯图标样式，或者图标与文本标签搭配的样式。选中的标签需要有不同的视觉风格，可以使用按钮、文字、圆点等样式来表示选中效果，帮助用户一目了然地定位当前导航。在Apple iOS底部标签栏中，标签栏的宽为390px，高为49px。常规标签栏的图标大小为25x25px，紧凑型的标签栏图标为18x18px。在iOS的底部标签栏中，文字使用的字体为10px，中等粗细。 二、标签栏设计6个注意事项1、导航数量不超过5个底部标签栏最适合放置3-5个导航选项。移动端屏幕相对较小，使用五个以上的选项会让导航挤在一起，并影响可用性。另外导航选项太多，手指的触摸面积(红色圆圈)会比触摸目标(导航选项)的面积大很多，用户有可能会意外触发错误的选项。 设计解析：①如果选项很少，只有两或三个时，可以考虑使用分段控件的设计样式，将分段控件放在页面上方作为导航。②如果选项很多，超过五个时，我们需要评估这些导航的优先级，筛选出最重要的导航。如果必须要保留五个以上的导航选项，可以考虑使用类似汉堡菜单这样的控件。 2、不要使用不熟悉的图标 ...继续阅读 (18)

设计这一行有点像相声，郭德纲曾经说过，相声的门槛很低，会说话，你就有可能会说相声。设计也是这样，会使用一些绘图软件，你就可以成为设计师。入门很简单，想要更进一步并不是一件很容易的事情。小可爱们，我这里会定期推送插画、UI设计、排版等相关文章教程，有事没事来逛逛啊；设计路上在学习，永不停歇，我们一起加油~ 很多人都说设计这个物种是只看图片，不看文字的，这一点我并不认同。因为设计师对于文字的解构能力，真的在作品中一对比就可以高下立判。比如你们看研习设推文和作品中，所有关于文字的排版，是不是都是对文字内容进行了重新编排，这是设计师必须具备的一种能力。看不懂文案这种类型的设计师，遇到文字的排版，全部照单复制，甚至连信息内容、标点符号、字体备注都不看。☝ 提供的文案信息☝ 设计完成稿曾经我就遇到过这样的设计师，软件操作特别溜，别人出1张海报的时间他能做3张，但是每次出品的海报，不是少复制了文字，就是主副标题区分不清等等各种问题。最离谱的，还有把文案备注的文字也给放到画面上。文案备注标题（要用红色），竟然也全盘复制。这样的成果交付，会让一名设计师显得特别不专业，即便你的软件技术很强，也会让你的工作伙伴不想再与你合作。 这也是看不懂文案的一种体现，文案小清新，设计非要配个重口味的画面；文案是小桥流水人家，你非要来个大漠孤烟，长河落日；你明明是个乖巧俊俏小娇娘，他就给你来个膀大腰圆黑李逵。☝ ...继续阅读 (27)

做作业时间到了，今天我们的作业是一个小插画的练习，希望各位童鞋能搞定哦！注意：注意颜色的搭配；注意透视效果；注意渐变的过渡。要求：提交的作业在背景的右下角或评论框署名，格式为：(N群-XX）原图作者： herdetya各位童鞋请选择适合自己现阶段的练习：新手作业进阶练习中高级作业转载请注明：学UI网»小插画练习【做作业】 ...继续阅读 (17)

小编：对于新进入UI行业的新人以及初级UI设计师来说临摹是成长最快速的一种方法，可是你真的会临摹么？你又从中学到了多少？今天就来告诉大家关于临摹都有哪些阶段以及应该如何做。感谢作者@菜心设计铺的分享。 不知道你有没有这样的情况，临摹了很多设计作品，但是等到自己原创的时候，就做不出来了！为什么？因为临摹的阶段有很多种，而且每个阶段都有不同的侧重点，也许你并没有注意对一些细节的思考。为了解决这个问题，今天菜心就来简单介绍四个临摹的阶段，大纲如下：1.跟着教程临摹2.对照原稿临摹3.加入想法临摹4.转化现实临摹1.跟着教程临摹如今网上有很多设计类的教程，手把手教你把一个图标（或海报等）做出来，这种临摹方法会告诉你一些具体的数值，你只要跟着一步一步做就可以。但这样就够了吗？当然不行，如果不思考，跟着临摹再多也不会有太大的进步。需要思考什么呢？对软件技法的思考，例如斜面浮雕用来增加厚度：对质感表现的思考：暗部、亮部、环境色、反光。如下图：这些都是最开始临摹需要思考的问题，而不是仅仅跟着别人的步骤执行出来，如果不经总结思考，临摹再多也毫无意义。 2.对照原稿临摹拿到一个原稿，在没有其它教程的帮助下还原出来，这就是对照原稿临摹，如下图：如果前期在跟着教程临摹的过程中，有大量的思考过一些表现技法，其实这种照着原稿做的难度并不大，但如果你现在做不出来，就证明你思考的还不够，没有真正理解技法的原理，不 ...继续阅读 (22)

免费可商用字体，一直是设计师心中永远的痛（尤其是中文字体），今天，我们带大家来看一波免费可商用字体。首先是中文中文字体的版权，有三个字可以形容：有点乱！对于不同的字体厂商来说，不同用途，不同收费，不同条款，蛋疼得很。为什么我们需要免费的商用字体？我想答案只有三个字，穷穷穷！因为，免费商用的字体既然是免费，那么在一定程度上，质量普遍都不是那么的高，很多的免费商用字体都不适合大面积的排版，毕竟可口可乐跟可日可乐还是有点差别的。但是，也有挺不错的字体。那么，问题来了，如果没有能力购买这些字体的商用版权，但是又想用一些正版字体，咋办，下面，我们就为大家盘点一下。01.思源黑体下载地址  https://github.com/adobe-fonts/source-han-sans/(或后台直接回复关键词“思源黑体”）思源黑体（英语：Source Han Sans）是Adobe与Google所领导开发的开源字体家族，1.001及更早版本以Apache 2.0许可证授权，而1.002及更新版本则使用SIL开源字体授权，属于无衬线黑体。思源黑体于2014年7月16日首次发布，支持繁体中文、简体中文、日文及韩文，并且有七种字体粗细（ExtraLight、Light、Normal、Regular、Medium、Bold 和 Heavy）。公开之时为当时涵盖字符数量最多的字体，44,666个字符分属于6 ...继续阅读 (24)

周一了让我们以一个愉快的话题开启新的一周吧！话题就是：设计师的你会给自己买花么？1.花花能开启好心情～为自己的生活增添情调。2.一般选择网上订购花呢？还是去花店买花花？3.有没有特别喜欢，要推荐给别人的花花种类？4.或者还有的朋友觉得买花浪费钱，还不如自己家种花好？期待你的踊跃发言，或者给我们晒晒你美丽的花束~转载请注明：学UI网»设计师的你会给自己买花么？【话题】 ...继续阅读 (22)

​约在10年之前，在用户界面使用的动效，大部分是一些广告和闪烁的弹窗。然而到了今天，已经发生了翻天覆地的变化。交互设计和动态效果的详情，带来的是网站或APP的根本改变。这种思维方法，在下面有详细的描述。不可能永远只是设计静态的网站。也就是说设计用户从这些画面实际查阅内容的方法。为了设计出更好的数字产品，从一开始网页或APP就要有良好的交互性质是非常有必要的。这一次，就将如何有效的运用UI动效的方法详细介绍给大家。使用动效的理由动态（英: Motion）在从他的性质上来说，就是用户界面上最突出的元素。相较于文字文本和静止的图像，动态的更容易被发觉。我们的视线会不由自主的追寻着动态的物体，这也可以说是一种条件反射。试着将这个利用在功能性的动效上吧。功能性的动效是？功能性动效，指的是在UI设计中作为功能的一部分被采用的小动效，有着非常明确和合理的目的。为了减轻认知的负担。防止发生变化时看漏（英: Change Blindness）。在空间关系中确立良好的收束。以用户为中心的设计方法，直观的用户界面，响应性，人性化等等都是必须的。功能性动效，将有助于你实现这些目标。那么，就让我们详细的来看一看功能性动效吧。用功能性动效完善UX对APP或网站的体验或印象，是通过由各个接口的基础工作组合而得来的通过在好的地方使用动效，会更易于使用，让功能性更加完善。通过仔细研究测试，功能性动效，都包含以下的功 ...继续阅读 (22)

01项目背景米大师web是什么？米大师web是计费平台部为公司以及合作方提供的，web端泛娱乐业务支付解决方案。后台以SDK包提供给业务，前端以支付弹窗形式适配所有业务场景。 为什么要改版？原版米大师web的后台和前端还停留在09年，随着接入业务增加，用户的体验问题也随之出现。（看看旧版的界面，以QQ会员开通为例） 02设计目标改版需要针对已知问题进行解决，设计主要从三个方面进行解决 1.零散信息归类整合，减少表单阅读负担原来版面信息以表单呈现，信息分散，影响阅读。改版把信息重新归纳整合，提高阅读效率。 2.按照用户路径进行信息分区，优化视觉动线原来版面商品信息和支付信息混杂一起，影响用户处理效率。改版后按照用户的路径“选商品→支付商品”，重新进行信息分区，优化用户视觉动线，提高处理效率。 归纳法＆穷举法改版的最大目标是支付效率的提高。但是由于是场景内支付，有弹窗尺寸、业务情况不同的限制。因此方案需要综合考虑所有因素，得出限制下的最优方案。1.归纳法——分析支付方式步骤与页面的关系穷举所有支付方式步骤，得出步骤与页面的关系的表格 2.穷举法——结合限制，制定最优支付方案根据步骤与页面的关系表格，结合业务特点、弹窗尺寸限制，穷举所有情况作为支持多种业务模式的支付方案，统一各业务场景下的体验尤为重要，使其适用于多种业务，各种屏幕，同时减少开发的成本。03简洁舒适的视觉设计更好的处理信息 ...继续阅读 (21)

小编：学会字体设计，对于设计师是有很大益处的。好的字体设计可以丰富你的作品。这篇文章提到了格式塔心理学为字体设计提供了理论支持，我们可以利用局部替换笔画，相邻字体公用笔画，文字笔画断掉或连接等来尝试进行字体设计，大家快去尝试下吧。 在说字体设计之前我不得不提一下“格式塔心理学”，这是我们省略与变化字体笔画的理论基础。格式塔系德文“Gestalt”的音译，主要指完形，即具有不同部分分离特性的有机整体。将这种整体特性运用到心理学研究中，产生了格式塔心理学，其创始人是韦特海墨、考夫卡和苛勒。20世纪30年代后，他们把格式塔方法具体应用到美学中，与心理的各个过程结合，促进了具有格式塔倾向的美学研究。（来自百度百科）我们的眼睛和大脑在观察事物、接收影像刺激的时候，会有一些特别的倾向。这些倾向常常可以帮助我们快速的辨别事物，有时候也会产生所谓的“错觉”。格式塔心理学重要的概念便是“整体不等于个体的总合”，举例来说：当我们在观察另一个人的时候，并不是先看到他的手、脚、头、眼睛、耳朵、鼻子，然后把这些视觉特征组合成一个称为“人”的组合。我们是直接的观察到人这个“整体”，而不是其他器官的“个体的总合”。格式塔心理学主要有相似性原理、连续性原理、封闭性原理、对称性原理等，举例来说，比如我们看到下面两组图形：我们可以观察发现，虽然上图中的几组图形线条没有完全闭合，但是我们依然能看出它们是方形、圆、三角形 ...继续阅读 (25)

小编：使用过多的设计元素或复杂的调色板往往会导致一个网站过度设计，而忽视了最重要的内容。大多数时候，你会发现它更好的做法是采取简约的做法。今天，推荐一组现代简约的网站设计，配色柔和清新，图中带RGB色值。来激发你的灵感吧～ 转载请注明：学UI网»一组现代简约的网站设计欣赏 ...继续阅读 (55)

小编：今天带大家一起欣赏30个音乐均衡器UI界面设计。炫酷、简洁…风格各不相同，每一个界面都很精致，大家可以学习一下这些好的表现形式，无论从配色还是排版都是让人感觉很舒服的。如果大家有什么要补充的可以告诉我们呦！ 文章来源：设计之家作者：佚名 转载请注明：学UI网»30个音乐均衡器UI界面设计 ...继续阅读 (16)

小编：这是一篇H5的项目总结。  @ISUX  还记得几天前的520你在干什么吗？是在朋友圈争先恐后晒恩爱、晒求婚、晒结婚证结婚照，还是一边吃着狗粮一边被晒得双目失明呢？我们QQ钱包团队联合厘米秀在这一天特意奉上《520的正确操作方式：白和宝贝橘的520》H5，帮助各位用最正确的姿势过一个幸福的520。首先奉上H5线上地址，看看白和宝贝橘两只猫是怎么过这一天的：接下来，我给大家分享一下在这支H5在创作过程中的一些心得体会。一、创作背景过情人节要做什么？除了吃饭逛街看戏送礼物，当然就是发个充满感情的红包给Ta啦。借着520这个节日，来一个情感化运营H5，既能给用户增添情趣，又能提醒对方发QQ红包表达对自己的爱意，何乐而不为呢？于是，就有了我们这次创作计划。（其实，这还伴随着一班单身狗深深的恶意，哈哈！）二、创意和策划前期和产品经理脑爆大量创意，出了若干版本故事线和展现方式，最后发现日常的才是比较感人的，于是我们以情侣间发生的日常普通小事构造了三个情景：1.玩王者荣耀拿下四杀时也要接听另一半的电话。2.有好吃的东西要主动让给另一半吃。3.最好的情人节礼物就是给对方发个充满感情的QQ红包。从这些情景中提醒情侣们正确的520操作方式就是要懂得要替另一半着想、给对方惊喜。最后可在落地页给心爱的Ta发红包、领取厘米秀装饰和动作表情秀恩爱。故事从猫的角度去叙述，显得更生动形象有趣，而在每个关键时 ...继续阅读 (24)