小编：选择使用一款字体的时候，除了考虑它的易读性，更多考虑的是这款字体能否准确地传达出对产品独有的气质 ！那么应该怎么选择合适的字体呢？或许这篇文章能够为你提供一些思路。时下一种流行的设计方式是在页面顶部使用配有简洁文字的大幅图片或者视频，以此吸引用户进入网站。这种设计方式最头疼的就是如何为这些文字选择合适的字体。从样式繁多的字体库中找到一个合适的字体，往往会让设计师感到举步维艰。但是我们可以使用一些小技巧，就能找到我们需要的字体。让我们通过下面几个精彩的案列来分享这5条建议。 什么是特排字体(Display Type)在开始之前，我们来了解下什么是特排字体?（如果已知晓请直接跳到建议1）特排字体通常指是字号偏大，特别引人注目的文字，通常用于标题或需要放大显示的文字。 特排字体并不只是在网页设计中使用，它源自于印刷设计师的一个术语。(译者:更多说明参见Display_type In Wiki)特排字体主要应用于以下两个方面：用于首页展示的网站名称，例如Walk West （上图）用于每个页面的大标题，或者横幅页头的标题。虽然作为标题使用的字体不如首页名称的字体那样巨大醒目，但却更广泛的被使用在网站中各个页面上。 1、具备可读性MADEBYAUGUST.COM 为了确保信息传递的有效性，特排字体需要有良好的可读性。这听起来像是一句废话，但实际上你会发现很多大标题阅读困难的网站，这是因 ...继续阅读 (9)

设计传统的2D界面尚且需要你掌握大量专业知识并付出辛勤的汗水，要打造全新的体验独特的3D世界又将意味着什么？Mike Alger和Andy Stone正是致力于研究这一问题的两位走在前沿的VR设计师。Mike Alger目前就职于Google，过去几年里一直在VR领域进行探索，他所制作的几部VR设计理念讲解视频堪称业界经典。Andy Stone是Emerson Stone设计公司的合作伙伴，同时也是Medium上的VR话题作者之一。 实体与空间的迷宫关于VR，首先需要定义清楚的就是“虚拟现实”这个概念本身。这个名字不错，也存在了有一段时间了，但如今我们知道这个概念有着更广泛和深刻的所指，沉浸式体验的意义更在于对我们所生活的这个现实世界进行扩展。VR不仅代表着一种全新的人机交互范式，它更需要我们对物理及空间相关的知识有着深层的理解，包括音效设计、建筑设计、光影与物理效应等等方面。对于社交类产品来说，这些要素很可能重塑个人空间、个人形象的展现形式，以及人与人之间的互动模式。在为VR进行设计之前，我们需要充分考虑清楚自己的设计倾向及其有可能对用户造成的影响。这是一项长期工作，随着我们对全新社交范式的理解的不断深入，相关指导原则的制定及道德层面的讨论也会持续进行。 如何看待VR设计目前所处的阶段？Andy Stone我个人看来，在这么短的时间里，Google就能将其设计语言充分融入到VR/ ...继续阅读 (9)

小编：今天给大家带来了一篇关于配色的文章，不会配色或无从下手的小伙伴们可以来仔细阅读研究一下，此篇从多方向详尽的为大家介绍了关于色彩的相关知识并配有案例展示。非常感谢作者@鱼子有梦的分享。希望可以帮大家解决一些配色上的烦恼！配色一直都是我的弱点，而且会在这方面纠结很久，相信有些朋友也会遇到此类问题；所以花了点时间整理了关于配色的知识和方案，其中参阅了网站上很多设计师的文章，汲取精华，集中归类，更全面的总结；文章尾处均有参阅设计网站及设计师的备注。还有配色素材可下载。本文仅是个人总结的和见解，不作标准规范；希望此文的总结能够帮助一些热爱设计又为配色而苦恼的朋友，共同学习，共同进步。原文地址：站酷作者：鱼子有梦 转载请注明：学UI网»UI配色整理 ...继续阅读 (11)

小编：最近流行一种色彩你一定知道：高亮高饱和，满屏的姹紫嫣红相碰撞出这类的海报，创意十足又略显与众不同，不低调不平庸。相信我，你一定会为它尖叫。一起去欣赏同样的色彩却来自不同设计师的风格吧～希望能让你寻到新的灵感。Buagasm posters byVasjen Katro Skull — byNick Kumbari Made You Look y∆ Studio–JQ ∆ design is… lit byAndre GuerraforDesign Sprinkles WANQIU byYizhou Li byJasonXieJ byTrent Kokic byEdwin Carl Capalla Snapshot Poter Design byChris Do SO / Poster Series — PCK2 byTokito .andZura Chavchanidze byYannick Buchs byEden Vidal 原文地址：medium转载请注明：学UI网»姹紫嫣红的创意海报欣赏！ ...继续阅读 (19)

小编：做为设计师在求职时常因项目经验缺乏而被击退，若你能清晰的描述自己重设计项目的思路，成功机率增加了不只一半。今天@众安ZED 将他们的案例进行精心的总结，为你全面展现了一个重设计作品的思路。9月至11月，众安AppV2.2及小版本迭代陆续上线，首页、发现、我的和很多主要页面全新改版，为用户提供了全新的体验。新版本在流程、功能、界面上都进行了极大优化。需求背景​众安作为第一家互联网保险公司，产品分布于各个互联网平台，如微信、网站、合作平台等，而App作为众安独立的平台之一，想象和发挥的空间更大，因此也承载了更高的目标。这次改版的原因主要有以下几点：1. 公司战略调整战略调整为改版提供了大量的人力物力支持，也意味着更高的要求。2. 设计体验不统一由于产品模块多，接手的人多，且没有规范进行统一，整个app的体验相差很大。在设计上，我们需要从交互和视觉层面做到统一化、规范化。3. 视觉风格过时2.1版本的视觉形象混乱，设计语言陈旧。这次改版希望重新定义视觉风格，打造全新的视觉设计系统。4. 不满足现有产品和业务要求APP以往的改版更加注重业务需求，对整体架构和体验考虑较少。随着更多功能和业务的拓展，我们需要重新梳理产品结构和信息层级，以满足未来的发展。除了以上的问题，设计同事与产品一起收集了一系列体验细节方面的需求。经过整理归纳，我们确立了这次改版的设计目标：产品结构清晰化、重塑产品视 ...继续阅读 (4)

小编：hello!好久不见，@菜菜给大家带来的是一篇如何利用简单的几何图形去绘制我们的办公桌，教程写的比较详细，很容易上手，赶快动起来吧，大家不要忘记交作业！原图：提示：文章中所有的描边都是内描边。1：桌子第一步：新建一个658*494的画布，使用圆角矩形工具画一个532*18px，圆角为10px的圆角矩形，填充两个像素的描边，填充描边颜色为：#211e1f，填充背景色为：#f5f3e6；如下图所示： 第二步:使用钢笔工具勾出桌子的木纹如下图所示： 2：台灯第一步：使用圆角矩形工具画一个34*16px、圆角为4px、描边为2px的圆角矩形，填充描边颜色为：#211e1f，背景色为：#f5f3e6，使用直线段工具画一条16px的直线，摆放到如图所示的位置： 第二步：使用矩形工具画一个6*120px，描边为2px的矩形，填充描边颜色为：#211e1f，背景色为：#f5f3e6，右击画布空白处，在弹出的快捷菜单中选择“变换”–“旋转”，在打开的菜单中输入如下参数: 第三步：使用椭圆工具的同时按下shift键画一个14*14px，描边为2px的正圆，填充描边颜色为：#211e1f，背景色为：#f5f3e6，然后再画一个6*6px、描边为2px的正圆，填充描边颜色为：#211e1f，背景色为：#f5f3e6，如下图所示： 第四步：复制第二步中的矩形，旋转到一定的角度，复制第三步中 ...继续阅读 (12)

啦啦啦，又到了做作业的时间了。今天我们的作业相对来说不难，希望大家可以通过例子，发挥自己的创意，做出一些新的样式，加油哦，看好你们哦。注意：注意花纹的比例；注意立体感的表现；注意整体颜色的搭配；要求：提交的作业在背景的右下角或评论框署名，格式为：(N群-XX）原作者:Jenn Sager各位童鞋请选择适合自己现阶段的练习：新手作业进阶练习中高级作业转载请注明：学UI网»67数字处理【做作业】 ...继续阅读 (1)

@飞屋睿这篇文章会带给你什么设计一张海报，按照普世流行的极简路子，那应该是不断做减法的美学。但也有反其道而行之的装饰风格，它显然在尽力铺张某种创作热情，看似复杂混沌，实则有自身的秩序之美。1、熟悉装饰风格（DECO ART）中的几何主义装饰风格（DECO ART）结合了因工业文化所兴起的机械美学，以较机械式的、几何的、纯綷装饰的线条来表现，如扇形辐射状的太阳光、齿轮或流线型线条、对称简洁的几何构图等等。它是纯粹的意象汇集。而最好的理解将在实践的过程中获得。2、学会单线绘制的技巧绘制单线装饰风格的海报，了解所谓单线是指所有线条的大小等同，产生整体效果的一致性。3、熟悉AI中所有关于对线条的处理工具技巧（路经查找器、形状生成器、钢笔工具、旋转工具、缩放工具等）。绘制基础几何形提前最好能大致画个草图，把大概的几何形表现出来。然后再进入软件处理。有了基本构图，开始动手时才能做到“胸中有丘壑”。STEP 01打开AI，新建一个1296px*1728px的文档。并用矩形工具绘制出海报边框，所绘制出的矩形关闭填充，保持描边大小为3px。这个矩形就是海边的边框大形。矩形大小为1040px1498px。为了定位以及构形的方便，最好加入辅助线。而你所创建的几何形的尺寸也不要产生小数点，这样能保证最佳像素表现（例如：矩形宽度1124px是可以的，但是1124.5px的话也许就会带来麻烦）。STEP 02 ...继续阅读 (1)

小编：@飞屋睿设计一张海报，按照普世流行的极简路子，那应该是不断做减法的美学。但也有反其道而行之的装饰风格，它显然在尽力铺张某种创作热情，看似复杂混沌，实则有自身的秩序之美。这篇文章会带给你什么1、熟悉装饰风格（DECO ART）中的几何主义装饰风格（DECO ART）结合了因工业文化所兴起的机械美学，以较机械式的、几何的、纯綷装饰的线条来表现，如扇形辐射状的太阳光、齿轮或流线型线条、对称简洁的几何构图等等。它是纯粹的意象汇集。而最好的理解将在实践的过程中获得。2、学会单线绘制的技巧绘制单线装饰风格的海报，了解所谓单线是指所有线条的大小等同，产生整体效果的一致性。3、熟悉AI中所有关于对线条的处理工具技巧（路经查找器、形状生成器、钢笔工具、旋转工具、缩放工具等）。绘制基础几何形提前最好能大致画个草图，把大概的几何形表现出来。然后再进入软件处理。有了基本构图，开始动手时才能做到“胸中有丘壑”。STEP 01打开AI，新建一个1296px*1728px的文档。并用矩形工具绘制出海报边框，所绘制出的矩形关闭填充，保持描边大小为3px。这个矩形就是海边的边框大形。矩形大小为1040px1498px。为了定位以及构形的方便，最好加入辅助线。而你所创建的几何形的尺寸也不要产生小数点，这样能保证最佳像素表现（例如：矩形宽度1124px是可以的，但是1124.5px的话也许就会带来麻烦）。STEP ...继续阅读 (1)

小编：UI设计师是需要不断去成长的，增强设计技能；拓展视觉欣赏能力等等…设计技能可以通过不断的练习来增强，视觉欣赏能力则需要多看而且是看好的，优秀的作品才能逐渐积累起来。今天为大家带Dribbble上2月份的热门UI设计作品，都是精品，希望能带给大家新的灵感。设计变化多端，我想很多设计师的创意大多来源于一些优秀作品或一件事物才能激发创作灵感，所以「多看」是必不可少的，有空就看一看吧，今天为大家分享 Dribbble 2月份热门的 UI 设计作品（ APP UI与 Web UI）。下面一起来看看这些优秀网页设计和 UI设计作品 ，没多少个，只取精品，希望能给你带来新的灵感来源，Enjoy!着陆页设计 byuixNinja Admin管理面板界面 byBagus Fikri Google intern 聊天消息交互设计 byJohn Schlemmer 移动 APP 设置与详细页 UI by:Nimasha Perera 个人作品集页面设计 byMichał Roszyk 简约手机版 Blog 设计 byMatteo Pasuto 创意工作室网页设计byMike 个人资料页面 byBen Schade T ——R byKate Laguta 着陆页面设计2 byAlan Podemski 用户分析界面 byAwesomed 10 UX And Visual Design T ...继续阅读

小编：@狼哥 随着APP启动页越来越受到重视，各种风格的小插画也开始流行起来，但是很多小伙伴又苦于没有思路没有灵感，这个问题很是头疼啊。所以狼哥想了想，决定这一期的公开课中分享搜集插画灵感的方法。还记得前几期的“微原创”么？这次我们在学习别人风格、技法的基础上完全画自己的画。比如，拍照取景，然后将照片上的内容画下来，再经过艺术加工，一个精美小插画就诞生啦！往下拉，有彩蛋哦！灯灯灯等~~~彩蛋就是狼哥以前的一些小插画，狼哥就是这么画滴装逼桌面 http://www.zcool.com.cn/work/ZMTgwMjczMjQ=.html澳洲印象 http://www.zcool.com.cn/work/ZMTQwNzA0MTY=.html转载请注明：学UI网»狼哥分享小插画《学UI网第九十期YY设计课》 ...继续阅读 (2)

小编：今天给大家带来一篇插画小教程，教大家画发光的可爱的“球球”。效果看起来很漂亮的，制作过程却很简单。非常感谢作者@guomke的分享，步骤写的非常详细，大家快来一起操练起来，别忘了最后把做好的图晒出来给大家欣赏一下！这种亮亮的“球球们”是不是很漂亮~O(∩_∩)O看起来很简单，其实做起来也很简单~总之就是，好看又简单~好吧，我们开始吧~STEP 01打开AI，创建一个*800*600*的文档。新建一个*800*600*的矩形作为背景，背景色填充#171742 。F7呼出图层面板，创建2个图层，“背景”图层，和”图形”图层。 STEP 02锁定背景，然后在“图形”图层中，我们先绘制一个圆，这个圆就是“球球的脸”建立189*189的圆形 STEP 03建立189*95的长方形长方形的边与圆形边对齐shift ctrl F9 调出路径查找器，将圆形与长方形联集。 STEP 04接下来画圆角矩形圆角矩形的宽度：27px 半径：80px高度没有限制。画完7个圆角矩形后，摆放在刚才的画的图形上。（建议多画3个矩形，后面需要用）（为了更好的视觉区分，我把7个圆角矩形分了3个颜色）将蓝色的矩形与白色部分联集将黄色的矩形 shift ctrl ] 图层调至白色矩形前面后，减去顶层上面几步后，图形是下面这样：接下来将红色矩形调至前面，将红色矩形向下移动，进行分割 ...继续阅读 (10)

​小编：@喪心病狂十六夜貓在第二次世界大战后的艺术运动所发源的极简风格，再次成为现代网页设计的流行趋势。它有着良好的适用性、帮助用户简化操作、良好的屏幕兼容性能快速载入页面等等优点，对网页来说有着各种各样的好处。虽然简约风格看起来似乎太简单了，但正如“少即是多（英文：Less is More）”这句座右铭说的一样，我们需要考虑的东西可一点都不少。这一次，就让我们一边学习简约风格的原则，一边将它应用到实际网站制作中去吧。详细从以下开始。什么是简约风格的网站？扁平设计、英雄形象和汉堡包菜单等等许多这些现在流行的设计趋势，都是于2000年开始逐渐受到极简风格的影响才诞生的。【这里的英雄形象指的是：在网站首页上使用的大尺寸图片。在日本，作为视觉的关键，也被称为主视觉。在Bootstrap中也有命名为「Hero unit」的组件而被大家广泛使用着。】​现在为我们提供了许多服务的google，它的主页也已经有15年以上没有变动过了。​谷歌一直被评为采用简约风格的Web界面的先驱，自20世纪90年代所提供的测试版以来，一直都很重视界面的简洁性。关于简约风格的讨论还在继续，但也有一些很多设计师都认同的共同点。那么，就让我们一起来详细的看一看简约风格究竟有着哪些特征吧。只有必要的元素简约风格的哲学非常简单，即“少即是多（英文：Less is More）”。在网页设计中，只使用真正有必要的要素，就可以 ...继续阅读 (5)

小编：这个教程旨在告诉大家使用PS制作小插画，和常见的布尔运算的使用～锻炼大家边看教程边做边思考的好习惯。如果大家在使用PS的过程中有什么不明白或者不理解的地方可以在下方的留言板中留言～我将统一回答大家的疑惑～另外大家可以积极的交作业哦～我也会一个个为大家解答的～Z作者站酷地址：http://www.zcool.com.cn/article/ZNDcxNzU2.html 转载请注明：学UI网»线性小插画绘制【教程】 ...继续阅读 (7)

很多时候我们做设计都被要求表达一种固定的感受，而实际做出来的作品却有可能给不同的人以不同的感受。那么问题来了，如何才能避免这种情况出现呢？让我们一起了解一下“固有情感”这个概念吧~ 你是否迷惑过，在设计中使用什么样的要素才能符合要求呢？这个时候若是能够了解了情感效果中的固有情感，工作的方法就会有所改变。因此，这次对于“固有情感”做了一些总结。 1.什么是“固有情感”？基本上所有的人都有同样感觉的情感效果。以颜色为例会有，红色给人以温暖的感觉，蓝色让人觉得寒冷，浅色让人感觉很轻，深色会显得很重，等具有代表性的固有情感。同时，另外一种情感效果是“表现情感”。表现情感是诸如漂亮、帅气、可爱等因人而异的情感。这次将要介绍一些关于颜色、形状、文字和排版的固有情感。 2.颜色的固有情感冷色·凉爽或者寒冷的感觉·看起来后退或者沉着冷静的感觉·寂静的感觉·给人以时间很短的印象暖色·温暖或炎热的感觉·看起来前进·兴奋感·给人以长时间的印象浅色·柔软柔和的感觉·重量轻的感觉深色·坚硬的感觉·沉重的感觉·朴素低调的感觉鲜艳的颜色·华丽的感觉·有朝气的感觉 3.形状的固有情感圆形·柔软的感觉·自由的感觉·轻松的感觉·女性化三角形·危险的感觉·疼痛和尖锐的感觉·宽阔的感觉·方向性矩形·稳定的感觉·庄重的感觉·男性化·信任感 4.文字的固有情感明朝（衬线字体）·柔和的感觉·年代感、历史气息·文雅、典雅的感觉· ...继续阅读 (8)

小编：弹框是一种交互方式，用作提醒，做决定或者解决某个任务，常见于网页及移动端。其好处是让用户更聚焦，且不用离开当前页面，更快更容易完成任务。现在弹框越来越被设计师关注，如何做出更美体验更好的弹框？接下来我们就一起看一看别人设计的漂亮的弹框。OverlayPop-UpPop-UpPop Up WindowPop UpPop-UpPopup OverlayPop-Up / OverlayDaily UIPop-Up/OverlayPop Up OverlayDaily UI #016Pop-Up / OverlayPop-UpDaily UIFree PSDDay 016Pop-up windowPop-Up / OverlayPop upDaily UI #016Pop-Up / OverlayReminderDaily UIDaily UIPop-Up / OverlayDaily UI 016UIPop UpPop up/OverlayOverlayPop UpDaily UIOverlayDay 016OverlayDaily UIDaily UI 016OverlayOverlay文章来源：设计之家作者：佚名转载请注明：学UI网»35个漂亮的网页弹框设计 ...继续阅读 (11)

你肯定遇到过这样的情况：明明想找别人沟通工作，却陷入好友状态和其他网页一发不可收拾……好不容易找到工作状态，却突然收到QQ推送的娱乐八卦新闻。相信你和我一样，需要一个高效、无广告、清爽的聊天协作工具，让自己效率爆棚，早早下班。现在，腾讯做了一款叫 TIM 的办公专用轻聊版 QQ，满足你的需求。从 3 月 1 日起，你可以到 office.qq.com 直接扫码下载 TIM 的正式版，包括 iOS、Android 以及 PC版本的TIM。我们邀请了一些测评组织来体验TIM，来看下他们体验的感受如何。一、比 QQ 更轻，但比 QQ 还多了点光是从界面上来看，TIM更加清爽。移动端的 TIM 把 QQ 的「动态」替换成办公所需的实用功能，显得更为简洁：而 PC 端的变化则更大，Windows 版的 TIM 和 Mac 版的 QQ 十分相像，把我们熟悉的 QQ 聊天列表，变为一个窗口式的固定弹窗。TIM 删除了 QQ 空间、动态、厘米秀、游戏等和工作无关的功能，提供了一个高效沟通的氛围。那它保留了什么？答案是，那些能让你高效工作的功能：群投票、邮件、转账、位置、文件传输；批量整理不常用的好友和同事，归到一个组里；当然少不了语音通话和视频功能，远程开会再方便不过。TIM 的邮箱可以添加除 QQ 邮箱以外的邮箱除了「删繁就简」，TIM 还新增了几个适用于办公场景的功能：名片夹收藏夹多人在线编辑 ...继续阅读 (4)

Skacks会彻底改变你对Sketch布局方式的理解。就像CSS中的Flex Box、iOS中的UIStackView和Android中的FlexboxLayout——Stack的自动布局可以再次改变整个局面。Sketch用户终于可以在不用CSS的情况下，直接使用Flexbox的排版技术。我们相信，推动设计生态前进的关键在于，创造出强大的设计概念。Flexbox已经彻底改变了局面，它出现已有好几年了。但要使用它，你得在浏览器中使用CSS来设计，因此对于多数设计师可望不可及。Stack是另一种形式的Flexbox，它更直观，但能力丝毫不减。它能使设计师以列、行、网格的思维来思考设计——使设计更加一致。Stack是什么？Stack是一种特殊的组，定义了其内部图层的布局方式。Stack组的图标是一种特殊的蓝色，上面还有图标来表示方向。要使图层变为Stack模式，在Auto-Layout面板中点击Stack按钮。小提示：–Stacks能产生一致性。–一致性使设计清晰。–Stacks能使设计清晰。一个Stack组有3个属性：方向：定义其内部图层按照水平还是垂直方式排列。方向对齐：包括顶对齐、中央对齐、底对齐、伸展。对齐间距：定义其中每个元素的间距。Stack可以嵌套使用！来解这道题！90%的设计师第一次都会理解错！下图由多少个Stack组构成：正确答案是： ...继续阅读 (11)

之前在DDC后台有粉丝留言说希望我们能写一篇关于iOS和Android平台特性对比的文章，笔者曾经为两个平台分别做过差异化的设计，所以今天想借此话题为大家介绍一下iOS和Android两个系统在设计方面的差异之处，让大家能更好的理解其中的异同并运用在自己的设计当中。作为智能手机的最大的两个阵营，iOS和Android系统差异一向都是大家津津乐道的话题，其中内容通常是围绕“机器性能好不好，打开软件卡不卡”“摄像头的像素高不高，拍出来的自己美不美”“外观是不是有bigger”等话题展开的。但在一个设计师眼里，这两个系统的差异性之多可远远不止表面上看起来的那么简单粗暴。但在移动端趋势有如春草那样蔓延开来的今天，大多数的公司都选择把iOS的界面直接运用于Android系统。我们自然可以理解这样做是为了节省成本和更快的迭代，但抹杀了系统特性的运用却牺牲了许多Android用户的用户体验。尽管知乎也有类似回答过两个系统交互的不同，今天笔者想更着重介绍一下两者设计语言的异同。从Flat Design和Material Design 说起几乎每个移动端的设计师都会熟知的一个Mobile设计里程碑——就是iOS7的Flat Design。原本栩栩如生的拟物化设计被拍扁，去除了冗余、厚重和繁杂的装饰效果，扁成了“扁平化设计”，其核心思想就是让“信息”本身凸显出来，在设计元素上则强调了抽象、极简和符号化 ...继续阅读 (7)

在这篇文章中，我们将与大家分享一些专为设计师打造的热门工具。它们可以有效的帮助你制作交互原型，协助你进行网站的设计，并为你提供收集、管理设计素材的场所。那么，这些实用的工具，你又岂能错过呢！Have Fun！1.Napkin iphone版Napkin iphone版Napkin 是一款直接在 iPhone 上就可以完成 APP 交互设计的软件。它拥有三个主要工具：图层控件、画板工具以及编辑控件，让你在手机上就能轻松的完成创意设计。是不是很方便呢？官方网站：http://www.designwithnapkin.com/2.AtomicAtomic无论是在简单的交互上，或是贯穿在整个产品的研发中，Atomic 都可以帮助你快速创建切实的原型。官方网站：http://www.atomic.io/3.WakeWakeWake 是一款面向创意设计团队的协作工具。它能让你快速地了解团队的创意，在不打断你工作的情况下，与团队成员共享你的工作流程，同时 Wake 还可以跟一些设计工具（Sketch、Photoshop 或者 Illustrator）直接对接，方便团队利用已有设计工具。官方网站：http://www.wake.io/4.CereosCereos专为营销人员和设计师打造的一款强大的交互式内容创作软件。你可以用它创作出多种形式的内容。例如，互动的信息图表、适合移动设备的电子书、多页的 ...继续阅读 (12)

小编：大家都知道动效是很重要的，好的UI动效不仅可以使用户体验大大的提升，还可以增加用户在使用过程中的趣味性。使用设计动效可以在一定程度上增加内容的展示量，让用户有更高操作体验。接下来大家就一起来欣赏一下吧！文章来源：设计之家作者：佚名转载请注明：学UI网»动态UI设计作品精选 ...继续阅读 (16)

小编：@狼哥 过完年了，大家有没有把状态调整回来呢？因为过年而暂停的公开课终于又和大家见面啦！由于很多小伙伴说一些立体感的UI控件不好做，因为扁平化太好做了。那么这次狼哥挑了一套比较简单、常用的控件和大家分享。在分享的同时分析这些立体的空间是怎么做出来的，我们如何在二维的平面上营造三维空间的感觉。其实分析是很重要的，学会了分析，一些难题就会被拆分成一个个简单的小问题，我们就能逐步攻克这个难题了。转载请注明：学UI网»狼哥教你画按钮控件（学UI网第八十九期YY设计课） ...继续阅读 (13)

今年的情人节虽然过去了，但是有爱的心还是永远都不要过去。so我们今天的作业是一个爱心图标的临摹！gg~~注意：心的形状要勾好看点；反光高光什么的，可以用剪切蒙版的画笔图层擦出来；细节很多，一点点来，要有耐心；要求：提交的作业在背景的右下角或评论框署名，格式为：(N群-XX）本作业来源与网络，若有知道原作者的请联系我们，我们将在第一时间处理！各位童鞋请选择适合自己现阶段的练习：新手作业进阶练习中高级作业转载请注明：学UI网»heart临摹【做作业】 ...继续阅读 (19)

小编：@狼哥 有相当一部分小伙伴找狼哥说，临摹了之后总觉得哪里不得劲，虽然还原度已经很高了，但还是觉得再加点什么就更棒了。狼哥想了想，要不给静态的案例加点动效吧。这样一来学习了优秀的作品，二来给原作品“锦上添花”，第三还进行了一次“微原创”（关于“微原创”请见上一期公开课），这是一举三得啊！转载请注明：学UI网»播放器及动效制作（学UI网第八十八期YY设计课） ...继续阅读 (9)

小编：做为交互设计师如何落实好葱框架到内容再到设计的流程？一起看看来自京东的设计师@美霞将她的工作实践总结出来分享这整个流程的内容。前言频道页的交互设计，通常会拆分为下几个步骤，本文主要探讨落实设计的环节。落实设计，即是在经过需求分析、方向定位之后，输出最终交互稿件的过程。对项目的分析思考、逻辑的梳理整合能力无疑是一个交互设计师的核心技能，而落实设计的能力在我看来，应该是设计师的基本功夫。前期分析定位需要有理有据，同样，在落实设计这一步上，也需要思考周全、反复打磨。虽然最终稿件的输出因人而异，但在框架到内容的过程里，也有一些方法和思路可以帮助我们提高效率，规避不必要的错误。以下是我在落实设计的一些步骤和方法总结。壹 | 写在最前：内容填充一定是基于分析框架之上的这一点准确来说，是贯穿整个输出过程中的。需求分析的结论和推导出的方向定位，并不单单是用来跟需求方沟通的，更是整个输出设计过程中的核心标杆。后续页面设计涉及的模块比重、整体调性等都是需要围绕前期分析的定位框架。贰 | 整合信息信息整合是着手设计的第一步，面对多样的信息，我们可以从以下三个方面去整理。1、信息元素在前期的分析阶段，我们只会确立到模块的运营维度，到落实设计这一步，我们则需要清楚了解模块内展示的信息元素。在实际的项目设计中，需求方可能会向我们提供要展示的信息，但交互设计师也需要有自己的考虑，放置哪些信息能够更加凸显这 ...继续阅读 (1)

小编：Kibzy APP能帮助父母减少不必要浪费的时间，它是一款允许父母互相帮助带小朋友到兴趣班，它能实时的通知你家小孩被接、在路上以及已到校。如此你便能合理的安排你的工作、计划。它由来自的美国的3位设计师：@Elena Galitsky、@Max Balter、@Bachoo Design 共同完成。以下是您如何发送和接收请求到您受信任的联系人：原文地址：behance转载请注明：学UI网»家长or小盆友拼车的app欣赏 ...继续阅读 (10)

小编：@狼哥 很多小伙伴一直被“原创”的事烦恼着，其实原创哪有那么容易啊，老费脑子了！但是微原创就相对容易多了。什么叫“微原创”呢？就是在原有的基础上进行一些原创设计，不管是自己原先的作品还是别人的作品，都可以进行“微原创”。这不，狼哥找了个案例和大家分享。不过需要注意的是，自己原先的作品随便整，别人的作品得先说明一下是在谁谁谁的啥啥啥作品上进行“微原创”，毕竟我们也要尊重原作者的劳动成果嘛，对不？转载请注明：学UI网»狼哥教你微原创-壁挂相册（学UI网第八十七期YY设计课） ...继续阅读 (10)

小编：今天小雨带来的是二十四节气の惊蛰App启动页。惊蛰以后，桃树枝头的蓓蕾惊醒了，东一枝西一枝，那些嫣然微笑的花朵，喷出醉人的芳香。春天万物复苏的景致，粉嫩的颜色，是我近期的最爱，虽然辣么大了，可管不住扮嫩的倾向呀。希望大家喜欢。素材链接：http://pan.baidu.com/s/1sltWUOd文章站酷链接：http://www.zcool.com.cn/article/ZNDcxNzU2.html 转载请注明：学UI网»惊蛰APP启动页教程 ...继续阅读 (8)

小编：嗨同学们好！今天又是活力满满的一天呢，下面为大家带来一篇简单的AI教程，将学习制作灯泡文本效果，在本教程中会学习使用一些基本的工具。希望你喜欢这个教程！第一步创建一个新文档，将窗口中的数值设置如图： 并设置网格为： 第二步、创建主要形状选择矩形工具（M）创建一个148 x 28px的矩形，其颜色为R = 244 G = 167 B = 32，并降低不透明度至20％。 选择添加锚点工具（ ），在矩形左侧4px的位置添加两个新的锚点。用直接选择工具（A），选择左上角的锚点，将其向下拖动2px，然后选择左下角的锚点，将其向上拖动2px。 选择直接选择工具（A），选择红色圆圈突出显示的左边两个锚点，设置边角为5px，选择红色圆圈突出显示的右边两个锚点，设置边角为13 px。 第三步、创建内部组件使用矩形工具（M），创建一个115 x 14px的矩形，距刚才画的矩形左侧12px，垂直居中对其，设置1px的内描边，颜色设置为R = 243 G = 202 B = 103，圆角为7px，选择对象>路径>轮廓化描边。重新选择矩形工具（M），创建一个109 x 4px的矩形，如图放置，添加相同的1px黄色内描边，圆角为2px，选择对象>路径>轮廓化描边。 选择矩形工具（M），创建一个12 x 10 px的矩形，将其放置在距第一个距矩形3px的位置。设置颜色为R = 121 G = 96 B = ...继续阅读 (8)

小编：@C7210 VR硬件设备正爆发式发展，做为UI设计师在此领域的跟进也需时时，以下这篇是关于VR界面设计的实践指南，希望对你有帮助。一篇VR实践指导文章。Smashing Magazine好久没有这样新一些的东西了。实践指导性质的内容非常简单易行，个人感觉需要重点关注的是将传统UX设计流程及方法融入VR产品设计的思路，以及作者对于VR设计开发工作前景的观点。新技术，新事物，大风刮去之后留下的一批实践者所始终坚持的那些，才是真实的、有长期价值的东西。这是走心；集体意淫无非走肾而已。下面进入译文。对于很多设计师而言，VR仍是一片未知领域。在过去的几年当中，我们见证了VR硬件设备与软件产品的爆发式增长。站在体验的角度来看，从枯燥无聊到精彩绝伦，不同类型的VR平台与软件形式所带给我们的也不一而同，其中的复杂度与使用效率方面的差异也相当明显。作为传统UX设计师，踏入全新领域的第一步是最为困难的。我们知道，因为我们经历过。别担心，在本文中，我们将详细的分享VR app在设计方面的具体流程，包括相应的工具及方法，希望各位读过之后能够掌握到足够的知识去运用到自己的VR项目设计当中。要实现这一目标，你不必成为什么专家，但学习热情以及将能力运用到新领域当中的渴望则是必需的。希望我们最终能够通过更多的分享与交流来最大程度的推进VR的发展速度。 VR app的类型从设计的角度讲，VR app大致由“ ...继续阅读 (5)