时间 信息 版面 在进行设计时,常常会涉及到“时间”的排版,比如展会日期、演出时间、活动促销时间等。“时间”在版面中更像是个“配角”,并不像标题和其它信息那么显眼,所以常常被设计师所忽视。但版面中任何一个小细节都会影响到版面整体的美观,本期讲解“时间”信息编排的几种思路,教你如何让“时间”的排版在顺利传递信息的同时,还具有良好的视觉体验,为版面增添设计感。往期平面干货:文字怎么搭配排版才吸睛!送你50+案例!海报文字的排版怎么样才能吸睛与众不同?阅读文章 > 一、对比“对比”在设计中无处不在,在“时间”的编排中也是如此。在设计时可以弱化日期中较次要的信息,突出主要信息,让观者一目了然。此案例时间并没有经过太多的刻画,但加入了大小对比,形成了视觉层次感。将“年份”和“月、日”字眼信息缩小,采用大小对比增强信息之间的跳跃率,显得灵动活泼。将“月份”改为空心字,形成空心字和实心字的强弱的对比,使主要信息“日期”更突出。二、简化将“年、月、日”简化为“.”“/”等符号,既能准确传达日期信息,又可以使视觉效果更简约。很多时候年份并不那么重要,可以把年份弱化,突出具体时间,形成对比、层次区分,这样更有利于阅读。如果时间信息较多,想更简约的呈现,年份直接删去也无妨。当活动的时间范围在同一个月,“月份”可以共用,这样能精简画面重复的信息。三、替代将月份替换为英文,使版式多一点变化。将日期中的阿拉伯数字用汉字代替,比较适用于传统复古的版面。日期连接经常使用横线“——”,也可以替换为各式各样的箭头来连接日期。将年份信息放在连接线上,既起到连接的作用,同时还能引起阅读者的注意。四、添加如果想让版面视觉效果更丰富,可以选择添加信息。此案例添加星期的英文缩写,增加大小对比,丰富了画面层次。有些活动是只在一天的某个时段举行,则需要添加具体时间。还可以添加图标或其他小元素进行装饰,增加更多趣味性。添加外框,让“时间”信息的呈现更整体,也能与其它信息进行区分。六、分行当有两个日期需要呈现,可以采用分行处理,让读者更易于阅读与识别。七、对齐方式左对齐是最符合人阅读习惯的对齐方式,所以也是“时间”编排中最常使用的对齐方式。在设计时也可以尝试改变不同的对齐方式,让编排多一些个性和变化。也可以将文字调整大小和间距,使两端完全对齐,可以达成工整严谨的效果,看起来也更加饱满。八、纵向编排在版面空间比较狭窄时,可以改变时间的排版方向来适合版面编排需求,纵向的编排还能体现出古典文化感。在改变排版方向时,一般要把数字调整为常规阅读方向,保证良好的识别性。也可以同时采用横排和竖排相结合的排版方式,形成方向上的对比,视觉效果更丰富。九、字体选取特殊的字体,让信息编排更具个性和设计感。掌握方法后,可以尝试更多的组合方式,让重新设计后的“时间”信息在顺利传递信息的同时,还具有良好的视觉体验,为版面增添设计感。本期示范所用字体为:Trajan、Times New Roman、Garamond、思源黑体、D-DIN、Bebas、Facon、Quantum、Bungee Inline、Morena、Baloo(除前三款外均可免费商用)欢迎关注作者的微信公众号:「艺海拾贝Design」本篇来源:优设网原文地址:https://www.uisdc.com/time-design
夏花 神兽 工具 大家好,这里是和你们聊设计的花生~春节将近,前不久 2023 年央视春晚公布了兔年的吉祥物“兔圆圆”,它是春晚 40 年历史上首个通过互联网大数据分析完成初始配方原创的总台春晚吉祥物 IP,形象乖巧可爱,一经发布就受到了很多网友的称赞和喜爱。其实除了“兔圆圆”,今年春晚还以《山海经》《抱朴子》《史记》等典籍中的神兽为原型,设计出麒麟、白泽、貔貅等上古神兽形象,届时也会出现在春晚舞台上。而参与此次神兽IP设计的就有一位年轻AI数字艺术Sixone。春晚官方公布神兽形象在参与此次设计春晚神兽IP形象之前,Sixone就已经和其他成员一起创立一家数字艺术工作室WAIO,是国内最早成立的AI数字工作室之一。工作室目前由 5 位前沿 AI 人工智能绘画艺术家组成,他们本职为中国传统艺术画师、CG 艺术家、雕塑家、设计师、原画师,同时悉知并掌握最新的 AI 绘画工具用法, 合并形成了完整高效的工作流。在参与此次设计春晚神兽 IP 形象之前,WAIO 工作室团队已与央视网、知造局、阿里拍卖、小红书、雪佛兰等品牌有过合作,团队成员担任过全球首届 AI 艺术创作大奖赛的特邀评委,多项 AI 艺术作品也在北京、上海、深圳、成都等地巡回展出。WAIO 与央视网合作的“梦画 AI”节气插画系列WAIO 成员作品在“梦廊坊·沸铜数字艺术展”中展出从刷屏互联网到登上春晚的舞台,这些令人称奇的AI数字艺术品是如何被设计创作出来的呢?优设专访了WAIO工作室的2位成员 SixOne 和 Theo,我们一起来看看有关AI艺术创作的那些有意思的故事吧~夏花生:两位好,先简单做一下自我介绍吧~SixOne:大家好我是 SixOne, 大家都叫我 61。本职是动画师,同时也是 WAIO 数字艺术工作室的成员。Theo:大家好我是 Theo 没编号,群友给起了个昵称提提。我这边本职工作是 UI 设计,也会做一些平面类的工作。在 WAIO 这边除了正常跑图和设计类工作之外,还会做一些商务对接工作,如果有数字藏品相关涉及到赋能玩法之类的,也能变身狗头军师出谋划策。夏花生:WAIO 工作最开始是怎么成立的?Theo:WAIO 这个名字来自一个非常搞笑的小猫表情包和 61 老师的口头禅 Waio(哇哦),成立的初衷也挺有意思。我们团队的 5 个成员之前在用 Tiamat,就是国内比较厉害的一个 AI 绘画工具,互相交流的过程中就逐渐熟悉了,有了一个自己的小群。当时正好有一个数字艺术展同时邀请了我们几个,我们就开玩笑说不如直接成立一个“WAIO 犯罪团伙” 一起参展吧,WAIO 的雏形也就有了。SixOne 设计的 WAIO 工作室 logo 他们为自己设计的头像夏花生:Theo 是什么时候开始接触到 AI 绘画的呢?Theo: 最早应该是在去年 4 月份吧。当时是在网上看到 Wombo Dream 的相关信息,就跑去试了试,然后整个人就惊了。虽然说按照现在的 AI 出图的效果来看它出的图不怎么样,但是当时并没有太多的 AI 软件进入我的视野,第一次接触到这种工具后的想法就是“太牛了!”,文字️转图片这本身就是很酷的一件事。Wombo Dream我用的并不多,因为马上Disco Diffusion就来了。正式的AI绘画之路其实也是从Disco Diffusion开始的,正儿八经的开始各种找资料,做功课的学习。Dream by WOMBO 是最早一批的 AI 图像生成工具,有网页版和移动应用程序。图片来源:https://dream.ai/了解热门 AI 绘画工具:人工智能快速出图!盘点 4 款人气超高的 AI 绘画神器大家好,我是和你们聊设计的花生~有关注 AI 绘画领域的小伙伴可能注意到,国内已经出现了能直接使用中文提示词生成 AI 图像的工具了,这就进一步降低了我们进入 AI 绘画世界的门槛,对设计师和创意工作者来说无疑是好消息。阅读文章 > 夏花生:我有翻看你们在小红书上发布的 AI 作品,很明显的一个感受就是 AI 图像的生成质量越来越高了,可以分享一下学习进步的经验吗?Theo:我自己的学习过程可以分两个阶段。 最开始是 Disco Diffusion 时代,同期还接触到国内的 Tiamat,基本学习方法是一致的,就是解决 Prompt(关键词)这个壁垒。会经常找参考资料,看看输入后会有什么样的神奇结果,在这个过程中逐渐积累经验,比如不同艺术家对应的风格、镜头语言的不同构图、不同渲染模式的出图效果等等。当时还跟 61 老师一起搞了个共享文档,收集记录好的 Prompt 然后拆分研究。但当时 Disco Diffusion 的出图时间真的一言难尽,每次尝试都经过漫长的等待,整个学习是痛并快乐着的。Theo 的 AI 作品然后 Midjourney 时代来了,也带来了 Discord 交流社区。Prompt(关键词)已经不能算是壁垒了,国内的一些 AI 绘图工具甚至可以直接选相应的关键词出图,此时更需要能对画面主体做精细的描述。AI 工具的操作也越来越便捷 ,用户体验逐渐拉满,当然如果想出一些与大流不一样的图,Prompt 还是要自己整理修改的。到这个时候 AI 绘画的学习成本可以说大大降低了,B 站等各种社交媒体都有教程,AI 绘图工具本身的社区也是一个很好的学习的地方 ,研究大佬的描述是件很有意思的事。Midjourney 的 Discord 社区界面截图。Discord 是现在很多 AI 绘图工具都使用的交流社区,上面汇集了世界各地用户的作品、讨论和经验分享。夏花生:Theo 你本身就是设计师,也尝试过将 AI 绘图与 Blender 这样的 3D 软件结合起来,那你觉得 AI 绘图工具可以在哪些方面给设计师作带来帮助?Theo:我有关注的一个 Blender 大佬 Lan Hubert,他会教很多偷懒小技巧,比如用照片建模、照片贴图什么的,照片这部分完全素材可以用 AI 生成。还有就是 AI 出图是很好的概念设计辅助手段,我见过有大佬用 AI 跑出一个兔子形象,然后在 Blender 建模出来还绑了动画,效果太香了。有概念设计师会起个草图,用垫图的方式让 AI 快速迭代的各种概念设计图,我觉得这事用在初期方案审核上是个很好的思路。此类的应用其实还有好多,在 Discord 社区里有好多账号只跑一个领域的图, 比如服装、鞋子、珠宝首饰之类,可以带来丰富的设计灵感。WAIO 与雪佛兰合作的长图夏花生:听说61你有参与设计2023年春晚中的一组神兽IP形象,可以分享一下背后的设计过程吗?SixOne:是的,我在此次的神兽的IP设计中负责一定部分的工作,对我来说也是一次非常宝贵的经历。前期的神兽形象是由陈漫老师指导,我的神兽灵感来自于知名摄影师陈漫的作品,然后北大陈连山教授也给了我每只神兽具体的山海经文献参考。夏花生:所以这次神兽的设计过程中 AI 只是起了辅助性的作用,快速将不同方面的意见呈现出来作为参考?实际的设计绘制都是专业人员亲自创作出来?SixOne:是的夏花生: 这次和春晚的合作的感觉什么样,有没有疯狂改稿?SixOne:此次和春晚的合作很顺利,大家都很认可神兽的形象,由于是自己的作品,改稿也是心甘情愿的,我们都希望中国能做出自己民族文化的 IP,能在孩子们心里多弘扬中国的文化,让更多人喜欢。然后一开始的有一版是有五只神兽,对应的五行属性。但是教授说山海经里没有对应这种说法,这版构思就被舍弃了,感觉设计团队的每个人对创作的要求都是很严格的。夏花生:两位现在对 AI 绘画领域比较熟悉了,觉得国外和国内在 AI 绘画工具的发展以及创作环境中有什么不同吗?SixOne:感觉在国内偷摸摸的玩不敢声张,不然容易被人挂图。可能有些人认为自己一笔笔画出来的才叫画画,我其实并不这么觉得。我有一定审美和创作能力,只要不是叠别的画师的图或者什么侵权行为,我借助 AI 工具进行创作,前期出一些意向稿给甲方选定风格和方向,能大大节约时间成本。微博上有人说这次的神兽形象一看就 90%都是用 AI 画的,我其实挺开心的,至少他们只是攻击 AI,并没有说神兽丑,说明我设计的形象还是好看的,对吧?再说不管是国内和国外都没有哪个 AI 能很好的画出山海经的神兽形象,说到底人工智能要有了人为的干涉,它才能够智能。WAIO 成员 Sixone 的 AI 作品Theo: 工具方面的话,我觉得国产自研模型和国风数据库可以跟上国外的规模,做区别出明显区别于国外 AI 的中国风的东西,会是个很好的路子。前段时间中华珍宝馆启动了一个开放数据项目,助力书法 AI 研究,觉得挺好的。其实这种开放数据库,并不是像大家想的那样是在给 AI 绘画行方便,官方明确表示 AI 技术还可以用来对画面进行自动化标注,方便大家检索画作,这可以很大程度上减少人工成本。或者用 AI 进行图片清晰度提升,如果能做的好,对出版和自媒体行业将有非常大的价值。项目详情:https://mp.weixin.qq.com/s/Oir8Xw6EypFB0laKxWsSjw夏花生:说到这里,我想起之前 A 站上有一次集体首页刷屏,是为了反对 AI 不经允许拿图训练模型的行为。现在对 AI 一比较大的争议也是集中在训练集的合法性上,你们对这方面是怎么看的?Theo: 不同软件的商业条款不同,作为创作者我只能按照软件的商业条款操作 ,抵制版权问题这事本身我觉得没有问题。我认为应该是 AI 软件方,AI 创作者和画师,这里泛指一下因为版权问题反对 AI 者, 三方联合推动这个行业健康发展,包括相关立法,创作者权益等等。科技发展不是一波人出来抵制,或者 AI 创作者说我不用这个软件了,他就停滞不前了 ,发展速度和带来的便利这半年我想大家应该是看的清清楚楚 。共同推进健康发展,而不是抵制技术本身,甚至从道德谴责演变成网暴。Unsplash 宣布禁传AI生成图像,人们对AI的反抗要拉开序幕了?大家好,这里是和你们聊设计的花生~9 月 21 日,国外知名大型图库 Getty Images 宣布禁止用户上传和销售使用 AI 模型(包括 DALL-E、Midjourney 和 Stable Diffusion 等)生成的插画,网站内存有的 AI 图像也会被删除。阅读文章 > 夏花生:我也一直有关注 AI 技术的发展,现在 AI 除了在绘画方面发展的应用之外,在生成 3D 模型、生成视频还有智能聊天方面也要不错的发展。如果可以的话,你们希望将来 AI 技术在哪些方面更有进一步更神奇的发展?SixOne:作为动画师我想要让 AI 做动画,不过目前如果 AI 能开发出分图层技术就很厉害了。Theo:我希望目前已经实现的 AI 功能结合一下,比如用 ChatGPT 生成文字脚本,然后 AI 绘画软件直接生成相应的图。其实现在也只是多了一步人工的复制黏贴,但是如果真的能打通这些关节, 同步修改文案到自动修改图片,或者加入局部修改功能,这样工作流的确很吸引人夏花生:的确,如果将现在的 AI 工具整合在一起真的会很方便,感觉未来也很有希望实现。那今天的访问就现在这里啦,感谢两位大佬的回答,也祝 WAIO 未来发展的越来越好~了解人工智能聊天工具 ChatGPT:地表最强AI聊天机器人ChatGPT诞生!会给设计师带来哪些影响?大家好,这里是和你们聊设计的花生~前几天刚和大家聊过 AI 绘画工具 Midjourney 的 V4 模型,感叹它图像生成质量之高。阅读文章 > 以上就是本期对 WAIO 数字艺术工作室的专访,看完之后大家对 AI 绘画工具参与设计创作有没有什么新的认识和看法呢?欢迎在评论区分享。对 WAIO 工作室感性去的小伙伴可以关注 SixOne 和 Theo 的小红书,了解更多 AI 绘画信息关于关注优设的 AI 绘画的专题:优设「AI 绘画」专题: https://www.uisdc.com/zt/ai-draw推荐阅读:Runway!AI技术+视频制作的新一代视频内容生成工具大家好,这里是和你们聊设计的花生~之前和大家聊过不少 AI 图像生成工具,有的可以根据文本生成图像,有的则是将 AI 技术运用到图像处理中,让扣除背景、消除画面元素成为非常轻松快速的事情,大大提升了设计师的工作效率。阅读文章 > 2023年,让这20款AI工具帮你更高效地完成工作~2023年,让这20款AI工具帮你更高效的完成工作~大家好,这里是和你们聊设计的花生~2022年是AI技术大发展的一年,我都快记不清为大家推荐多少种AI工具了。阅读文章 > 本篇来源:优设网原文地址:https://www.uisdc.com/waio-interview
自己的 需求方 作品 在设计职场中,我们肯定被否定过,委婉一点就是建议再多出几个版本。要是遇到直白一点的,直接说你的设计做得太丑啦!在职场中遇到被否定实属正常,没有打压就没有痛下决心的驱动和反思。记得初入职场的时候,一次设计提案就直接被老板说:“这都画的啥玩意儿,这么丑”,当我成长起来之后再回想起当初的场景,我很庆幸老板的直白批评,让我清醒起来了,自己不努力就只能被淘汰。最近黑马哥也回忆了一下自己初入职场时的经历,当我们被否定的时候,如何走出困境至关重要。今天也针对这个话题和大家聊一下自己的想法,希望对大家有所启发。往期黑马哥干货:职场遇到这10种要求,设计师请学会拒绝!职场中总有这样一群人,总喜欢麻烦别人,把自己的事情交给别人来完成;也有这么一群人,不好意思拒绝别人的事情,导致自己的工作做不到极致。阅读文章 > 一、真丑假丑自我判断初入行业工作中作品被否定实属正常,虽然我们要按照需求方的想法做设计,但是被否定并不一定是我们设计得丑。需求方也是分专业和非专业,针对一些不专业的需求方,我们也要坚守自己的判断,真丑还是假丑自己心中要有数。要是自己不够专业被别人质疑,可能是真的丑,这种情况只能虚心接受了。如果只是需求方审美不行,我们可以为了工作妥协自己的想法,但是我们对于设计的判断依然要坚守在更高的标准中。如果是在设计平台发布作品被说丑,我们就要思考别人的这个评价是否是“杠精”。我们输出作品都有自己的目的,不能因为别人觉得丑就放弃,要有自己的正确判断。别人评价作品丑没关系,明确自己做这个作品的目的更重要,坚守自己的目标规划,让“杠精”们和你的差距越来越大。二、正视问题调整心态虽然真丑假丑我们自己要判断,但是如果是真的能力不足,也要正视这个问题。不要被别人影响,也不要自我感觉过于良好,正视自己调整心态至关重要。不要被别人的评价干扰自己的心情,作品丑不是什么大过错,只是我们还在进步中而已。调整自己的心态切勿玻璃心,整理那些有效的建议,当局者迷旁观者清,别人的建议也是我们增长经验的一部分。三、反复磨练由丑变美知道自己的不足是好事,懂得调整心态更是值得点赞,就怕能力不足而不自省,更怕玻璃心一蹶不振。黑马哥刚毕业的时候也经常被骂,设计方案被退回来和被说丑那是常有的事儿。这都是职场经历的一个过程,没啥大不了的,跌倒了爬起来继续撸图。我们要明白只有反复磨练才能由丑变美,想要改变别人的看法不是靠空想,也不是靠时间的积累。工作年限长了不代表你的能力就强了,工龄和能力不是一定会成正比的。我们都是凡人,只有按部就班的努力才能成为自己,简单的事情反复做,重复的事情做到极致,设计经验就是一堆源文件积累出来的。要给自己制定作品输出计划,不怕自己做得比较慢,就怕你一直在原地踏步。要让自己多年后有很多作品可以筛选,而不是埋怨没有机会和公司不注重设计,导致自己没有作品沉淀。四、设计过程多找依据有时候我们的设计被否定并不是设计本身不好,也许是少了说服需求方的依据。就类似于设计方案技术说不合理、不好开发、实现不了等问题,如果我们可以拿出别人实现的依据,就可以证明我们的设计是没问题的,是你们技术能力不行而已。设计过程中我们做出来的解决方案要有成熟的构思,也要找到验证方案成立的依据,空口说白话肯定是没有说服力的。平时也要加强体验和总结,也要建立灵感资源库培养采集、分类和分析的习惯,日常的积累量是提高效率的关键,别人产品的上线方案也是参考依据的途径之一。设计过程中的依据可以是调研分析、竞品分析、线上案例分析、设计推导等,不要闷着头画图,也不要让设计停留在个人理解中,突破固化思维才能突破灵感束缚。五、设计收尾自我审查优秀的设计师需要注重细节、具备良好的职场习惯和专业态度,完成项目设计后要反复审查,不要出现低级错误。很多设计师完成项目后直接就发给需求方,一些看似小问题却影响了别人对你设计态度的质疑,相互之间的信任度需要从每一个细微之处体现。自我审查是我们把控设计质量的第一个环节,只有自己觉得满意了才有可能说服别人接受,自己都打动不了还妄想打动别人。自我审查包含:设计逻辑、需求匹配度、细节处理、文案描述、规范统一性等,把控思路和细节,减少因小失大的风险。六、设计提交要有说明设计都是比较主观的,我们喜欢的方案需求方不一定能接受,而需求方喜欢的方案也许我们也觉得很丑。有时候方案被否定可能就是需求方只是凭感觉判断的,如果我们提交的只是视觉表现层面的展示,别人判断的时候也只能通过主观意识,也就加大了被否定的可能性。无论项目大小,我们在提交的时候最好有自己的一些设计说明,不要只是发几个图过去。特别是面试的笔试题,通过包装呈现自己的全案设计思路是至关重要的,这样才能通过整体的结构体现出自己的综合能力。要是比较重要的工作项目提案,我们制作 PPT 也是必不可少的,特别是要进行演说,准备充分才能减少风险。也不至于让需求方觉得这么长时间就画几张图,把设计的价值给拉低了。平时多输出一些日常练习,完成之后也尽量包装作品,这样才能提高自己作品包装的能力。排版的基础也是需要反复磨练的,不然做个 PPT 都显得不堪入目,反而影响了设计作品本身的质量。七、设计评审要有主见在进行项目设计评审时,我们也要先入为主,提前把自己的设计理念阐述一下,不要让大家通过主观意识去判断。在阐述的时候要有自信,对自己的设计方案要有信心,如果自己都否定自己,还怎么让设计说服别人。遇到对设计作品质疑的声音,不要一味地妥协和质疑自己,要有自己的主见。通过自己前期的设计思考和项目的一些调研依据进行辩证,就算最终要妥协也不能自己否定自己的设计质量,只是大家见解不同,要敢于为自己的作品做争取。有时候需求方自己也不是很明确想法,或者说他们的想法也可能是错误的,我们要自信自己是专业的,方案是符合市场实际情况的。就算最终我们妥协了,也要保留自己的最终解释权。作为设计师,一定要够专业、有态度、要自信。这份有主见和自信的气场不能丢,要给人的感觉就是站在台上就是我的主场,你们不能单纯以美丑来定义我的设计,要给出一个说服性的理由。就相当于我们发布作品在设计平台,别人评价说作品很丑,那也是别人不明白我们输出作品的目的,我们要坚信自己的方向是没错的,让多年后那些评价的人和我们差距一大截。八、完成项目复盘经验工作中项目有大有小,完成的结果也会有好有坏,也有一些不尽人意的情况出现。但是我们依然要养成一个针对项目复盘的习惯,特别是项目做得不好的时候,更是要通过复盘掌握经验和调整思路。初入职场我们经常会被人否定设计能力,作品也会经常被退稿。复盘出不足的问题才能找到解决方案,这也是自查的一种形式,通过项目来自查自己的技能范畴,针对不足的技能制定学习计划。有些设计师作品经常被需求方否定,却不知道自己的专业能力到底问题在哪里,就是缺少自查的环节。假设出一个全案设计的项目,然后去构思这个项目中所需要的能力范畴,再对标自己所具备的能力进行梳理。也要找一些优秀的设计作品来进行质量对标,和这些高质量的作品对比,看看自己缺少那些表现力。如果自己无法解析这些深入的表现技能,就要通过学习去加强,不然不会的问题就会越积越多,最终让自己陷入被动状态。九、主观判断美丑自知对于美丑的定义因人不同,审美的标准和生活的环境都各有差异,我们在判断感官层面都会带有自己的主观意识。通过这一点我们也要明白,别人判断我们作品也是如此,我们自己要自知自己到底有没有尽力。不因为别人的夸奖而沾沾自喜,也不会因为别人的否定而一蹶不振,主观判断美丑自知。我们要了解自己、规划自己和信任自己,一切都按照自己的规划去进行,这个过程中难免会有异样的眼光,我们无需改变他人的看法,一切留给时间来验证,只要确定自己的方向是正确的即可。十、总结本文通过关于别人对作品美丑的评价为切入口,和大家聊了这个问题出现时的一些关联因素和思考角度。我们要有自己的思考和判断,不会因为别人的评价而晃动自己的坚守,也要因为别人的评价而冷静分析,接受有效的评价屏蔽无效的争论。本文观点仅为个人经验反思和建议,大家结合自己的实际情况选择性吸收,不足之处欢迎留言补充,我们互相进步。本篇来源:优设网原文地址:https://www.uisdc.com/if-design-ugly
字体 文字 隶书 中国具有五千年文字历史,文字中所包涵的精髓,值得每一位设计师学习、继承与探究。设计师需要熟悉各种字体的风格特征,并能灵活运用字体进行编排设计,才能使作品的内容更清晰、更有条理地传达给读者。文字不仅具有阅读的固有功能,同时肩负塑造版面视觉风格的审美功能。在现代设计中常能够看到一些精心设计过的字体,以醒目而个性的形式出现,在进行信息传达的同时也被赋予了视觉个性,成为画面的焦点之一。字体是指文字的风格款式,也可以理解为文字的一种图形样式,不同的字体传达出不同的性格特征。目前各大字库提供了各种版本、各种类型的字体供设计师使用。正因为字体类型繁多,使得版面设计成了一种很具有挑战的设计工作,设计师必须不断感受与体会,来安排好这些数量有限、潜力无穷的基本元素。本期通过汉字的发展简史,分析汉字在各种设计案例中的使用,并为大家推荐视觉效果较好的相关字体。更多字体干货:超全整理!设计师必备的3类书法字免费资源(附下载链接)大家好,我是和你们聊设计的花生~之前在社群有小伙伴问有没有免费可商用的毛笔书法字体资源,有肯定是有的,但授人以鱼不如授人以渔,今天除了为大家推荐免费好用的书法字体,还会为分享给大家优质的书法字入门知识和教程,还有免费的资源网站,让你即使没有书法功底也有办法做出好看的书法字体 ~往阅读文章 > 一、甲骨文甲骨文是我国最早形成体系的文字形式,字形优美,变化丰富,甲骨文处于图像化符号和系统化文字的过渡期,强调物体的特征和对自然的模拟。应用案例:目前古文字已失去了信息传播的实用性价值,但也为设计师们打开了更为广阔的文字应用空间。在现代设计中更多是作为图形使用,应用于体现古老历史文明的特定内容中。1. 汉仪陈体甲骨文以甲骨文书法艺术为基础,融入了现代设计思维,赋予了这种古老文字强烈的时代气息,用“新”的方式再现出甲骨文文化。二、金文金文即铸造在殷商与周朝青铜器上的铭文,又叫钟鼎文。多为象形字以及由象形字合成的会意字,优美的文字像一幅幅图画,生动逼真。以战国时期中山国所出土方壶上金文为发想,取其线条的韵律感,保留重心偏高的特点,重组字体写法,创造出古为今用的现代金文,整体予人端庄优雅的形象。以西周〈大盂鼎〉金文为基础,结合青铜铭文、甲骨文实物,转译为易于识别的文字造型,并保留象形文字的图像趣味。三、大篆广义的大篆包括甲骨文、金文和六国文字。狭义的大篆指籀文,以周宣王时的太史籀所书而得名。石鼓文为大篆的代表。字体结构整齐,笔画匀圆,形体趋于方正。逐渐摆脱象形的拘束,奠定了方块字的基础。以大篆为原型制作的一款字体,字形浑厚,方圆兼备,笔势婉转通畅,优雅古朴。四、小篆由于战国时期各国的文字非常混乱,大大影响经济生产的发展以及文化教育的传播。因此,秦始皇在统一六国后,进行了具有历史意义的改革“书同文”,即统一文字。李斯以秦国文字大篆作为基础,去繁就简,同时吸收民间字体中的一些简体、俗体字的优点,进行规范,形成了一种新的字体——小篆。应用案例:小篆几乎完全脱离了象形文字,形体偏长,圆润整齐,成为十分美观的方块字体,有庄重肃穆、典雅堂皇之气,特别能营造传统古文字的典雅韵味。1. 华康新篆体设计师将传统篆书较难识别的部份略加修改,成为一般人也能看懂的“新篆体”。圆润均匀的线条,圆转的曲线笔势与颀长的字体结构,呈现出篆书独特的风格,五、隶书由于人们对信息传播的质量、速度有了更高的要求,小篆就逐渐演变成为笔画简化、更适合书写的隶书。隶书的出现,是书法史乃至文字史上的一次重大变革。初步形成了构成汉字基本要素的点、横、竖、撇、捺、提、钩、折的笔画特点。隶书书写效果略微宽扁,横画长而直画短,轻重顿挫富有变化,讲究“蚕头燕尾”、“一波三折”,极具艺术欣赏的价值。应用案例:隶书字形平整、质朴、雄劲,气度十分典雅,艺术感染力极强,现代设计中常常用来作为版面的标题。六、魏碑魏碑体是北魏时期产生的一种介于汉晋隶书和唐楷之间的新书体,又称为龙门体。魏碑体端正大方,质朴厚重,刚劲有力,笔画如同斩钉截铁一般充满气势。七、草书为了书写快捷和书者为了抒发自己的胸臆,产生了一种在隶书基础上演变而来,笔画连带,一气呵成,极富张力和艺术感染力的字体——草书。草书发展可分为带有隶书笔意,有章法可循的章草,进一步到不拘泥章法的今草,再到奔放不羁、气势万千的狂草三大阶段。应用案例:草书笔画连绵、自由、奔放、洒脱和率性,便于直接抒发书写者的思想情感。但因其识别性和易读性较低,一般作为标题或装饰元素使用,运用在浪漫情怀、充满动感的版面中。1. 钟齐柳江毛草字形潇洒飘逸,笔画连绵,行云流水,古朴优美,个性鲜明。Tips:如果安装后找不到字体,请搜索其名称「Liu Jian Mao Cao」八、楷书楷书盛行于唐朝时期,楷书同时吸取了篆书圆转笔画,也保留了隶书的方正平直。笔画挺秀均匀,字形端正,使汉字的结构大体的固定了下来。后人因为以这种字体作为学习书法的楷模,即称之为——楷书。应用案例:楷书字形端正、挺秀均匀、富有韵味,给人以传统、古朴和高雅感。楷体识别性和易读性较好,无论是标题用字或正文排版都可以胜任。1. 方正楷体(免费商用)形体方正,结构整齐,将章法严谨的楷书化作现代字体,整体清晰度佳、辨识度高,适用于一般内文、教科书、公文、告示等。九、行书行书没有楷书那样规范严肃,也没有草书那样奔放和难以识别,而是书写流畅,用笔灵活,字体如行云流水、婉约妍美、潇洒流畅,而且易识性强,时至今日,行书依然是最为使用和应用最广泛的字体之一。应用案例:行书与现代手写体相近似,笔画流畅飘逸,商业设计中常用于潇洒随兴的视觉效果,能营造出充满人文气息与浪漫的氛围。1. 禹卫书法行书笔法柔顺,飘逸有型,潇洒如风,是一个很有美感的书法字体。2. 钟齐志莽行书(免费商用)运笔灵动快捷,不像草书那么疯狂抽象,却也有着笔走龙蛇之感。Tips:安装后找不到字体,请搜索其名称「Zhi Mang Xing」。以上列举的各种字体,均是以不同时代书体为基础,进行规范化设计而成,在字体设计师的努力下,最大限度的保留了原字体的精神风貌、笔画造型特点、字形结构比例和审美特征等。文中展示字体只作为案例分析,版权归原作者所有,如需商用请购买正版字体。至此,书法界的主流书体都已经登上了历史舞台,最重要的书写介质——“纸张”开始普遍为人们使用,此后的汉字史,可以看作一场精彩又漫长的墨与纸的切磋。下期见!欢迎关注作者的微信公众号:「艺海拾贝Design」本篇来源:优设网原文地址:https://www.uisdc.com/history-of-chinese-characters
信息 用户 视觉 遇到跨职能同事对界面设计方案发出灵魂拷问,设计师该如何应答?本文从理论和应用层面,对不同种问题总结了万字科普,希望有用~往期干货:UI/UX设计作品集中的推理分析该怎么写?高手实操案例分析!编者按:作品集中的推导分析部分该怎么写,而不是套市面上的流程和模板?阅读文章 > 一、那些年,我遇到的灵魂拷问...我的日常工作嘛,想必和其他从事界面设计相关工作的设计师一样:70%的时间用来构思设计策略和产出设计方案、30%的时间用来和产品团队各种各样的角色打交道:比如需要通过项目展示,让产品决策者买账;或者给开发工程师解释设计细节、跟踪上线后的品控问题。而在这 30%的沟通时间中,与合作小伙伴们的探(撕)讨(逼)设计问题总是不可避免的一个环节。那在这个时候,如何让他们理解问题背景、如何让他们理解你的设计方案、如何让他们“买账”......诸如此类问题是否能高效沟通,显得尤为重要。其实,对于一些比较偏产品向的界面设计问题(比如:为什么支持“批量取消"?为什么有“确认页”?为什么“全屏展示活动图片”?...等流程、功能、信息展示型问题),我们解释起来是比较容易的——我们可以对标着产品经理制定的产品目标,结合数据分析师或用户研究员总结出来的数据或用户事实,即可快速地合理解释自己的设计方案。但是,如果你的小伙伴恰巧是非常严谨认真、刨根问底的人,他们可能会问出一些 非 常 微 妙的问题,让设计师立时无法抓到一个准确的论点或论据展开阐述,往往只能和团队的小伙伴们相顾无言。那这些 非 常 微 妙 的问题具体指的是什么呢?容我举个栗子:类似于以上的问题,想必各位设计师在日常工作中并不罕见。然而我每每回答时,对话会进入一个奇妙的怪圈,be like:“你不觉得这样设计更清晰/工整/美观吗?”“我不觉得啊,我觉得都长得差不多。”“可是这样用户能更快找到交互目标,完成交互任务,有更好的用户体验呀。”“啊?有吗?为啥?所以呢?”“......”所谓“忍一时越想越气,退一步越想越亏”。咱就是说,每次都不知道如何解释、眼睁睁看着设计被“砍”来“砍”去可不行。为了让我自己变成更加“耐撕”的设计师,同时尽可能帮助到遇到类似问题的小伙伴们,我尝试着阅读、思考、总结了一些界面设计的科普知识,并以此来深入浅出地、感同身受地、科学严谨地解释一下设计师那些对于微妙设计细节的坚持,到底是从何而来的。欢迎各位设计师小伙伴给你们身边发出类似灵魂拷问的跨职能同事分享这个科普帖;也欢迎刚出新手村的、从事界面设计相关工作的设计师小伙伴们,把它当作入门级界面设计理(下)论(饭)科普来阅读。1. 呔!灵魂拷问挑战一!对于“界面设计的工作定义”这个问题,我根据自己的理解和体悟,尝试着用更加通俗的方式概括了它的答案:界面设计,不仅仅是埋头把线框图“从无到有、从有到优”地吭哧吭哧画出来就完事儿了,它还包括了解目标用户的特性和需求,了解产品的细节和目标,并根据用户的期望和产品的商业目标,假设出最“两全其美”的方案,并用目标用户能“看得到”“看得懂”“能操作”的界面把这个方案表达出来。对于这个“两全其美”的方案本身,比如有什么功能、流程长什么样子这些问题,相信产品团队的其他角色会贡献一定的想法和决策;而对于让用户能“看得到”“看得懂”“能操作”这个要求,则是界面设计工作中的主要责任和挑战,也是我们花费了大量时间去“纠结”的关键点所在:有人肯定要问:但凡是能用智能电子产品看到你这个界面的人,肯定看得到字、认识字、也知道要点哪儿。为什么说“看得到”“看得懂”“能操作”这三点居然是个“挑战点”呢?——其实,“能做到”不一定意味着“做得好”,实际上人类的知觉和行为能力是十分有限的。关于这个论点,我将用一个例子来让大家深切了解(人类)用户的认知局限性。请仔细阅读下方的视频截图中,黑底白字的字幕给你“布置”的“观察任务”,之后再点击下下方的视频以开始观看:(《The Monkey Business Illusion》 - B 站视频源 点击下方视频直接播放,或复制链接跳转到 B 站观看): .video_pc { width: 100%; height: 585px; } @media (max-width:767px) { .video_pc { height: 50vw; } }当视频无法加载时请刷新页面,或前往PC获得最佳体验。默数白衣服的人传了几次球看完这个视频,相信大家对于人认知的局限性已经有了一定感悟。然而,和“有限”的用户认知相反的是,在实际的产品规划中,(由于不断更新的商业目标)产品的功能和信息的增量却是“无限”的。这对矛盾意味着,要做到“看得到”“看得懂”“能操作”这三点,团队中的设计角色必须斟酌如何正确引导用户在海量信息中,按我们预期的方式和顺序去浏览和操作:而这就是,除了“画界面”——即“把产品经理规划的功能落实在界面中”这个要求之外,界面设计的另一个要求。这也导致了设计师在设计界面的工作中,会反复斟酌一些在跨职能同事眼中显得“无足轻重”的细节了。看到这里,各位看官可能会有进一步的疑问:诚然,“引导用户按商业期望并尽量无痛地操作界面”在上述矛盾点的铺垫下,确实显得十分重要。但是,这难道不该跟“界面结构”“文案”这些更直观的要素具有关联性吗?正确的交互引导和设计师纠结来纠结去的界面细节(比如:元素距离、字体大小、图标元素......等),到底有什么因果关系呢?用一个不那么恰当的例子做类比:程序员在模拟环境下跑代码之前,虽然没有那么确切的证据能证明这段代码一定能跑通且无 bug,但是他们往往会参考以往的经验和网上的案例,用最保险的逻辑和语法至少先码出一段能跑的代码,让它先运行起来再纠错。那么相似地,设计师设计的界面在上线之前,谁也不能保证这个设计一定能达成设计目标——商业目标及用户体验目标,但起码我们可以参考行业公认的“共性设计规律”,以及通过用户调研、数据分析得来的更有针对性的“个性设计规律”,用最自信的方式先设计出一个达到开发和上线标准的界面:而上述所说的“行业公认的共性设计规律”,往往就和那些跨职能容易忽略、但设计师却不停纠结的界面设计细节,息息相关。那么,这些“行业公认的设计规律”是什么?决定了怎么样的设计细节?以下我将挑选最基础的一些案例,用跨职能小伙伴们常见的“灵魂拷问”作为开头,结合理论和应用场景,帮助大家更快地感受和理解。2. 呔!灵魂拷问挑战二!我们来抽象和展开这个问题:为什么我们需要对某些界面模块进行“特别的设计”?需要“特别的设计”的情景是什么?为了回答这个问题,我想首先介绍一个界面设计的基础理论给大家:这个理论其实很好理解,无需再深挖背后的心理或生物学原理啥的。不过值得一提的是,这个理论其实不仅运用在界面设计中,在很多其他的艺术或设计创作领域也很常见,我能快速想到的一个(奇怪的)例子就是,喜剧《唐伯虎点秋香》中唐伯虎初遇秋香时,唐伯虎端详了一下秋香的外貌,对身边的祝枝山说“长得也是一般的好看而已嘛”,然后祝枝山意味深长笑了笑、朝着人群大喊:“美女!”,结果所有华府的女佣都转过了头,唐伯虎惊讶地往后一跳,直呼:“哇~秋香果然是国色天香,超凡出尘!”如果把唐伯虎想象成目标用户(?),把秋香姐想象成我们想重点推荐的功能(??),要想让秋香姐,啊不是,某个功能对用户而言,是引人注目且过目难忘的,我们需要做出强烈的“对比”来凸显——在界面设计中,这个“对比”可能是颜色、尺寸、形状、留白等样式上的各种不一样:让我们再回头看看这个灵魂拷问:诚然,通过“挑选一个合适的展示位置”在现有布局中达到“使模块呈现最好的曝光量、(重复)点击率等表现数据”这个目的是可行的,但是不可否认的是,一个载体界面上最佳的位置是有限的,位置的更改更是对页面其他模块而言会牵一发动全身、对用户而言会产生新的学习成本。一旦我们想尽量维持其他现有功能的布局、或希望除了位置优化之外,穷尽最大所能提升模块的行为表现时,为这些模块做特别的设计优化是必要且合理的。当然,这种“特别的设计优化”中的具体设计细节,也要考虑到此处设计复杂度 v.s.研发周期等“性价比”问题,不能理直气壮一味追求“特别的视觉效果“而掉入“过度设计”的怪圈。3. 呔!灵魂拷问挑战三!让我来进一步抽象这个问题:对于界面中的文字信息,既然可以利用格式(分行、分段)来区分其类别和从属关系,我们为什么还需要进一步给予文字不同的视觉权重呢?在进一步解释其原因之前,让我们先明白另一个关于信息阅读的“规律”:为了更好地理解这句话,让我们将自己代入一个例子来实际体会一下所谓的“通过抓取关键词判断全局内容”是个什么情况,请回答以下问题:回想一下,你在以上例子中收集信息的方式是什么样的?是挨个阅读了第一组和第二组中的所有内容并做出了判断?还是跳跃阅读式提取了和“台灯”更相近的关键字并做出了判断?相信大部分人都更偏向于后者,而后者就是我们所说的“通过抓取关键词判断全局内容”。记得之前在阅读《社会心理学》这本书的时候,我发现在应用层面上,几乎所有的人类行为动机,其背后都有一个较根源的规律:人脑总是倾向于“简化提取信息“和“分散认知压力”。那么,当我们尝试着用这个心理学现象去反观“信息线索”这一规律时,它似乎变得可以推理和解释了:当我们的界面中堆叠了海量信息和视觉元素时,和我们预想的“用户会按顺序依次获取信息并进行脑内加工”不同,用户下意识会为了简化认知过程、分散认知压力,去跳跃式阅读并“采摘”他们认为的关键信息到大脑的“中央处理器”中,进行进一步加工,以便搞清楚“这个页面是什么?”、“我能否找到我需要的东西?”、“我大概能在哪里通过什么后续交互找到它?”...等问题。不知道大家是否曾看过“F 型阅读顺序”这个用户阅读规律,其实它的底层逻辑也同样是“信息线索”。那么让我们回到开头的灵魂拷问:为什么需要给界面上的某些文字进行视觉权重的处理,也就是加黑、加粗、加大、加行距等等?其实答案已经不言而喻了——为了把我们想传递给用户的信息,像喂饭一样“喂”到总是跳跃式阅读、可能会遗漏关键信息的用户的“嘴”中,让他们找到他们想找到的、或者我们想呈现给他们的信息。举两个栗子:4. 呔!灵魂拷问挑战四!用简单的话来复述这个问题,就是:利用额外的动态控件去传递信息,它的必要性是什么?对于这个问题的答案,让我从一张图片开始,为大家展开阐述。如下图所示,请你尝试盯着图片中心的蓝色圆形,并尝试用余光去辨别距离这个圆形由近及远的物体分别是什么:你是否有如下感觉:距离圆形,即我们的视焦点越远的物体,越难以辨别是什么形状?那么请你再尝试盯着下面这张动图的图片中心的圆形,并尝试用余光去辨别最远处那个不停运动的物体是什么:对于这张图片,那个动起来的、距离圆形较远的物体,好像没有静态的时候那么模糊了?以上这两个例子,其实都涉及到一个关于人类视觉的普遍规律:这个规律实际上和我们眼球构造导致的视觉特性有关,如下图所示:人的眼球视觉可分为“主要视觉”和“次要视觉”。其中,“主要视觉”分布在中心区域且范围较小,由“视锥细胞”产生图像,而“视锥细胞”对于光线充足条件下的静态目标的色彩和形状细节都十分敏感,在白昼时是人类主要使用的视觉细胞;“次要视觉”则围绕“主要视觉”分布在其周围且范围较大,由“视杆细胞”产生图像,“视杆细胞”对于亮度和动态十分敏感,是黑夜中在“视锥细胞”失灵时的主要视觉补充方式。其实,不仅是人类,很多其他以捕猎为生的哺乳动物的眼球也有同样的视觉特征。“主要视觉”能帮助捕猎者更好获取在视觉中心的猎物的一举一动,“次要视觉”则能帮助捕猎者快速获取周围环境中潜在的危险或捕猎竞争者的动向变化。这就解释了为什么当你在光线充足的屏幕上,盯着上面那张静态图片中的圆形时,你的“主要视觉”只能支持你看清视觉焦点范围内的很小一圈的事物,比如距离圆形最近的外星人头像;而对于那些距离圆形较远的形状,则因为落在了“次要视觉”中,而随距离变得越来越模糊。那上面这个视觉规律和本环节的灵魂拷问又有着怎样的关系呢?首先我们要明白的一点是,人类只有一双眼睛、一个视觉焦点(动线)。那么,当这唯一的视觉焦点随着我们正在进行的交互,移动到界面中的某个位置时,可能某些比较重要的、距离视觉焦点较远(而坐落在了“次要视觉”区域内)的信息,正在随着交互的进行更新了部分内容,那用户很可能就错过了这个重要信息的更新。那么,设计师能做什么来防止这种情况发生呢?根据上文提到的视觉原理,这里应该有两种思路:1. 把关键信息的静态文案,放置在当前交互(视觉)焦点附近 2. 如果 1.的解决方案在当前界面布局规范中不被允许,那么我们可以利用“视杆细胞对动效敏感“的特性,动态展示关键信息。最后,让我通过总结上文的内容,来快速回答一下本环节的灵魂拷问:当你想强调的信息和当前的交互(视觉)焦点较远的时候,由于视觉的局限性,我们很难感知到其变化。如果这种“不被用户感知”的概率很大、且其造成的体验或商业后果让人难以接受时,将该信息重复强调在焦点附近、或者用动效引起用户的注意,都是必要且合理的设计手段。5. 呔!灵魂拷问挑战五!同样,首先让我尝试转译和展开这个问题:在内容能够完整传递信息的情况下,为什么我们还要增加额外的视觉要素?对于这个问题,和前面的环节相同,让我先引入一个和答案有关的设计规律:单纯看字面的意思或许有些抽象,为了方便大家理解,同样我将用一个实际的例子来让大家亲身感受一下这个规律。如下图,请分别大声朗读出两个组中的所有词汇,朗读时记得尽量快速并保持正确(想挑战更高难度的小伙伴,也可以尝试朗读每个词汇的字体颜色名称):你是否发现自己在识别和朗读第一组内容的时候,速度是快于第二组的?那原因又是什么呢?如果你仔细研究上面两组词汇,就会发现:第一组词汇的字面意思和字体颜色名称是一致的,比如:“粉红色”三个字的字体颜色也是“粉红色”;而第二组的上述两个要素,却是错位的。其实,在这个例子中,(如果你挑战的是朗读词汇本身)字体颜色就是一种“环境刺激物”,当人们对“环境刺激物”和目标识别物本身的信息认知是一致或者相似的时候(正如第一组所展示),就如本规律所说,人的辨识速度会更加快;反之则减慢。接下来,让我再例举一个和界面设计更贴脸的例子,让大家快速感受一下:如上图所示的三组提示,你阅读时长最短的是哪一组?你能最正确地 get 到弹框信息的又是哪一组?想必大多数人的答案都是第三组,因为其提示中的文字和辅助刺激物(颜色、图标)传递的信息是一致的,因而能使人们更快更正确 get 到信息。其实这个例子也体现了界面设计中,最常见的“环境刺激物”是什么——比如:颜色、图标、插图......这种视觉类刺激物;其他一些不常见的“环境刺激物”包括了:声音、震动这些和其他四感相关的刺激物(写到这里突然想到windows系统里,当警告框莫名其妙连续弹出时,那一连串的“噔噔噔噔噔”,就算现在回想都能吓到炸毛的程度...):当然了,选择“环境刺激物”时也不一定非要挑选被文化或普遍认知刻进我们 DNA 的那些元素,诸如:红色=警示、感叹号=有问题......,它也可以来自特定产品领域、甚至完全来自你的产品本身:通过在交互中的不断重复和保持一致,将新的“刺激物+含义”组合刻进用户的潜意识中。比如,在填写密码/验证码等口令类输入的情境下,弹出框的震动会让人甚至都不用看错误提示,就意识到“填写错误”这个信息。这是因为某些聊天和金融类 APP 已经通过不断应用该“环境刺激物”在相应的场景,来让我们下意识把“震动”和“填写错误”联系起来:好的,有点扯远了......让我们回到这个问题。已知人在与界面交互时,注意力是线性的+有信息量上限的,当设计师面临:用户正在最重要的任务或者信息流中,且不应该被打断并转移注意力到次要信息线上。但同时,获取该次要信息对于用户后续的操作决策而言,又是必要的;用户正在主信息流中获取某个信息,但 ta 需要花更少的专注力成本在这个信息上,以便于将注意力“花在刀刃上”。在这两个情况下,用视觉权重适当的、含义一致的“环境刺激物”去辅助呈现对应的信息模块,是合理且有必要的设计手段。这是否给你带来了一些颠覆原来认知的、对界面设计的启示?——有的时候,界面设计上的“多设计”,反而是为了用户“少阅读”。6. 呔!灵魂拷问挑战六!同样,让我转译一下这个问题:在分割界面信息模块上,多样的空白行、多余的分割线,他们存在的意义是什么?在回答这个问题前,同样让我们从一些由实验结果总结而来的“规律”作为前情铺垫:这个规律其实很简单直观,大家可以回想一下自己欣赏各种平面艺术作品时,是否都是按照简单几何形去拆解构图的?或者反过来思考,在阅读过的平面设计构图教程中,是否大多数构图法则也都是以简单几何线/形作为基础的,比如:三角形、圆形、正方形、梯形、对角线、放射线等等...从正反两个方向来看,都有事实印证这个规律的正确性。在界面设计中,由于“传递信息”这个关键目的,带来了“布局的复杂度必须较低”的局限,同时也是考虑到技术投入和实现难度等问题,当设计组件或信息模块时,我们通常会采用的形状仅有方形和圆形:其中,圆形常用于偏视觉的元素(比如:图标,图标按钮等),我们暂且不展开。接下来,让我们聚焦在常应用于控件或文字模块的“方形”上。这时候就不得不引入一个在界面设计领域,大家最熟悉的理论之一——“格式塔”理论了。这里为了让解释更加好理解一些,让我直接选取一些和本环节问题最相关的两个“子理论”来为大家展开阐述。第一个“子理论”是“邻近性原则”:上图其实把这个原则体现得淋漓尽致,我就不再为大家举另外的栗子展开解释了。其实,这个原则就回答了“信息间的空白空间”存在的必要性——你是否还记得前文提到的“信息线索”这个规律?既然人们的界面阅读习惯是“快速扫描”、“跳跃获取信息”,那么,和“文字权重的多样性”类似,“空白空间”往往能让人在扫描信息时,下意识推理出信息结构(即信息的从属、分组关系),从而使得这种“跳跃式获取信息”的行为更加快速和准确。比如:当用户看到一整块被空白分割出来的、较独立的部分时,会下意识去扫描第一行——他们往往会认为那一行是标题。通过这种方式,他们可以了解这个信息模块是关于什么的、有没有仔细阅读的必要......等等关键信息。那么,如果“有层次的空白空间”就能在视觉上帮助分割界面的信息层级了,为什么有时候设计师还会应用分割线/框呢?首先需要从另一个“格式塔”的“子理论”——“同域原则”说起:这个规律说明了“分割线”也同样能帮助信息分组。并且,在设计实践中,“分割线”这种更为强烈的视觉元素,其分割信息的视觉强度是大于“空白空间”的——这意味着在以下两个情况下,分割线是有存在必要的:当在界面中的某层平级元素里,有最最需要重点强调的单个信息组时,需要用分割线/框强调之; 当界面中的某类平级元素,因为内含的子元素太多太杂导致“分无可分”时,需要引入视觉上观感更强烈的分割线/框来强化分组。当然,还有其他例外的情况也会使用到分割线/框,它们和视觉分组无关但和交互引导息息相关,比如:“带边框的信息模块”可用于暗示该模块可点击、且点击都指向同一个目的地页面;“一列带框的信息卡片被屏幕边缘隐藏一部分”,能用于暗示该卡片列是可横向滑动的......等等,这些常见的使用场景相信大家都不陌生,就不展开讨论了。所以总结并回答一下本环节的问题:“空白”的多样性,能帮助用户在扫视界面时,更快理解界面中的信息的分组关系、子母集关系,从而提升当用户跳跃式阅读界面时,其找关键字的准确性和速度;而分割线/框,作为“空白”的补充手段,既能在视觉上强调单个信息模块,又能帮助在层级过多、元素过杂的情况下,让信息的分组显得更清晰。因此,在信息较多、层级较复杂的界面中,设计师合理地利用多种数值的空白间距、分割线/框,是一种能帮助用户在阅读信息时“大脑减负”的常见方式。7. 呔!灵魂拷问挑战七!上述问题中提及的,无论是“菜单”还是“筛选”,本质上都是为目标选项池新增属性维度,并按这些维度分别分组,基于此让用户“按组定位”逐渐找到目标选项的一种交互方式。所以,让我们转译一下本环节的问题:和让用户直接阅读选项信息并决策相比,为什么我们需要通过(多层)分组的方式,让用户决策的过程从“一次性选择到目标”到“通过层层筛选、慢慢锁定目标”?它应该被应用在什么情景中?因为这个问题解释起来也有些复杂,因此,同样地,让我从人类“决策行为”的剖析开始阐述。人的决策行为,本质上分为“感知”和“思维”两个步骤:先“感知”一个可选项、理解它的内容、并将以上内容“存储”在自己的“短时记忆”中,然后接着“感知”下一可选项并同样存储在“短时记忆”中......然后通过“思维”快速判断自己对每个可选项的主观喜好、客观利弊,最后做出决策。从上述的“决策行为”方式中,我们可以看到承上启下的关键点是“把选项储存在‘短时记忆‘中”。说的有点悬乎,举个通俗的栗子来讲就是:当你上班摸鱼,思考中午吃啥的时候,你得先在脑内回忆一下今天食堂的菜谱有啥,才能基于这个信息纠结一小下下,最后决定吃什么。那可能有人又会问:这“短时记忆”又是什么?为什么选项会被存储在“短时记忆”、而不是其他什么什么的记忆里呢?好的,那让我们进一步展开这个话题,来探讨一下“短时记忆”这个概念。让我快速用一张图片来给大家科普一下什么是“短时记忆”,以及它的兄弟“长时记忆”:一般,在我们采集到信息中的关键内容后,它会被首先放入“短时记忆”中,只有当我们不断复习(刺激)该信息到某个临界值,它才会被放入“长时记忆”库中,拥有“长时记忆”的特性:一个事实是:大多数的选择决策往往都是一次性的。这就决定了它们只会存在在“短时记忆”中,并拥有“短时记忆”的局限性——留存时间短,最关键的是,可留存的信息量少。那到底这个“少”又是多么地“少”呢?这时候就不得不提到继“格式塔原则”之后另一个界面设计中最常被提及的定律——“米勒定律”了:那么,基于上面提到的两个关键点(即“记住可选项是决策的关键点”、“能记住的可选项的容量十分有限”),我们可以引出一个和用户决策行为相关的界面设计中的规律——“席克定律”:下面我将举一个栗子,让大家感受一下这个规律将如何作用于我们的决策行为中。假设此时你正准备吃中饭,那么请分别在下面 A-C 组的菜谱中决定你想吃的东西。你可以尝试计时,自己从开始阅读菜谱到最后决定吃什么共用了多久:体验完上述的栗子后,请试着回想一下:是否从 A 到 C 组的决策时长有个非常明显的增长趋势(如果你有一丢丢选择恐惧症,那么这种增长会更加明显)?这就是“席客定律”想告诉我们的规律。那么在设计实操中,如果可选项过多(超过 9 个),且这种决策对用户而言是必要的、不可跳过的,我们怎么减少用户在进行该决策时的思考负荷呢?在本环节的开始,我曾提到过,人类的决策过程分为“感知”和“思维”两个步骤,因此我们的优化方案也可以从分别优化这两个环节入手:优化“感知”的处理负荷,即帮助用户剔除非必要的可选项,可用的手段有自动筛选、自动排序,以及手动筛选框、手动排序等功能;优化“思维”的处理负荷,即将决策的关键因素拆解成不同的维度(组),并将信息多层次地分组放置,形成各种样式的“菜单”,手风琴菜单、下拉菜单、侧边菜单...等等。当然,解决措施有意义的前提是想解决的问题是有意义的,因此我们可以逆推,上述 1.和 2.的解决措施的应用场景为:选项库在做决策的当下,只会存在于用户的“短时记忆”中——毕竟正因为如此,才有了决策能力的局限性,才引发了后续问题和解决思路。那么,到底是哪些具体的应用场景符合上述条件呢?我罗列了一下能想到的场景:动态变化的选项库,比如:商品搜索结果列表、活跃用户列表、最热门的歌曲列表等等;非用户定制的、使用频率较低的选项库,比如:工具类软件的某些功能列表,系统设置选项列表等等。而一旦选项库是静态的、使用频率较高的、用户定制的,在这种情况下,选项库大概率已经坐落在了“长时记忆”的区间中,所谓“自动脑补”。在这种情况下,设计师可以不用考虑优化决策体验的问题。这时候,设计师使用“菜单”或者“筛选框”等控件的考量,更多应该是基于用户的心智模型、竞品的常规处理方式、它本身或其他同界面入口的曝光量影响等问题了。二、灵魂的拷问?灵性的应答!虽然,贯穿本文的始终是一个个“规律”和“理论”,但引用这些“规律”“理论”的本意是为了佐证本文中各种观点的合理性(毕竟“理论”和“规律”都是多次实际实验后总结出来的、在当前情景下最可能发生、最普适的现象),而非真的让大家在实际解决问题的时候,去咬文嚼字般地用似是而非的语言营造自己的权威感。让我们开个脑洞换位思考一下:当你在和程序员交流的时候,他们直接甩出代码开始和你讨论数据结构;当你在和数据分析师交流的时候,他们直接把公式和 XX 定理摆在你面前高谈阔论......在这些情况下,你非但不会觉得他们很专业,反而会一头雾水地当场无语,对吧?推己及人,我建议大家在实际的跨职能沟通中,能够更多以这些“理论”“规律”中较表象、容易理解的信息作为起点,结合实际的问题情景、设计方案去解释和沟通:以上就是基于我在实际工作中跨职能小伙伴们常问我的灵魂拷问,深度研究和思考后总结出的一些理论依据和应用方法,希望对你无论是审视自己的设计作品、还是回答跨职能同事的问题,都有参考价值。最后,感谢大家阅读本文,也欢迎各种点赞评论收藏,栓 Q~欢迎关注作者的微信公众号:「应谋鬼计」本篇来源:优设网原文地址:https://www.uisdc.com/workplace-response-guide
入口 卡片 功能 一、功能入口概述不论是在设计中还是生活中,入口对于我们来说都很重要。比如当你需要进入到一个空间时,你需要知道门的位置并清楚如何打开它。比如下图中左侧的门就非常明显,而右侧的门则需要仔细辨认了。还有的入口即使你知道它存在,但也根本弄不懂它的含义,如下图你能分辨出男女厕所吗:由此可见,在入口设计中保持其清晰与直观是非常重要的。在 B 端页面的设计过程中,我们同样会面临很多入口的设计,比如需要从当前页面下钻或者跳转至其他功能的时候,而这类入口我统称为功能入口。那么我们在面对这类问题时,到底有多少种形式且如何选择呢,本人根据实践以及资料整理出了这篇文章,对 B 端中常见的功能入口都进行了对应的总结和归纳,希望对大家有所帮助。作者往期文章:B端对齐如何设计?我总结了这3种常用场景!B端设计中如何做好对齐设计?阅读文章 > 二、功能入口形式在这里我根据样式和场景将我们常见的各类入口分为以下几类:文字入口、图标入口、卡片入口、自定义入口。那么这些入口的使用场景都有哪些区别呢,我们接着往下看。1. 文字入口文字入口应该是最常用的,也是我们最常见到的。其大量分布于我们的页面之中,对于文字按钮,通常会用以下几种方式:文字变蓝。这是为了和普通的文本形成区分,从表达上直接告知用户当前可点击;文字+图标,比如箭头或者图标。这种形式在很多界面中也会被用到;文字+底色或者描边,这其实就是我们常用的填充按钮或者描边按钮。那么纯文字是否可以作为入口呢,答案是肯定的。纯文字的形式一般存在于固定的组件入口,比如弹窗的取消,以及网站常见的底部导航:在这里我们注意到目前有很多 B 端产品会有这样的细节,对于在当前页面下钻的入口,可以用纯文字表示,对于需要下钻或者跳转页面的入口,会在后面加一个符号的提示按钮,达到提前告知用户页面跳转的目的,表意更明确。这里还请大家思考一个问题,如果你的当前列表承载了多个入口,那么此时你应该如何放置这些功能让用户更好理解呢。这里有两种方式:A.将功能入口以文字的形式直接放出来,列表本身不承载任何入口;B.将列表整体作为一个入口,其余功能以文字的形式作为另一个入口;那么这两种功能到底该如何取舍呢。个人认为,这取决于当前功能的主次级关系,如果当前功能都为平级,那么直接都放出来即可。如果某个功能为主要操作,那么列表本身点击则为进入该功能,其余功能都为辅助。2. 图标入口图标入口的使用频率也很高,比如我们常见的编辑、删除或者设置等,都用了图标按钮来进行传达。但图标按钮在使用时需要注意 2 点:1. 一般对于用户认知度很高的按钮,比如电话、喜欢、关闭等,可以直接用图形表达,用户也能够充分理解其含义。2. 对于用户认知度不高的按钮,我们最好图标配合文字按钮进行说明。最直观的方式是直接图标+文字,比较隐蔽的方式是 hover 图标再进行文字含义的解释。这两种都可以进行使用。举个实际的例子,你可以通过上下两个图片的图标按钮,看你在默认情况下能够识别几个图标的含义:是不是 coding 的图标如果不进行 hover 查看说明基本都不认识,而微博的图标则基本都能够辨识。3. 卡片入口卡片入口则区别于常规的入口形式,卡片入口可以让我们对其内容区域有更加灵活的发挥方式。卡片一共可以分为三种形式:纯卡片、卡片+常驻入口、卡片+隐藏入口。「纯卡片入口」这种形式我们很常见,就是在卡片里面可以简单介绍下该功能的信息,我们可以通过 hover 卡片样式上进行对应变化,用户直接通过点击卡片就可以进入到对应入口。这种卡片形式不用刻意表达点击样式,因为一般卡片在用户视角下都是可以点击的。我们更多的关于则是卡片的表现形式。如果大家对表现形式感兴趣,后续有时间可以整理一波,这里就不再赘述。「卡片+常驻入口」这种形式适合其余入口也比较重要的时候,可以将多入口进行外露。这样便于用户能够一眼发现,缺点是可能整体视觉呈现上不够美观。而卡片本身是否提供入口呢,这其实跟之前文字的思考一样,如果我们本身对某个功能的点击权重较大,你就可以赋予点击整体卡片的功能,否则你可以去掉点击卡片本身的功能。「卡片+隐藏入口」这种设计形式在 B 端中也用得非常多。其既可以达到多入口的功能,也避免整体影响页面的美观性。缺点就是在用户的第一眼呈现上会隐蔽一些,需要用户主动发现。我们可以根据当前产品的业务场景需求,来选择不同的卡片入口形式。4. 自定义入口自定义入口更多是设计师自定义的某类入口,他不限于样式,比如可以是某类异性形状。但此类入口一定要让用户明确其是可以进行点击的。比如你可以通过卡片形式或者加指向性的图标来让用户知道。三、入口的出现场景我们在进行入口设计的过程中,基本会有三种出现场景:常驻类、隐藏类以及场景类。1. 常驻类入口常驻类入口通常是比较重要的,需要用户高频操作的。根据业务的需求场景我们可以选择最重要的功能作为常驻入口外露,比如语雀文档的新建文档、知识库和模板中心则作为高频入口放了出来。2. 隐藏类入口对于很多操作,他的重要程度并不高,且操作较多的情况下,我们会考虑将其功能入口在默认情况下隐藏,用户需要 hover 才能看到功能入口,或者隐藏在...里面:3. 场景类入口这种入口的用法则更为高级,一般当用户需要该功能入口的时候,它就可以主动出现。比如飞书文档当你使用 ctrl+z 撤回操作规定次数后,其会在顶部出现历史记录的入口,并提示你可以直接进入历史文档查看。这种还体现在当你在长文档区域滑动操作指定距离后,其右下角就会出现返回顶部的按钮,来让用户更快地回到顶部。但这种入口场景的建立的前提,一定要在熟知用户操作的前提下进行,才能给用户更好的体验,否则只会带来尴尬的体验。这不由得让我想起了之前微博上线的时间预约功能,其用在新闻大事件的时间预约时就会非常尴尬,比如「你预约明上午 10 点半袭击 FBI 办公室」。好了,本次的入口分享就到这里了,希望对大家有帮助。也是今年的最后一篇了,希望大家新年快乐,明年过得更好~欢迎关注作者微信公众号:「阿东的设计体验馆」本篇来源:优设网原文地址:https://www.uisdc.com/function-entry-design
标题 个字 文字 如果大家喜欢看电影同时注意观察电影海报设计,会发现大量海报标题设计都偏爱错位排版。错位编排是通过对标题文字大小、位置和笔画的调整,打破固定的排版样式,让标题的排版更具个性化,是提升标题编排设计感和美感最简单最实用的设计技巧。本期分享 5 个常用的错位排版方法,学会这些方法你也可以快速设计出个性的标题排版。往期排版干货:为了让你学会「时间」排版,我做了50+案例示范在进行设计时,常常会涉及到“时间”的排版,比如展会日期、演出时间、活动促销时间等。阅读文章 > 此案例,所有文字字号大小一致,文字交错移动位置。第二个字“叉”往右边移动,第三个字“感”则往左偏移,第四个字“染”再往右偏移。每个字移动的距离不一样,这样会形成一定的节奏感。刚开始练习如果对偏移距离掌控不好,建议距离小一些,而且首字和末字字错位不要太大,可以很好地避免文字排版混乱的问题。还可以让字间距紧凑些,甚至可以让一些笔画连起来,整体感会更强。刚开始练习可以固定其中部分字体的大小,小号字和大号字穿插排列,小号字偏移的位置尽量控制在大字号范围内,保持文字组合的整体性。使用错位排版可以打破沉闷的对齐排版,营造文字编排的节奏感,增加标题设计的创意性、设计感和美感。错位编排的方式还有很多,这里只是简单总结 5 个常见的排版方式,希望能够帮助大家打开思路,设计出个性的标题排版。欢迎关注作者的微信公众号:「艺海拾贝Design」本篇来源:优设网原文地址:https://www.uisdc.com/dislocation-layout
干货 素材 情绪 大家新年好! 提前给大家拜个早年!这是 2023 年 1月的第三波干货,对于依然忙于工作、或者寻找素材的同学而言,希望这一波干货能够给你提供帮助!这一次合集中,包含了2个基于人工智能的设计工具,一个是照片生成服务,另一个则是一件生成视频的工具,都相当实用;对于需要做平面设计和视觉设计的同学而言,基于情绪的渐变生成工具、开源 SVG 图标系统和平面设计素材大合集应该能在你日常工作中,帮你节省不少时间精力。当然,在此之前记得看看往期干货中有没有你感兴趣的素材:第二波!2023年1月精选实用设计干货合集大家好,这是 2023 年第二期干货素材合集!阅读文章 > 下面我们具体看看这一期的干货:1、根据心情和情绪生成的渐变色https://gradienmood.posandu.me/色彩是拥有情绪的,但是有情绪的色彩有不一定仅仅只有一种颜色。这个名为 Gradien Mood 的渐变色网站会将不同感觉和渐变色搜集起来,其中有的渐变色甚至拥有极为复杂的情绪,而你需要做的,就是输入你想传递的情绪,然后就能搜到相关的情绪和色彩,包括渐变的 CSS 代码和具体的颜色代码,值得收藏哦。2、250+ 超多平面设计素材合集https://theveller.gumroad.com/l/GraphicDesignResources-byTheVeller/PHLAUNCH这是给平面设计师的终极创意工具包,其中涵盖大量日常平面设计能用得上的素材,包括编辑能用得上的文案模板,图库素材和营销资料,提升展示性的样机和模板,常见的图案和渐变素材,以及深色系设计素材,目前处于限时免费的阶段,立刻下载就对了 !3、针对人物和情侣的 AI 绘图服务https://aiphotos.ai/生成式 AI 正在进行领域细分我是知道的,但是照片和图片生成服务里面居然还细分出针对人物肖像甚至情侣肖像生成的服务,是我没想到的事情。这个名为 AI Photos 服务就是这么顶,它需要获取你(们)的个人照片作为基础,越多越好,然后在此基础上为你生成150张各种风格各种题材的个人/情侣艺术照片。算算日子,距离情人节已经不足一个月了。4、实用性超强的俄罗斯方块设计系统https://new.tetrisly.com/Tetrisly 设计系统是一个精心设计的 UI 库,他们的团队竭尽全力地让每个 UI 控件都是高度可用和易用的,避免存在垃圾组件,并且这些都可以直接输出 React 组件,让开发更加便捷。在设计上,他们创造了一套对比度合理、配色丰富易用的色彩系统,一套像素完美的图标合集,并且带有一套专门的 Figma 插件。5、高质量开源 SVG 矢量图标素材库https://www.svgrepo.com/这套名为 SVG Repo 的素材库包含有超过 46 万个高素质矢量 SVG 矢量图标素材,这些图标的素质过硬,都是成套使用,基本无需修改就可以直接诶用在设计上,而具体的矢量素材文件也都是经过 SVG Repo 压缩优化过。SVG Repo 上的图标素材永远免费,且可以用于商业项目。6、移动端照片光影优化工具 Relighthttps://www.pixerylabs.com/relight如果你想在移动端上拥有堪比摄影工作室级别光影效果照片的话,那么使用 Relight 可能是最好的选择。它可以快速地为你的照片重新打光,而且在预设的光照强度、配色和效果的基础上,进行更加细致的调整,可以弥补很多其他的修图 APP 在这方面的缺陷。7、基于 AI 的智能视频制作工具https://boolvideoinvite.carrd.co/人工智能在视频领域的运用也越来越多了,有从输入命令完成操作,到一键自动完成的工具,AI 的使用方法各不相同。这个名为 Boolv 的智能视频制作工具属于是那种最为简单的,你只需要提供基本的产品图以及产品链接之类的基础内容,他们的 AI 能够在此基础上自动搜集整理信息,并且自动生成漂亮且素质过硬的视频内容。感兴趣的同学可以试试看。本篇来源:优设网原文地址:https://www.uisdc.com/2023-1-design-resources-vol3
封面 红包 挂件 大家好,我是插画师小光Sir~又是一年收红包的好时节,今年微信红包新增了异形红包封面样式,让封面设计有了更广的发挥空间。我也尝试了下,成功上架了3款异形红包。下面就以优设小鸡的兔年红包封面为例,详细地给大家介绍下今年的新规范和制作方法,也帮想做异形微信红包封面的萌新们避坑。关于我:优设百万人气插画师,知名IP商业画师 ,擅长IP形象、潮流插画、分镜设计、爆款漫画,服务过国家体育局、中国体彩、人民日报等知名品牌,曾入选《插画师·宴》中国top100插画师。想看我更多作品可以关注我的小红书@插画师小光sir,微博@插画师小光sir,约稿商务合作加微信:guangsir6666往期回顾:虎年“hú”利!资深插画师手把手教你100%成功上架微信表情包农历虎年越来越近,家中挂起的条条腊肉,街边装饰的串串红灯笼,都让过年的氛围越来越浓,大家想放假的心情是不是也越来越迫不及待了呢?阅读文章 > 一、新版红包封面制作教程新版封面需要我们同时上传封面图、封面挂件及气泡挂件,其中封面图会同时展示在发红包页、红包消息气泡、拆红包页、红包详情页中,气泡挂件、封面挂件会分别展示在红包消息气泡和拆红包页上。可以看出新版比旧版多了“封面挂件”和“气泡挂件”两个版块,也是异形红包的特殊所在。大家做之前一定注意先看下官方的规范标准,尤其需要注意图片的规格要求,不符合的话很容易就审核不通过。点击查看官方的规范标准:https://cover.weixin.qq.com/cgi-bin/mmcover-bin/readtemplate(在左侧目录栏里定位“新版封面”)虽然官方有提供新版红包封面的模板(下载入口在官网“新版封面”小标题旁),但是用PS打开后,发现没有标出官方规范中的明确尺寸数值,双击挂件也只是跳转到了矢量ai文件(吐槽下这次官方给的模板文件有些敷衍),因此下面会详细给大家介绍如何自己设置准确的画面尺寸。“封面挂件”、 "封面图"和“气泡挂件”制作教程① 先新建个1053*1746的画布大小,并按照规格要求做好辅助线:左右两边96px,上342px,下96px(参考线插件GuideGuide下载链接见文末)。② 下载官方模板并打开,将其中的“红包封面”图层组(包含封面挂件、红包遮罩、封面图三个图层)拖进上一步新建的文件中,放大合适比例180%(这是我不断试错得出的大小比例),然后以这个为底版,在相似的范围内绘制设计我们自己的红包内容。我附上了自己创作优设小鸡的加速剪辑视频,同学们可以作为一个参考。 .video_pc { width: 100%; height: 585px; } @media (max-width:767px) { .video_pc { height: 50vw; } }当视频无法加载时请刷新页面,或前往PC获得最佳体验。第③步:绘制好内容后,需要对画面按“挂件”和“封面图”做拆分。动图里显示的是自己画好的内容,包含多个图层,所有图层放在了一个组里。我们先用选框工具选中参考线围起来的中心区域,反选,然后为整个组添加一个蒙版,加上蒙版后的效果图保存为透明底图片,就是我们的「封面挂件」。第④步:双击“封面图素材”智能对象跳转至新窗口,把优设小鸡画面组放进来,替换原有图层做剪切蒙版,Ctrl+S 保存,再回到源文件就可以看到新的“封面图”效果。这种过程需要不断微调保存对位,因为要确保“挂件”和“封面图”2个图层边缘能无缝吻合,不能出现错位。调整好之后,把“封面图”也导出一份图片。(我制作的这份“挂件”和“封面图”的模板文件我打包好放在文末了)第⑤步:“气泡挂件”的制作过程和第①步相似。打开官方的模板里有“聊天气泡”文件组,双击“气泡挂件”智能对象进去就是标准尺寸,我们只需要做好参考线和调整小红包比例(也是180%)就OK啦。我同样也做好了一个模板,大家可以导入自己的文件再导出就是争取的尺寸了,下载链接见文末。二、文件打包上传做好全部素材后,就可以导出并上传查看预览效果了,注意挂件图可能需要压缩。上传证明文件时候如果没有登记版权,就准备好源文件,有条件的提前做一个创作过程的录屏,更容易通过哟!三、个性化设计具体的画面绘制及红包样式大家可以根据自己的喜好调整编辑。在这版优设小鸡兔年红包中,我为气泡红包做了一个特殊的背景,让背景图和气泡挂件完美融合一个整体。制作方法是只需要把做好的气泡背景图转为智能对象,并拖入我制作的气泡挂件的模板文件中即可,然后再微调对位并上传查看效果。今天为大家演示了一个标准的新版封面文件准备流程,希望对想做异形红包的同学们有帮助,文内的提到的自制模板及插件下载链接在文末都有,有需要的小伙伴可以下载,比官方制作模板更加方便哦~如果你也喜欢我的插画风格并想学习更多的插画知识,欢迎关注了解我的微博、小红书及优设大课堂课程,我会经常分享一些插画基础教程。微博:@插画师小光sir我的超人气手绘课程:https://xue.uisdc.com(温馨提示:微信红包新版封面制作模板为@插画师小光sir制作分享,仅供个人学习使用;内含的“优设鸡兔年装扮”仅做教学参考,严禁商业用途的使用及出售。)推荐阅读:如何设计微信红包封面?从零开始教你定制微信红包封面关于我:优设百万人气插画师 / 知名IP商业画师 / Wacom大赛评委 / 擅长IP形象、潮流插画、分镜设计、爆款漫画等。阅读文章 > 优设专访数字艺术家Sixone:AI辅助创作的IP形象是如何登上春晚舞台的?大家好,这里是和你们聊设计的花生~春节将近,前不久 2023 年央视春晚公布了兔年的吉祥物“兔圆圆”,它是春晚 40 年历史上首个通过互联网大数据分析完成初始配方原创的总台春晚吉祥物 IP,形象乖巧可爱,一经发布就受到了很多网友的称赞和喜爱。阅读文章 > 文件名 如何下载使用 文件大小 提取码 下载来源 红包设计素材35Mndmg 点此复制 登录下载 本篇来源:优设网原文地址:https://www.uisdc.com/wechat-red-envelope
宋体 字体 宋体字 宋体字形方正,结构严谨,笔画横平竖直,横划收笔处和笔画转折处带有装饰部分(类似拉丁字体中的“衬线"),有极强的笔画规律性,从而使人在阅读时有一种舒适醒目的感觉。在现代设计中宋体因其良好的适应性,被广泛使用。往期字体干货:9种字体盘点!设计师都要懂的汉字发展简史!中国具有五千年文字历史,文字中所包涵的精髓,值得每一位设计师学习、继承与探究。阅读文章 > 一、宋体的起源和发展1. 雕版宋体字的形成在印刷术发明之前,书要一字一句用手抄写,费时费力。而唐代发明的雕版印刷术,使书籍由手工抄写进入印刷复制时代。现存最早的雕版印刷品是唐代咸通九年的《金刚经》2. 宋朝体到了宋代,雕版印刷迎来黄金时代,但此时的字体也并非我们熟知的“宋体”,而是以唐代大家的楷书字体入板,并且不同地区入板的字体也不同。浙江刊本–《姓解》四川地区 - 《开宝大藏经》3. 明朝体明朝体是中国明代木板印刷中出现的字体,也是现今大众所认知的“宋体”的原型。虽然明朝体逐渐失去宋朝体所特有的风格,但由于易于凋刻,字形便于走刀,能满足当时的印量而得以发扬。《南齐书》 –明朝时期的南京国子监刊本4. 清代宋体字在康熙中期以后逐渐形成清代的风格,此时的宋体字更加成熟、精致。乾隆时期,宋体字大体定型,与现代宋体字基本相同。《学统》清康熙刻本综上所述,我们可以知道宋体字不是宋朝的字体,而是汉字字体中的一种风格类别。而在日本以及港台地区,宋体字也被称为“明朝体”,“宋体”与“明体”本为一物,是由于文化差异所带来的名称上的差异。二、现代宋体如今,为了适应印刷和电子屏显示的需要,宋体又被进行了一番改造。现代型宋体的几何特征更为明显,笔画更为利落冷峻,为了可读性,文字胸线也较大,更加符合现代设计所需要的明快感。以宋体为基础发展出许多新字体,各大字库也开发有各有特点的宋体。包括老宋到新宋,再到仿宋,从用于标题的粗宋、中宋,到用于正文的书宋,成为一个完整的字体系列。笔画较粗的宋体适合用做标题,醒目大方;笔画较细的宋体,拥有很高的阅读性,主要用于正文排版。根据中宫和体饰等特点,可以大致地将宋体分为传统型宋体、中间型宋体、现代型宋体:目前可免费商用的宋体字非常稀缺,推荐 9 款免费商用宋体。三、宋体的使用场景1. 传统、历史传统宋体的笔画结构带有手工雕刻的痕迹,几百年的文化沉淀,加上字体本身的特征,使得宋体用于传统、历史题材的设计中,可以体现出古朴的传统文化感。2. 文化、艺术宋体由于继承了自然书写的痕迹,又具有精致的装饰性美感,运用在文化艺术等题材,具有强烈的人文气息,充满文艺范。3. 典雅、高贵宋体字方正平稳、对称均衡的字体结构,显得端庄典雅,舒展大气。常运用在要体现高端、雍容、典雅、华丽的设计中。4. 女性、优雅宋体在工整中充满人情味,有着很强的韵味感和精致美感,带着几分女性的温柔与优雅气质。所以很多和女性相关的设计都会使用宋体。5. 时尚、前卫现代宋体笔画呈几何化结构,相对于传统宋体的温情,现代宋体更加的冷峻,细腻中透露出时尚前卫的风格,具有时尚感与精致的印象。五、字体搭配推荐案例一使字体搭配协调的一个基本原则就是选择风格相近的字体。使用同一字族里的字体进行搭配,是最简单、安全的搭配方法。所谓字族(font family)即一款字体下的多个子字体,如思源宋体字族从细到粗共有七款字体,风格协调统一。使用中西文组合排版时,西文尽量不要使用中文自带的字体。宋体常与衬线体相搭配使用,因为两种这字体无论在笔画特征,还是气质上都很相似。如本案例使用的是西文字体“Times New Roman”。在编排时需要形成视觉层次,通过字体的大小、粗细、颜色等方式来给版面带来阅读的层次感。案例二搭配不同的字体时,要注意他们之间的包容性,既要有所区别又要统一和谐。书法字笔画变化丰富且非常具有视觉冲击力,通常会搭配同样具有历史文化属性的宋体字形。西文则选择与宋体对应的衬线体,与书法字形搭配。根据书法字的结构和笔势,通过对文字大小、位置的调整,进行编排,让文字看起来更紧密也更有节奏感。案例三在进行时尚类的设计时,可以选择现代型宋体,西文字体则可以搭配几何衬线体。本案例使用方正风雅宋和 Didot 进行搭配,这两款字体简约的几何造型和粗细对比强烈的笔画,细腻中透露着时尚前卫的风格。黑体与宋体的混搭是很常用的一种搭配方式,需要注意的是尺度的把握,适当的对比能够为版面带来更丰富的视觉印象,但对比过度也会产生凌乱感。本案例选择较细黑体进行搭配,字形形成了微妙的对比,较细的黑体还有着高雅、精致的气质,运用在具有女性时尚特征的设计中相得益彰。西文则选择和黑体相对应的无衬线体。编排效果:如果感觉排版太过于规矩,可以尝试加入手写体加强字形对比,打破呆板感,营造更强烈的动感。在进行设计时,不管是中文与中文还是中英文搭配,都是需要经过仔细分析和不断练习,才能达到和谐统一、层次清晰而美观大方的效果。欢迎关注作者的微信公众号:「艺海拾贝Design」本篇来源:优设网原文地址:https://www.uisdc.com/songti-characters
用户 布局 功能 前言随着产品不断迭代,产品功能会逐渐丰富全面,但对于用户来说,是不是齐全的功能就等同于好的体验呢?本文将以“腾讯会议设置布局”交互优化为例,结合《设计心理学 2》的相关理论,分享关于简化复杂任务的设计心得。腾讯往期案例:如何构建科学有效的色彩系统?来看腾讯文档的实战案例!“色彩是我们感知世界的重要媒介,对于信息传达有着重要的作用,能使人们能够更有效的感知设计的意图和内涵,使传达更高效。阅读文章 > 一、为何要“简化”任务一款产品是不是功能越齐全多样就意味着越好的产品体验呢?对于专家用户来说,当然是功能越全面越能满足自己的需求,但对于新手用户来说,全面的功能未必等同最佳的体验,过多操作挤在同一任务中,可能会让用户感到不知所措,难以上手。因此设计师应尽可能帮助用户简化任务,避免用户因为界面复杂而放弃任务。专业类软件的核心用户通常是掌握某项技能的专家用户,他们在使用前,已经有预期需要先系统学习整个软件的操作,因此它们的复杂和全面是符合专家用户要求的。即便如此,近年来,Figma 之类的软件也在持续打磨易用性,降低用户使用门槛。专业图形建模类软件操作界面作为一款面向普通大众、以高效协同为第一初衷的产品,腾讯会议更需要不断简化复杂操作,让大多数用户都能快速上手,流畅地主持或参与一场会议。下面我将结合腾讯会议设置布局的交互优化案例,来分享关于简化复杂任务的一点点心得。会议场景矩阵相比线下会议,线上开会不免缺乏临场感,因此在腾讯会议里,主持人常常需要通过设置布局来让成员关注重要的视频画面。在无特殊需求的普通会议中,官方提供的两种默认布局就能满足常见的会议场景:腾讯会议默认布局实际上,真实的会议场景需求多种多样。例如,企业汇报更关注发言人,而小组讨论则更侧重轻松的沟通,如何在同一个界面里满足不同的诉求成为难点。为此,腾讯会议在默认布局的基础上,推出了“自定义布局”和“会聚模式”功能,来提供更丰富的会议布局选择。丰富的布局模式因概念陌生,且需要设置成员顺序、位置以及画面比例,对于普通用户来说,这两个功能有一定的使用门槛。在该功能推出一段时间后,我们发现:用户普遍找不到设置布局的入口,在具体设置过程中也遇到较多困难,认为设置布局是“高阶”而“复杂”的功能而不愿尝试。要让用户能把布局能力真正用起来,简化布局的设置过程就显得尤为重要。布局操作路径为了探究具体是什么原因让用户觉得功能复杂,我们开展了易用性测试,得出以下几个交互层面的具体问题,包括:1)入口难找;2)操作难理解;3)流程任务多;4)效果无预期。因此简化任务流程是当下急需解决的问题。具体问题二、复杂任务的“简化”原则那么如何才能把任务变得简单呢?依照诺曼的《设计心理学 2—如何管理复杂》一书中所说,系统复杂性的总量是恒定的,想要用户操作变简单,那隐藏在幕后的复杂性就要增加,在管理复杂时,可以从以下角度出发:良好的概念模型易懂的语义符号自动化、模块化的配置鼓励和系统默认组织结构学习的辅助工具如何管理复杂“概念模型”存储在用户脑中,也被叫做心理模型,它能帮助我们快速理解事物运作的背后逻辑。若我们的界面没有准确地传达出概念模型,用户就需要通过不断地摸索和猜测来尝试,最终很有可能因为不理解其含义而失去耐心。设计师应当通过浅显易懂的语义符号,帮助用户构建合适的概念模型,以帮助他们更好地理解产品功能和操作逻辑。像 iphone 的”开锁“提示、微信的”漂流瓶“、深泽直人的 CD 机,都是通过用户生活中熟悉的物理模型,让用户快速联想到熟悉的事物,从而更好地理解接下来需要与产品互动的操作。概念模型案例“自动化”选项和默认配置,则能帮助用户摆脱繁琐的选项和步骤。我们可以基于对场景和用户习惯的了解,提供常见的选择或智能配置。例如在表单设置页内提供默认的模板和样式,能够让用户更轻松地理解产品功能和效果。相比起手动添加内容,可以大大减少理解成本,帮助用户更轻松地完成设置过程。通过“自动化”简化用户操作“组织结构”是指把集中在同一个页面的任务进行结构重组,拆分成易于操作的小步骤,并保证每个模块都简单易学,容易理解。用户在进入一个铺满选项和操作的页面时,通常会不知所措,不知道从哪一部分先开始。或许本身设置的难度并不大,但复杂的设置项也会在心理上给用户带来巨大的压力,从本能上抗拒和排斥。好比完成一场马拉松可以把每 5km 作为一个里程碑去逐个击破,倘若我们能将原本用户觉得困难的大目标拆解成一个个简单的小目标,明确每个步骤应该做什么,并在完成每个步骤后都给予充分的鼓励和反馈,用户就会有持续去完成设置的耐心和动力。拆解关键步骤“学习的辅助工具”是指在合适的时机给予用户有效的帮助指引和提示,对于 Saas 类产品来说,在用户需要的时候及时提供帮助和指导,能给用户充分的安全感,缓解用户操作时的不安和紧张。关于操作的提示,我们不能只是告知用户哪里出错了,更重要的是给出原因并提供解决方案。提前引导而非指责,将能大大提升用户持续操作和探索的信心。另外需要注意的是,用户很可能第一次遇到时未必能记住所有指引的内容,因此对于复杂的操作任务,还需要提供稳定常驻的帮助入口,便于用户二次查阅。辅助学习三、产品“简化”的设计策略有了设计原则的指导,我们的设计目标也会更加清晰。在具体的方案设计层面,我们需要结合设计对象的特点,将理论指导转化成可落地的设计方案。布局设置一般由主持人在会议中统一设置,因此在场景上,具有“设置时间紧张”、“自定义程度高”、“生效范围广”、“角色复杂”等特点。结合前文梳理的设计理论原则及业务场景特点,我们将设计理论转化成了具体可落地的设计策略。设计策略具体包括以下四点:1. 简化入口,及时帮助通过便捷的入口和及时的引导,让功能在合适的时机曝光,保证用户在需要时轻松地找到功能。针对“入口深”这个问题,我们将原本不稳定的入口改为常驻入口,待用户选择布局后再提示相应条件,及时引导用户在使用前先打开摄像头。同时在移动端和应用面板也都增加入口,降低用户寻找的门槛。增加入口另一方面,我们将原本需从客户端跳转到 Web 页面的操作,都简化至客户端内,减少用户跨端操作,避免因为过多的窗口跳转让用户感到迷惑。同时精简了高级功展示,在会议的客户端只保留核心操作,这样用户就不需要在多个页面之间来回跳转,完成设置项后,也可以在会议的客户端立即生效。缩短路径,减少跳转考虑到新手用户并不一定能理解“布局”、“轮询”等功能的作用,我们在页面顶部增加“新手指引”常驻入口,用户可以通过步骤引导图来详细了解每一步操作。对于用户比较陌生的高级功能,也在功能的启用选项旁提供 GIF 动图,帮助用户全面、直观地了解功能。通过新手指引快速学习2. 自动配置,提供模板“系统默认”具体落地到设计方案,即可以根据用户的使用频率,自动设置常用选项,同时提供默认模板,减少用户的决策压力和理解成本。例如,用户在进入设置页时,可能不太理解“布局”、“视图”、“背景图”及“模式”等陌生的概念名词之间的区别,也不知道这些布局样式适用的场景,因此,我们通过提供默认模板和效果示意,帮助用户快速理解概念之间的区别和不同的效果。常见模板及官方背景图同时考虑到自主设置有一定操作门槛,我们把常用的样式增加到默认列表中,用户选中后就可以直接使用(左图,L 布局)。对于座位设置功能,我们也提供了“自动填充”的默认选项,新手用户可直接选择自动排序,快速使用布局功能,而专家用户若有特定的排座诉求,则可以切换到“手动模式”来进行更高级的设置(右图,设置座位)。提供多种模式,满足不同诉求3. 拆解任务,分解流程“简化复杂页面”非常重要的一个方面是重组页面结构,把聚合在一个页面的任务根据先后顺序拆解成不同的步骤,让用户不再迷失于平铺了多个功能的庞大页面。拆解步骤拆解成小步骤后,可以通过增加步骤条导航和引导提示,让用户更明确每个子环节的“小目标”和当前所处的进度阶段。通过导航降低用户心理门槛除了将一个页面拆解成多个步骤,还可以通过收起/隐藏侧边栏目录,让用户更聚焦在某一具体的内容,免除其他元素的干扰,这样用户能更专注于布局画面本身的编辑。4. 效果预览,建立联想新手用户初次设置布局时,可能缺乏安全感,不知道应用范围是自己还是全部成员。为此,在设计客户端的设置流程时,我们提供了“场景示意图”和“效果预览区”,让用户在编辑的过程中也能快捷地联想到应用后的效果,实现所见即所得。除了官方提供的场景图模板,用户还可以根据自己的诉求在编辑器内 DIY 创作自己的场景图。考虑到对于新手用户来说,场景图编辑器的功能有一定使用门槛,在进入编辑器时,我们都会提示用户,可以通过调整模板场景图来快速上手,理解创作后的效果。通过效果图构建联想对于设置了座位、但未开启摄像头的成员,我们通过“铭牌”的概念模型,让用户能够联想到线下会议室里的“座位牌”,从而更好地理解这个座位已被主持人提前预留给了重要的成员。通过概念模型映射,帮助用户理解抽象概念可以看到,无论是场景效果“示意图”还是“名牌”的概念模型,都是通过真实世界里的元素,唤起用户在真实世界的心智,从而帮助用户更快地理解软件界面的功能逻辑。总结与回顾经过持续半年的方案打磨和研发落地,上文提及的改版方案已全部上线,会聚模式和自定义布局的渗透率都有了非常大的提升。通过该项目我们知道,在面对场景复杂多样的产品时,我们需要遵循一些通用的简化设计策略,综合考虑不同用户的认知门槛,尽可能降低上手难度。具体策略包括“简化功能入口”、“提供默认设置”、“拆解复杂流程”、“构建联想概念”等。为用户打造更简易的使用流程,一步步简化用户设置任务的操作,才能从根本上提升用户使用产品的效率。欢迎关注作者微信公众号:「腾讯设计族」本篇来源:优设网原文地址:https://www.uisdc.com/simplify-user-tasks
宋代 画谱 人物 大家好,这里是和你们聊设计花生~这个时间大家放假回家了吗?砂糖橘炫起来了没有?今天为大家推荐一场我最近发现的宝藏线上数字展览《千年调•宋代人物画谱》,它由中央广播电视总台CGTN重磅打造,多角度全面展现了宋代画作中的人物, 网页设计精巧雅致,所含内容专业丰富,让我们足不出户也能沉浸式感受宋代的极致美学。千年调 · 宋代人物画谱线上展直达: https://news.cgtn.com/event/2022/The-Song-Painted/index.html (手机端也适合观看~)《千年调•宋代人物画谱》数字特展是“CGTN艺术推广计划”的第一季,以数字博物馆的形式了打造伴、伊、仕、伶、俚、仙6大主题数字展厅,以中英双语形式全面展现宋代名画中孩童、侍女、文人、艺人、商人和仙道的形象及背后蕴藏的中国式美学。《千年调•宋代人物画谱》6大主题的入口页(手机端)此次线上展共甄选全球 10 余家博物馆的 110 副传世之作,如《清明上河图》、《韩熙载夜宴图》、《听琴图》等,并利用数字技术让画面内容“动起来”,使原本扁平的人物瞬间生动鲜活起来,以“中国方式”展示传递中国宋画所含的技法、构图、器物和思想。网页端的开屏动画以 6 大主题中的“伊”为例,展示的是有关宋代服饰妆容的内容,以配图+短文的形式介绍了宋代妇女的“一年景”簪花风俗、妆容特色及服饰穿着。进入主题后有一个古画动态开花的效果,介绍妆容的时候还有一个“化妆”的互动环节,点击五官的位置可以为画中的人物逐一“上妆”,人物的眼睛也会不时眨动,非常有意思。这样互动小游戏在其他主题中还设置了很多,足见此次策展方的确花了很多心思。作为一场面向世界的特展,《千年调•宋代人物画谱》还为每个主题增加了“入画”和“赏画”两个版块。“入画”是网站特设的艺术评论专栏,邀请了国内外的专业宋画学者、艺术策展人、青年插画师、古画复刻人、古代服饰专家,一人一画对作品进行深入的剖析解读,帮助大家不同角度更深入地了解画作背后所蕴含的历史人文内涵,对宋代文化感兴趣的效果小伙伴不容错过。“赏画”版块是数字典藏区,收录了相关主题的多幅高清宋画珍品,并配有中英双语伴读导览。赏画区使用地图分片(Map Tiles)的 Web Canvas 技术手段,可以最大限度的缩放画作,观察古画的细微之处。线上展的 6 个数字主题厅我都浏览了一遍,网页用了多种技术展示古画的特色细节并实现与观众额互动,整个展看完真的是一种美的享受,非常适合在家闲暇时看看~推荐阅读:看电影学审美!8位值得关注的宝藏电影拉片UP主大家好,这里是和你们聊设计的花生~想必很多学设计或插画的小伙伴听过可以通过看电影来提升审美,学习构图、配色、造型等方面的知识,并获得相应的创作灵感。阅读文章 > 本篇来源:优设网原文地址:https://www.uisdc.com/the-song-painted
红包 封面 品牌 新年好呀新年好呀,祝福大家新年好~(一阵 BGM 响起)每年春节前夕,忙碌的摸鱼人最重要的事情,当然是在各大公众号抢红包封面呀!尤其是奢侈品大牌,相信不少小伙伴们都开了闹钟蹲点吧?今天将给大家分享一番奢侈品品牌红包的美图,同时从品牌定位、调性和设计思维方面来进行延伸介绍。本期分享将由珠宝和箱包两个纬度展开,各自介绍六款红包封面和它们背后的设计巧思。话不多说,我们赶快开始吧!红包教程回顾:如何设计微信红包封面?从零开始教你定制微信红包封面关于我:优设百万人气插画师 / 知名IP商业画师 / Wacom大赛评委 / 擅长IP形象、潮流插画、分镜设计、爆款漫画等。阅读文章 > 珠宝尚美巴黎——卯兔迎春,圆满时刻正如俗话所说:“最高端的食材往往最朴素的烹饪方式。”作为珠宝界的“纯元皇后”,尚美巴黎便是深喑其道。仅用一根金线连笔勾勒出兔子的形象,再配以最经典的 LIENS 系列图案,上方以皇冠 Logo 呼应——来自拿破仑的伉俪约瑟芬皇后,不争不抢,简约而不失简单。JEUX DE LIENS HARMONY 缘系•一生系列 圆•缘主题 珍珠母贝手链将兔子和珠宝用扁平形式勾勒外轮廓,一笔成型。点和线构成面,表达所有元素,结构统一,构图平衡。圆即缘,象征美满与幸福。千言万语化为轻盈隽永的线条,预示着阖家团圆,万事遂心。梵克雅宝——福兔跃春,巧撷红封一只粉妆玉砌的兔子,正徜徉在山水之间。仔细走入这片风光之中,还能看到兔子头戴珠宝,而山林间有一叶扁舟,上方还有点点枝丫,像繁花,像油纸伞,像一切春日里的美好。不用加任何 logo、文字和经典四叶草图案的珠宝,仅仅是这绝美画面,就让众多网友评价它为“2023 最美红包封面”。画面整体为暖色调,采用渐变背景。画风融合了中国传统工笔花鸟画的精美绝伦,又有西方油画透视原理的栩栩如生。而梵克雅宝也是维持着一贯的品牌调性,近来微信推送文均是以清新淡雅的插画为主,点缀以绝美瑰宝,再添几笔小动物赋予其动效,形成独特的世家美学。宝格丽——满怀憧憬,畅叙新春宝格丽今年的设计略显简单,一只简笔画的卡通兔子,背景是由 logo 延伸做成了凹凸有致的效果,类似“老花”图案,点缀以几颗金色圆环。B.ZERO1 项链其实这些图案大有乾坤,它来源自宝格丽经典的 B.ZERO1 系列:从著名的圆形露天剧场——罗马斗兽场汲取灵感,其独特纯粹的螺旋造型,象征着过去、现在和未来的和谐相承。我们所看到的正是它的俯视图,也是项链戒指等瑰宝的侧面。元素的重复和堆砌,篆刻着来自罗马的不羁与大胆。蒂芙尼——瑞兔报喜,福运满满不久之前,蒂芙尼携手全球品牌代言人谷爱凌呈献新春广告大片,此枚红包封面就是由海报衍生而来。广告大片中,谷爱凌携 Tiffany T、HardWear、Lock、Knot 等系列作品出镜,或单独佩戴演绎优雅风姿,或创意混搭展露个性魅力,在蒂芙尼臻美设计的光芒中,迎接充满希冀的耀目新年。其中,Tiffany Lock 系列从古董珍藏库的经典挂锁中撷取灵感,致敬其悠久深厚的品牌历史。这或许是本次 logo 选择了复古花体 logo,而不是品牌传统 logo 的原因。谷爱凌手持蒂芙尼经典首饰盒,饱含美国洗练时尚的独特风格。Tiffany Lock 系列手镯 18K 白金半铺镶钻石不同于其他珠宝品牌,选择了人像海报更能吸引大众的视线,不知道青蛙公主爱凌的美貌有没有让你联想到《蒂芙尼的早餐》里的奥黛丽赫本呢?宝诗龙——焕新自我,蓄「饰」待发作为世界十大珠宝之一的宝诗龙,将宠猫 Wladimir 为灵感来源,用异形动态红包的设计,小猫咪的眼睛一眨一眨,让它更加跃然纸上。Boucheron 宝诗龙的动物寓言于 1866 年诞生于品牌工坊。 品牌工匠以巧手塑造了一系列栩栩如生的传奇动物形象。左:Boucheron 1980 年代珠宝广告;右:Wladimir 黑色蓝宝石戒指,2019 年红包背景的线条又似大门,又似祖母绿切割的图形,源自于宝诗龙 logo 的外轮廓。它的设计是以“芳登广场”的八边形外形和中间的立柱地标为元素,既有旧法式建筑的高雅端庄,又有新巴黎的特立独行。麒麟——新禧贺岁,麒趣开年相较于其他珠宝世家,Qeelin 这个名字或许更为陌生,但你一定见过张曼玉在戛纳所佩戴过的那款“葫芦“饰品。Qeelin 取名自 Qilin,即“麒麟”,它既是代表吉祥的中国神话动物,也是爱的象征。Wulu 18K 玫瑰金钻石及翡翠耳环今年的红包封面是品牌代言人刘诗诗携手的动态封面,视频里她所佩戴的即是最新款 WuluWulu 系列饰品。葫芦向来被视为吉祥的象征,它能带来幸运和财富,据说如果将葫芦挂于自家门前,还能祈求平安,加上形状浑圆,更满足了中国人追求圆满的渴望。麒麟用摩登的线条比例,将十分传统的葫芦包装成现代感十足的珠宝配饰。作为一个地道的中国珠宝品牌,你有什么理由不支持它呢?箱包爱马仕——层出不穷,意想不到爱马仕这个名号常常被人挂在嘴边:XX 里的爱马仕,作为爱马仕本“马”,中国春节自然是不能丢了排面。今年邀请了著名插画师 @废画三千 合作,设计了 4 款插画风红包封面。设计上饱含着插画师一贯的浪漫画风,又结合了爱马仕一些经典款式:猪鼻子、钥匙与锁、马蹄等元素,给予这些原本被叫做“配货”的小物件排面,而爱马仕几款最为经典的 BKC 包包并没有直接出现。在获取方式上也别有不同,常规款 2 枚红包在专属小程序“欢喜跃新年”中抽取,还可以抽取到两款头像挂件和新年贺卡。集齐 6 款福袋后,可打开第三枚隐藏款红包。至于第四款,则更多的面向原有的客群——在爱马仕的购物小程序上订阅获取。小程序“欢喜跃新年”小程序玩法和设计并不多,仅靠可爱的兔子、鲜艳的配色和灵动活泼的配乐就足够吸引眼球。背景色为红色渐变,象征新春气氛。按钮底色则是标志的“爱马仕橙”。点击“新年贺卡”,还有 AR 互动新体验哦!香奈儿——新春时节,寒冬绽放本次香奈儿红包封面共两款,均来自护肤品——香奈儿一号红山茶花系列。两款封面同一画风,都是类似油画棒的笔触,以白色为主色调,红山茶花于白雪皑皑中倔强盛开,象征能量与新生。第一款为兔子在雪地奔跑,通过公众号领取。第二款为兔子停驻,仅限量发放给 VIP 顾客。两款画面通过兔子脚步连接,从奔跑到停驻,连接过去,展望未来。香奈儿官网页面“与香奈儿共度新春”根据香奈儿成衣一贯的调性,并不会过度的推出限定包装,仅是更换丝带、包装纸和配件等。香水与美容品也跟紧脚步,仅在宣发物料上做创意,产品包装本身不会做出太出格的设计。当然,作为时尚风向标,香奈儿的创意只会多不会少,更多的是体现在秀场 T 台上。这或许也是“小香风”经久不衰的原因之一,毕竟一看到黑色菱格、5 号数字、双 C logo 和粗花呢料,仿佛就能嗅到来自香榭舍利大街的奢靡香气。路易威登——联名不断,新潮旧浪作为定制箱包起家的“销量冠军”,LV 则更为妇孺皆知。比起高高在上的爱马仕香奈儿,LV 拥有一些奢侈品“入门款”——在奢侈品中相对“平价”的款式。与往年不同的是,今年的红包封面没有选择加入 LV 最经典的老花图案、棋盘格元素和吉祥物 Vivienne,而是直接选取了兔年限定系列的设计。在获取方式上,也更为倾向原有的客群——通过销售人员向VIC(稳定而有一定消费力的客户)定向、限量发放。普通用户可通过小程序拼图游戏互动获取抽奖码。PRECIOUS RABBIT 70 方巾打开 LV 官网首页,很难找到兔年限定的产品,取而代之的是 10 年后再次与波点女王草间弥生的合作。在全国各大商圈,圣诞限定的 LEGO 合作橱窗已不见踪影,而略带魔性的波点限定快闪装置正在如火如荼的进行着。用一篇文章,帮你读懂日本艺术家草间弥生众所周知的日本著名当代艺术家草间弥生,精神病患者、波普艺术家、时尚女王、前卫艺术家,以高色彩对比度的圆点创作、具有繁殖特色的艺术作品和无限的空间立体感而闻名于当代艺术界。阅读文章 > 草间弥生的手绘波点、金属波点、无限波点和迷幻花朵,致敬艺术、开拓精神和手工技艺。正所谓“甲之蜜糖,乙之砒霜”,这次红包设计虽没有花费更多心力,但 LV 成功把草间弥生的名字再次推向大众视野,这又何尝不是一种宣发上的成功。迪奥——灵兔秘境 邂逅礼运以高端定制时装闻名的迪奥,今年也给兔子“高定”了两款红包封面。第一款用手绘的方式,描绘了瑞兔在花丛中的美丽倩影,两只毛茸茸的耳朵冲出画面外,显得更为活泼生机。第二款则是中规中矩,中间是兔头剪影,背景是迪奥经典标志性的老花图案。logo 也是“高定”——来自男装DIOR BY ERL 限定联名系列。DIOR TRIBALES 耳环同 LV 一样,今年的迪奥除了其中一款以老花为背景外,品牌象征的五角星、罗盘、星座、蜜蜂等元素并没有出现。而美妆线的新春包装,则是照搬之前的圣诞限定,仅将底色深蓝色改为红色。部分产品推出的新款限量豹纹包装,似乎更适合虎年的气氛。获取方式上,是通过小程序 AR 扫描兔形图案获取。在线下指定精品店,有机会收获新春限定礼盒。古驰——大展宏兔,前兔无量崇尚极繁美学的古驰,今年推出了两款动态红包封面。设计上选择了当下流行的 2.5D 矢量插画,兔子跳跃在不同的砖块上,随着砖块的翻转,兔子也跳跃起舞。品牌标志的大写字母 G 作为图案装饰,巧妙融合在画面中。作为一张动态红包封面,巧妙利用 2.5D 的视觉落差,仿佛可以听到唰唰的翻转特效音。配色上有两款,红色款和红金相间款。虽没有出现标志性的老花、蜜蜂和红绿配色,但这样复古又繁复的设计,的确很符合古驰的风格。古驰官网定制心意卡界面本次红包的设计来自古驰兔年限定包装,也作为图案制成新年购物赠品环保帆布袋,原设计是土黄、米白和深灰色。同样也是刚结束圣诞限定的星空包装,设计师选择了省时省力的方式,利用色彩搭配,无缝连接了新年“新”配色。华伦天奴——快乐「兔」击,元气新年知名成衣品牌华伦天奴今年携手知名艺术家张权,带来联名红包封面。红包设计是非常标准的居中式构图,将蓝兔子 KARORO 的形象放在正中间,上方是 logo 联名。蓝兔子手中环抱的是 ROSSO 红新春 V 标志系列托特包。ROSSO 红 V 标志小号托特包22 年阿亚那刮起的粉色飓风几乎席卷了整个时尚圈,余音绕梁,经久不衰。华伦天奴用他独到的设计和色彩 #Valentino Pink PP,将粉色做出了洒脱不羁,做出了高傲矜贵,做出了各大品牌纷纷效仿的粉色新浪潮。这一次,华伦天奴用色彩美学交融东方文化,用一抹经典红与 V 标志印花,致敬传统,对话当下,悦启新春盛景。红色作为华伦天奴的品牌色,“代表了生命、血、死亡。热情和爱,是哀伤和忧郁的最佳药物,也是我设计的衣服系列中最为畅销的颜色。”新的一年到来,提醒着我们更不该忘记华伦天奴真正的品牌色——红色,同时也期待他能重新定义不同色彩所掀起的滔天巨浪。写在最后不同的品牌有着不同的调性,正如不同设计师有着不同风格。有些品牌选择了迎合时节,精心制作了春节限定。有些品牌则热爱联名款。还有些品牌并不随波逐流,只在自己的赛道上勇往直前。但他们都有一个共同的特点:不是突出产品本身,就是突出品牌定位。让人在万千红包封面中,一眼就能牢牢锁定眼球,明白所谓“品牌的价值”。古人说:“观一叶而知秋,道不远人即为此。”仅仅透过红包封面这样小小一隅,也能品味到奢侈品背后百年历史的醇香。它们被时代的浪潮裹挟着,经历过战争,也拥抱过玫瑰。芬芳馥郁,渊远流长。看了这么多,是不是蠢蠢欲动也想自己设计起来了呢?你更钟意哪一款红包封面呢,欢迎在评论区探讨哦~如何设计微信红包封面?从零开始教你定制微信红包封面关于我:优设百万人气插画师 / 知名IP商业画师 / Wacom大赛评委 / 擅长IP形象、潮流插画、分镜设计、爆款漫画等。阅读文章 > 最新微信异形红包封面怎么做?资深插画师5步教你搞定!大家好,我是插画师小光Sir~又是一年收红包的好时节,今年微信红包新增了异形红包封面样式,让封面设计有了更广的发挥空间。阅读文章 > 作者 OS:本期红包封面设计分享仅为个人想法,排名不分先后。没有分享到的大牌,多半是作者没有抢到,或是不如其他品牌典型。配图均来自官方网站与公众号。如有不足,欢迎指教。两个系列六款红包,双喜临门六六大顺。祝各位新年发大财!本篇来源:优设网原文地址:https://www.uisdc.com/luxury-brand-red-envelope-cover-design
收藏 收藏夹 用户 几乎所有 C 端产品中都会有收藏功能,也是为用户提供对喜欢的内容进行个性化保存、分类和管理的空间。同时也方便用户再次消费某个内容时,减少再次记忆和查找的成本。比如我喜欢做菜,但是年纪大了记性不好,每次做一道菜我都会打开我的某音收藏夹里找到视频教程。更多收藏夹设计教程:从“去我的收藏夹吃灰”聊起,如何从产品角度解决信息过载问题?有了互联网以后,大家都会发现信息的获取越来越方便,但同时也会发现,信息过载的问题更加严重。阅读文章 > 一、收藏夹要解决用户什么问题两个关键词:1.管理 2.分类管理,就是我们所说的增删改查。“增”,我们需要在用户浏览信息时给该信息提供收藏功能,这里要注意的是收藏信息的颗粒度,什么信息可以收藏,一段话?一篇文章?一个用户发布的完整内容?还是一张图片?产品对收藏最小单位的定义要明确,因为会影响到对收藏内容的分类。例如微信可收藏的最小单位很多,有链接(包含文章)、文件、图片/视频、音乐、语音、聊天记录、笔记、位置,而像饿了么只能关注店铺,对任何菜品、用户评论等等都无法进行收藏。B站你可以收藏视频、漫画、商品,但不能是他人的动态。删没什么好说的,再来说一下改和查。因为他俩会涉及到收藏的流程。我们知道不同产品的收藏流程是不同的,例如马蜂窝、闲鱼等产品,用户收藏内容后只给出收藏成功的 toast/提示栏提示,并告知收藏到了哪里;而腾讯视频、抖音、携程则是当用户进行收藏后除了给出成功提示还会给出收藏列表的入口;最后,像知乎、豆瓣在点击收藏后直接给出滑出操作框让用户选择收藏夹或创建收藏夹以及是否要转发。二、3 种流程的区别前两种我认为区别并不大,是否要在提示框里给用户进入收藏列表的入口,更多还是取决于产品是否想让用户离开这个场景,还是让用户继续浏览。之前我们提到过闭环,但是闭环一般针对任务而言,但是收藏严格来说不算是“任务”,而是用户的一种“行为”,感知起来区别还是很大的,因为任务是有明确目标的,比如给用户安排一个任务,让他对某个商品进行分类收藏,那么用户会根据这个分类收藏的目标去进行操作,任务结束后给用户相关的引导和出口。但是在用户自然的浏览场景中,对内容的收藏并没有具体目标,所以要不要给用户在点击收藏后引导进入收藏列表要具体情况具体分析。其次是知乎、豆瓣,在用户点击收藏后给予是否要创建收藏夹的功能,相比于前两种,对信息内容的管理,更加明显了。首先为什么他们和前两种不同呢,像知乎用户是有 KOL 效应的,个人的收藏夹可以公开,他人可以查看他人的收藏夹,有点类似于花瓣的画板,同时对于这类知识、内容类的应用,对于分类的要求和需求更高更多,本身知识的维度就很多,颗粒度很小,所以在用户进行收藏行为时主动提醒用户可以创建收藏夹。那淘宝是怎么做的,它在用户收藏的时候也给出一个菜单,用户可以选择收入到某个收藏夹,也可以默认不放入,还可以去创建并放入,这就是更个性化了。但是咱们说前两种没有给在收藏时给创建功能的就不个性化了吗?也不是,个性化也要根据产品定位和用户需求来的,比如马蜂窝的一些机票车票、旅游产品,做一个收藏夹创建,好像没必要,因为可收藏的类型不多,个性化标签也不明显,显然是没必要的。腾讯视频、闲鱼显然也是。那我们再来聊一个细节。知乎在点击收藏某个回答的时候,页面会唤起收藏模块,让用户选择你要收藏到哪里,但这里的体验不是很好,因为用户想要收藏某个内容必须先选择收藏夹,如果不选择则无法收藏成功?无论你当前是否创建了收藏夹,都必须选择或点击完成,如果有创建过,那就需要经历:1. 点击收藏图标 2. 点击要收入的收藏夹 3. 点击完成,如果没有创建过那么默认会创建一个收藏夹。而淘宝则不是,无论你是否创建收藏夹,只要点击收藏图表那就已经收藏成功,在这个前提下,你可以选择是否要收入到某个收藏夹还是新创建一个。所以知乎、豆瓣的收藏单位大多以回答、帖子为主,这样的内容系统无法帮助生成标签,所以需要用户自己创建分类,在收藏时给予创建功能是合理的,但我认为知乎这样的设计还是不够人性化,但是站在业务角度看,就是想引导用户去创建分类,也是能理解的,虽然在体验和效率上并不是最优。创建、分类、搜索都是帮助用户再次进入收藏空间时能够更好的查找想要的内容。同时不同产品会有不同的筛选标签,比如微信阅读,收藏其实就是书架,哦,应该说,书架就是收藏。筛选维度分为:更新、进度、购买、分类。所以我们在设计收藏功能的时候,要根据用户的筛选场景和内容来制定合理的筛选维度。三、收藏和点赞还有加入购物车的区别收藏的属性就是收纳、管理和分类,但是和点赞、购物车不同,点赞意味着认同,具有社交属性,同时也为了帮助产品记录用户个偏好用作研究,而收藏则是用户想对该内容进行收集,比如我正在准备一个辩论赛,我抽了一个反方观点,虽然我本身并不喜欢这个观点,但是为了准备辩论的素材和题目我会对这个内容进行收藏,但不会点赞,虽然收藏大部分时候也有对内容的认可,但不完全是。所以收藏更多的是用户个人对信息的单方面管理,点赞则一个即时互动。收藏和购物车也是一样的,购物车承载的是更多消费、商品营销的表达、算价以及凑单活动,购物车和直接消费强关联,而收藏夹多关注与对商品的存储管理、搜索查找,虽然也有一部分需求重合,但用处、和场景还是有很大区别的。最后,总结一下,设计收藏夹时,我们首先得根据产品定位和用户需求以及内容的维度来选择好收藏夹的颗粒度或最小单位,其次,根据业务或用户需求设定好收藏夹的收藏逻辑和流程,最后,做好用户对收藏内容的查找以及分类筛选的体验。欢迎关注作者的微信公众号:「应谋鬼计」本篇来源:优设网原文地址:https://www.uisdc.com/collect-design
黑体 字体 个字 “黑体”结构清晰、简洁有力的字形风格能使版面显得庄重醒目并富有现代感。无论是识别性、适用面、视觉效果都非常好。本期推荐 13 款免费商用黑体,前 6 款为各大品牌开发的黑体字型,后 7 款是在传统黑体上进行设计改造,形成各有特点的黑体变体。还有优设自研的超人气字体:「优设标题黑」官网下载!「优设标题黑」请从优设官网下载,我们会将最新字体版本更新在此,大家记得收藏本页面。阅读文章 > Adobe 和 Google 共同开发的免费黑体。字体设计优雅,显示效果优秀,可以满足不同场景下的文字显示需求。由于字体是开源且免费的,用户还有权修改它,以此衍生出了大量基于思源黑体改造的字体。阿里巴巴普惠体字形瘦长,视觉重心略高,字体内外都透露出一股年轻挺拔的姿态。包含 5 个字重,针对不同字重的使用场景,对细节做了区别化处理。其中 L/R/M 较细的字体更适用于长文阅读,而 B/H 两款较粗的字体更适用于标题场景。奉行简洁真实,去除装饰,特征鲜明但又低调,并针对移动端进行了像素级优化,具有现代感和未来感。包含 5 个字重。MiSans 为小米品牌字体,笔型平直有力,设计简约,减少视觉负担,更有利于屏幕显示。MiSans 字重齐全,层级清晰,共有 10 个字重。华为 HarmonyOS 鸿蒙操作系统全新定制的系统默认字体,鸿蒙字体设计上聚焦于功能性、普适性,是一款多语言的无级可变字体。首款支持字重、中宫双重无级可变的荣耀品牌定制字体。采用现代简约的黑体风格,不同笔画部件之间的位置关系清晰明确,字体精美舒适。江城斜黑体可以看做思源黑体斜体版,字形倾斜 12 度,具有力量感,速度感。保留了原字体 7 个字重,满足多种场景使用。江城律动黑字体向上倾斜 5 度,具有上下律动感,自带活动促销 BGM,天生适用于活动、促销等广告语。欢迎关注作者的微信公众号:「艺海拾贝Design」 文件名 如何下载使用 文件大小 提取码 下载来源 免费商用黑体370.2MB8866 点此复制 登录下载 本篇来源:优设网原文地址:https://www.uisdc.com/free-font
设计师 需求方 国内 从去年开始关注腾讯 CDC 每年一度的设计人才调研报告。2022 调研报告的全称是《2022 年互联网新兴设计人才白皮书》,样本来自腾讯 CDC 公众号、站酷和卷叔填填圈的自有样本库,样本量总计约 7000 人,招聘数据来自脉脉人才智库,看起来还是具备较高说服力的。正好最近也看到了 UX tools 的《2022 Design Tools Survey》,这份报告有很多设计媒体都做了中文版的翻译,但 UX tools 的调研对象是海外设计师群体。所以我把其中部分内容结合腾讯 CDC 的报告进行了对比,觉得有意思的点还挺多的,这里列举 5 点,跟大家分享。关于这份报告的中文版:从1000多篇文章中,总结出 2023 UX设计行业趋势报告编者按:相比于其他的具体的趋势报告,来自 UXdesign.cc 的这篇报告更像是一篇针对 2022 年的反思和总结。阅读文章 > 2022 年设计岗位招聘需求量少的可怜设计职能由专业细分向着综合性职能演变对比海外设计师的从业年龄,国内设计师“太年轻”设计师与需求方的关注点不一致国内体验设计软件生态与海外差异较大,国产软件仍有较大空间第 1 点:2022 年设计岗位招聘需求量少的可怜腾讯 CDC 关于这一页的描述是“今年市场对新兴设计岗位招聘需求有所下降”。“有所下降”这个说法有点太过温和了,对比 2020、2021、2022 三年的设计招聘数据,设计岗位的招聘需求不仅仅是有所下降那么简单,2022 年简直是非常惨淡的一年。需求量连去年的一半都不到。第 2 点:设计职能由专业细分向着综合性职能演变这一页特别有意思,注意看近三年来游戏设计、交互设计、UX 设计与用户研究的热度趋势。更细分的交互设计、用户研究岗位在变少,相反的,产品体验设计这种综合设计职能在变多。实际上现在同时具备 UI 设计、交互设计、用户研究等综合能力的产品设计师与 UX 设计师在人才市场上非常少。但企业都在招聘这样的人,这个现象一方面反映了设计职能的综合性发展,另一方面也反映了企业管理者在理性地控制人员成本。第 3 点:对比海外设计师的从业年龄,国内设计师“太年轻”对比 UX tools 做的问卷调研,海外与国内的设计师在工作年限上的差异非常巨大。工作 10 年及以上(不含 10 年)的设计师占比约 30%,而国内 10 年以上(含 10 年)的设计师仅占 10%。不知道各位怎么理解这个巨大的差异,我觉得这是国内设计领域仍然非常不成熟的表现。如果大部分设计师做不到 10 年就不干了,设计深耕也就无从谈起,没人进行专业深耕,所以这个领域也很难有什么进步和明显的发展。那么为什么国内是这样的情况呢?可能并不是因为我们国人设计师没长性,而是国内的设计岗位需求决定的。一方面设计领域没有长期深耕人才,另一方面企业用人方几乎不能接受工作 10 年以上的设计师。只有少数高阶职位才会写 10 年以上。一个人从本科毕业参加工作 22 岁,到法定退休年龄(男性 60 岁、女性 50 岁)还有大约 30-40 年的时间。工作 15 年/20 年以上的设计师将何去何从呢?最近两年在人力资源行业,我看到大量的 35 岁以上和 40 岁以上的设计师仍在招聘平台上求职、找工作。我看到他们的简历和自我介绍,仍能感觉到他们对设计抱有热情。但现实情况是需要设计师的用人单位在同样薪资条件、工作能力接近的情况下往往更加青睐年轻的那个。这样的环境久而久之,年龄偏大的设计师过了 35 岁之后,就可能会觉得跟周围的年轻设计师对比显得有点格格不入,从而选择转行。海外设计师的情况与国内截然不同。他们不光有大龄的设计师,还有大龄的程序员和产品经理。大家都不会觉得年龄有什么问题,也不会觉得年龄大了在求职的时候就是减分项了。再比如我们看设计领域的知识沉淀。国内设计领域的写作者整体也都比海外的作者年轻,工作 5 年、7 年就出来自立门户开班授课的人也很多。大家写的内容和讲的内容也都集中在设计入门和设计基础,比如讲用户体验地图“是什么”的人挺多的,但接下来用户体验地图与用户画像之间的关系、用户体验地图的实际工作价值探讨、用户体验地图在不同行业不同类型的产品应该如何应用等等下一步的问题,似乎很少能见到有人可以写出来、讲出来。为什么呢?我觉得跟从业时间有很大关系。第 4 点:设计师与需求方的关注点不一致从调研数据表现上来看,设计需求方(这里指的是日常工作中有设计需求的产品、研发、市场、运营、行政等多类岗位职能)最关注的三个方面是创造力、合作沟通和责任心,而设计师对于自身的设计工作最关注的三个方面是设计成果呈现、逻辑思考和创造力。设计师觉得最重要的肯定是要进行高质量进行设计交付,设计产出的表达和呈现优秀。而我们的需求方觉得设计师应该更有责任心、应该更加注重协作和沟通。在创造力这方面,双方似乎非常有共识。并且我们的需求方把创造力放在第一位,从这个数据中你看到了什么?我看到了我们的需求方对设计师的尊重和对设计价值的无限期待。虽然他们不是每次都讲,也不会把创造力、创新写到自己的需求文档里,但是他们一直以来都在期待设计师可以给到他们眼前一亮的东西,给他们带来惊喜感的东西。我觉得,创造力和洞察力是设计师工作的内核,也是最难的部分,值得奋斗终身的部分。第 5 点:国内体验设计软件生态与海外差异较大,国产软件仍有较大空间近年来,sketch 在海外的使用量急剧下滑,同时伴随着 figma 一统天下。而在国内 sketch 仍是最主流 UX 设计工具,因为今年 figma 对中国市场的放弃动作,我所在的团队目前仍在使用 sketch+蓝湖来完成日常工作,有点无奈。PS:CDC 的研究数据显示 UX 设计使用最多的是 Photoshop,还有人在用 PS 做 UI 界面吗?我猜这个问题原文问的可能是你在用哪些设计工具,而不是问你最常用哪些设计工具。腾讯 CDC 报告中的软件 NPS 调研结果特别有说服力,Figma 一如既往的高分。我听过蓝湖公司的 Mastergo 团队为猎聘 XID 做的讲解,感觉在性能和工具体验上已经没什么问题,可以满足日常的 UX 设计协作使用了。如果要对比Figma,我觉得最大的差异不是技术层面和产品层面的问题,而是设计文化和设计社区层面的问题。Figma 是先进设计理念的代表,并且有基于设计工具发展起来的成熟的设计社区。这一点大家都比不了,Adobe XD 不也认怂了嘛。欢迎关注作者微信公众号:「柴林的设计笔记」本篇来源:优设网原文地址:https://www.uisdc.com/design-report-interpretation
素材 网站 高质量 大家好,这里是你们聊设计的花生。今天为大推荐一个包含超多字体和矢量设计素材的网站Creative Fabrica,不仅免费而且质量都非常高。往期回顾:4500张!免扣复古插图素材网站「Free Vintage illustrations」大家好,我是和你们聊设计的花生~在上周给大家推荐的 9 个高质量的免扣素材网站中,有一个高质量的复古插画网站 Heritage Library,里面有 270 套复古插图素材可以免费商用,不知道大家有没有收藏用起来呢?阅读文章 > Creative Fabrica网站直达:https://www.creativefabrica.com/freebies/Creative Fabrica 是一家国外的综合性设计素材销售平台,为设计师或手工艺者提供各种类型的高质量素材。网站的本身是付费平台,但是其中有一个“Freebies”版块,原本收费的素材在这里可以限时免费下载并用于商业设计,目前收录了10万多项免费资源,且会每日更新。“Freebies”里主要收录了6种类型的素材,包括字体、SVG素材、图案、刺绣图形和教程,其中前3种的素材质量最高,数量也非常大。字体区目前有3700多种资源可供下载,风格主要以手写英文花体为主,风格各异,在logo、设计或海报banner的设计中都可以用到。“Freebies”内的字体资源(部分)SVG素材和图案里则是各种各样的装饰性素材,如排版好的手写文字组、可无缝拼接的图案花纹、纸质纹理、装饰边框、可爱的动物或植物插图贴纸、样机模板等,能看得人眼花。很多素材都是成堆打包下载的,简直是天降的羊毛随便薅。“Freebies”内的素材(部分)Creative Fabrica 可以直接打开,免费素材下载没有次数或数量限制,但部分素材会限时,过了时间就恢复原价,所以大家看到喜欢的素材记得马上下载。下载素材之前主要用邮箱注册然后登录,点击卡片进入详情页后可以看到素材的授权类型、文件格式、尺寸大小等信息,点击绿色的“Download For Free”按钮即可下载素材。Creative Fabrica 对所有的免费素材都附上了商业许可证明,但是规定在 Basic POD 的范围内,我查了一下大概包含以下的意思:免费素材可以用于商业用途的设计,但用户要确保对这些设计进行修改,使其最终效果与原始设计有明显区分。比如下载一个SVG格式的插画素材后,你可以修改它的颜色、增删它的部分元素、添加背景装饰、或与其他素材混用叠用,但不能原样照搬使用;免费下载的字体必须用作其他设计中的一部分,不能直接将字体本身出售获利;不能直接用网站内下载的多个素材拼合做成“新”作品,必须要使用者本身对其进行明显的修改;不能将下载的免费素材直接分享到其他类似的设计平台上,也不能直接分享给其他任何人。每次下载的商用许可证只适用于下载者本人,自己下载自己随便用,但不能帮别人下载,也不要让别人帮忙下载。总结一下,Basic POD就是下载的免费素材只能作为设计中作品中的一部分,需要设计者本人的进行显著修改;免费素材的商用许可证只对本人有效,不能将原素材上传到其他平台或者分享给别人。更详细的介绍大家可以看官方发布的说明:Basic POD 概念解释:Print on Demand licenses: an overview - Creative Fabrica以上就是今天为大家推荐的综合性素材网站Creative Fabrica,里面有大量免费可商用的设计素材,包括字体、矢量图形、纹理、模板、无缝图案、贴纸等,但需要在Basic POD 范围内使用。如果你喜欢本期推荐的话记得点赞收藏,也可以转发给身边有需要朋友 。有关于本文或者设计的疑问,可以在评论区提出,我会第一时间为大家解答 ~推荐阅读:免费可商用!90000+高质量矢量素材网站SVG Silh大家好,我是和你们聊设计的花生~今天为大家推荐一个免费开源的素材网站 SVG Silh,上面有非常多高质量的剪影及写实线条风的素材,而且提供 SVG 的下载格式,方便我们在设计中进行再次编辑,一起来看看吧~「网站直达」 https://svgsilh.com/ ,网站首页看起来比阅读文章 > 超全整理!9个设计师必备的高质量图案背景素材网站大家好,这里是和你们聊设计的花生~之前为大家推荐过5个纹理材质网站和5个科技感背景网站,今天继续为大家推荐9个高质量几何背景图案素材网站,它们包含了上千种丰富的图案样式,可以用作海报、网页、包装、PPT、壁纸设计等多个方面,下载便捷且都是免费可商用,一起来看看吧~1)more.阅读文章 > 本篇来源:优设网原文地址:https://www.uisdc.com/creative-fabrica
字体 笔画 圆润 圆体给予人圆润亲切的感觉,显得温润柔和、新颖活泼。本期推荐 12 款圆体或类圆体,非常适合运用在可爱活泼、轻松休闲、需要体现亲和力的设计中。往期回顾:视觉设计师来收!免费商用字体推荐:黑体篇(13款已打包)“黑体”结构清晰、简洁有力的字形风格能使版面显得庄重醒目并富有现代感。阅读文章 > 未来圆是由思源黑体所衍生的未来荧黑制作的圆角化产物。对简体中文的支持也十分良好,基本上不会存在缺字的问题,并且有 6 个字重,十分贴心。优设好身体是一款亲和力、现代感极强的标题字体。它以圆体字型为基础,通过瘦高的字面、偏向几何的曲线,让整宽字体富有亲和力和时尚感。优设好身体开放下载!优设网出品的第二套免费可商用字体2020年元旦前一天,我们发布了第一套免费可商用字体《优设标题黑》,点此下载:字体一经发布便收获了无数好评,从人民日报、观察者网等官方媒体,到说唱新时代、青春有你等娱乐综艺,以及快手、网易云、QQ音乐等大众App,应用案例随处可见。阅读文章 > 该字笔划的每一个直角,都被处理成了半径为 4pt 的圆角,笔划角度尽量为垂直角度。字体部首的右下角均为 45缺角,提高了字体视觉中心。字体古朴优美,中宫紧凑,视觉阅读极具层次感。字字俊秀且呈现古雅之风,以精心设计赋予了汉字全新美感!笔画采用等粗几何线条,轻盈舒展,简洁雅致,笔画转角曲直结合,柔中带刚,曲线流畅行云流水,温婉柔美。共有三个字重。采用外圆内方的圆角处理方式,以 7做倾斜,弯钩笔画的弧度向上,让整款字体年轻富有活力,并对不同笔划的字体进行了简洁处理,既保证了笔划多的字能简洁不拥挤,又维持了笔划少的字体完整性。横竖笔形粗细视觉相等,在字形设计上采用 1:1.4 的比例(白银比例),更能体现出低调内敛的东方之美。有着时尚、年轻、女性化气质。具有美术字风格的窄斜体中文字体。字体参考了 80 年代手绘美术字,字身窄长、字面瘦高,在人文观感和几何特征之间寻找视觉平衡。「康康体」是一款萌系可爱手写风格中文字体,字库共 2623 个汉字和字符,能够满足日常设计使用。笔画随性自由和多变,采用了略带弧度的笔画,线条圆润,显得轻松惬意,自然舒展。仓耳舒圆体的笔形一端较粗一端较细,自然过渡,圆润饱满,端庄中带有几分慵懒,轻松愉悦,字形轮廓整体统一。家族字体包含 5 个字重。具有手写的风格及圆润的笔画, 让这款字体看起来很可爱,字体每个笔画的粗细相同,两端圆润饱满,横画略偏斜,日字不封口,同时保有可读性及趣味性。欢迎关注作者的微信公众号:「艺海拾贝Design」 文件名 如何下载使用 文件大小 提取码 下载来源 免费商用圆体87.1MB8866 点此复制 登录下载 本篇来源:优设网原文地址:https://www.uisdc.com/free-font-2
对象 板块 思维方式 有一个所有设计师都懂,但所有发布设计需求的人都不懂或者假装不懂的事实——同一个项目中,花的时间精力越多,做出来的设计效果就越好。这个道理看起来浅显易懂,但总有那么些情况下,有人又要你做出高质量设计,又不给你时间。而大部分情况下,我们不得不经常面对这个看似无解的矛盾,这便引发了一个思考:应该舍弃质量,还是放弃效率呢?提高效率工具:这5款工具,让设计师工作效率提升 200%!(十二)大家好,这里是和你们聊设计的花生~今天为大家带来设计师效率工具第 12 期,本期推荐的 5 个神器分别是: 免费好用!阅读文章 > 在思考这个问题的时候,引出了另一个更本源的问题:质量和效率是否难以共存?直觉上来说,是的。鱼和熊掌不可兼得,工作中真的很难协调这个平衡,总得有所取舍。但工作之外呢?将目光跳出设计领域,是否会有意外收获呢?一、目光跳出设计领域的思考我们先来里认识两个设计中不太容易接触到的概念:「面向过程」与「面向对象」这是来自编程过程中的两个截然不同的思维方式,一般用来总结不同编程语言的运行逻辑,但我们不是程序员,对这个问题不做深究,只聊聊这两个概念各自背后的思维方式中,是否包含有解决质量与效率之间取舍问题的解法。二、两种概念的认知什么是「面向过程」,我们将其简化为一个日常生活中的琐事来理解:你要洗衣服。于是,你烧制了草木灰,熬制了羊油,将两者混合,以古法制作出手工肥皂,随后钻井,打水,刨木,做盆,最终成功的洗干净了衣服,这就是极致的「面向过程」的思维方式,所有的一切从头开始,完全定制,充满仪式感的同时,也繁琐的有些过分。相信大部分人不会选择这样的方式来完成「洗干净衣服」这一目的。那什么是「面向对象」呢?通常来说,将衣服脱下丢进洗衣机拿出干净的衣服,才是身为现代人的我们更常运用的方式,而这就是典型的「面向对象」的思维方式。三、进一步了解何为「对象」那么问题来了,什么是「对象」,想必大家也都意识到了:洗衣机,以及一切包含完整闭环功能的事物。「面向对象」的思维方式里最重要的一点,就是合理的运用拥有各种完整功能的「对象」来解决问题,衣服脏了找洗衣机,肚子饿了找外卖,头发长了找理发店,屋子乱了找 58。看到这里,想必大家对这两种思维方式的优劣就一目了然了,「面向过程」的每一步都完全透明可控,在保证充分定制化的同时得到最优的质量,但相应的,需要付出极多的成本。而「面向对象」,则通过不同「对象」自有的一套流程来提供标准化的解决方案,在保证足够的完成质量的同时,最大化的提升了效率。那么在设计中,「面向过程」和「面向对象」这两种思维方式是否能有所帮助?又是否存在最优解呢?四、质量与效率间如何选择首先,在面对不同的设计目的时,合理的遵循某种思维方式肯定是有所帮助的,因为我们时刻在面临不同的挑战,有的来自用户,有的出自运营,时而背负工期,时而直面自身。身为设计师,我们应该认真对待自己的每一份作品,保证作品的精致与美观,是进行商业展示时,对第一时间看到我们作品的用户的负责,同时也是对身为艺术工作者的自己的尊重。因此,在条件许可的情况下,尽可能的使用「面向过程」的思维方式来完成作品,能更有效的提高作品素质,充分定制画面中的每一个细节,也是锻炼自身各类技能的有效手段。但在商业需求中求生的我们,更多的时间里要肩负着运营提出的海量需求,又不得不在很短的时间内高质高效的完成工作,这种时候,「面向对象」的思维主导的工作方式就显得很重要了。所以,这两种思维方式并无最优解,根据不同的情况灵活运用才是最合理的选择。那么我们该如何选择呢?先别急着思考如何选择,因为这是一个伪命题。五、「对象」与「过程」的关系你们应该也都注意到了,在「面向对象」的过程中,所有的「对象」,都不是凭空产生的,它们的背后也许是一台精密的名牌家电,也许是一间忙碌的专业厨房。而无论是机器的诞生,还是珍馐的烹饪,都灌注了从业者们大量的心血,他们在创造「对象」的过程中,同样经历了大量「面向过程」的工作流程,最终得以让我们可以跳过「对象」的创造过程,只享受「对象」带来的便利结果。「面向对象」的流程中,离不开「面向过程」的前期铺垫,因此这二者之间不是对立的选择,而是互补的嵌套,先精益求精的产出「对象」,再便捷高效的使用「对象」。还记的开头我提出的问题么:质量与效率之间是否难以共存?现在看来,结论已经显而易见,「面向过程」=质量,「面向对象」=效率,我们无需舍弃任意一方,想要让其共存,我们所需要做的只是合理的安排其完成顺序。六、如何归类「对象」接下来回归到具体的工作中,什么样的工作可以归类为「对象」呢?首先我们需要明确:什么工作需要花费很多精力才能保证高质量,同时也必须保证高质量。我们以本次 58 到家春运活动为例,首先引入眼帘的是就是我们的活动主视觉板块,紧接其后的是利益点板块,和 SKU 板块。作为年度级别的重点活动,整体页面保证高质量是必要项,而其中最花费精力的,就是主视觉与 SKU 板块。主视觉元素繁多,画面构成复杂的同时,既要保证品牌的一贯风格,又要契合当前时间节点的活动氛围。而 SKU 板块则数量庞大,整体板块在保证品牌的一致性与排版美观的同时,又要兼顾增强用户品牌感知的功能。目前来看,好像并没有什么好的方式将这两个板块的工作流整理成一个「对象」,从而提高效率。但别忘了,我们这两个板块是从春运活动这一根项目中拆分出来的二级项目,而这些项目,仍可以进一步拆分成更多的三级子项。先从主视觉讲起,一个完整的视觉画面,包含了,背景,人物,道具三大类,为了保持品牌的视觉风格一致,不同活动中的主视觉同样的人物形象需要反复出现,道具风格也要保持统一,这二者成为了「对象」化的理想突破口。接下来是 SKU 板块,这个板块的工作流中最繁琐的部分在于数量庞大的同时,需要保证排版规范美观,且风格统一,每次制作都需要把不同的文字与图片规范在相同的范围与版式中,注意到关键词了么?相同的范围与版式,我们何不把排版规范收拢成为「对象」呢?进一步拆分后,满足「对象」化条件的三级项目已经十分清晰了,那如何进行「对象」化呢?七、如何进行「对象」化我们的答案是 faceteam,3D 组件库,与自动 SKU 模板。Faceteam 是一个由众多设计师共同建立并不断完善的人物模型库,其中包含着海量的人物模型,涵盖了 58 到家各类设计任务中需要出现的各色人物形象,且所有模型都有着统一规格的骨骼绑定流程与动作控制器。每当项目中出现了需要的人物形象,只需要在 faceteam 中选择相应的模型下载,就可以方便的根据场景进行动作调节,高效的完成场景中的人物填充。3D 组件库采用与 faceteam 相同的逻辑搭建而成,里面包含了大量高频会使用到的日常道具,并根据其属性进行了详细分类,通过将其整理后制作为 C4D 预设文件,可以方便的通过软件自带的预设库进行一键调用,极大的简化了场景中道具的搭建流程。自动 SKU 模板是一个将重复性工作交由机器完成的算法,我们提前将板块中的排版进行规范,制定好大板块中每个小板块的尺寸与排放,和小版块中每个元素的尺寸与位置,如此一来,不同活动中需要更改不同的图片与文字时,其替换工作甚至不需要设计师的参与,运营端就可自行完成。至此,最耗费时间精力的子项目都已「对象」化,通过对不同「对象」的灵活应用,其合并而成的根项目整体效率便有了飞跃式提升。原来,质量与效率可以共存,只不过需要选择合理的思维方式而已。写在最后《思维力》中有句话如是说:“选择大于努力”,我们不能放弃身为艺术工作者的理想与坚持,但有时候,选择正确的方式,选择一条捷径,并不意味着偷懒与取巧,反而让我们可以有更多的精力来精进自身,有更多的余地来对抗滚滚的时代洪流。与君共勉。欢迎关注「58UXD」的微信公众号:本篇来源:优设网原文地址:https://www.uisdc.com/balance-efficiency-and-quality