构图 画面 主体 前言配图是我们平时在设计工作中经常用到的,一个好的配图很多时候会直接影响到一个作品的好坏,图片本身也是一种视觉语言,通过学习跨领域的知识可以帮助我们提升自身所处的领域设计能力,本篇文章和大家讨论构图和景别知识,通过对这些知识的了解判断如何选择一个好的配图以及怎么应用好配图,大多数设计师选择配图时都是凭着主观意识在选择配图,你所选择的配图很大程度会受到你的主观意识的影响,这些主观意识来源于自身审美、文化、环境等因素的,因此在我们的主观意识基础上,应该具备一定的客观依据来帮助我们更好的选择合适的配图。构图与景别知识在摄影、绘画、影视中应用很多,但很多设计师容易忽视这些知识,这些知识看似是摄影、绘画、影视等行业的知识与设计好像没太大关系,这些知识也是很有必要学习的的理论知识,对构图景别的理解很大程度会影响你能否把握好设计画面中的配图,配图本身也是一种视觉语言,提升构图和景别知识对设计师整体综合实力提升是有帮助的,当你做三维和插画等设计时同样也会用到这些知识,了解这些知识会让你以客观依据的角度,运用和判断设计中配图的好与坏。相关干货:一图胜千言!如何给作品配图?图形在版面构成中,占有很大的比重,也有这样一说:一幅图片胜于千字。阅读文章 > 一、关于构图目前来看几乎所有的艺术或商业作品,无论是摄影、绘画、CG 等都离不开画面的构图与结构,你甚至能在很多绘画大师的的经典作品中看到他们作品中也使用了构图理论,合理的构图作品,给观众美的视觉享受和与众不同的情感体验,同时提升画面表现,关于构图的知识很宽泛,构图方式方法也非常多,有的作品中可能包含多种构图形式,这里给大家大致介绍一些常见的构图知识,目的是抛砖引玉让大家意识到良好的构图能平衡画面同时,传达出更清晰明确的图像信息。1. 中心构图中心构图是将画面主体放置在画面的视觉中心,让主体成为整个画面的视觉焦点,通过周围环境氛围烘托画面主体,这种构图形式聚焦主体,能更好的凸显画面主体。2. 一点透视一点透视构图有较强的空间感和纵深感,画面的元素会向中心聚焦,会把观众的视觉引导向画面中心,比较适合表现画面空间感。3. 黄金法则黄金法则构图遵循古希腊学者毕达哥拉斯的黄金分割比例进行构图,也就是我们常说的 0.618:1,黄金法则构图有采用像三分法那样井字构图,还有采用黄金螺旋的构图方式,构图时将主题放置在黄金比例焦点或线上。4. 对角线构图对角线构图中主体在画面的对角线位置排列,对角线构图视觉冲击强,具有动感和不稳定性,使画面更有趣味和视觉张力。5. 三角形构图主体在画面中呈三角形状,正三角形构图画面更具稳定性,反之倒三角形构图会使画面有紧张感和不稳定性。6. 字母形构图字母形构图画面呈现字母形态,不同的字母构图会给观众带来不同的视觉感受,S 形构图是一种比较常见的构图形式,S 形构图迂回延伸使画面产生优美、雅致、韵律感。7. 引导线构图引导性构图利用画面中有形或无形的线,引导观众的视觉聚焦到画面的重点,引线不一定是一条线,它是一种具有引导性的东西,光影、道路、河流等都可以做为引导线,引导性构图视觉表现强,引导观众视线突出主体。8. 三分构图三分构图是最常用的构图方法,结构由两条竖线和两条横线构成,形成一个井字,也叫井字构图法,在三分构图中主体通常放置在四个交点上或线条上,三分法是比较常见的构图形式,可以在很多摄影和绘画作品中看到。9. 对称构图对称构图是根据对称轴,使画面形成的对称的构图形式,比较常见的对称构图上下对称、左右对称,对称构图具有平衡性、稳定性、均衡性。10. 水平线构图水平线构图也是比较常见的一种构图,水平线构图通常表现宽广的场景,地平线、海面、湖面等主题,水平线构图给人宽阔、稳定、平静、舒适的感觉,水平线构图主要是是采用横画幅来表现。11. 垂直线构图垂直线构图中主体呈现为垂直的线条,垂直线构图给人高耸、庄严、挺拔的感觉,具有较强的视觉张力,垂直线构图常采用竖画幅来表现。12. 十字形构图十字形构图是水平线和垂直线的组合,十字形构图画面会给人平稳、安全、严肃、神秘的感觉。13. 夸张透视夸张透视会以比较特别和夸张的的视角表现画面和主体,使画面整体都具有强大的视觉张力和冲击力。14. 虚实对比虚实对比通过主体和背景的间的虚与实对比,从而突出画面主体,虚实对比使画面更有层次和空间感。15. 明暗对比明暗对比通常以暗衬托明,在视觉感受中越暗感觉离我们越远,越明亮感觉离我们越近,明暗对比对比可以使画面更有立体感,层次感等,通过画面中的明暗对比形成的强烈反差,可以凸显画面中主体,引导观众视线到主体上。16. 色彩对比色彩对比中包含三个要素色相对比、纯度对比、明度对比,同时根据色环中的色相变化,还可以分为同类色对比、邻近色对比、对比色对比、互补色对比,色相角度变化越大对比月强烈,通过色彩对比可以突出画面重点、丰富画面、提升画面层次,背景色彩与主体色彩形成对比,能凸显画面主体。17. 奇数原则奇数原则画面通常是一个、三个或五个主体,通常不超过七个,超过七个时观众会将其视为一个整体,当画面中为主体为奇数时,在视觉上会比偶数更和谐、更美观。18. 视觉引导视觉引导通过画面内容引导用户视觉,视觉引导形式有很多种,人物或动物直视、运动方向、肢体语言等,都可以引导用户在观看画面时的视线运动。19. 大小对比通过大小对比使主体与周围元素形成差异化的视觉冲突,同时大小对比中的次要元素还可以作为比例参考,突出主体的大小,强烈的视觉落差增强版面节奏。二、关于景别裁剪图片为不同景别的图片对板式设计也有很大影响,不同景别的图片传达的视觉语言也是不同的,哪怕是图片朝向的位置都值得我们仔细思考,在配图时我们要思考通过图片传达什么视觉信息给观众,所以在我们做设计时,要想清楚当前页面要传达什么样的信息从而采用什么样的景别。1. 大远景大远景通常表现广阔气势宏伟的场景,大远景的空间感非常强,强化景物与环境的关系,主体相对较小与场景形成强烈的大小对比。2. 远景远景营造主体与场景的关系,通过画面场景叙述主体和场景的关系,远景具有较强的空间感,具有开阔的画面场景。3. 全景全景通过场景来体现主体的处境,利用人物和场景的关系强化主题,全景中主体会被强化形成明显的内容中心,从而弱化场景。4. 中景中景表现主要表现人物膝盖以上,在中景中人物在画面中的占比更大更为突出,人物会被强化,同时弱化场景。5. 近景近景主要表现人物胸部以上,画面中人物或主体会占有主导地位,强调人物的情感特征,通过细微人物的动作、肢体语言、表情等表现画面主题。6. 特写特写主要表现人物肩部以上或主体的细微部分,主体被放大,场景弱化到难以分辨,强调主体的情感、心理或产品的工艺结构等。7. 大特写大特写会将主题放的更大,展现主体的局部细节,大特写具有强调和突出主体细节特征的作用,具有极强的视觉效果。写在最后配图知识是设计师在平时工作或设计练习中必备知识,很多时候我们在选择配图时完全是凭感觉在选,图片也是一种视觉语言,作品整体质量也会受到配图的影响,本次配图知识分享希望能帮助大家在之后选择设计配图时,在主观意识判断的基础上有一个客观的依据,写这篇文章的同时,我也正好根据文章大纲做了一套版式练习作为文章配图,最后给大家分享几个高质量的图片网站:免费可商用!超过十万张相片下载的图库「Rgbstock」Rgbstock 是一个 100% 免费图库,收录超过 100,000 张相片素材让使用者免费下载!阅读文章 > 可自由商用!收录超过100万张图片素材的免费图库PikWizard本文要介绍的「PikWizard」是一家可免费图库,收录超过 100 万张高质量、适用于商业用途的免费图片素材,可安全用于商业用途,无需标示原作者或出处来源。阅读文章 > 本篇来源:优设网原文地址:https://www.uisdc.com/patching
业务 设计师 课程 金三银四招聘季悄悄开始了。虽然去年到今年经历了一波裁员潮,但是依然有一波在 C 端做UI和产品的同学,逆流而上跳槽到 B 端领域做设计和产品了。虽然他们各自的业务和行业差异极大,但是不知道你有没有发现,他们都有个共同点,那就是收入都还相当不错。的确,对于 UI/UX 设计师而言,回老家考公是一种上岸方式,而 C 端转战 B 端也是一种上岸的方式。只是,相比于更容易理解、更贴近普遍认知的 C 端设计,加入更多行业背景、业务需求和专业流程的 B 端有着更高的门槛。为此,我们专门准备了这套 B 端设计入门私房课,给正在筹备上岸的你:课程原价169元,限时新课价直减40元,仅需129元!移动端扫码学习,网页端右戳学习 https://wei.xet.tech/s/2pMvzq入坑B端设计的绝佳时机!也许很多同学几年前就听说过「用友」和「金蝶」这些针对企业的商用软件开发企业,但是随着如今各行各业信息化建设,不止是传统的金融、仓储、物流等领域需要更加深入定制化的设计,而且教育、地产、医疗、销售乃至其他更加细分的行业,大都需要有自己的信息化管理系统。大概是在 8 年前,为了区别于针对个人用户(Customer)的 UI/UX 设计,有人提出了 B 端设计,也就是针对企业和商用(Business)的系统化 UI/UX 设计,彼时 B 端设计开始被提出,8年时间蔓延至今已呈大势之象。如今大量的企业有着自己独特的渠道、和同行截然不同的流程,在管理模式上也大相径庭 ,这也使得很多企业迫切需要贴合自身业务特征的定制化的 B 端设计。即便针对自身体系定制一套数字化系统成本高昂,但是效率提升后带来的利润增长更为可观,这使得 B 端设计成为了设计领域新的增长点,「钱」景无限!但是相应的,B 端设计所牵涉的「业务属性」,也对设计师提出了新的要求。设计师天然就是内容和信息的消费者,从事 C 端设计时,可以相对容易地代入身份,针对性地进行设计,而 B 端设计所涉及的行业不同,所牵涉到的专业性的用户身份也千差万别,业务流程可能完全找不到合适的参考,这一方面要求设计师需要通过专业的手段和方法来调研和梳理,摸清业务,另一方面也需要设计师有更加系统化的思维和方法,来为整个业务创建流程,搭建平台,统筹管理,而这也是 B 端设计不同于 C 端的重难点。这个时候,你就需要针对性地系统化学习了。事半功倍的学习路径很有必要!如果你是设计小白或者已经是 C 端的 UI/UX 设计师,那么这套课程可以带你以正确的姿势开始学习 B 端设计,如同你刚刚转到 B 端设计,这套课程同样可以带你重新收束 B 端设计的思维和知识点。课程会分为 3 个阶段:第一阶段带你着重了解 B 端设计的特征,概念和流程,明确方向第二阶段教你 B 端设计前期分析的方法和要点,深入业务第三阶段结合实际案例,循序渐进地教授 B 端设计执行的技巧下面是详细的大纲:课程原价169元,限时新课价直减40元,仅需129元!移动端扫码学习,网页端右戳学习 https://wei.xet.tech/s/2pMvzq用项目喂出来的课程讲师小煜老师是实实在在在大厂里,用一个个大型 B 端项目喂出来的资深设计师,从电商到金融,从 IM 到直播,踩过不同行业的坑,处理过多种截然不同的业态,面对千差万别的用户需求,在B端行业差异里逐步摸索出成系统的设计策略,又在共通的方法中,总结出应对不同需求的独特技巧,这套录播课程,就是她过往 B 端项目的总结。10 年前 C 端的 UI 设计当初是机会无限的蓝海,如今的人满为患,内卷严重。但是业务形态千差万别的 B 端需求旺盛,行业垂直且细分,需要懂得用户体验、具备系统思维、敢于探索需求、能够梳理业务的 B 端设计师,而任何一个细分行业的发展,起码都是按照十年来进行计算的。下一个十年,你可以从 B 端开始。课程原价169元,限时新课价直减40元,仅需129元!移动端扫码学习,网页端右戳学习 https://wei.xet.tech/s/2pMvzq本篇来源:优设网原文地址:https://www.uisdc.com/business-design-course
图标 设计师 图形 小图标是界面的核心组成部分,承载着信息传递的重要作用。作为页面的最小展示单位,图标设计也是最能考验设计师基本功的一项工作。不过设计师熟练掌握的,往往只是单个图标的风格化绘制方法。在这个过程中,设计师更关注图标的美感和细节,而忽略了从宏观的角度考量「图标表达的准确性」、「不同图标之间的关联」、以及如何帮助业务「快速实现客制化功能」。更多图标干货:如何拥有一个画图标的好习惯?我总结了这 8 个方面!对于 UI 设计师来说,图标设计的能力至关重要,也是提升感官体验的重要方向。阅读文章 > 一、金融行业图标设计常见问题问题 1:金融行业功能服务名词抽象,设计师难以精准表达金融行业内,许多功能服务名词抽象,如工资理财、活期产品、定期产品,都没有可直接映射的物理形态,行业内也没有统一标准,设计师只能凭借经验绘制,难以精准表达。问题 2:关键词图形化的结果不一致,增加了客户的认知难度参与图标绘制的设计师分散在各业务线,每个人都依据自己的经验自由发挥,导致对同一关键词呈现的图形化结果不一致,增加了客户的认知难度。问题 3:工作模式割裂,难以满足千人千面的灵活配置及高端客制化需求以往的工作模式,由不同的设计师提供切图给不同的运营经理进行配置,这样多对多的模式导致沟通成本高,还经常出现配置重复、错误等问题。接下来,我们将从平安银行业务的特性出发,以金刚区双色图标为例,还原一个图标从诞生到前端展示的全过程,分享建设图标生态过程中的实践经验:2 个方法和 1 个工具「联想筛选法」「图标元素周期表」和「图标管理平台」。二、联想筛选法平安银行 App 是一款金融领域的 C 端产品,覆盖了账户、理财、贷款、保险和生活等多项综合服务,拥有着 400+丰富的功能服务类型,同时,这些功能服务的名称相较于其他行业都更为抽象。比如大家经常能接触到的电商平台,购物车、服饰、鞋包等,都有非常明确的物理形态,设计师只需要据此进行风格化处理,即可形成一个能精准表达相应含义的图标。但是在金融领域,许多功能对应的则是虚拟服务。如理财或保险,是没有物理形态的,且业内没有形成统一的标准,在用户层面还没有建立起统一的认知。那么如何绘制易理解、易识别的图标,是对设计师的一个考验。这里向大家介绍一种相对普适的方法「联想筛选法」,主要分为三步:第一步 了解服务特点图标代表某一功能服务的入口,起到帮助用户定位识别的作用,所以我们只有充分了解这项服务的实际含义与特点,才能真正绘制好一个图标。以保险为例,设计师首先需要思考保险是什么?它是给消费者提供保障与补偿,帮助消费者抵御风险的系列产品。因此我们在绘制图标时,需要充分体现“保障”和“抵御风险”的作用。第二步 映射联想了解服务特点后,设计师可进行简单的图形发散,即根据这项服务的实际含义和特点,联想相关的图形。比如下雨天撑起的一把伞、起到保护作用的盾牌、保险箱或一把锁,再比如在保险服务过程中用户通常接触到的一些实体物件,如保单。不过有一些功能服务,我们很难联想到合适的图形,这时就可以用文字来表达,如表达「税」的图形。一般情况下,我们通过从物理映射到相关性联想,再到文字表达这样的方法,逐步发散思维,就可以找出一些能表达其含义的图形。第三步 查重筛选拓展出几个图形后,如何筛选出最合适的那个呢?我们可以通过「契合度」「专属性」和「拓展性」这 3 个原则进行筛选,需要注意的是,这三个原则是有先后顺序的。① 契合度主要是分析哪个图形与该功能定义更为贴切。对于保险来说,契合度排序为:盾牌>保单 >雨伞>锁。② 专属性我们需要从全局的角度看这些图形,是否被其他功能占用。比如在业内,「锁」更多代表的是密码,而「保单」的样式和普通的账单难以区分,故可以排除。③ 拓展性需要考虑该图形在造型上是否容易和其他图形组合。因为功能服务往往不是单独存在的,通常会与一些相关功能共用图形(在第 2 个小节我们会分析拓展性案例)。通过以上 3 个步骤,就可以快速选择出最契合功能服务的图形。如最适合保险的图形是「盾牌」,它既高度契合保险服务本身的含义,同时也具有一定的专属性和拓展性。三、图标元素周期表通过上述联想筛选的方法,可以帮助设计师快速选择出与功能服务契合度较高的图形。不过绘制图标的设计师,是分散在各业务线,其中不乏新入职的同学。大家对方法的理解和掌握程度不一,导致不同的设计师,对同一关键词图形化的结果不一致,具体表现如下:同类型的功能服务,设计师使用完全不同的图形化元素,从而难以建立长期统一的客户认知。例如,同时用皇冠和钻石代表「权益」相关功能。即使图形元素一致,在风格化绘制的过程中,也会出现多种不同的样式。例如常用的人民币符号,在前期上线时就出现了七八种样式。为了解决上述问题,我们尝试沉淀出一套实现标准图形规范的快捷方式「图标元素周期表」:经过分析,现有功能服务名称多为 A+B 的组合结构。还是以保险为例,相关的功能有保险商城、保险服务、保险测评、跨境保险等,这类组合功能我们可以将其拆分为:保险+服务、保险+商城、跨境+保险这样的形式,进行图标设计。这样我们只要组合两个独立元素,就可以得到表意精确的组合图标,组合的形式可以是内外或左右结构:独立元素可以分为主图形和辅图形,经过组件化,最终形成「图标元素周期表」。业务设计师可以根据功能服务的特性,自由组合主辅图形即可。这大大减少了图形化结果不一致和样式不统一的问题。不断重复应用关键图形,可以建立并强化客户对相关功能服务的整体认知。当客户看到盾牌,马上可以联想到保险,就像看到放大镜,就知道是搜索功能一样。四、图标管理平台前两个部分介绍了联想筛选法和图标元素周期表两种方法,可以帮助设计师完成图标绘制。不过要使精心设计的图标,在前端正确展示,还需要开发与运营经理的参与。以平安银行为例,依托智能推荐能力,我们为客户提供千人千面的服务,且针对不同资产等级的客户,定制更符合客群审美的专属主题。因此在 UI 层面,图标需要配置更灵活以及满足换肤需要。我们尝试构建「 图标管理平台 (ICON ZOO) 」,旨在为设计师、开发和运营经理搭建沟通桥梁,将绘制好的图标标准化命名,上传至图标管理平台,平台将自动生成图标的 URL(唯一在线链接)。不论是开发调用,还是运营经理在后台系统配置,都不需要设计师单独提供切图,而是直接调用图标管理平台的 URL。这样大大减少了配置错误率,也方便我们随时对图标进行更新和换肤,同时提高工作效率。图标管理平台不仅能管理全平台的公共图标,业务设计师也可以创建业务图标空间,满足不同角色的协同需要。写在最后今天,我们从业务的角度出发,详细阐述了一个小图标从诞生到前端应用的全过程。看似一个很小的环节,如果在图标体量比较大且参与人数多的时候,沟通不畅通,就容易出现失控的情况。设计师需要感性和理性并存,感性可以为设计注入灵魂,理性可以让我们从业务角度出发,深入探寻问题本质,逐步找到最终的解决方案,帮助团队实现更高阶的目标。欢迎关注作者微信公众号:「 OnepinganDesign」本篇来源:优设网原文地址:https://www.uisdc.com/financial-icon-drawing
样机 作品集 再来 金三银四,很多同学已经提前开始准备作品集,摩拳擦掌打算换个更好的工作!但是一翻以前的作品,感觉能拿得出手的寥寥无几,开始纠结要不要放弃,或者抓紧时间再做一个虚拟项目丰富一下?确实,好的作品只能靠平时多积累,但是好的包装却是可以“临时抱一抱佛脚”的!样机用得好,作品集也能快速提升一个段位!今天就来给大家更新一波儿高质量样机!看中了单个样机的,可以直接复制对应链接去浏览器打开获取。话不多说,我们一起看看样机效果!一、iPhone 14 Pro 必须先来一波儿满打满算,iPhone 14 上市都已经半年了,新的样机模板得安排上。尤其是很久没更新作品集的同学,仔细看看之前用的样机,能当传家宝的 iPhone 4 千万要换掉。3 个角度、4 种颜色免费获取 https://js.design/community6 种颜色、可编辑、组件状态免费获取 https://js.design/community二、十三香也得来点儿样机不是越新越好,适配你的作品、并且更能展现亮点和优势才是最好的。如果没针对灵动岛做特殊设计,那么 13 仍然是你目前的最佳选择之一。免费获取 https://js.design/community三、再来个安卓的免费获取 https://js.design/community四、Apple Watch 也要安排上智能可穿戴设备是近些年的流行趋势,虽然 Apple Watch 样机的使用场景没有 iPhone 那么丰富,但还是要存一下以备不时之需,免得以后要用的时候慌慌张张到处找。免费获取 https://js.design/community五、再来几个电脑的这也是必不可少的iMac 24 寸样机,七种颜色都有,可以一键换图,查看具体再哪一个样机上展示的效果最好。免费获取 https://js.design/communityMacBook 样机模型自然也不能少,包含了新款 pro 16 英寸、14 英寸,以及 MacBook Air,存这一套就够用了。免费获取 https://js.design/community六、平面的整完了,最后再来点 3d 的3D 不同机型样机合集,涵盖手机、电脑、iPad、Apple Watch、绘画板等多种设备,一共 15 个样式,妥妥够用了。免费获取 https://js.design/community用够了单手握持点击?看看这套 3D 样机素材,一共十多种姿势可以选。免费获取 https://js.design/community当然,真人手握样机模板也不能少, 有 13 和 13Pro 两种机型,握持的手也有明暗两种模式,可以更好地融入你的作品集当中。免费获取 https://js.design/community实在是太全了!最后以上就是今天要和大家分享的全部样机模板,都是非常实用的,用好了可以让你的作品包装效果更上一层楼。这些样机模板都来自于「即时设计-资源广场」,除了选出来推荐给大家的这些,还有 100+ 样机素材,想要的同学可以直接去查找使用。资源获取地址: https://js.design/community本篇来源:优设网原文地址:https://www.uisdc.com/10-prototype
代码 程序员 项目 很多年前,当我还是一名计算机专业的大四学生时,整天上网浏览各类招聘信息,想找到一个合适的程序员实习岗位。除了实习岗位外,我偶尔也会点进一些“高级工程师”的招聘帖里。现在回想起那些帖子,抛开让人眼花缭乱的技术名词,我印象最深的就是常出现在第一行的岗位年限要求:“本职位要求 工作经验 5 年以上”。作为一只一天班都没上过的小菜鸟,这些年限要求在我眼里简直长到夸张。不过,望洋兴叹之余,我有时也会在心中暗暗憧憬一下:“五年工作经验的程序员,那该多厉害啊?写代码对于他们来说,是不是像吃饭一样简单?”时光荏苒,一晃十几年过去了。如今回头一望,自己也成了一名有着 14 年工作经验的光荣打工人。在软件开发行业摸爬滚打这些年后,我发现很多事情,与我在大四时所想象的大不相同,比方说:随着经验增长,编程并不会变简单太多,“像吃饭一样简单”只出现在梦里给许多“大项目”写代码不光没意思,还很危险,远不如在 LeetCode 上做一道算法题有趣只从技术角度思考问题,成不了好程序员,有些东西远比技术更重要细想起来,这类关于编程的感触还有许多。我整理了其中 8 条,写成了这篇文章。如果其中某些观点引起了你的共鸣,我会非常高兴。更多编程干货:学编程后,我做了这10个有毒的在线免费设计神器!(下)上篇的5个神器大受欢迎,人气极高。阅读文章 > 一、写代码很简单,但写好代码很难编程曾经是一项门槛很高的专业技能。从前,一个普通人想学编程,最常见的做法就是通过教材和书本学习。不过大部分编程专业书,十分艰深晦涩,对于初学者来说很不友好。因此不少人在尝到编程的乐趣前,就早早地半途而废。但如今,学编程正在变得越来越容易。学习不再像以前那样,只能硬啃书本,而是多了许多新途径。观看教学视频、参加 Codecademy[1] 的交互式课程,甚至直接在 CodeCombat[2] 通过玩游戏来学编程,每个人都能找到适合自己的学习方式。“妈,我真没在玩游戏,我在学编程呢!你看屏幕右边!”此外,编程语言也在变得越来越易用。经典的 C 和 Java 不再是大多数初学者的首选,许多更简单、更易上手的动态类型语言如今大受欢迎,与之相关的 IDE 等工具也变得越来越完善。这些因素进一步降低了编程的学习门槛。总而言之,编程早已褪去了它的神秘面纱,从只有少数人才能掌握的神秘技能,变成了一门人人皆可学习的普通手艺。但更低的学习门槛,更友好的编程语言,并不意味着人人都能写出一手好代码。如果你已经工作,参与过一些项目,那我很想问你一个问题:”你日常接触的这些项目的代码质量如何?是好代码多,还是烂代码多?”不知你会怎么回答,我先来说说我的答案。1. 好代码还是很少2010 年,我跳槽到了一家总部位于北京五道口的大型互联网公司。加入这家公司前,我只在十人规模的小公司待过,因此,我对新公司在各方面都有着很高的期待,尤其是软件质量方面。当时,我心里想的大概是这样:“这可是支撑了有着千万用户量的产品的大项目,代码质量跟之前那些比,肯定有质的飞跃吧!”等到在新公司工作了一周后,我才发现自己实在是错得离谱。所谓“大”项目的代码质量同我的预期相去甚远。打开 IDE,数百行的函数和神秘的数字字面量比比皆是,开发任何一个小需求都难如登天。后来,在待过更多公司,接触了更多软件项目后,我总结出一个道理:不论公司多大、项目多牛,在实际工作中遇见好代码,仍然是小概率事件。2. 好代码有哪些要素?话说回来,到底怎样的代码才算是好代码?在这方面,Martin Fowler 有一句话常被大家引用:“Any fool can write code that a computer can understand. Good programmers write code that humans can understand.”“任何傻瓜都能写出计算机能理解的代码。优秀程序员写人类能理解的代码。”我认为它可以作为评价好代码的原点:好代码一定是可读、易读,且容易理解的。写出好代码的第一原则,就是把人类读者放在第一位。除了可读性以外,评价代码好坏还有许多其他维度:贴合编程语言:是否使用了当前编程语言的推荐写法?语言特性和语法糖,使用程度是否恰到好处?易于修改:代码设计是否考虑了未来的需求变更,当变化发生时,代码是否容易随之修改?API 设计合理:API 设计是否合理,易于使用?好的 API 在简单场景下使用方便,在高级场景下又可以随需求扩展。性能够用:代码性能是否满足当前业务需求,同时为未来保留了一定提升空间?避免过度设计:代码是否存在过度设计、过早优化的毛病?…总而言之,对于任何层级的程序员来说,好代码都不是什么唾手可得的东西。要写出好代码,需要在许多维度上反复权衡、精心设计,最后再加以持续打磨。既然如此,假如想尽快掌握写代码这门手艺,有捷径吗?3. 写好代码的捷径在许多层面上,我认为编程和写作非常相似[3]。二者都是使用文本和符号来表达思想,只是方式略有不同。谈到写作,我想问一个关于作家的问题:“你听说过不读书的作家吗?你有没有听到过某位作家说,他从来不读其他人的作品,只读自己的东西?”。我猜答案应该是否定的吧。如果你去查阅相关资料,你会发现许多职业作家的日常生活,就是阅读和写作两件事在不断循环。他们每天会花大量时间阅读各类文字,然后再写作。同样是“文字工作者”,程序员们就很少重视阅读。但要想快速提升编程能力,阅读正是不可或缺的重要一环。除了日常工作接触到的项目以外,我们应该更多地阅读那些经典软件项目,从中学习 API 设计、模块架构和代码编写的技巧。不光代码和技术文档,最好再定期读一些计算机方面的专业书,保持阅读书籍的习惯。在这方面,我认为 Jeff Atwood 在 15 年前写的文章 "Programmers Don‘t Read Books -- But You Should(都说程序员不读书——但你应该读)"[4],如今读来仍不过时。提升编程能力的捷径,就藏在“阅读 编程”这个无尽循环里。“一个好的程序员应该做什么?”二、编程的精髓是“创造”在程序员的日常工作中,有很多事情会让人充满成就感,甚至情不自禁地感叹“编程真美好”。比方说,修复了一个极难定位的 Bug,用新算法将代码性能提升了一倍,等等。但在所有的这类事情当中,没有任何一件,能和“亲手创造出一件东西”相比。当你在编程时,创造新事物的机会实际上随处可见。因为并非只有发布一个新软件,才称得上是“创造”。写一个可复用的工具函数、设计一套清晰的数据模型,全都可以归入“创造”的范畴。身为程序员,保持对“创造”的热情至关重要。因为它可以帮我们:更高效地学习:学习一门新技术,最高效的方式就是用它开发一个真实项目,在创造的过程中学习,效果最好。有机会邂逅了不起的东西: 许多改变世界的开源软件,最初都是作者纯粹出于兴趣所创造,比如 Linus Torvalds 和 Linux,Guido van Rossum 和 Python。1989 年的圣诞假期,荷兰人 Guido van Rossum 敲下了 Python 语言的最初几行代码,Python 最初仅被期望作为 ABC 语言的继承者,但后来“吞噬”了全世界虽然“创造”好处多多,程序员们也有大把机会去做,但许多人常常缺少一种身为“创造者”的觉悟。就像那个广为流传的小故事所说:一位哲学家询问正在砌砖的工人,有人清楚地知道自己是在建造一座大教堂,有人却认为自己只是在砌砖。很多程序员正是“只见砖块,不见教堂”。将自己定位成创造者后,看待事物的方式就会发生天翻地覆的变化。举个例子,同样是给 API 增加报错提示文字,创造者们就能跳出“快速完成需求就好”的思维陷阱,向前一步,追问自己一些更重要的问题:“我想为用户创造什么样的产品体验?怎样的报错文字,更能帮助我达成该目标?”就像任何一个有用的编程模式一样,“创造者思维”也能成为你的职业生涯的一道巨大推进力。因此,现在就试着问自己一个问题吧——“我的下一份创造会是什么?”三、打造高效试错的环境至关重要我曾参与开发过一个互联网产品,它设计精美,功能丰富,每天都有大量用户使用。但就是这么一个从市场角度看颇为成功的产品,工程质量却非常糟糕。如果你打开它的后端项目,把所有目录翻个底朝天,都找不到任何一行单元测试代码,其他自动化测试流程也是无从谈起。而业务逻辑偏偏又十分复杂,最后,项目代码间的意料耦合多如牛毛,开发一个新特性,很容易把旧功能给搞挂。“在忙啥呢?” “试着修复我之前修一个问题时搞出来的问题,那问题是我之前解决另一个问题搞出来的,而那个问题又是我……”因此,项目每次发布时,开发和产品同学全都得严阵以待,氛围十分紧张。整个发布过程也很刺激,紧急回滚时有发生。一个人在这样的环境中工作,技术成长抛开不谈,心理素质肯定能得到极大锻炼。编程原本是一件充满乐趣的工作,但为这样的项目编程,乐趣根本无从谈起。究竟是什么夺走了编程的乐趣?1. 理想的编程体验“刷题”LeetCode[5] 是一个著名的编程学习网站,上面提供了许多覆盖各个难度的编程题,大部分与算法相关。用户可以选择自己感兴趣的题目,直接在浏览器上编写代码(支持十几种编程语言)并执行。如果通过了全部的测试用例,则算作解答成功。在 LeetCode 上做题在 LeetCode 刷题很像在玩游戏,富有挑战性,同时也很有趣。整个做题过程,实际完美展现了一种理想化的编程体验:关注点分离:每道题目都是一个独立个体,同一时间内,开发者可以完全沉浸在一道题目中;快速获得精准反馈:开发者每次调整代码后,能通过自动化测试快速获得结果反馈;零成本试错:写出的代码语法有错误、逻辑有问题,没有任何不良后果,心理负担小。不过,屏幕前的你很可能觉得我在说些废话。“不然呢?解算法题、写小脚本,不就是这样的体验吗?有啥特别值得说的?”你很可能会继续补充道,“你知道我们公司的项目有多复杂吗?规模超大,模块巨多,你懂我意思吗?每天服务 万人,光数据库就好几套,消息队列都有三种,开发起来当然要麻烦一点咯!”确实,全世界的软件千差万别,开发起来不可能都像在 LeetCode 上刷题一样轻松愉快。但这并不意味着,我们不应该努力改善自己身处的编程环境,哪怕只有一点点。要通过改善环境来提升编程体验,可用的理念和工具包括:模块化思想:妥善设计项目中的每一个模块,降低耦合,提升正交性设计原则:微观层面上,应用那些经典的设计原则和模式,比如“SOLID”原则自动化测试:编写规范的单元测试,必要时使用 Mock 技术,用自动化测试覆盖业务关键路径缩短反馈回路:切换编译速度更快的工具,优化单测性能,竭尽全力缩短从“改完代码”到“获得反馈”的等待时间微服务架构:必要时,将大单体拆分为多个职责各异的微服务,分散复杂度……关注编程环境,刻意创造出允许高效试错的“代码乐园”,让工作像刷题一样轻松愉快。是经验丰富的程序员能为自身团队做出的最好贡献之一。四、避开代码完美主义陷阱在代码质量上精益求精是好事,但也要注意别掉进完美主义的陷阱。因为编程不是艺术创作,不鼓励人们无限度地追求极致。作家大可花上数年打磨一本传世之作,但程序员在代码上钻牛角尖就很有问题。世间没有完美的代码。大多数时候,你的代码只要能满足当前需求,又为未来扩展留了一些空间就够了。有那么几次,我在简历上看到候选人给自己打着“代码强迫症”标签。隔着屏幕,我虽能感受到 TA 对代码质量的那份重视,但在我心底,其实更期望 TA 早已将完美主义陷阱远远甩在了后头。五、技术很重要,但“人”也许更重要在软件开发领域,“单一职责原则”(全称为 Single responsibility principle,后简称为 SRP)是一条非常著名的设计原则。它的定义很简单,一句话就可以概括:“每个软件模块应该只有一个被修改的理由”。单一职责原则:能做到,并不意味着你就该这么做要掌握 SRP 原则,关键在于搞清楚“被修改的理由”为何物。很显然,程序是没有生命的,它自身不能也不需要主动去改变。任何修改程序的理由,都来自与之相关的人,人是导致修改的“罪魁祸首”。举个简单的例子。看看下面这两个类,其中哪一个违反了 SRP 原则?一个字典数据类,支持两类操作:存数据、取数据;一个员工资料类,支持两类操作:更新个人信息、渲染一张用户资料卡片图。在大多数人眼里,第一个例子没问题,但第二个例子却明显违反了 SRP 原则。要得出该结论,好像无需任何严格的分析和证明,运用一丁点直觉即可。但假如做一些正经分析,第二个例子的可疑之处,在于能为其轻松找出两个不同的修改理由:管理员认为资料中的“个人电话”字段不能有非法号码,需增加简单的校验逻辑某员工认为资料卡片图上的“名字”部分太小,希望加大字体”It is people who request changes. And you don’t want to confuse those people, or yourself, by mixing together the code that many different people care about for different reasons.” ——“The Single Responsibility Principle”“是人在要求软件变更。你绝不想把那些不同人出于不同原因所关心的代码混在一起,这样只会把他们和你自己搞糊涂。”——“单一职责原则”理解 SRP 原则的关键,在于先理解人以及人在软件开发中所扮演的角色。再举一个例子。微服务架构是近些年很火的一个技术话题。但许多人在讨论它时,往往只关注技术本身,却忽视了微服务架构与人之间的关系。将微服务架构风格与其他东西区分开的关键,在于将大单体拆分为独立的微服务后,不同模块间的边界可以变得更清晰。跟数百人的团队一同维护着一个大单体比起来,许多小组织各自维护着独立的微服务,明显拥有更高的运作效率。如果缺少了特定的组织规模(也就是“人”)作为前提,空谈微服务的各种技术优势和那些花活,纯属本末倒置。技术当然很重要。身为技术人员,那一张张瑰丽的架构图和独具匠心的代码细节,天然吸引着我们的注意力。但是,也请千万不要对软件开发里的另一个重要因素“人”视而不见。必要时,转换一下看事情的角度(从“技术”转向“人”),那样对你大有裨益。六、求知若渴是好事,但也要注意方法如今人人都在说“终身学习”,而程序员是一个尤其需要终身学习的职业。因为计算机技术的迭代更新非常快,某个三年前流行的框架或编程语言,很可能一个月前已经过时。一分钟之内会发生什么事情?Netflix 观看时间增长 70,000 小时;Snapchat 上有三百万视频被观看;Google 新增两百四十万次搜索;一个 JS 新框架被发明(这条不是真的 )要在工作中表现得游刃有余,程序员们需要学习的东西非常多,涵盖各个层面。拿我比较熟悉的后端领域举例,一位合格的后端工程师至少需要掌握以下这些:一种或多种后端编程语言 / MySQL 等关系数据库 / Redis 等常见存储组件 / 设计模式 / 用户体验 / 软件工程 / 编译原理 / 操作系统 / 网络基础 / 分布式系统 / …虽然要学很多,但据我观察,大部分程序员其实都挺爱学习(至少不排斥),因此心态不是问题。不过有的时候,光有“求知若渴”的心态并不够,学习时,我们尤其需要关注“性价比”。1. 关注学习性价比下面这张图,展示了学习成效和投入之间的关系。学习成效与投入关系图,横轴为学习投入,纵轴为学习成效从图中可以看到,在学习的初级阶段,投入较少时,所获得成效增长飞快。但当成效超过某个阈值后,之后再想继续提升,所需要的学习投入就会呈指数级增长。正因如此,我建议你在学习任何一项新事物时,先在脑海中想清楚一个问题:“我应该在上图中的哪个位置停下来?”,而不是闷头猛学。知识的海洋浩瀚无边,有些东西需要我们成年累月的持续学习,不断精进。也有些东西,蜻蜓点水般学到一些皮毛已绰绰有余。准确判断并分配自己有限的学习精力,甚至比努力学习本身更重要。2. 挑选合适的学习资料有了学习目标后,下一步就是寻找合适的学习资料。在这方面,我想分享一次自己的失败经历。有段时间,我突然对产品交互设计产生了浓厚的兴趣,认为自己应该在这方面有所精进。于是,我精心挑选了一本领域内非常经典的专业书:《About Face 4: 交互设计精髓》[6],将其买回家中,满怀信心地认为自己的交互设计能力可以迅速获得提升。但事与愿违,当我捧着那本经典著作时,发现自己连第一章都无法顺利读完——那句老话说的没错:“隔行如隔山”。从这次失败中,我总结出了一点经验。那就是学习某项新东西时,我们最好挑选那些更易读,更适合“门外汉”的学习资料,不要“眼睛大,嘴巴小”,只知道奔着最经典、最权威的资料而去。回顾之前的经历,我觉得以下几本书非常适合门外汉学习使用,性价比极高:《写给大家看的设计书》[7]:设计相关《点石成金》[8]:Web 用户体验相关《鸟哥的 Linux 私房菜》[9]:Linux 系统相关也许每个人的内心,都想成为一个博学的人,无所不知,无所不晓。但可供分配的时间的精力总是有限,我们不能,也不需要在所有领域都成为专家。七、越早开始写单元测试越好我非常非常喜欢单元测试,我认为写单测这件事,对我的编程生涯影响极大。夸张点说,如果以“开始写单元测试”作为分界线,把我的职业生涯分割成两段,后面那段远比前面那段精彩得多。写单测的好处很多,比如单测可以驱动你改善代码的设计、可以作为代码的一种文档,等等。此外,完善的单元测试还是构建前面提到的“高效犯错的环境”的关键。我已经写过几篇关于单测的文章,比如《有关单元测试的 5 个建议》[10]、《游戏“蔚蓝山”教我的编程道理》[11]。所以在这儿,我不打算再重复一遍。只说一句:如果到目前为止,你从未试过写单元测试,或从没重视过测试,我建议你从明天就开始写起来。一般情况下我不测试我的代码,但假如测的话,我在生产环境测八、程序员最大的敌人是什么?在大多数程序员段子里,产品经理经常作为反派角色出现。他们口中的项目需求总是变个不停,一天冒出一个新想法,搞得程序员苦不堪言。客户每天都在不停修改需求,所以,我们决定在下次发布前,把这些需求“冻结”起来在这些段子的烘托下,不断修改需求的产品经理,仿佛真成了程序员们最大的仇敌。似乎只要产品不乱改需求,大家的工作环境马上就会成为乌托邦。虽然偶尔吐槽一两句产品经理很有意思,但我还是想一本正经的说一句:产品经理不是敌人。因为从某种角度来说,软件生来就是准备被修改的(不然你猜,软件为什么叫“软”件?)。这样看来,开发软件和修建房子完全不同。因为没人会在建好一栋大楼后说:“让我们把它推倒重建一遍吧!一样的楼,但是用的钢筋和水泥比之前少 30%!”所以,产品经理以及不稳定的需求不是程序员的敌人。并且,能否写出易于修改、适配变化的代码,是区分普通程序员和优秀程序员的重要标准之一。那么,程序员们最大的敌人又是什么呢?1. 复杂度是最大的敌人就像《代码大全 2》中所说:软件开发的核心问题是管理复杂度。失控的复杂度就是程序员最大的敌人。来看看那些导致项目复杂度不断增长的要素:不断增加的新功能: 更多的功能等于更多的代码,更多的代码通常意味着更高的复杂度对高可用的需求: 为了实现高可用,消息队列等额外的技术组件和代码被引入对高性能的需求: 为了提升性能,缓存和相关模块代码被引入,部分模块被拆分后,换成高性能语言重写一再被推迟的重构:因项目排期过于紧张,迫在眉睫的重构被一再推迟,技术债越积越多忽视自动化测试: 没人写单元测试,也没人关心测试…终有一天,当项目的复杂度增长到一定程度后,空中会传来一声巨响。“咚!”,一个大家不愿改、不敢改的“大坑”凭空出现在了所有人的 IDE 中。猜猜看,究竟是谁挖下了这个坑?那些在降低复杂度上投入时间的团队,所负责的软件项目更容易成功2. 减缓复杂度增长的过程虽然复杂度总是会不可避免地持续增长,但有许多实践可以减缓该过程。如果每个人都能做到以下这些事,复杂度就有可能被长期控制在合理范围内:精通当前编程语言与工具,写整洁的代码使用合适的设计模式和编程模式对重复代码零容忍,抽象库和框架适当运用整洁架构、领域驱动设计思想编写详尽的文档和注释编写规范有效的单元测试分离那些变动的与不变的…要求看上去很多,但总结起来,核心其实就是一句话:写更好的代码。写在最后2020 年,我在小组内做了一个分享,当时的 PPT 标题是《编程十年后的十个感触》。将资料分享在公司内网后,有位同事看到,评论说光看 PPT 不过瘾,希望我能将其扩展成一篇文章,我回复说没问题。如今 3 年过去了,我总算是兑现了自己的承诺。当年准备分享材料时,我做完整个 PPT,最后一页实在不知道该放些啥。于是灵机一动,搞了个纯白色的背景,中间打了一行黑体大字:“十年很短,编程很难”。如今,第二个十年也已快行至中途,而这句话的后半部分好像对我仍然适用——长进不大,继续加油 。原文链接:https://www.piglei.com/articles/programming-is-still-hard-after-14-years/欢迎关注作者微信公众号:「piglei」本篇来源:优设网原文地址:https://www.uisdc.com/8-programming-experience
用户 新用户 产品 编者按:这篇文章出自资深 B 端 UI/UX 设计师 Taras Bakusevych ,他对于产品、视觉、体验设计上,都有深入的钻研,而这些钻研是实实在在的项目喂出来的实战经验。他之前的每篇文章都值得一读这10个设计原则,是确保金融类产品体验优秀的核心要义财务和金融相关的应用是一个相对专业的分支,在这个领域当中创造体验优异的设计并不是一件简单的事情。阅读文章 > 在资深设计师眼中,这 10 个设计原则更值得学习和了解编者按:在做设计的时候,设计师到底要遵循哪些设计原则?阅读文章 > 以下是今天的正文:出色的新用户引导,能够缩短用户了解产品价值的路径,能够帮助用户迅速抵达令人惊艳的细节,获得成就感,完成任务,和产品产生情感连接。1、第一印象至关重要新用户引导通常是产品当中用户历程的起点,用户和产品的初次交互将会塑造产品对于用户的第一印象,如果做的足够好,则能够带来较强的用户忠诚度,将用户变成长期客户和产品拥护者。在整个用户产品周期当中,新用户引导是起点,然后是用户使用和用户留存的阶段。新用户引导阶段:初次使用产品,成为产品的用户。产品使用阶段:用户能够熟练使用产品和功能,能够实现预期目标,获得预期收益。用户留存阶段:用户不断提升参与度,开始使用产品所提供的更多功能,成为专家级用户和产品的拥簇。2、新用户引导并不是简单的产品介绍新用户引导时常和产品介绍界面混淆,很多产品在新用户引导界面介绍产品的功能和优势。那么,在你设计新用户引导界面的时候,需要问问自己这几个问题:这些界面是帮助用户获得他们想要的东西,还是在他们前进道路上带来不便的?我们的界面是在介绍显而易见的事情吗?这些信息在此时此刻是否可操作?是否有用?要让用户在打开界面第一屏的时候就可以交互和使用。产品优势介绍应该是在 App Store 或者 Google Play 的 APP 预览页上展示的,那是用户试图了解产品的地方,也是更加合理的地方。3、最好的新用户引导是沉浸式的很多产品功能其实很简单,并不一定真的需要开头单独设置引导页。新用户引导是否需要,取决于多个因素:用户的目标和需求业务需求、行业标准、法规要求产品所需要的经验和熟练程度产品的熟悉度和开创性程度有很多产品是简单到开箱即用的,而还有一些产品则需要经过漫长的引导培训,用户才能正常使用、达成目标,以避免出现错误付出高昂的代价。4、新用户引导流程可以由多个元素组成像注册、订阅服务、功能推荐、定制服务等,都可以应用到新用户引导当中。新用户引导的重要性,和你产品的收入模式有很大的关联。比如付费订阅类的产品,新用户初次上手的体验之后产生的评估,将会极大地影响后续的订阅付费意愿。关于这一点,NNGroup 有过非常专业的分析:https://www.nngroup.com/articles/mobile-app-onboarding/5、介绍、小贴士和操作提示APP 内的教程和介绍,主要是教育用户使用某些功能,并且引导用户在 APP 内抵达特定的页面和功能。而这种引导的呈现形式也不尽相同,比如卡片式说明、全自动产品导览、视频教程以及工具提示。好的产品设计应该是不言自明的,所以设计的核心目标是设计清晰、独立不言自明的界面,而不是指令式的引导。避免设计冗长的指令引导和教程提供简短清晰的、和上下文环境高度相关、可操作的引导指令,并且用户可以禁用这些引导指令。操作提示——关于特定操作、交互的请求或者建议,比如引导用户给 APP 评分,与朋友分享,或者启用消息推送。这些操作提示如果放置在新用户引导阶段,实在是太早了,很容易让用户感到抵触,导致转化率降低。避免过早提出不当请求为用户提供小贴士引导的时候,尽量给出符合上下文提示且有明显好处的,或者告知用户当前操作不当可能会导致哪些不好的后果6、新用户引导时间越短越好绝大多数的设计师可能都都没意识到这个问题。其实这个设计背后的逻辑很简单,就是「成本收益」原则 —— 只有当收益等于或者大于成本的时候,用户才会跟进或者进行活动。流媒体音乐 APP 的新用户引导流程通常是 5-10 步,银行金融相关的则 20到25步不等(因为许多金融服务平台有严格的监管和合规的要求)。所以,在设计的时候建议:在允许的范畴内,尽量让你的新用户引导流程比竞品更短,让用户尽可能少点几次进入正式界面而具有独特优势和功能的产品,可能会因为缺少竞品或者后续大量奖励,需要更苛刻的注册和引导流程每个问题和引导功能需要有充分的理由7、增量引导流程新用户引导可以被切分为若干个不同阶段,这样用户可以先访问产品特定功能的引导,而其他的引导流程,则在用户触发的时候再进行,这种设计是提升用户引导流程有效度的好办法。这种增量引导方式有很多好处:减少用户的认知负荷,让用户分阶段地完成任务并获得奖励回馈确保用户可以分阶段完成任务,并且每次都能获得和当前状况相匹配的引导信息比如 Wise 的客户端就使用增量引导流程,仅在用户需要的时候提供引导,快速注册之后,用户就能进入程序,访问页面,仅在用户需要开通帐号和服务的时候,再次提供针对性的引导。8、保持透明,呈现进度好的设计理应在对的时机给予对应的反馈,始终让用户了解正在发生的事情——可用性启发式:系统状态可见性对于新用户引导流程,如果缺乏明确的目标,用户不知道什么时候会结束,则可能会产生强烈的焦虑感和失控感。在下面的案例当中,我们可以看到没有进度条指示和有明显进度条指示的差异,有着更清晰进度指示的 Moka 比 Revolut 更加透明和友好。对于较长引导流程,可视化的进度条和进度指示器能够更好帮助用户了解当前状态。努力设计好文案贴合用户期望,并且鼓励用户9、了解阻碍用户的关键点在 APP 中很多任务可能会让用户感到压力,如果这些任务是必须执行的,那么需要通过特殊的设计来缓解压力和阻碍。以下是阻碍用户抵触引导的主要原因:潜在的安全和隐私的问题超长的表单和漫长的流程过于激进的广告和付费要求在用户从应用中获得正反馈之前就敦促用户付费缺乏逻辑和意料之外的问题强制要求创建帐号强制用户做出决定缺乏本土化的设计10、了解用户并优化用户体验用户初次使用产品的用户体验,是一个很好的契机,可以更加深入的了解的用户的偏好和目标,并且借此调整产品的体验。通过询问用户喜欢哪些艺术家,YouTube Music 可以为新用户创建一个独特的、负荷偏好的独特播放列表。尽快了解用户的偏好,对于提升内容服务和用户粘度至关重要。Duolingo 在新用户引导阶段,会先了解用户的学习目标,以及当前对于语言的掌握程度,在此基础上创建独特的学习路径。而 Duolingo 也证明了一件事情,就是用户自己设置的目标比系统设定的目标,有更高的达成率。11、全力强化品牌气质第一次和用户相遇,是展现独特品牌气质的好时机,你可以借助更好的品牌设计,让用户感知到品牌的独特之处。良好的品牌设计,结合游戏化设计和友好的吉祥物,能够帮助用户和产品产生情感连接。HeadSpace 就是一个典型的案例,和很多其他的 APP 不同,HeadSpace 并没有急于让用户注册,而是以一组可爱的动画开始,引导用户「吸气」和「呼气」,简单而可爱的互动引导着用户,给用户留下独特的第一印象。12、完善空状态在引导用户进入应用之后,有的应用可以直接使用,而有的应用则可能因为缺少内容而显得无趣。所以,针对空状态的设计是非常有必要的,借助设计让空状态勾勒出用户路径,结合新用户引导,让用户快速适应产品的功能。Mailchimp 就是这么做的,它借助一个简单的新用户任务清单,引导用户完成一个又一个任务。本篇来源:优设网原文地址:https://www.uisdc.com/user-onboarding-practices
用户 内容 商家 一个 SaaS 产品的后台是如何设计的?作为知识付费行业的头部 SaaS 服务商,从 2016 年诞生不到 7 年时间,小鹅通注册客户数已经超过 160 万,终端访问用户人数超过 7.8 亿,毫无疑问成为了国内知识付费规模最大的 SaaS 产品。为什么拆解小鹅通的后台?这是因为后台设计往往被多数产品、开发甚至老板忽略,他们甚至认为后台不需要设计,更不需要考虑用户体验,能把功能实现就可以交付。但我的观点恰巧相反,我认为一个 SaaS 产品设计最大的挑战和关键正是后台。它决定了运营者的工作效率和操作体验,即便你的功能再强大,如果用户不会用、不愿意使用,那么用户也不会续费,而续费,正如《SaaS 创业路线图》作者吴昊在他书中的观点——SaaS的本质,就是续费。设计大侦探的第一个B端产品拆解,选择了工作量最大、最繁杂的后台,阅读时间长,非常乏味,但如果你认真啃完,你对SaaS产品、后台设计、B端设计不会再陌生。都说良药苦口,这碗药,廖尔摩斯先干为敬。往期拆解:万字拆解!12306产品设计全方位深度解析有人说它是全世界最牛逼的 APP,因为它的算法难度和春运期间访问量几乎是全球之最;但有人说它是全世界最垃圾的 APP,因为在使用这个产品的过程中,遇见很多奇葩、愤怒的体验。阅读文章 > 一、导读1. 内容结构小鹅通的后台拆解包含四个部分,分别为导读、产品画像、设计拆解和总结,内容篇幅超过 4 万字,阅读时间较长,所以拆分为 4 篇文章发布,建议收藏阅读。2. 适读人群第一类,产品经理/UI/交互设计师,通过对小鹅通后台产品的深度拆解,跳出执行层,培养后台设计的全局观,从功能价值、应用场景、业务流程和用户体验多维度去学习和思考一个头部 SaaS 产品的后台如何设计。第二类,SaaS 产品及知识付费从业者,获取一份专业、完整、有深度价值的 SaaS 竞品设计参考。3. 分析模型第一,增长模型。由戴夫·麦克卢尔提出,包含用户获取、用户激活、用户留存、获取收入、用户推荐,分别对应用户生命周期中的 5 个重要环节,主要用于分析产品的功能价值。用一篇文章,让你掌握能让用户快速增长的AARRR 模型AARRR模型因其掠夺式的增长方式也被称为海盗模型,是Dave McClure 2007提出的,核心就是AARRR漏斗模型,对应客户生命周期帮助大家更好地理解获客和维护客户的原理。阅读文章 > 第二,尼尔森十大原则。尼尔森十大可用性原则是界面设计中最基础、最重要的设计原则,任何产品的设计,都可以通过这十个原则进行指导设计,这个原则主要用于诊断后台设计的用户体验。用超多案例,帮你掌握尼尔森十大可用性原则尼尔森设计原则是人机交互学博士 Jakob Nielsen 于 1995 年发表的“十大可用性原则”。阅读文章 > 第三,其他设计基础理论,包括费茨定律、格式塔原则、席克定律等,主要用于判断后台设计的易用性。4. 拆解步骤SaaS 产品的后台的设计不仅复杂,而且很多功能如果不亲自体验根本没法理解,所以针对小鹅通后台的拆解,我分为以下三个步骤进行第一,亲自上手实操体验操作。对每一个功能版块进行了全面的实操体验,弄清楚了才开始拆解,绝非走马观花。第二,结合官方帮助文档创作。在体验小鹅通产品的时候,有很多功能必须结合帮助文档才能理解,甚至由于权限和内容问题,部分功能没法体验,只能靠官网介绍来理解。针对每一个功能,严格按照「功能介绍-功能价值-使用场景-页面内容-核心功能-操作流程」的结构去描述,旨在让产品设计师看懂这个功能设计的价值和细节。第三,深入思考产品设计细节。在拆解完每一个功能,我都会加入自己的思考,主要分为细节侦查(值得我们学习的细节)、迭代建议(个人认为可以优化的地方)、设计思考(某个功能带给我的启发)、体验陷阱(用户体验糟糕地方)和体验小结(针对某个功能版块进行全面总结)。5. 阅读建议由于内容篇幅太长,强烈建议你可以申请小鹅通免费试用账号一边阅读一边体验,这样对整个后台的设计才更深有体会。二、产品画像1. 产品简介小鹅通是知识产品与用户服务的数字化工具,包含知识店铺、企业直播、企业培训、企微助手等多款产品,可以为有线上经营、商业变现、私域运营、用户服务等需求的企业,提供一站式技术服务,助力企业完成数字化升级。根据官方数据显示,截止到 2023 年 2 月,小鹅通注册客户数已经超过 160 万,终端访问用户人数超过 7.8 亿,是目前国内知识付费客户数量最多、规模最大的 SaaS 产品。2. 用户角色用户角色是指使用操作小鹅通后台的用户,主要分为运营者和店铺销售。① 运营者店铺的运营者主要负责店铺装修、商品管理、用户运营、数据分析、活动策划、拉新引流等工作内容,是小鹅通后台主要使用的用户群体。② 店铺销售店铺销售会通过企业微信和 CRM 工具使用小鹅通,不过他们主要通过企业微信的小鹅通应用进行工作,很少涉及后台操作。3. 信息结构从信息结构看,小鹅通后台主要包括店铺、圈子、直播、内容、商品、营销、交易、用户、CRM、企微、数据、应用、设置和服务 14 大版块(感谢探友@miki 对小鹅通后台信息结构的梳理)。三、设计拆解小鹅通的后台非常庞大,包括了店铺、圈子、直播、内容、商品、营销、交易、用户等 14 大版块,其中每一个版块又包含若干功能,体验起来非常繁杂,很容易陷入焦虑感。所以我按照一个知识店铺从 0 到 1 装修、添加内容、店铺推广和运营的步骤把小鹅通的后台拆分为 8 个服务,然后再对每个版块的内容进行详细拆解。1. 初始设置当我从官网开通小鹅通的知识店铺以后,进入到管理后台,面对如此繁杂的功能,我想做的第一件事,就是对我的店铺进行基础设置,我得让用户知道这个店铺叫什么名字。① 店铺设置「店铺设置」为商家提供了店铺的基本信息设置,比如店铺信息、品牌形象、用户账号设置等。「店铺信息」提供店铺名称、店铺管理员和主营类目的设置,非常基础。「用户账号设置」 提供在使用系统过程中的各种登录偏好设置,比如登录设备限制,可自定义学员使用同一账号在同一时间不同浏览器上同时登陆的情况「引导设置」提供了引导用户关注公众号、加入社群、收藏店铺、添加客服和添加手机号等功能,对新用户的首次访问至关重要。「功能配置」支持用户对商品销量、播放量/浏览量、评论审核、严禁词、视频播放器、商品评价、买家申请售后等功能进行设置,可以看出系统非常完整和灵活。迭代建议用户的短期记忆一般不会超过 5 秒,所以在体验「设置」这个栏目的时候,我就发现小鹅通的功能太过繁杂,这对新手商家的入门有很高的学习成本。这个栏目的内容其实可以拆分为基础设置、高级设置这样的阶梯式内容,有助于缓解新手用户的焦虑。② 员工管理「员工管理」是为商家提供新建员工、运营角色管理、员工权限设置的功能,这个栏目主要帮助商家管理自己的运营团队。③ 角色管理「角色管理」包含了系统默认的多个角色,比如高级管理员、普通管理员、财务、老师、课程顾问、教务专员、销售员等,并且可以对每个角色进行权限设置,另外系统也支持商家新增自定义角色,满足商家各种运营需求。④ 操作日志「操作日志」记录了整个系统管理员的登录和操作内容记录,日志系统作为一个后台系统必不可少的模块,它可以记录下系统所产生的所有行为,这有助于商家对系统运行监管,并且可实时监控员工在系统中的敏感操作,加强员工培训和管理。⑤ 消息推送「消息推送」是商家建立外部触发最好的方式,这个版块主要为商家提供各种场景的消息推送设置,小鹅通支持服务号代发、短信通知和 APP 推送通知三种类型。⑥ 体验小结在对「设置」模块的实操体验中,感受到小鹅通的功能非常强大,甚至功能多得有点让人透不过气,这对新手商家来说,会产生很多的焦虑和压力,我迫切需要一份最基础、最简洁的新手引导指南。这也突然让我想起了当我申请小鹅通体验账号时,客服专员向我多次提及给我做新手操作培训,但我都婉拒了,也许对于一个头部 SaaS 产品来说,客服专员的培训是客户体验过程中必不可少的一个环节,但是我认为好的设计,其实不需要太多的学习成本。2. 添加内容当我把店铺的基础信息设置好以后,接下来,就需要为我的知识店铺准备上架的内容了。我找到了「内容」这个模块,发现小鹅通支持的内容形式非常多,从视频、音频到图文专栏,把常见的内容形式都涵盖了。① 内容「内容」版块包含内容类型和互动工具两个部分,商家可以在「内容类型」选择自己要发布的形式发布内容,而「互动工具」则是帮助商家课程运营和学生管理的工具。内容类型小鹅通支持视频、音频、图文、电子书、AI 互动课、专栏、训练营和会员 7 种类型,几乎覆盖了常见的内容形式。1)视频「视频」是最常见的内容形式之一,商家可以把录制好的课程视频上传到这个栏目,就可以开始向学员销售。新建视频「视频」包含基本信息、课程内容、所属组合课、商品信息和状态设置五个部分。在「基本信息」,商家需要填入商品名称等基本信息;在「课程内容」,管理员可对视频的播放进行设置(比如课程未学完禁止拖动进度条和倍速播放等),还可以对内容设置保护(禁止文字防复制和开启防录屏跑马灯)。「所属组合课」是提供商品和其他内容(专栏、会员和训练营)关联,比如新添加的商品属于某个付费专栏,那么就可以关联,提升效率。在「商品信息」,可以设置商品的售卖方式,支持免费、付费、加密和指定学员。针对付费视频,还可以支持片段试看,提升付费转化。「状态设置」是指在添加完商品后,商家可选择立即上架、定时上架或暂不上架,比如商家在准备某个促销活动的时候,可以提前编辑商品,设置定时发布即可。视频管理「视频」添加成功后,在「视频」栏目页,可以查看商品的详情,对商品进行编辑,分享、下架、复制和删除等。「分享」是指商家可以把商品的链接、二维码等信息直接复制分享给好友,同时也起到了预览的作用,这是一个公用的组件,在其他商品和版块同样适用。视频详情页「视频详情页」主要分为课程设置、运营设置、学员列表和数据分析四块内容。「课程设置」就是对课程的相关信息进行设置,相当于对内容进行二次编辑。「运营设置」从四个解为一个通用的表单;「CRM分配」是指可以把浏览课程的学员自动分配给企业的CRM销售人员;「私域引流」是指可以引导用户扫码加群,提高课程服务质量和商家对学员的运营能力。在「学员列表」,可以查看当前购买商品的所有学员信息,包括购买时间、学习进度等信息,系统也支持商家手动添加可学习课程的学员。在「数据分析」栏目,可以查看商品的「学习效果」和「交易数据」,比如商品的订阅人数、学习人数、完课率、学习趋势图等,通过这个栏目,可以帮助商家对用户的学习进行深入的分析,提升运营效率。设计思考在初次添加店铺内容的时候,对很多功能板块都不熟悉,比如 CRM 分配、超级会员等,虽然能感受到小鹅通系统的强大,但对于刚入手的商家,则会产生很深的焦虑,不知道这些功能如何设置和使用,也无法感受到这些功能对店铺运营的帮助。音频「音频」也是一种常见的内容形式,可以设计讲书、广播等产品,用户可以在地铁、公交等场景收听。「音频」的新建流程、商品管理功能和「视频」相似,我们不再赘述。图文「图文」也是一种常见的内容形式,可以为学员提供付费阅读等类型产品,「图文」的新建流程、商品管理功能和「视频」相似,我们不再赘述。迭代建议付费阅读其实是知识创作者非常喜欢的方式,小鹅通虽然设计了这个功能,但前端的界面设计并没有根据图文内容传播的特点设计,所以用户体验并不理想,显得非常鸡肋。电子书「电子书」对于出版社等用户群体,是一个刚需功能。在上传电子书文件以后,系统可以自动解析书籍章节,轻松完成电子书在线管理和售卖。其次在店铺前端,用户可在手机端阅读,支持区域触摸翻页、章节试读、划线、书签、更换背景等功能,阅读体验非常友好。「电子书」的新建流程、商品管理功能和「视频」相似,我们不再赘述。AI 互动课随着近两年 AI 技术的发展,小鹅通也加入了 AI 互动课的内容形式。商家可以利用 AI 互动形式的课程内容,搭建具有沉浸式场景的课程学习形式,实现个性化、趣味性、强互动的授课形式,不过搭建成本相对较高,更适合于有特定需求的客户。新建流程「AI互动课」的新建流程分为三个步骤,分别是填写基本信息、制作课程内容和填写售卖信息。在「基本信息」,商家需要输入课程名称和详情页等信息。进入「课程内容」以后,左侧提供了内容组件(文字、图片、音频和视频)、题目组件(单选题、多选题、不定项、判断题和填空题)和其他组件(章节标题和附件),商家可以根据自己的需求加入组件进行设计。商家在填写售卖信息以后,就可以进行上架销售。专栏专栏「专栏」可以将多个单品课程打包成系列课销售,比如常见的付费专栏、连载小说、有声读物等。「专栏」建立后,进入详情页,可以在「目录管理」添加专栏商品,还可以对专栏的商品设置排序和设置试看。其他功能和「视频」相似,我们不再赘述。大专栏「大专栏」就是「专栏」的父级,可以将多个专栏进行打包,组合成专项学习专题,打造学员深度系统学习方案。训练营「训练营」相比「课程」,是一个动态的服务。商家根据某个学习主题,集中式、计划式、督学式地学习。「训练营」也是一种常见的引流手段,通过打卡、签到、学习,可以快速帮助商家进行传播拉新。新建训练营商家建立训练营以后,需要建立营期才能开始招生。营期的建立分为营期基础信息、营期课程和售卖信息三个步骤。在「营期基础信息」,需要设置开课信息,包括招生时间和开课时间;其次支持设置三种目录解锁模式,自由模式(无门槛自由学习)、闯关模式(完成任务才能继续学习)和日期解锁(每天只能学习一定数量的课程)。在「营期课程」,商家需要添加训练营的学习任务,可以加入店铺的课程内容,还可添加打卡、考试等助学工具,增强督学效果,提升用户活跃度。会员「会员」是商家可以打包特定商品内容(包括专栏和商品)进行销售,它的功能流程和「专栏」功能相似,在建立「会员」后,进入详情页的目录管理才能添加课程商品。这个功能可以帮助商家聚集一定量级的忠实粉丝,实现店铺的稳定收入。设计讨论不知道是不是语义的问题,我对「会员」这个功能有很多不理解,首先感觉和「专栏」很相似,其次和「超级会员」也有点傻傻分不清楚,所以在体验的过程中,花了很多时间去学习研究。体验小结从小鹅通支持的 7 种内容形式来看,它几乎覆盖了所有的知识付费内容,视频、音频、电子书、专栏,甚至还有 AI 互动课。这足以满足各种知识用户人群的内容要求,不管你是销售录播课、音频课还是文字专栏,小鹅通真正的实现了一分钟拥有自己的知识店铺。② 互动工具「互动工具」包含了打卡、考试、练习、作业本、题库、证书、表单、活动管理、随堂检测、测试活动和付费问答 11 种工具。打卡「打卡」是一个提升用户活跃度的运营工具,通过持续的打卡输出,不仅可以帮助学员养成一些比较好的行为习惯,还可以帮助商家提升用户付费转化。「打卡」分为日历打卡、作业打卡和闯关打卡三种形式。日历打卡「日历打卡」是以“天”为单位的打卡模式,学员需要每天在有效时段内提交打卡内容,比如每日英语学习打卡、早睡打卡等。a. 新建流程「日历打卡」的建立有两个步骤,分别是设置打卡信息和打卡介绍设置。在「设置打卡信息」,分为基本信息、打卡规则和其他设置三个内容。「基本信息」可以设置打卡的起止日期、打卡时段、提醒方式、每日打卡次数、可补打卡次数、参与条件和打卡规则等;「打卡规则」主要是设置用户打卡的内容类型和范本;「其他设置」可以帮助商家关联超级会员和指定商品文件。在「打卡介绍设置」步骤,需要添加打卡的封面图和详情页介绍,完成后打卡建立添加成功。细节侦查如果不是亲自新建一次「打卡」,你根本无法理解一个小小的「打卡」功能竟然会如此复杂,包含的场景和功能竟然会有这么多。b. 打卡详情页「打卡」建立以后,可以进入打卡的详情页,主要分为日记管理、任务管理、学员管理、分组管理、助教管理、激励设置、运营设置和数据分析 8 块内容。「日记管理」主要指用户在前端的日记打卡,老师可以根据学员的日记进行评论、置顶、加精和删除,还支持批量导出日记。「任务管理」是指给学员布置学习任务,帮助学员更好地学习。「学员管理」主要提供对打卡用户的管理,比如查看学生打卡详细资料和暂停打卡等。「分组管理」支持老师对打卡的学员进行分组,提高管理效率。「助教管理」支持老师添加助教,助教可以对学生打卡进行点评、删除和精选等操作。「激励设置」是指为了鼓励学生坚持打卡,老师可以设置证书、返学费和积分这样的形式来吸引学生参与(证书和积分我们在下面会单独讲解)。「返学费」是一个打卡活动中常见的营销方式,学员完成指定的任务就可以拿到打卡费用的返现,这样不仅可以筛选精准用户,也可以提高用户的打卡积极性。「运营配置」主要包含配置日签和邀请卡两个部分。「日签」是一种吸引用户传播的手段,通过个性化和精美的日签设计,不仅可以体现活动特色,还能激发学员的收藏欲望,最终吸引用户主动传播,拉新引流。「邀请卡」也主要是为了激发学生传播引流,不仅设计了精美的邀请卡片,还支持老师自定义设计,以及直接引流自私域社群。「数据分析」是对整个打卡的数据进行全面的分析统计,包括当天打卡人数、打卡次数、新增学员、点赞数、评论数、加精数等等,通过精准的数据分析,可以为商家运营方案提供支撑。作业打卡「作业打卡」是以布置“作业”的形式打卡,这种打卡方式可以加强教学质量的检验,让学生产生完成作业的紧迫感,督促学生进行学习。闯关打卡「闯关打卡」是以“关卡”作为单位的打卡模式,这种打卡形式由于自身具备游戏的挑战性,所以能够有效刺激学生为了拿到更好的成绩而努力打卡,从而提升用户参与度和积极性。考试「考试」是用来检测用户学习效果的学习工具,商家可以通过考试情况得到学习效果反馈,可根据考试反馈进行后续课程优化。新建考试「考试」的建立分为三个步骤,分别是设置考试信息、选择试卷和发布。「设置考试信息」又分为基本信息、信息采集、考试设置、题目分值和结果设置五个内容。「基本信息」需要填入考试的基本信息,选择需要关联的课程;在「考试设置」,老师可设置参考考试的时间、考试时长、考试次数等;在「结果设置」,可以选择考试完就展示成绩、题目和答案。在「选择试卷」步骤,可以创建新试卷,也可以从试卷库中选择已设置好的试卷,其次还可以设置考试通过分数的成绩。添加试卷以后,管理员可选择立即发布、定时发布以及开启微信服务号通知,帮助学生可及时获取考试的消息通知。考试管理在学生开始考试以后,后台会生成考试数据,商家可查看考试的详细情况,包括批阅、统计分析、老师管理、设置证书等。练习「练习」满足了商家售卖已有题库题目,为学员提供自主刷题练习工具的需求,而通过反复练习,可以提高学员学习效果,有助于提升用户的活跃度和留存率。新建练习「练习」的建立包含基本信息、练习设置、商品信息、私域引流和信息采集五个步骤。在「练习设置」,管理员需要关联题库,设置答题的出题顺序(包含随机和按顺序),题目数量和考试难度;「商品信息」可以设置「练习」是否付费,或需要参与关联课程才能学习;「私域引流」和「信息采集」是公共组件,我们在上文已经解读过,不再重复。练习管理学生开始练习以后,后台可查看学员的练习数据,包括练习参与人数、每道题目的正确率等,这些数据可以帮助商家及时调整运营方案,或针对性对学生进行讲解授课。作业本「作业本」主要帮助老师和学员在课程后续实现互动和答疑,不仅可以加强学生对知识的学习,帮助老师了解学员学习的状态,更能提升用户活跃度。新建流程管理员需要先建立一个「作业本」,这个流程比较简单,输入名称以后,选择关联课程,还支持关联「圈子」(一个用户运营的重要功能),老师布置的作业会在课堂互动和作业动态显示。「作业本」建立以后,管理员可以布置「作业」。「作业」分为手动布置(新建)和题库布置(从现有的题库中直接选择)。「手动布置」需要输入作业名称和作业内容,支持上传图片和音频,填写完成后,作业创建成功。题库「题库」需要配合作业、考试和练习场景使用,为这些工具提供数据支撑。题库「题库」支持添加单选题、多选题、不定项选择题、判断题、填空题、问答题和材料题等多种类型。添加也非常简单,管理员选择好题目类型以后,填入内容就能新建成功。「批量导入」是为管理员提供批量输入题目的工具,按照系统提供的输入范例格式,系统可以一键识别出题目,轻松录入。「Excel导入」也是一种常见的导入形式,不过需要按照系统标准的批量导入模版,才能实现批量导入。试卷库「试卷库」是题库中题目的组合,可以看作是「题库」的父级。管理员可按照自己的需要把题目手动或自动组合成试卷,在考试、作业等场景中就能及时调用,提升工作效率。「试卷库」的新建流程包括设置试卷信息和组卷两个步骤。在填写完试卷基础信息以后,在「组卷」步骤,可以选择「手动选题」和「系统抽题」。「手动选题」就是管理员从题库中逐一手动选择,准确率较高,而「系统抽题」则是系统根据管理员的题型设置随机抽题,具有随机性。证书「证书」可以为学生带来成就感,激励学生坚持完成任务,当学员通过考试、完成作业以后,管理员可以向学员颁发证书,最终提升用户活跃度。「证书」的建立包含基本信息、发放规则、证书样式、证书信息、发证信息和证书分享六个内容。在「基本信息」,管理员可选择证书类型,包括考试证书、打卡证书、圈子证书等,另外,证书需要关联对应的考试。在「证书样式」,系统提供了数十种系统样式,管理员可根据自己的偏好和品牌VI选择,其次也支持自定义样式,上传设计好的背景图片即可生成。在「证书信息」,管理员可以编辑证书标题、获奖文案等,还可以加入鼓励文案,吸引用户传播分享。在「发证信息」,可加入发证日期、证书编号和发证印章等,突出真实性。在「证书分享」,可以添加分享语和二维码,通过学生的分享,为商家拉新引流。表单「表单」是运营者用于发起问卷调研,自定义收集用户信息的社群功能。它可以帮助商家收集用户需求和反馈信息,通过对用户的调研分析,进一步设计和优化运营策略,从而为用户提供更精准的服务新建流程「表单」的建立分为三个步骤,分别是编辑表单、表单设置和表单发布。「编辑表单」分为三块内容,左边是组件和外观,管理员需要从这里选择内容,比如单选、文本框等。「组件」包含基础组件(单选、多选、下拉菜单、文本框等)、描述分割(文本描述、图片、分隔栏)和个人信息(姓名、性别、年龄等),「外观」可以设置表单底色、标题、选项内容字体大小和颜色。选中内容以后,中间为表单编辑区域,可以实现可视化编辑,包括调整顺序、删除等。右侧可以设置表单的字段和逻辑,包含基础设置、选项设置、逻辑显示规则等。在「表单设置」,可以设置用户提交的次数、回收方式(支持定量、定时回收)、微信分享信息和私域引流。在最后一步「表单发布」,需要关联对应的内容,比如相关视频、课程、专栏、圈子、训练营等内容,关联成功后,表单就可以发布。活动管理在店铺的运营中,举办线下活动必不可少,「活动管理」就是为了解决这个场景而设计。管理员可以使用「活动管理」功能组织线下活动,一站式完成线上发布活动信息、用户报名、收集报名用户信息、管理报名情况、现场签到等流程。发布活动「活动」的发布包含基本信息、票务设置、座位设置、报名信息设置和私域引流六个部分。在「基本信息」,管理员需要填入活动的名称、地点、时间、关联的课程等信息;在「票务设置」,可以添加免费票和收费票,设置票种的展示规则等;「座位设置」部分,还可以开启自动排座,活动座位由系统自行分配;在「报名信息设置」,管理员可以根据自己的需求灵活配置用户报名的信息,非常方便;「私域引流」可以帮助管理员在活动报名前后将潜在用户引流至商家的私域流量池。名单管理活动建立成功后,商家就可以发布活动,「名单管理」就是活动报名的详细数据,包含报名管理和签到管理。a. 报名管理「报名管理」主要包含了所有活动报名的数据管理,比如待审核、报名成功等,管理员可以在这个栏目查看报名用户的详细信息。b. 签到管理「签到管理」有两种形式,一种是用户自行扫码签到,系统会生成活动的二维码,管理员向用户展示扫码即可;另一种是商家主动扫码核销,工作人员进入票券核销页面以后,就可以对报名的用户进行扫码核销。随堂检测「随堂检测」是一个协助老师校验学生学习质量的辅助工具,它不仅可以提升学生对课堂知识的学习和巩固,还能有效防止学员挂机学习,提升学习效率。测试互动「测试互动」是一个通过设置轻量级的在线趣味测试,刺激用户活跃的社群玩法。运营者可根据用户特性设计测试题目,激发用户好奇心,活跃已沉淀的粉丝,增强学习过程的互动乐趣,同时可以设置根据测试结果给用户推荐课程。新建流程「测试互动」的新建包含了设置测试信息、添加题目和结果页设置三个步骤。在「设置测试信息」,运营者输入测试名称、简介和设置有效时间;在「添加题目」步骤,需要加入测试活动的题目,支持单选和多选;在「结果页」设置,需要设置测评结果,并可以向用户推荐指定的课程,进行付费转化。付费问答「付费问答」是一个为商家增加变现的工具,学生付费向老师提问,获取一对一答疑。「付费问答」需要先创建一个问答专区才能开启,有点像建立一个问答专栏。当用户在前端购买问答服务以后,运营者可以在手动邀请答主进行答疑。其次这个功能也设计得很完善,还支持设置用户围观价格和围观分成。体验小结在体验完这 11 个互动工具以后,我开始感受到小鹅通这个工具的魅力。从引流到激活、从留存到传播,这 11 个工具几乎能满足一个知识店铺运营多维度的需求。而让我最惊叹的是小鹅通产品的设计细节,比如一个普通的打卡功能,如果只是从前端体验看,你根本无法想象这些小功能的后台设置其实有这么复杂。而小鹅通为了降低商家的运营成本,几乎支持每一个功能版块自定义,给我最大震撼的就是「证书」这个功能,不仅提供多种证书设计样式,连证书内容的每一个字段,都可以在后台自行输入,无需任何加工,实在是太方便了。② 商品「商品」主要指实物商品和服务类商品的发布和管理,如果商家有周边商品,可以通过实物商品来上架,服务类商品则是指虚拟服务,比如 1V1 咨询、设计指导这样的虚拟服务。「商品」栏目的功能比较简单,我们就不过多赘述,大家可以亲自体验。欢迎关注作者微信公众号:「设计大侦探」本篇来源:优设网原文地址:https://www.uisdc.com/xiaoe-teach
苹果 产品 设计师 编者按:在以设计著称的苹果公司做设计是怎样的体验?这篇文章出自前苹果设计师 Andrea Pacheco,她如今是 Meta 的首席产品设计师,她在离职后详细梳理了她在苹果做设计所学到的10个经验,非常值得借鉴学习。以下为正文。工作了30年,当首席设计师Jony Ive离开苹果之后原标题:Jony Ive on Life After Apple原作者:Elisa Lipsky-Karasz链接:https://www.wsj.com/articles/jony-ive-apple-design-interview-profile-lovefrom-1166阅读文章 > 2021年,我找到了梦寐以求的工作。苹果是极简主义设计、革命性设计和创新的圣杯。在这里,特立独行的人可以坐在桌上工作,大胆而疯狂的想法是被鼓励的。作为一名产品设计师,在苹果工作是改变人生的经历,我只能说,未来无论我走到哪里,我都会坚持一些源自于它的一些原则。在苹果工作的一年时间里的收获很多,我总结了 10 条经验。简单总结就是:苹果是一家独特的公司,我相信他们进行产品设计的一些方法只有在他们的商业模式下才能成功,这种模式允许创新、失败、风险,并且对于设计工艺有着卓越的要求和高度的关注,哪怕这样的目标需要很长时间的努力才能达成。打造出色的产品,而不是最小可用模型。讲故事是作为产品设计师需要培养的最佳技能。自上而下的文化并不像我们想象的那么糟糕。免责声明:此处总结均基于我自己的经验,并不代表苹果的运作模式。1、澎湃的激情和伟大的设计同样重要当有足够多的人相信项目能成的时候,这个项目才有可能达成。从闲聊到决策制定再到高层决策,均是如此。我们说话、表达自己、阐明思想的方式,对于达成共识、影响他人再到推动事物发展,都至关重要。我最大的收获之一,是要让演讲充满激情,不仅仅是在介绍工作内容的时候,包括在会议上分享的时候同样要如此。当你对你的工作内容充满激情的时候,你理应向周围每个人展示你对此的激情。乔布斯能让他的想法更加易于理解,并且令人难忘,这种能力是惊人的,而这恰恰源自于他说话时的激情。人们可能不一定完全记住你说了什么, 但是他们会记住你给他们传递的感觉:自信、乐观、无聊、不情愿或者其他。归根结底,情绪和感觉的传达不应仅仅只应用在向客户销售产品的时候,对内部团队和利益相关方传递想法的时候,这种情绪传递的方式同样是沟通的关键。2、讲故事同样是设计师的超能力在苹果,最令我我感到惊讶的事情之一,就是做任何工作内容分享的时候,设计师都会认认真真为此做一套演示文稿。而所被分享的工作内容可能仅仅只是一件小事,比如最近工作进展或者一次小迭代。但是在苹果内,设计师会尽力用好讲故事的技巧来影响每一个观看者,而不仅仅是把结果展示出来。在一次次的观看演示和亲身演示的过程中,我总结了一些小贴士:讲述故事而不是简单的解释过程每张幻灯片只关注一个点,不要因为幻灯片数量多就混淆了当前要讲述的内容,每张幻灯片只使用一个加粗的句子,而不是直接罗列整段内容。使用注释来承载你要讲述的内容,而让幻灯片本身来呈现你所描述的内容。演示过程需要排练。即使只是针对一个小设计的演示,也提前1小时去会议室来回顾内容,确切地梳理清楚你之后站在台上讲述的内容,怎样开始如何收尾。享受这个过程!3、大创意和长期目标更重要我注意到一件事情,大多数的产品团队不会将他们的精力过多投入到小胜利和小问题修复上。相反,整个团队会更加基于长期影响来打造下一个重要产品上。这种长期注意的思想在苹果内部很常见,但是这也解释了为什么每年 WWDC 和发布会上总能看到一些让人大吃一惊的新功能,但是与此同时,之前系统中的某些可用性小问题,还没得到修复。这种情况可以归结为是公司文化。苹果以品牌创新而闻名,因此用户很自然地期望苹果能努力发布新产品,有创新性、革命性的产品,而这种期望也自然而然地影响着公司的决策。而我想学习的是这种长期注意的思想,如果想要创新,要着眼长远而不是眼前的小胜利,即使抵达目标要更长的时间。4、相信直觉,你就是专家理想情况下,每当我们进行设计的时候,我们都会事先进行用户调研和测试,发觉可用性和可访问性上的问题和潜在风险。但是在苹果,有很多产品都很难进行开放的用户调研和用户测试,想象一下,消息传到外界,所有人都会好奇下一代产品到底会有哪些功能。所以,你需要找到新的办法来测试你的设计,同时又不影响保密。还有一种办法,是挑选一部分内部员工来做内部测试,而与之相对的另外一种方式就是专家评审。专家评审的时候,通常会邀请设计总监、分管产品的高级副总来进行评审和讨论,这种情况下风险就很高了,你必须详细说明每一个设计决策背后的意图和想法。你可能会觉得这种决策方式更容易带有偏见,但是经历过多次之后我发现,这种设计决策会议比我参加过的绝大多数用户测试都更有价值。在这个过程中,不断的有人挑战你,挑出设计的细节不断「拷问」你,你可以发现真正的聪明人都会关注哪些用户体验,而他们又是从哪些角度来优化体验的。在这个过程中,你需要相信自己的直觉,你需要保持自信,沉着地应对,你自己也是可供倚靠的专家——无论是做产品设计、用户调研,还是应对专家评审。5、成为有全局思维的战略思想家人们常说苹果是设计师最理想的公司,我想这主要是因为成为苹果的设计师之后,可以专心将时间都投入工艺的精进和执行上,专注产品的表现(交互设计)和外观(视觉设计),以及如何让用户感受到整个苹果生态一致性和拓展性上(系统设计)。为了让设计师能够专注于设计和执行(同时掌握细节),这需要有一个相当智慧的产品团队,能够将产品思考和战略做得相当细致到位。作为产品设计师,我目前负责交互和系统设计决策,不得不说我错过了不少产品决策的机会。6、洞悉超越当下问题的 One More Thing也许你还记得乔布斯说「One More Thing」时给人的惊喜,其实这也和苹果内的工作模式有关联。追求「One More Thing」并不是强制性的,但是有很多人喜欢这么做,老实说,我也很喜欢。这是一种「彩蛋文化」。正如我前面所说的,一切都关乎「演讲」,所有的展示也都在演讲台上。而「彩蛋」会放在演讲展示的结尾,它的存在意味着你的产品或者探索并不止步于当前的结果,它有延伸出的彩蛋,有更高的目标,有全新的胜利方式。总而言之,这是推动团队进行更广阔思考、寻找未曾设想道路的契机。我喜欢这种文化的地方在于,它为设计师提供了一个安全的空间来拓展创意,获得更多利益相关者的关注,没有「必须」构建出结果的压力。如果它得到认可,那很好,如果没有得到认可,反思和建议同样价值千金。7、极简设计真的很难但是当你达成极简的设计目标的时候,那种感觉无可比拟。8、始终追求创造卓越的产品当你在购买苹果产品的时候,你不会期望它依然处于测试阶段,你希望拥有的一款高素质、高性能的产品。这种源自于硬件开发的文化,也同样反映在苹果的软件和服务的开发当中。记得我和 Apple TV 的产品团队开会的时候,当时 Apple TV 的产品尚未成熟,TV 端的体验尚未优化到位,有人提出可以在网络和移动端上提前上线。当时产品总监说:「如果我们不能在所有平台上提供最佳体验,就根本不会上线。如果这一天需要我们等待一年时间,那我们也会等。」听到这个话的时候我感到相当震惊,在我的职业生涯当中,产品经理少有为了给用户最佳体验而不断延迟发布。这种精益求精的文化在苹果内是一种普遍存在的现象。很多人抱怨苹果经常会花费很长的时间才上线对手已经拥有的产品和功能,但是这些功能大多有着更高的成熟度和惊人的体验,而且我相信这种开发文化只会在苹果存在,因为唯有这样的商业模式才和这种文化相得益彰。9、学会说不这是我在职业生涯中学到的最好的经验。学会说不,意味着要学会确定任务的优先级。我们的大脑能够接纳的信息是有限的,将精力投入到能产出最大影响和效果的项目、活动,这是非常重要的。而且,在大型科技公司,总会有令人兴奋的项目和机会,你很容易参与到不同的项目当中去,所以千万不要贪多,学会说不。「人们总认为专注就意味着你需要对手头的事情说是,实际上并非如此。这实际意味着你要对一百个好主意说不,你要慎重做出选择。」乔布斯10、自上而下的文化并不都那么糟糕苹果最显著的特征之一,就是它是一家自上而下的公司。这意味着在公司内,设计师和产品研发等都都需要向董事、经理等管理人员展示工作内容,并且获得批准之后才能执行。我的总监和设计主管有时候不同意我的意见和观点,我后来才发现他们都是对的。那是因为,在苹果大家通常都不会带着自负态度来做决策。这里的工作者大都是纯粹的最佳用户体验的追求着,所以,当有人不同意你的观点之时,通常他们都有着足够充分的理由,对事不对人。而这里同样有着一个安全和开放的空间,供大家进行健康的辩论,并且还提供全方位的建议来帮你完善想法。而这恰恰是我接纳苹果式自上而下文化的原因,重要而有效的决策可以更快地被做出。无论专家和领导是否通过了你的提案,最终都可以让项目保持良好的势头。在自下而上的企业文化之下,我时长需要花费几周甚至几个月的时间来打磨产品,过程中需要和 10+ 同事高频沟通来保持想法一致,而这个过程真的是令人筋疲力尽。在苹果的经历则表明,让一位有远见卓识的领导来做决策,确实可以节省时间,让我可以专注于工艺,而不是在项目管理当中虚耗光阴。本篇来源:优设网原文地址:https://www.uisdc.com/work-in-apple
氛围 兔年 用户 随着开工响声结束了兔年春节,相信兔年都会给我们带来好运和惊喜,让我们一起来努力和期待吧!在这个移动互联网时代中,相信手机也是伴随我们跨年的物件,而各类应用软件也为我们的兔年春节增添了许多乐趣。作为 UI 设计师,我们通过自己的创意让用户感受到不一样的兔年氛围,下面黑马哥带大家一起回忆一下。通过一些 APP 线上案例分析,看看 UI 设计师是如何营造兔年春节氛围感的。更多氛围感设计案例:如何营造氛围感?来看QQ游戏中心的实战案例!QQ 游戏中心作为服务于 QQ 玩家的平台,致力于为游戏玩家发现好游戏和提供游戏相关服务,如何在为玩家提供好游戏推荐同时,为他们提供好游戏相关服务,是我们需要探寻的设计平衡点。阅读文章 > 一、应用图标小空间里的氛围感应用图标的氛围感是提高用户打开产品的关键,作为春节氛围感的营造来说,是最容易让用户感知到的。在这个方寸内的小空间里面,也是设计师发挥创意脑洞的形式。通过兔年春节发生变化的一些应用软件分析,众多案例都在配色、文案、图形营造等方面进行设计发挥,也有结合 IP 形象装扮和营销活动主题等形式,增强用户对产品的情感化认知。二、顶部视觉区域背景营造作为应用软件的主界面来说,顶部视觉区域也是设计师发挥的一方空间。在氛围感的表现中也是非常利于发挥的,经常在一些节日庆典和主题活动时进行设计表现。结合春节元素和喜感的红色氛围营造,给软件带来了新春情感化,作为兔年春节来说,小兔子的元素也会被充分展现。除了兔子元素以外,也有运用灯笼、烟花、祥云等元素点缀,达到营造背景氛围的目的。三、营造图标设计氛围春节期间在图标设计上面营造氛围感是最为常见的,也最容易吸引用户的关注度。重点在金刚区图标和底部标签栏图标设计进行发挥,结合配色、节日元素和造型等方面进行设计,达到营造氛围的目的。图标风格多样和灵活多变的特性,无论是结合传统文化还是其他多样化表达,都非常利于设计发挥。除了在春节氛围中便于发挥以外,在其他主题活动中也是重点表达的形式。四、异形广告中的氛围和元素异形广告相较于中规中矩的矩形束缚来说融合性更强,更容易让界面上下的内容过度更自然。近些年异形广告穿插在界面中非常普遍,特别是在营造氛围层面效果也是十分突出的。由于特殊造型的设计发挥,便于设计师结合各类元素,营造贴合的界面氛围和强化视觉感。五、氛围浓厚的闪屏广告闪屏广告算是春节期间最常见的表达方式,无论是情感化的闪屏设计,还是结合营销广告表达,这里都是最容易出现在用户视野中的。闪屏广告的主题营造非常多,众多产品都会结合,创意发挥也是层出不穷。六、引导页中的风格氛围化引导页相对来说曝光度会比较低一些,大部分情况还是初次使用或者更新时出现,如果恰逢春节期间发生版本迭代也可以尝试营造氛围。可以在元素造型不变的情况下改变配色风格,也能起到营造氛围的作用。七、弹窗设计的氛围点缀在用户浏览内容或者操作功能时,弹窗可以辅助操作和理解,也可以作为温馨提示或者信息传递等。在春节期间为了渲染氛围,也会结合主题元素进行氛围点缀,带给用户更加情感化的感官体验。八、异形弹窗营造新春氛围在一些营销活动的配合中,弹窗通常会打破边界的束缚,异形弹窗更能吸引用户关注。也能更容易结合主题元素营造氛围感,特殊的造型更利于设计发挥,界面内的融合度也相对较高。通常结合兔子 IP 形象、红包和春节元素等,以质感风和 3D 建模形式表达居多。九、丰富界面背景氛围感丰富整个界面背景相对较少,也有产品会在部分界面或者界面局部卡片等场景中进行表现。氛围感的营造可以带给用户有温度的体验感,也能将春节氛围重点突出。十、沉浸式体验的活动氛围感沉浸式的体验能够吸引用户的参与感,比如春节期间的红包雨,融入到整个界面的设计中,以趣味性的形式满足用户心理。在不隔断与界面之间的联系,降低活动对用户的干扰,进而提高氛围感和参与度。比如高德地图在春节期间设计了放烟花的体验,用户可以在定位的任何地方点击燃放烟花,新添春节的氛围。将这一传统文化搬到了线上云端,也是提高体验度的不错形式。十一、营造氛围的专题页设计春节氛围感在各类营销活动中表现度是最高的,随着近些年新的技术和视觉表现力的提升,在视觉感的强化层面也是十分出色。无论是运用三维化还是插画风,带来的视觉张力都是非常棒的,今年各大产品呈现出来的设计感视觉表现力都非常不错。十二、互动性体验的活动设计随着视觉表现力的提升,提高用户对于活动的参与度要往游戏化和互动性等方面探索。比如抖音在兔年春节期间的活动设计,游戏化的互动体验增加了活动的娱乐性,用户的参与度也是可想而知的。也有通过自定义角色装扮的形式带来互动性的玩法,在氛围感十足的场景中送祝福,无论是娱乐性还是感官体验层面都非常不错。小结本文主要是对春节期间的一些设计案例进行了回忆,体验、分析和总结了一些优秀的设计点,希望可以作为日后灵感的来源。描述属于主观意识,不足之处大家选择性吸收,我们互相进步。本篇来源:优设网原文地址:https://www.uisdc.com/create-festive-atmosphere
人工智能 工具 你可以 大家好,这是 2023 年 1 月的第 4 波干货!想必很多设计师同学都已经回到岗位开工了吧?那么这些新的设计工具和素材,就有用武之地了!过了个年,新的图标字体图库倒是没增加,新的人工智能设计工具倒是多了一堆,更加细分的功能,更加突出的效果,从网页到移动 APP 都覆盖了,这个数量增长甚至催生了专门搜集整理人工智能工具的网站。今天的文章开头就是过年期间新崛起的 AI 工具,相当带劲。当然,在此之前记得看看往期干货中有没有你感兴趣的素材:第三波!2023年1月精选实用设计干货合集大家新年好!阅读文章 > 下面我们具体看看这一期的干货:1、人工智能演示文稿生成工具https://glimmerai.tech/人工智能P图早就不是新鲜事儿,现在你也可以使用 AI 做演示文稿了!这个名为 Glimmerai 的工具就可以帮到你,你所需要做的就是尽可能详细描述你的需求,这样 AI 才能尽可能贴近你的目标,等 AI 生成之后演示文稿之后,你可以进一步使用文本指令或者语音指令,来进一步细化。GlimmerAi 使用的是目前最热门的 GPT-3 和 DALL E2 来生成,目前这项服务依然处于 Beta 阶段,可以免费试用,有需求的同学可以上手体验一下。2、人工智能网站UX文案重写工具https://www.usesuperflow.com/rewrite-chatgpt和上面的 GlimmerAi 类似,Superflow Rewrite 同样是一个基于人工智能、但是更加深入细分的工具,它瞄准了工作量同样巨大且磨人的网站 UX 文案这个分野,相比于形形色色的 AI 文案写作工具,它干脆帮你直接在网站内优化 UX 文案,只要你在网站上加入 Superflow JS 的标签,就可以接入 AI,它会根据已有的训练数据,帮你将 UX 文案优化到最佳,提供更好的 SEO 效果,在 UX 文案的层面上,提供更好的转化率和用户参与度。目前 Superflow Rewrite 提供 3 个月的免费试用,如果你是网站开发者,可以尝试一下。3、人工智能移动端内容创建辅助工具https://piggy.to/magic正如同 Piggy Magic 的创始人 Shaul Olmert 所说的,咱们不能将内容创建的工作完全托付给人工智能,但是人工智能能够成为很好的内容创作的辅助工具。Piggy Magic 就是在这样的想法下诞生的,你可以直接将你想要创建内容的主题直接输入 Piggy,它会直接生成易于在移动端屏幕上浏览的多媒体图文内容,文章、帖子、邀请函、简单的演示文稿都行,随后你可以在 Piggy 的 APP 上进行调整和修改。将精力集中在想法上,将基础的版面和内容交给 AI 吧。4、汇总 200+ 精选的优质人工智能资源https://aidesignresource.com/如果上面的基于人工智能的工具里,正好没有你所需要的,不妨打开这个名为 Ai Desiger Source 的网站,它从目前乌泱泱的 AI 工具当中精选出素质较为过硬的、实用性较强的 200 多个,并且根据功能分门别类,你可以在这里快速筛选出可能你需要的 AI 工具!我已经收藏了!5、将 Figma 设计直接转为 WordPress 网站https://yotako.io/WordPress 有着极高的自定义自由度,但是第三方的主题也很难一次到位满足实际需求。而 Yotako 提供的这个免费服务干脆从设计端入手,你可以将你在 Figma 中设计完成的页面以主题的形式直接导入到 WordPress 当中,并且随时更新。当然,Yotako 所提供的服务实际更加深入,如果你还未曾拥有域名和实际网站,Yotako 还能帮你搞定网站相关的域名服务、托管、设置、日常管理等多数工作内容,而你唯一需要操心的就是设计。有需求的同学有必要了解一下!6、直接在网页上进行团队协作的插件https://donenote.com/DoneNote 是一个针对性和实用性很强的插件,它让你可以直接在网页上做笔记、标注、评论、分享的 Chrome 插件,如果你的团队需要针对自家的网站页面或者产品进行讨论或者迭代,直接在页面上标注讨论就完事了,极大地提升整个团队的工作效率。DoneNote 的基础服务是完全免费的,你可以先试用体验一下。7、在线 Notion 封面制作工具https://notioncovergenerator.com/app现在使用 Notion 做笔记、知识管理、流程和项目管理的同学特别多,为每个 Notion 页面设计一个漂亮的、贴合的封面图倒也是不小的需求,这个在线的小工具就是专门干这个的,尺寸都是算好的,填好你要的文本内容,选好字体,一键下载,还能预览在桌面端和移动端上的效果,简单快速不用开 PS,省心多了。本篇来源:优设网原文地址:https://www.uisdc.com/2023-1-design-resources-vol4
字体 趋势 视觉 编者按:蒙纳最近放出了他们对于 2023 字体视觉设计趋势的分析报告, 作为世界上最有影响力的字体设计和服务供应商,蒙纳对于整个字体设计行业有着深入的洞察和细腻的感知,而这份报告和往年的报告类似,对于 2023 年全年的字体设计趋势有感性而具体的预测,同时每个趋势结合具体的案例进行了展示。为了尽可能清晰直接地呈现,我将会对整个报告做一定程度的脱水处理,尽可能直观快速地将 2023 年的字体设计趋势呈现出来。下面是正文。受限于过去几年的疫情影响,大家只能在虚拟背景下进行远程协作,而现在大家可以告别虚拟的海滩背景,真正走出去,灵感和创造力得以蓬勃发展,激情迸发。放开所带来的情绪上的改变,进一步体现在设计领域当中,俏皮和趣味开始在更多的设计作品中呈现,混搭、多样性和包容性也以图形化设计呈现出来,动效和3D也会更为深刻地嵌入字体和视觉设计,设计领域之间的界限会进一步模糊。随着用户周遭屏幕数量的增长,增强现实和虚拟现实这样的产品和场景将会进一步贴近主流市场,这也意味着相关的数字设计的需求会进一步增加。作为设计师,我们深知磨练技艺最佳的方式,始终关乎思考、质疑、挑战、欣赏和持续不断地实战。而这也是这份报告的意义所在,它是一份同时兼顾反思过去和指引未来的作品集,你可以在此稍加停留,但是更重要的是为接下来的一整年做好准备。顶级字体公司蒙纳出品!2022年10大字体设计趋势蒙纳公司最近刚刚发布了 2022 字体设计趋势报告,这份报告对于视觉、LOGO、平面、字体/字库设计师有着相当的参考价值。阅读文章 > 1、创造性混搭这是一个从去年开始一直延续到今天的设计趋势,它趋于成熟,并且一直在发展。这种趋势本身也相当贴合人的经历和生活:及其复杂、多样和丰富。2022 Communication Desing TDC 大奖得主是一个来自澳门的设计项目,出自 Indigo Design 之手,他们围绕着字体采用 Risogragh 来创造半调的质感,但是丰富的色彩和形态上的不同组合,将整套设计拓展 为均衡的设计作品。Figma 2022 的视觉设计和 Stepan Solodkov 的标识设计同样是典型的元素混搭,狂野的外表下隐藏着微妙的平衡。而 Marlon Studio 为 Wild Kombucha 所设计的 LOGO 的混搭方式则更加有意思,棱角分明的笔触和柔和有机感的笔触,无缝衔接在一起。很多类似的设计,甚至会采用动态设计。当然,还有的混搭设计会使用更加微妙的方式,比如 Bielke & Yang 为挪威一家名为 Sommerro 的酒店所进行的设计,两种有着类似特质的字体被巧妙地混合在一个 LOGO 当中,不同但足够和谐。这种不同但是足够俏皮的设计对于字体搭配有着更高的要求,而且很大可能性仅仅只适用于你自己的品牌。2、智能网格字体去年我们注意到「有机模块」这样的趋势,而如今,这种风格有了新的演变,将网格作为一种组织形式,使用四分之一圆作为笔触的过渡,将类似 NASA 的蠕虫式笔触应用到更加广泛的字体设计当中,更加细致精确的切割出现在字体当中,规整而细腻。Wolff Olins 为生物巨头 GSK 所设计的新 LOGO 就使用了这种方式,网格所提供的精确感被自然的曲线所消解,一种强调人和技术融合的理念借此呈现。3、漫画超英风这种略显复古的视觉设计趋势的复兴有点让人猝不及防。这种经常出现在美式漫画封面标题式的字体设计,通常都有着醒目的几何特征,带着阴影和明显的透视,形状和用色都非常的扎眼。这种漫画超英风字体可能是受到当前超英文化的影响,它响亮而充满趣味,毫不避讳地张扬。设计机构 &Walsh 为葡萄酒 Stompy 品牌所设计的 LOGO 字体更加现代,告别了传统葡萄酒品牌那种传统沉重古朴的气质,带着透视和硬阴影,搭配更加鲜亮的色彩。位于布鲁克林的设计机构 Order 为名为 Forward Majority 的机构所进行的品牌设计也采用这样的设计,力量感十足。4、极致冷静风这种将极简和沉静、冷淡结合到一起的设计,可以在很多生活方式类的品牌身上看到,它大概也是一种永远不会消失的潜在设计趋势。它通常采用的是黑白灰为主、简约的、居中的视觉设计特征,营造出一种安静、沉稳冷静的气质,尽量少用文本字体,减少 LOGO 和图标的使用,而它恰恰也是借用这种极致的简单在日趋繁复的品牌设计竞争中脱颖而出。品牌设计机构 Skinn 为家居品牌 Joli 所采用的设计,就充分体现了这种现代性和精确感,沉静而平和,让源自产品材质的视觉吸引力自然流露。5、切割式设计通过切割来呈现零碎感和锐利感也是一种趋势,这种趋势在某些时候看起来会有点像像素,它给人的感觉会具有速度感和科技感。而切割本身会增加字体的速度感,如果角度得当甚至让人觉得动感。比如知名的科技媒体 The Verge 就在去年进行了重设计,新的 LOGO 采用了这种切割效果,有种令人眼花缭乱的动感。科技领域发展迅速,而 The Verge 借用新的字体设计来呈现潮流感。有的切割是从边缘开始,有的则是从中心开始的。陷阱式的切口设计能让字体设计拥有截然不同的趣味感,负空间和正空间一样重要。Valenlim Studio 为 Konnichiwa ZhongShan 这个活动所设计的字体就趣味十足。而名为 Koto 的日本工作室为 Boxy 所做的品牌设计也采用了类似的方式,这个初创企业的业务是将集装箱改造为法国郊区的自动化便利店,他们的名字有像集装箱致敬的意思,设计上,Koto 保留了字体的棱角曲线来降低字体的工业感。6、趣味像素化像素风的游戏是我们对于数字工具热爱的延续,是怀旧情绪的落脚点。有的像素化设计会将特征化的元素置于字体当中作为焦点存在,还有的设计则是将它单纯视作漂亮的装饰。像素风可以营造出复古游戏感,这种趋势是对早期数字化设计的一种致敬。不过这种将基础元素变为小方块的设计方式并不会消解设计的复杂度,就像乐高一样,你同样可以玩出花样。英国 NB Studio 为 Kudo 所打造的新设计就充满了平易近人的感觉:7、动态的肌理任何流动变化的东西都会更加吸引人注意力,无论是动画效果还是可变字体。即使是在静态的图像当中,带有倾向和变化趋势的字体设计,都会有动感。屏幕允许更多动态视觉内容,这也变相影响着用户对于内容「动态」的需求,所以字体设计也最好有流动的肌理。来自底特律的 Hobbes 工作室设计了一种独特的字体 Aerial,这种字体是借助 AR 和 VR 来实现的,字体借由无人机在空中拼合而成。另一个案例则是 UnderConsideration 找品牌设计专家 Sultan Jum 所设计的怪异字体,他使用 Nuform Type 的 Ozik 所创作出来的奇异设计,充满一种动态的怪异感。8、拓展和强调我们之前曾经设想过 3D 建模在字体设计当中的应用,现在就已经发生了。这是因为现在的设计师有着比几十年前更强的算力、更好的工具和更加复杂的技术吧?3D 建模和动效设计是否已经成为如今平面设计当中的标配了?设计的边界变模糊了,字体设计的技术和呈现形式都在拓展。Pentagram 为美国最大的艺术和认为基金会,Mellon Foundation 所设计的 M 字母就反映了当前的现状。整个字母采用了更加中性的色彩和材质感,同时它借助3D 建模和纹理渲染并且在呈现上,加入了动画,在外在形态上,它又能唤起人对于雕塑、舞蹈和写作等艺术形式的想象。如今已经不再是玩具总动员塑料感十足的时代,金属铬、玻璃和木纹才是如今的新标准。Red & Grey 为欧洲建筑师委员会所设计的新 LOGO 则在字体设计上采用了视错觉的技巧,这种跨领域的视觉手法暗含了双重性和对话的重要性。通过膨胀的方式来强调和拓展,也是最近几年呈现出来的明显趋势。品牌指南工具供应商 Brandpad 推出视觉设计就很好的体现出这一特征:而冰激凌品牌 Nuvem 给人的感觉也相当的蓬松:9、液化的形态液化的设计形态能够制造出奇异的体验,而这种设计也最值得关注输出效果的易读性和可读性。这一设计趋势也是去年设计趋势的延续,而且比起去年藏在酸性设计当中,今年的液化字体设计开始无处不在,从汽水到咖啡,无处不在。Swerl Coffee Roasters 是一个 1972 年从面包车后座上开始起步的咖啡品牌,Andreas Pedersen 绘制了一个时髦的液态感十足的字体,让人想起拿铁咖啡表面漂浮的泡沫。巧克力品牌 Dirtbag 同样采用了液态膨胀的字体,粉色的主色调和字体形成了强烈的对比,俏皮而令人心生好感。10、AI 生成设计我们仍然处于人工智能设计工具的初期,但是发展速度也相当惊人了。人工智能工具正在改变艺术和设计领域,我们目前尚且不知道最终的结果会是怎样的。人工智能正在加速原型设计和构思过程,为设计师的深入探索流出足够的空间。使用人工智能生成的字母通常有着拼贴式的外观,接缝的位置有时候会有一些柔和的污渍和处理。有时候 AI 生成出来的字体会非常的奇怪,但是这也可能会促使艺术家和设计师注意到某些未曾设想的道路。工业革命带来了革新,但是更多的利润被企业吞吃,大家依然需要花费大量的时间在工作上。人工智能到来后设计会变的更好吗?设计师的生活和工作会变得的更好吗?本篇来源:优设网原文地址:https://www.uisdc.com/monotype-trends-report-2023
互动 用户 贴吧 本文搭建“信息更易懂”、“路径更顺畅”、“玩法有惊喜”互动系统设计方法,焕新 19 岁贴吧互动体验,提升用户活跃。往期改版案例:上亿人使用的百度贴吧,是这么做设计改版的!随着产品的发展和用户群体的演变,用户对产品的认知也在发生变化,当用户认知和产品形象发生偏差时,体验升级就势在必行了。阅读文章 > 大厂出品!百度数字人设计改版实战复盘通过构建伙伴认知、满足情感互动、增强沉浸体验等手段,增强 AI 伙伴的曝光率,进一步向用户传达智能搜索感知,促进搜索行为转化。阅读文章 > 前言良好的互动氛围是社区产品的核心,贴吧作为一款近二十岁的社区产品,设计师秉承年轻包容的产品理念,始终在探索属于贴吧的特色互动形态,在这过程中,希望通过互动系统设计方法,升级贴吧互动体验,培养用户心智,形成良性互动链路,最终提升用户活跃。一、探索互动系统的设计方法较为简单的互动形态为作者生产内容,浏览者为喜欢的内容点赞、回复,甚至私信创作者,这些互动行为会激励创作者继续生产内容。基于以上互动形态我们搭建了循环互动系统,创作者为浏览者供给内容后,我们需要在互动环节引导互动行为发生,在触达环节优化互动信息触达,在反馈环节引导参与互动反馈,从而形成正向循环。结合实际的项目经验我们发现互动系统运转离不开“信息更易懂”、“路径更顺畅”、“玩法有惊喜”这三个要素。二、寻找贴吧互动设计机会点贴吧的角色是由创作者—楼主、浏览者—吧友组成,良好的产品运转模式为:创作者向浏览者生产供给内容,浏览者对其互动激励。但贴吧多年来互动链路中断,导致从互动到供给无法形成正向循环。1. 特色场景洞察问题贴吧的场景及形态广泛,与其他产品有所不同,具有内容形式多样、浏览场景独特、互动类型广泛、回复逻辑精细、互动玩法多元等特点,通过走查上述特色场景发现诸如链路中断、功能缺失、结构混乱、内容丢失等问题。2. 下探设计机会点基于以上问题的共性,我们可以从中总结出核心体验断点:看不懂:回复列表内容结构不合理、收藏后看不懂更新的楼层内容;看不到:Push 通路不稳定无法触达用户、大多用户关闭推送 push;没意思:赞、回复等互动方式老旧,刷贴、签到行为重复,没有特别的玩法。下面会使用上述总结的互动系统设计方法,对贴吧现存问题进行体验升级,提高用户的互动积极性。三、 互动系统设计方法应用举例1. 信息更易懂贴吧的回复场景多,逻辑复杂,创作者与浏览者在看到对方的回复后,内容展示需要易读易懂,彼此才会有意愿回复反馈。① 查看列表—优化结构查看评论列表的旧体验存在回复对象错乱、内容缺失的问题,新体验根据语境自由展现原贴、楼层、楼中楼三层结构,承接上下文关系,降低用户理解成本,并将其复用在查看点赞、查看@ 等场景中。② 查看详情—精准定位点击列表页后的精准定位也是易懂的关键,我们对内容被折叠、定位不准旧体验问题进行优化,新体验默认展开原贴及楼层内容,细化点击贴子、楼层、楼中楼后的定位逻辑,帮助用户精准看到想看到的内容。③ 继续消费—延长步长用户从回复列表进入查看详情页后,旧体验只展示当前的评论楼层,看不到上下文内容。新体验在定位楼层前后增加楼层内容,同时通过“查看之前楼层”和“加载之后楼层”方式继续浏览,延长步长。2. 路径更顺畅产品的推送 Push 向用户推送感兴趣的信息,需要稳定的触达用户且有意愿打开,才能达到召回用户目的。① 打开推送开关—场景引导旧体验引导开启 push 场景缺失,方式过于生硬,新体验选取贴吧高频互动场景,在用户签到后、回复后、发布后选择合适形态展现引导,提高推送通知打开率。② 展示推送—有吸引力旧体验互动 push 内容表述凌乱,新体验将 push 内容结构化,以“用户昵称+动作+互动对象”的结构展示推送内容,并强化互动用户的头像,适当展示互动详情,吸引用户点击。3. 玩法有惊喜贴吧点赞、回复等互动方式存在多年,缺乏新颖性,用户互动心智疲软,急需通过轻量、有趣的创新玩法,刺激浏览者互动。① 新增动态表情结合贴吧元素,补充单击、长按、双击的递进互动点赞方式,给予用户感官刺激,提升点赞爽感。结合时效性运营活动,增加高考、劳动节、618 活动点赞,营造惊喜感。首次私信提供贴吧 IP 表情,助力用户关系破冰。后续私信增加开香槟、丢炮竹以及丢炮竹炸滑稽双向互动玩法,持续提升用户互动意愿。② 新增潮流表态虚拟形式是近几年受用户喜爱的潮流表态玩法,探索虚拟形轻互动方式,互动后通过私信触达,并沉淀社交货币资产,进而引导双向互动。小结文本搭建的“信息更易懂”、“路径更顺畅”、“玩法有惊喜”互动系统设计方法,已将其运用在贴吧的特色互动体验升级中,并取得正向数据和用户反馈,希望该项目的设计方法及经验能为大家提供参考。欢迎关注作者的微信公众号:「百度MEUX」本篇来源:优设网原文地址:https://www.uisdc.com/tieba-design-revision
干货 素材 情绪 大家新年好! 提前给大家拜个早年!这是 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
红包 封面 品牌 新年好呀新年好呀,祝福大家新年好~(一阵 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
黑体 字体 个字 “黑体”结构清晰、简洁有力的字形风格能使版面显得庄重醒目并富有现代感。无论是识别性、适用面、视觉效果都非常好。本期推荐 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
素材 网站 高质量 大家好,这里是你们聊设计的花生。今天为大推荐一个包含超多字体和矢量设计素材的网站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
笔画 字体 粗细 本期推荐的是免费商用的卡通体,此类字体非常适合运用在可爱活泼、轻松休闲的设计中,会有不俗的表现力,常常能达到“画龙点睛”的效果。往期回顾:视觉设计师来收!免费商用字体推荐:圆体篇(12款已打包)圆体给予人圆润亲切的感觉,显得温润柔和、新颖活泼。阅读文章 > 整个字形向上倾斜,给人一种积极向上的感觉,而且横折和竖折的笔画都有弧线,没那么死板,无论是笔画结构,还是笔画粗细,都是灵活的,是一例轻松快乐风格的字体。字形笔画去除了折笔的弧形,换之以平直的笔画,竖弯钩转为竖折,同时弱化了钩笔画,省去了许多笔画末尾的小尾巴,显得更加直白可爱。整体形态采用了镂空的制作技巧,增强了字体的立体感。字体设计灵感来源于千图网 IP 千小兔的形象,将可爱的千小兔融入字体设计中,尽显年轻、活力与俏皮。适用于各类可爱、少女风的海报和店招场景。笔画粗细对比强烈,字形活泼,以拙为巧,趣味十足,充满童趣,让人觉得轻松愉悦。所有笔画以“圆润”为主,保留少量飞白,具有手写的韵味。在字形上淡化了棱角,笔画中间呈弧形外拓,将转弯的折角用平滑的曲线代替,部分笔画有规律的加粗,再结合圆润平滑的笔画,显得可爱个性,憨态可掬,轻松惬意。字体组合结构松散,重心不稳,字形偏长,起笔收笔锋利且粗细对比明显,笔画笨拙微带曲线感,具有诙谐幽默的效果。图片小可奶酪体字体笔画比较简单,都是中间宽两头窄的固定样式,笔画比较圆润,在转折处一笔形成的弧度,突出了手写感和趣味性。横竖笔画略带波浪,不完全平直,尽显俏皮可爱。字体笔画粗细排布均一合理,小字可读性较高。字体线条粗细适中,笔画随性,结构肆意洒脱,具有很好的识别性。猫啃什锦黑是一款可爱的马克笔手绘风格字体,其笔画活泼有趣萌萌哒,特别适合做可爱类、母婴类等海报的标题字体。仓耳非白是一款粗细对比明显、风格强烈、拥有 5 个字重的家族字体,结构方整,笔形简洁、利落,带有明显区别于其他字体的风格。Tips:如果安装后在 PS 或 AI 中找不到字体的话,请搜索「TsangerFeiBai」即可。字形结构灵活,选用粗细对比夸张的笔画,使字体更具视觉冲击力,搞怪的字型结构和出乎意料的空间调整让字体多了几分调皮可爱之气。笔画错落有致,打破了许多固有的排列模式,营造出天真烂漫的感受。欢迎关注作者的微信公众号:「艺海拾贝Design」 文件名 如何下载使用 文件大小 提取码 下载来源 免费卡通字体47.6MB8866 点此复制 登录下载 本篇来源:优设网原文地址:https://www.uisdc.com/cartoon-font
用户 功能 乘客 有人说它是全世界最牛逼的 APP,因为它的算法难度和春运期间访问量几乎是全球之最;但有人说它是全世界最垃圾的 APP,因为在使用这个产品的过程中,遇见很多奇葩、愤怒的体验。关于这两种说法,众说纷纭,本期设计大侦探,就来全面拆解铁路 12306APP,一起来看看这个产品到底是如何设计的,用户体验如何。往期拆解:上线即爆火!3600字完整拆解微信键盘的产品设计微信键盘发布啦!阅读文章 > 一、导读1. 内容结构全文 9700 字,分为六个部分,分别是导读、产品画像、出行服务、内容服务、思考总结和后记,你可以通过下面的思维导图对本文内容快速的了解。2. 适合人群第一类,UI/交互设计师,可以跳出执行层,全方位体验 12306 的产品设计,多维度去思考和总结如何规避类似的陷阱;第二类,产品经理/运营,通过全面的产品设计拆解、体验反馈,获取产品设计参考;第三类,旅游及出行相关行业从业者,通过对 12306 的全面拆解,获取竞品设计参考。3. 分析模型第一个,增长模型。由戴夫·麦克卢尔提出,包含用户获取、用户激活、用户留存、获取收入、用户推荐,分别对应用户生命周期中的 5 个重要环节,主要用于拆分和分析产品的功能价值。第二个,尼尔森十大可用性原则。尼尔森十大可用性原则是界面设计中最基础、最重要的设计原则,任何产品的设计,都可以通过这十个原则进行指导设计。尼尔森十大原则包括即系统可见性原则、环境贴切原则、撤销重做原则、一致性原则、防错原则、易取原则、灵活高效原则、易扫原则、容错原则、人性化帮助原则,通过这十大原则,可以对 12306 的产品设计体验进行全面的校验和侦查。用超多案例,帮你掌握尼尔森十大可用性原则尼尔森设计原则是人机交互学博士 Jakob Nielsen 于 1995 年发表的“十大可用性原则”。阅读文章 > 第三个,设计心理学。包括常见的格式塔原理、费茨定律、巴甫洛夫反应、72 效应、席克定律等常见设计基础理论。万字干货!15个著名的设计心理学原理和应用深度解析!“除非有更好的选择,否则就遵从标准”你是否有在听别人说某某原理法则时一脸懵 B 的时候?阅读文章 > 二、产品画像1. 产品介绍铁路 12306 是中国铁路客户服务中心推出的官方手机购票应用软件,主要为全国各地的乘客提供火车票预定、机票预订、汽车票预订等购票业务,首个版本发布于 2012 年 10 月 16 日,根据易观千帆数据,截止到 2022 年 10 月,12306 月活跃用户人数 6,923.78 万。2. 用户画像铁路 12306 的用户群体主要以男性用户居多,占比 65.04%,女性占比 34.96%;从年龄分布看,以 24-30 岁的用户群体最多,占比 36.52%,31 到 35 岁的用户占比 24.23%,36 到 40 岁占比 20.27%,41 岁以及以上占比 10.30%;从用户消费能力看,中高消费者占比 33.48%,中等消费者占比 30.43%,高消费者占比 14.70%;从地域分布看,新一线城市用户最多,占比 27.93%,一线城市占比 19.93%,二线城市占比 19.00%,其中广州用户最多,其次为深圳、杭州和北京。3. 信息结构铁路 12306 的一级菜单包含首页、出行服务、订单、铁路会员和用户中心。「首页」主要为用户提供火车票、飞机票和汽车票的购买,其次还提供各种快捷功能入口和酒店预订等服务;「出行服务」主要为用户提供约车、酒店、订单等服务;「订单」是可查询和管理在 12306 的各种订单;「铁路会员」是 12306 的会员版块,提供车票兑换、会员活动等内容;用户中心提供个人资料管理、出行向导和常用功能等内容。4. 重要迭代记录根据七麦数据统计,铁路 12306 的 APP 首个版本发布于 2012 年 10 月 16 日,截止到 2023 年 1 月 12 日,APP 版本已经更新至 V5.6.3 版本,近一年版本更新次数为 5 次。版本重要迭代记录2021 年 9 月,发布 V5.4.0 版本,新增无障碍功能、老人及障碍人士购票更便捷,即爱心版;5. 产品生命周期作为中国铁路客户服务中心的官方购票平台,铁路 12306 距离首个版本发布时间已经过去 10 年。从易观千帆数据观察,截止到 2022 年 10 月,12306 月活跃用户人数 6,923.78 万,日均活跃人数 811.65 万。由于是国有企业运营,而且是垄断业务,12306 没有任何商业变现的压力,从产品发布时间和活跃用户人数看,目前处于产品生命周期的成熟期。6. 竞争图谱截止到 2022 年 10 月,易观千帆数据显示,铁路 12306APP 在苹果的 APP Store 应用市场 APP 总排名 71 位,旅游类排名第一,汽车火车船票预定类第一,月活跃用户人数几乎是其他 APP 的总和。三、出行服务作为 12306 最核心、最重要以及实现商业变现的服务,出行服务主要为用户提供火车票、飞机票的销售,其次还链接了众多第三方合作伙伴,为用户在出行的各种场景提供了便捷的服务。1. 票务「票务」是 12306 最核心的服务,主要为用户提供火车票、飞机票和汽车票的查询以及销售,其次 12306 还对三种产品进行了组合,推出了空铁联运、铁水联运这样的服务。① 火车票「火车票」就是为用户提供火车和动车的票务销售,用户输入出发站、终点站和时间以后,就可以进行查询,其次还支持对已购买的车票进行变更到站、改签和退票。1)售票售票页当用户输入目标站点以后,就进入了售票页。在这个页面,可以看到当天列车的所有车次,包括直达、中转、出发时间和剩余票数。在底部,有一个菜单栏,包含了筛选、耗时最短、发时最早、显示票价和候补下单五个功能,这主要是帮助用户快速寻找符合自己需求的车次,比如出发车站、出发时间等。体验陷阱这个页面的操作体验不太友好,底部的菜单栏不仅没有实现全屏手机设备的兼容,而且几乎和背景的元素贴合在一起,不够醒目,如果用户不注意,根本无法发现底部竟然还有一排菜单栏帮助用户进行高效的检索。订单页在用户选择好车次以后,就进入订单页。用户需要选择座位的系别,包括硬座、软座、二等座、一等座、特等座等。用户需要选择乘车人。添加乘车人的步骤比较简单,在输入用户的真实姓名、身份证号码和手机号码以后,即可添加成功。首次使用12306的用户需要进行身份核验,用户需要通过验证系统发送的核验信息才能添加成功。细节侦查「姓名」这里有一个非常友好的设计体验,那就是针对无法输入的生僻字、名字超过 30 个字符,以及外籍用户的极端情况都给出了详细的指导,针对用户可能出现的极端的情况给与及时的提示,这就是尼尔森十大原则中的容错原则,帮助用户从错误中恢复,将损失降到最低。在「选择乘车人」的右边,还有一个「选择受让人」的功能。这个功能有很高的学习成本,会让用户摸不着头脑。我也是通过百度查询才了解到这是一个用户权益功能,它主要是指用户可以把平时购买火车票获得的积分转让给指定的用户,积分又可以抵消火车票款,从而实现抵扣。选择好乘车人以后,用户可以进行选座,就进入了提交订单、支付费用的环节。支付页订单生成后,用户需要在付款限定时间内支付火车票费用,否则订单将会取消。其次在支付页,也向用户推荐相关的保险服务,比如铁路乘意险,又分为平安险、行运险和顺意险,主要为乘客提供意外伤害疾病身故等保险。「购买返程」其实一个非常便捷的功能,但12306设计的层级太深了,而且没有加上一键返回首页或订单页的按钮,用户如果想退回到订单页或首页,需要不断点击返回,操作路径实在太长。体验陷阱底部菜单设计了三个按钮,违反了费茨定律的设计原则。用户在这个支付页的主要目标是支付费用,但是菜单栏的三个按钮权重设计得一样高,取消订单和购买返程这两个按钮,严重干扰了用户的选择,降低了操作效率。支付成功页当用户支付成功以后,「支付成功页」为用户提供餐饮预订、出行保险、酒店入住、网络约车等服务,非常便捷。不过内容的规划比较乱,体验稍差。候补下单「候补下单」是一个非常方便的功能,这个功能主要解决在当前车次没票的情况帮助乘客自动排队,如果有其他乘客退票,就自动抢票,非常贴心。这个功能也被誉为黄牛的终结者,帮助乘客自主排队。2)变更到站「变更到站」是指乘客可以更改目标站点,进入订单详情页后,点击「变更到站」按钮,点击底部的「立即变更到站」就可进入变更页面。在变更页面,乘客可以重新输入目标站点,然后再次进入车票售票页,选中需要变更的车次以后,进入订单页提交订单,变更成功。需要注意的是,变更到站只能办理一次。体验陷阱当用户点击「变更到站」的时候,如果不注意观察页面,根本感受不出原来需要在底部菜单栏进行操作,会让乘客陷入焦躁,不知道下一步从哪里进入。其次在变更到站页面,下半部分设计了很多快捷入口,比如车站大屏、约车、餐饮特产等,把用户的注意力分散了。这两个设计都严重了违反了费茨定律和席克定律,大大降低了用户的操作效率。3)改签「改签」是指用户可以更改出行的时间,改签的流程和「变更到站」相似,进入售票页后,选中需要变更的车次,进入订单页提交订单,改签成功。需要注意的是,车票改签只能办理一次,开车前 48 小时以上,退票费为票价 5%,24 小时至 48 小时之间为 10%,不足 24 小时为 20%。退票费最少 2 元起步。4)退票「退票」是指用户可以退掉已经购买的车票,退票流程比较简单,点击退票后,进入退票确认页,点击确认退票成功。需要注意是,距离开车前 8 天以上的不收退票费,其他的时段将会根据列车开车前的时间收取手续费,最高 20%。迭代建议在用户点击退票的时候,应该出现弹窗,再次提醒用户是否确认退票,这样能避免用户误操作。这就是尼尔森十大原则的容错原则,帮助用户从错误中恢复,将损失降到最低。5)购票后当乘客购买车票后,12306 的首页会加入一个行程的版块,向用户展示最近的行程详情,其次一级菜单栏「出行服务」内容也会同步更新。这个设计非常友好,直观醒目地告诉乘客最近的行程信息,通过外部触发避免乘客忘记行程。行程页这个页面从上至下包含四个部分,头部是乘客详细的车次信息,比如出发时间、经停站、天气等;中间是车票信息,包含检票口、座位号、车次和乘车二维码等信息;接下来按乘客出行前服务、车站/列车服务和到达服务三个场景为乘客推荐其他服务,比如餐饮预定、酒店预定等服务;底部是关于出发站、到达站的天气预报信息和优惠服务等信息。细节侦查行程页把乘客的出行拆分为 3 个场景,出行前服务(提供重点客户预约、我要选酒店、我要去车站、我要订餐饮和禁带物品规定)、车站/列车服务(提供临时身份证证明、遗失物品查找、我要订餐饮和站内导航)和到达服务(遗失物品查找、我要订酒店、接站约车、旅游景点预定、投诉建议和站内导航),这就是以场景为中心的设计——将设计工作的焦点从“定义系统的操作”转变到“描述什么人将使用该系统去完成什么任务”。② 飞机票「飞机票」就是为用户提供飞机的票务销售,用户需要输入出发站、终点站和出发时间,如果携带孩子或者婴儿,还需要单独勾选。飞机票同样支持改签和退票。1)售票页售票页的内容非常简单,在头部,用户可以左右滑动选择时间,页面内容以 Feed 流向用户展示详细的航班信息,其次还为用户提供了其他出行方案参考。底部设计了一个菜单栏,用户可以进行筛选设置,还可以根据价格高低和出发时间排序。2)选择舱位选中航班班次以后,进入到「选择舱位页」,在这个页面可以查看到航班的详细信息,比如航空公司、起飞时间、值机柜台等。用户需要选择舱位等级,比如经济舱、商务舱和头等舱,选中后,即可进入预订流程。拓展阅读为什么同一架飞机同一个经济舱飞机票价格不一样?这是因为一个飞机的不同舱位实际上是不同的产品,所以座位有不同的等级,故而价格有了出入。其次他们主要的区别包括但不限于退票改签的灵活程度、出票期限和目的地停留期限等等。3)订单页在订单页,可以查看到订单的详细信息,包括收费说明、退改说明等,在用户添加乘客以后,就可以提交订单。这里需要注意一下,如果乘客携带孩子或婴儿,需要添加儿童出行人。体验陷阱当乘客勾选了「携带儿童或婴儿」的选项以后,在订单页准备支付的时候,系统提示乘客需要返回添加儿童出行人信息。但却并没有告诉乘客如何添加,或直接给出对应的功能跳转链接,这让用户点击「返回添加」后却找不到功能入口。这就违反了尼尔森十大原则的防错原则,不仅在用户犯错之前没有给出提示,犯错了还不给与指导,真的非常糟糕。③ 汽车票「汽车票」为用户提供客车的票务销售,用户输入出发站、终点站和时间以后,就可进入售票页。汽车票的订单流程非常简单,在选中客车车次以后,添加乘客支付费用后,订单即可生成。体验陷阱用户在选择「达到地」搜索框输入地名时候,应该提供模糊搜索,比如输入湖南的地名,应该为用户提示相关联的车站。④ 空铁联运空铁联运,顾名思义就是把飞机和高铁这两个产品组合在一起销售,支持用户一站式购买“飞机+高铁”的联运行程,只需一次购票、一次支付。这个功能的使用场景主要是针对出发地和目的地没有直飞的航班情况下,为用户提供飞机+高铁的转运方案。这个功能对于乘客来说,支持一站式购买“飞机+高铁”车票,可以节省购票时间,非常友好。⑤ 铁水联运和空铁联运一样,这也是一个组合产品的销售,支持用户一站式购买“高铁+水运”的联运行程。使用场景、功能价值以及操作流程和空铁联运一样,我们就不必重复。⑥ 雪具快运12306 还推出了一个雪具快运的服务,为广大旅客提供多种个性化雪具寄送产品服务,还支持随车办理或上门办理寄送服务,目的是为用户打造滑雪的新体验。「雪具快运」的操作流程也比较简单,采用预约制,选中服务后,填写用户详细信息,支付成功后,订单生成。⑦ 小结作为 12306 最重要、最核心、最复杂的功能,从这个版块的内容拆解和实操体验来看,可以看出 12306 确实已经解决被誉为全世界最复杂的抢票算法逻辑(笔者通过实操测试,几乎都能买到票),特别是在春运这种会出现超过上亿用户抢票场景,真可谓非常不容易。不过从用户体验来看,非常一般,甚至有很多不合理的设计。2. 出行出行是 12360 结合了乘客在出行的场景中潜在产生的需求设计的服务,有结合车站商家的在线点餐,有结合当地地域特色的旅游服务,还有约车、保险、酒店等服务。这些服务,多数由第三方合作方提供。① 餐厅特产「餐厅特产」是一个为乘客提供在线点餐的服务,在乘客输入列车车次以后,就可以进行点餐,支持外卖配送至列车和到店自取两种形式。这个功能设计得很友好,不仅解决乘客在乘车前的就餐问题,为车站的商家引流,还可以增加平台的变现方式。② 铁路游「铁路游」是 12306 结合旅游出行的场景,为乘客推出的一项旅游服务,包含旅游专列、跟团游、周末游和自由行等。这个场景的链接其实非常好,但是版块目前设计得比较简单,内容也比较少。③ 约车「约车」是为乘客提供接送站、接送机、打车和租车的服务。这是一个强刚需的需求,用户在出行的前后都有用车服务。为乘客提供约车服务,不仅能增加变现方式,还能方便乘客出行。通过实操体验,约车主要由第三方合作方提供服务,比如曹操出行、T3 出行等公司,为乘客提供出租车、品质专车和商务车等车型。④ 保险保险分为乘意险和出行保险。铁路乘意险分为平安险、行运险和顺意险,主要为乘客提供意外伤害疾病身故等保险,在乘客购买铁路的订单页就会向乘客推荐,乘意险价格低,保障项目包含意外身故、伤残、医疗费用、住院津贴等。出行保险由第三方公司中国太平洋保险提供,主要为乘客提供出行安心保、空铁联运险和旅程预定取消险。⑤ 酒店酒店这个版块的内容相对夯实,不仅有新客大礼包这样的用户权益,还有商旅专区、今夜甩卖、高端酒店这样的内容。甚至还设计了专门的酒店会员 VIP,包含普通会员、银卡会员、金卡会员、白金卡会员和黑金卡会员,相对其他版块而言,这个版块花了比较多的心思。⑥ 铁路商城铁路商城是 12360 以乡村振兴·帮扶推介为主题打造的一个商城,包含了帮扶专区、优选好物、兑换专区、今日特卖等内容,其次还支持企业集采,批量购买。⑦ 小结从这个版块,可以看出 12360 其实结合了用户吃穿住行的刚需场景设计了对应的服务,有自主运营也有完全依靠第三方提供。不过整体的用户体验比较差,事实上可以参考像顺丰速运、智联招聘这些 APP,通过内置小程序的形式来设计,完全可以把这些版块让第三方单独设计和维护,同时还能为用户带来更好的体验。3. 会员铁路畅行会员是中国铁路统一对外会员服务品牌,开通畅行会员不需要花钱,畅行会员主要是用于会员用户积累乘车积分、用积分兑换车票等,主要包含积分权益,兑换车票、无票候补和会员活动四大会员权益。这个页面设计得比较简陋,也没有太多价值的内容,可以看出 12306 在用户运营方面比较欠缺。4. 订单12306 的订单包含了火车票订单、餐饮订单、保险订单、酒店订单、空铁联运订单、计次定期票订单、约车订单、出站引导服务订单、铁路商城订单、汽车票订单、旅游订单和铁水联运订单多达 12 种订单,从这些订单类型可以看出 12306 的服务特别多。体验陷阱这个设计实在太糟糕,严重违反了 72 效应。琳琅满目,花枝招展,让用户在这个页面几乎迷失。更糟糕的是,当你有一个非常重要的待支付订单,这个页面竟然没有角标提醒,最终你会因为这个糟糕的设计打乱自己的行程计划。四、内容服务内容服务是帮助产品实现用户留存和运营的版块,不过从 12306 的内容设计来看,整个产品的运营手段比较少,所以我把 12306 现有设计的功能拆分为便捷功能和向导功能。1. 便捷功能以下这七个功能,对用户而言,是非常便捷、友好的功能,可以帮助用户在出行的旅途中获取很多帮助。① 车站大屏「车站大屏」是一个非常贴心的功能,通过这个功能,可以为用户提供车站的实时列车信息,非常方便。大屏详情页可以拆分为三块内容,左上角可以切换全国各地的火车站,头部还有搜索框,为用户提供车次的查询,主体内容是当前车站向西的车次信息,包含发车时间、候车室、检票口和候车状态等。1)车次详情页进入列车的「车次详情页」,可以查看当前车次的完整信息,比如检票状态、候车室、检票口和全程停靠站、停留信息。在这个页面,还提供了「关注列车」的功能(关注后并无关注数据,显得很鸡肋),以及直接预订当前车次的入口。2)车站详情页「车站详情页」就像一个站点的主页,为用户提供完整的车站信息查询。这个页面可以拆分为四块,头部可以切换其他站点,并提供当前车站的天气情况以及车站基础信息。金刚区位 8 个功能入口,包含车站车次、站内导航、重点旅游、餐饮服务、周边酒店等。中间是当前车站的起售时间和换乘时间,底部是车站附近周边的酒店精选。迭代建议这个页面把车站当做一个主体,聚合了一个车站完整的功能,其实挺有创意,但页面隐藏得很深,如果不去拆解,几乎很难发现,很是可惜。我认为完全可以提高权重,升级为一级栏目,代替会员,或者和出行栏目进行整合升级。② 站内导航「站内导航」提供目标车站的 LBS 导航,对于乘客来说,到达一个陌生的站点,需要清晰的指引,这是一个非常便捷、温馨的功能,能帮乘客解决很多问题。不过这里有一个莫名其妙的设计,那就是进入这个功能之前,系统提示请摇“8”字校准手机,事实上这里是一个加载动画,但是画面和内容却误导了用户,我甚至每次进入都傻乎乎的摇动手机。③ 临时身份证临时身份证是一个非常重要的功能,12306 现在支持 APP 在线申请,极大方便了乘客的出行。申请流程也比较简单,填写个人信息,验证审核通过后,就可以生成电子证照使用。每个人每个月有 3 次申请临时乘车身份证机会。④ 遗失物品这是一个非常贴心的功能,如果你在乘车的过程中不小心丢失物品,可以通过这个功能登记,输入你的详细信息就能登记成功。⑤ 重点旅客这也是一个非常贴心的功能,主要为老年人、残疾人服务,通过填入你的信息,列车会根据你的情况提供优先进站、协助乘降等服务。⑥ 爱心版爱心版就是长辈版,专门为中老年用户设计的版本,在用户中心切换后就可进入爱心版。整个版本设计得非常简洁,操作步骤也比较简单,对中老年用户比较友好。⑦ 英文版英文版在用户中心的设置点击语言即可切换,整体的版本设计得直接简洁,用户体验不错。⑧ 小结从这个版块可以看出,一个产品如果以用户为中心去设计,是可以为用户带来很大的便捷和愉悦体验。比如像临时身份证这样的功能,过往我们只能提前出发去车站排队办理,但如今 12306 已经把这样的痛点解决,为用户节省了大量的时间。2. 向导功能以下 8 个功能,虽然属于出行向导,不过体验下来,感觉用户体验比较差,很多功能完全无法弄懂它的设计目的是什么,显得非常鸡肋。① 快捷退票「快捷退票」这个功能的设计,让人摸不着头脑。从操作流程看,首先需要输入用户的详细信息,包括姓名、身份证号码和手机,其次需要进行人脸核验,到了第三步还需要选择车票的日期车次,在最后的退票操作页面,用户点击退款后,没有和用户再次确认就直接退票。整个流程体验下来,非常糟糕。体验陷阱这个功能和订单页的退票感受不出来有何区别?如果用户要退款,不如直接去订单页进行退票,操作步骤简单,一目了然。其次不支持自动导入用户的购票信息实在太不方便,需要通过选择车票购买日期和车次,这个设计实在让人生气和愤怒(我在体验的过程中到了第三步只能退回到订单页把购票日期和车次截图下来,又再次重复前面两个步骤才到这个步骤)。② 联系方式这也是一个看不懂的功能,进入页面后,需要用户输入乘客的详细信息,但是这个乘客信息和用户在购买车票时候需要添加到乘客信息有什么不同?更糟糕的是,当你把自己的电话号码、身份证信息填入后,系统会显示核验成功,然而当你再一次进入,页面内容还是和之前并无区别,你不知道自己是不是还要重新输一次?③ 时刻表「时刻表」主要为乘客提供查询列班车次的出发时间和到站信息,但这个功能「车站大屏」几乎已经包含了,这个功能显得意义不大。④ 查票价这个功能非常鸡肋,因为在火车票的售票详情页就可以清晰直观地查询到列车票价信息,相反在这个页面,根本无法看到价格,因为价格的字体大小只有 20px,乘客几乎很难注意到。⑤ 查代售点这个功能主要为用户提供全国各地火车票代售点的查询,不过在互联网技术发展到今天,火车票代售点越来越少了。从 12306 采集的信息来看,部分代售点缺少电话等关键信息,对用户来说,比较鸡肋。⑥ 起售时间这个功能为用户提供各车站每日的起售时间,属于一个低频功能,可以解决乘客某些极端场景的需求。不过在我体验下来,比如通过此功能查询 1 月 29 日的车票,显示北京站起售时间为 10:00,但是在火车售票版块,我也可以直接购买 1 月 29 日的车票,这让我比较疑惑这个功能的价值在哪里。⑦ 正晚点「正晚点」同样是一个鸡肋功能,而且还需要输入准确的车次才能进行查询,车站大屏已经完美可以取代这个功能。⑧ 列车状态「列车状态」比正晚点都还鸡肋,让人愤怒,因为你需要输入正确的出发地、到达地和出发时间,对了,还有正确的车次才能进行查询,这样的操作成本比下载 12360APP 都还麻烦。⑨ 小结从这个部分的内容拆解和操作体验来看,12360 的产品设计得不够细致和贴心,很多功能就像是硬生生塞进去一样,滥竽充数。其次从他们的产品迭代记录次数可以看出,近 1 年更新时间只有 5 次,也许每一次都是在做加法,没有想过做减法,所以导致这部分的功能显得鸡肋而且有很大缺陷。五、思考总结通过对铁路 12306 的全面拆解,接下来我将从内容层、功能层、体验层和视觉层进行总结。1. 内容层12306 整个产品的内容设计,用一句话总结,可以归纳为——心有余力而不足。可以看到12306围绕乘客购票、出行的潜在需求场景都设计了对应的服务,比如酒店、约车、点餐、商城等,甚至还有空铁联运、铁水联运这种多场景的组合售票方式,不过在实际的版块内容打造中,则显得比较空洞,体验一般。这个产品,可以说几乎没有创新点,这主要也是由于它是由国有企业设计运营,背景极其复杂,设计目标也飘忽不定。2. 功能层在 2015 年之前,铁路 12360 承担了被誉为历史上人口迁移最大的春运的抢票工作,那时候一票难求,春运去 12360 就像是一场噩梦。不过在经过多年的升级和优化以后,目前 12360 的购票效率非常高,经过笔者多次的测试和调研,目前通过 12360 购票已经不再是难事。而且还设计了候补抢票这样的功能,帮助用户解决买票痛点,可谓非常贴心、友好。3. 体验层铁路 12306 的用户体验,非常一般,我在这次的产品拆解中至少侦查出了 20 条体验陷阱,这些陷阱都会给用户带来极其糟糕和愤怒的体验。比如让我像个傻瓜摇动手机的站内导航载入页,这完全就是把用户当成傻子一样看待,其次还有一堆数不清的鸡肋功能,对用户的操作体验造成了严重的干扰。我甚至认为爱心版和英文版比标准版使用起来更愉悦,更能减少我的焦虑。4. 视觉层作为一个 UI 设计师,在拆解 12306 的产品过程中,我对整个产品的设计感到绝望。首先,没有做到统一性,整个产品毫无设计规范,比如卡片的圆角、品牌色、版块间距根本不统一,这样的视觉体验一眼望去就非常糟糕;其次,图标、活动图、橱窗图以及详情页的设计毫无美感,满满的山寨 APP 风格,特别是订单页的 ICON,花花绿绿、琳琅满目,连最基础的统一都没有做到。六、后记作为一款国民级用户 APP,铁路 12306 仿佛陪伴了 80、90 后的青春。还记得 10 年前老家是黑龙江和河北的大学室友,每年春运开启之前就为了回家的火车票犯愁,不仅要去遥远的火车站排队,很多时候还可能空手而回,那便是最初对 12306 的记忆。如今十年过去了,12306 解决了亿万人的出行抢票需求,让我们在春运的路上,可以轻松购买一张回家的票。但下一个十年,我更希望 12360 的产品团队,可以重视用户体验设计,让我们不再掉入那些体验陷阱。参考文献:易观千帆-铁路 12360APP 数据分析七麦数据-铁路 12360APP 数据分析中国铁路 12306 官网尼尔森十大原则《设计的陷阱:用户体验设计案例透析》- 乔纳森·沙利亚特欢迎关注作者微信公众号:「设计大侦探」本篇来源:优设网原文地址:https://www.uisdc.com/12306-app