点击立即查看：https://996.pm/MQPxK 转眼，一年一次的双11已开始一周，在经历了收喵果、直播蹲坑、凑单满减、付尾款等系列动作后，大家兜里的钱和脑里的细胞也越来越少，以至于网友们纷纷调侃，当鲁迅付完尾款后都会发出这样的感慨吧！ 而那些在双11开

点击立即查看： https://996.pm/MQPxK

转眼，一年一次的双11已开始一周，在经历了收喵果、直播蹲坑、凑单满减、付尾款等系列动作后，大家兜里的钱和脑里的细胞也越来越少，以至于网友们纷纷调侃，当鲁迅付完尾款后都会发出这样的感慨吧！

而那些在双11开始前嚷嚷着“穷”、“没钱”、“绝对不买东西！”的人，在双11开始后，也选择性失忆，该看的直播是一场不缺，该买的东西是一个不漏，扒着算盘拼命凑满减，唯恐错过某个最大优惠， 毕竟，双11是一年中难得的优惠活动！

但透过现象看本质，双11的火爆很大程度是因为日益丰富的物质生活和口袋里的钱不够之间的矛盾，以至于大家都想趁着双11买些平时不敢买的东西； 如果我们能不断提升自我能力，从而可以获得更高的收入，谁还会耗费大量的时间精力去找寻“全网最低价”呢？

所以这个双11我们 不仅要优惠！更要能自我增值！ 为此，起点课堂会员精心筹备了双11狂欢活动，不仅让你可以享受到钜惠，还能助你全面提升职场能力，突破职场发展瓶颈，早日实现“财富自由！”

点击立即查看： https://996.pm/MQPxK

起点会员可以做什么？ 为了满足不同同学的学习要求，起点课堂会员分为了普通会员和高级会员，但只要你是会员，都可以享受如下权益：

1.1000+专题课程免费畅学 作为一套针对产品、运营人专业能力提升的解决方案，起点课堂会员可免费学习1000+专题课程，这些课程拥有海量知识点，并已为你 梳理成产品、运营、商业实战三大专业板块，帮助你重新构建自己的专业认知体系。

讲师背景： 精心筛选的700多位来自阿里、腾讯等顶级大厂的实战派导师，平均 拥有10+年的一线实战经验 ，从他们身上，你将学到来自一线大厂已被验证的产品、运营专业方法论。

点击立即查看： https://996.pm/MQPxK

课程内容： 课程覆盖了产品、运营、商业营销等领域的基础与前沿实战内容，帮你全面提升产品、运营、营销、行业知识和商业实战能力， 每年持续更新200+新课。

陪学计划： 为了帮助你更好地掌握知识，我们将定期举办陪学计划，班主任亲自带班督学，群内不仅可享配套的学习资料与干货，还可以和小伙伴们一起学习交流， 为你打造一个专属陪学社群！

点击立即查看： https://996.pm/MQPxK

2.全年12大直播主题 结合环境变化、行业发展及职业需求等， 每月选取一个前沿主题，并围绕主题每月邀请4-5位行业资深专家进行每周1场直播， 全年共计48场专属会员直播。

每周一起学习探讨，共同面对行业变革，解决实践问题，提升实战能力，帮助你得到更深入的启发及可复用的方法论。

点击立即查看： https://996.pm/MQPxK

3. 会员专属交流群 人脉任意勾搭： 加入起点课堂会员后，会有专门的VIP会员专属社群，成员都是来自百度、阿里、腾讯等各大赛道头部企业。经调查有47%的同学在B轮以上的公司工作，24%的同学在细分赛道的独角兽公司，还有15%的同学来自BAT、TMD等互联网大厂。

资讯干货分享： 会员群内每天都会分享行业动态、干货内容、资料和每月电子刊专题讲解等。

VIP专属助教： 助教会关注每个同学的学习情况，如没按时学习，可能会被连环催课哦！如你在工作指导、课程安排、职业生涯中遇到困惑，都可以来找老师聊聊。

点击立即查看： https://996.pm/MQPxK

4.50G+产品/运营学习资料包 囊括工具、模板、文档、脑图、报告、电子书等等，让你 建立自己的资料库 ，省却四处收集资料的繁琐和苦恼。

点击立即查看： https://996.pm/MQPxK

以上就是起点课堂会员都可以享受的权益，而 高级会员 除了上述所有权益外， 还额外享有免费参加全年产品经理大会、免费学习技能辅导课和自学课等特权！

点击立即查看： https://996.pm/M0J2W

「双11狂欢季」火热开启！ 会员买1年多送9个月 还有限量周边等豪礼任你抽！ ▼点击立即查看： https://996.pm/MQPxK ▼

编者按：在搜索功能上，天花板级别的设计师还能玩出什么花样？本文梳理了众多大厂的搜索设计细节，一次性看个够！更多搜索设计方法：5000字干货！

编者按：在搜索功能上，天花板级别的 设计师 还能玩出什么花样？本文梳理了众多大厂的搜索 设计细节 ，一次性看个够！

更多 搜索设计 方法：

5000字干货！五大章节帮你掌握搜索设计 本文从搜索的基本属性与特征、搜索入口的样式及应用场景、常见的搜索方式、搜索流程状态解析和辅助模块/元素的妙用5个章节，帮你掌握搜索设计。

阅读文章 >

搜索的本质是什么？无疑是内容的召回和信息的推荐。

可随着时代的发展和行业公司的内卷，不少公司除了持续优化搜索结果与推荐外，在搜索的体验和彩蛋上也是下了不少功夫，从而进一步加强自有产品的竞争力与用户黏性。因此今天就来盘点一些，那些有意思的大厂搜索交互。

大体上分为两类：彩蛋流和体验流。

一、彩蛋流 注重提升搜索过程中的趣味程度，以增加用户的好感度与产品印象/口碑。行业代表：谷歌浏览器、百度浏览器

1. 谷歌浏览器

可以说是搜索彩蛋的先行者，内置了很多搜索关键词的有趣彩蛋，如娱乐角色：搜索「灭霸」，页面右边会打响指，相关字段会被“毁灭”掉

搜索「马里奥兄弟」，右边也有游戏里一样的点击彩蛋

还有各种有意思的搜索结果比如搜：is google down（谷歌关闭了吗），搜索结果优先显示：NO

再如搜索《银河系漫游指南》的一句话：the answer to life, the universe, and everything。此时搜索结果页会自动计算成42。貌似也只有读过《银河系漫游指南》的人才能明白其中的奥秘。听说是生命、宇宙与万事万物的终极解答。

而且在日常的节日、活动、热点运营上，谷歌也从不缺席。都会在搜索框上用「插画、动效」等形式承载各种活动入口、吸引用户参与，可以已经形成一个稳定、具有品牌感的企业文化了。

如各种复活节、开学季、母亲节动效。而且更多有趣、创意的设计案例。

2. 百度浏览器

百度在搜索彩蛋里下的的功夫也不少，最著名的应该是搜索「黑洞」时，页面上会出现黑洞的吸入特效。

而且和谷歌相同，在其他的搜索关键词上，百度也是埋下了不少彩蛋，比如：搜索「翻转」，页面会左右翻过来

搜索「跳跃」，页面会在上下跳动

搜索「失重」，页面上的字会飘起来‍

而在「活动运营」上，百度也是很有心地进行着创新设计，力求给用户一种眼前一亮的感觉。比如每年的愚人节，搜索结果页上都有“调戏”用户的创意设计，各种轻松调皮的画风 给不少用户带来了新鲜感和趣味性。

还有在「活动入口」的设计上也是特别有想法：在某年的圣诞节上，百度创新性地将活动入口嵌套在结果页卡片中间，用活动里的IP形象雪人「抬着」结果页卡片和在上面「滚动」。

用这种充满创意+应景的的入口设计与引导方式，最大限度地降低漏斗，吸引让更多用户参与该活动。另外，百度搜索框上面的运营活动入口，也和谷歌有异曲同工之妙。

二、体验流 注重提升搜索过程中的交互体验，以增加用户的操作效率与产品易用性。

代表：苹果产品、夸克浏览器

1. Apple/苹果产品

iPhone

iPhone的「桌面搜索」除了能查询手机上的各种信息、文件，它还自带了「汇率转换和计算器」。在搜索框输入「数学公式、汇率转换」时会自动计算对应的结果。无需用户额外打开计算器、浏览器，大大减少操作链路。

在iOS的原生键盘里，可以根据输入词检测+搜索对应的手机号码：当你输入 「打+我或通讯录好友+电话」时，键盘上会自动显示自己或好友的电话号码，点击号码就能自动粘贴在输入框中。

用户无需前往通讯录就能轻松「获知+想起」谁谁的电话号码，大大提升操作体验与效率。

Mac

在Mac电脑的工具栏上搜索相关帮助时，系统会直接把该结果所对应的页面位置调取出来并悬浮展示。用户可以直观地该结果在哪里，并减少寻找的操作路径，免去多余操作。

在Mac电脑的系统偏好设置里搜索帮助，在结果列表上会以聚光灯的形式展示各个结果入口。选择具体某个结果时，该入口的聚光灯会更清晰些，特别容易找到搜索结果。

2. 夸克浏览器

夸克浏览器除了传统的「点击搜索框」唤出输入栏外，在屏幕任意位置下滑手势同样可以唤出搜索框。

降低「需要往上手指移动，才能点击搜索框」的操作成本，让用户更快、更精准地触达搜索。

而且在输入网址或英文等字段时，搜索框下方会出现一个滑块区。点击就会变成长条的滑块，拖拽滑块即可改变光标位置。

让用户更方便地将光标快速移动到想要的位置中，以便更快地搜索信息，大大降低操作成本。而且夸克还会前置搜索结果， 比如在搜索框中输入“某城市+天气”的关键词，上方就会以卡片的形式显示该地区最近一周的天气。

用户无需触发搜索、进入结果页才能看到想要查询的信息。

欢迎关注作者的微信公众号：「和出此严」

编者按：在搜索功能上，天花板级别的设计师还能玩出什么花样？本文梳理了众多大厂的搜索设计细节，一次性看个够！更多搜索设计方法：5000字干货！

编者按：在搜索功能上，天花板级别的 设计师 还能玩出什么花样？本文梳理了众多大厂的搜索 设计细节 ，一次性看个够！

更多 搜索设计 方法：

5000字干货！五大章节帮你掌握搜索设计 本文从搜索的基本属性与特征、搜索入口的样式及应用场景、常见的搜索方式、搜索流程状态解析和辅助模块/元素的妙用5个章节，帮你掌握搜索设计。

阅读文章 >

搜索的本质是什么？无疑是内容的召回和信息的推荐。

可随着时代的发展和行业公司的内卷，不少公司除了持续优化搜索结果与推荐外，在搜索的体验和彩蛋上也是下了不少功夫，从而进一步加强自有产品的竞争力与用户黏性。因此今天就来盘点一些，那些有意思的大厂搜索交互。

大体上分为两类：彩蛋流和体验流。

一、彩蛋流 注重提升搜索过程中的趣味程度，以增加用户的好感度与产品印象/口碑。行业代表：谷歌浏览器、百度浏览器

1. 谷歌浏览器

可以说是搜索彩蛋的先行者，内置了很多搜索关键词的有趣彩蛋，如娱乐角色：搜索「灭霸」，页面右边会打响指，相关字段会被“毁灭”掉

搜索「马里奥兄弟」，右边也有游戏里一样的点击彩蛋

还有各种有意思的搜索结果比如搜：is google down（谷歌关闭了吗），搜索结果优先显示：NO

再如搜索《银河系漫游指南》的一句话：the answer to life, the universe, and everything。此时搜索结果页会自动计算成42。貌似也只有读过《银河系漫游指南》的人才能明白其中的奥秘。听说是生命、宇宙与万事万物的终极解答。

而且在日常的节日、活动、热点运营上，谷歌也从不缺席。都会在搜索框上用「插画、动效」等形式承载各种活动入口、吸引用户参与，可以已经形成一个稳定、具有品牌感的企业文化了。

如各种复活节、开学季、母亲节动效。而且更多有趣、创意的设计案例。

2. 百度浏览器

百度在搜索彩蛋里下的的功夫也不少，最著名的应该是搜索「黑洞」时，页面上会出现黑洞的吸入特效。

而且和谷歌相同，在其他的搜索关键词上，百度也是埋下了不少彩蛋，比如：搜索「翻转」，页面会左右翻过来

搜索「跳跃」，页面会在上下跳动

搜索「失重」，页面上的字会飘起来‍

而在「活动运营」上，百度也是很有心地进行着创新设计，力求给用户一种眼前一亮的感觉。比如每年的愚人节，搜索结果页上都有“调戏”用户的创意设计，各种轻松调皮的画风 给不少用户带来了新鲜感和趣味性。

还有在「活动入口」的设计上也是特别有想法：在某年的圣诞节上，百度创新性地将活动入口嵌套在结果页卡片中间，用活动里的IP形象雪人「抬着」结果页卡片和在上面「滚动」。

用这种充满创意+应景的的入口设计与引导方式，最大限度地降低漏斗，吸引让更多用户参与该活动。另外，百度搜索框上面的运营活动入口，也和谷歌有异曲同工之妙。

二、体验流 注重提升搜索过程中的交互体验，以增加用户的操作效率与产品易用性。

代表：苹果产品、夸克浏览器

1. Apple/苹果产品

iPhone

iPhone的「桌面搜索」除了能查询手机上的各种信息、文件，它还自带了「汇率转换和计算器」。在搜索框输入「数学公式、汇率转换」时会自动计算对应的结果。无需用户额外打开计算器、浏览器，大大减少操作链路。

在iOS的原生键盘里，可以根据输入词检测+搜索对应的手机号码：当你输入 「打+我或通讯录好友+电话」时，键盘上会自动显示自己或好友的电话号码，点击号码就能自动粘贴在输入框中。

用户无需前往通讯录就能轻松「获知+想起」谁谁的电话号码，大大提升操作体验与效率。

Mac

在Mac电脑的工具栏上搜索相关帮助时，系统会直接把该结果所对应的页面位置调取出来并悬浮展示。用户可以直观地该结果在哪里，并减少寻找的操作路径，免去多余操作。

在Mac电脑的系统偏好设置里搜索帮助，在结果列表上会以聚光灯的形式展示各个结果入口。选择具体某个结果时，该入口的聚光灯会更清晰些，特别容易找到搜索结果。

2. 夸克浏览器

夸克浏览器除了传统的「点击搜索框」唤出输入栏外，在屏幕任意位置下滑手势同样可以唤出搜索框。

降低「需要往上手指移动，才能点击搜索框」的操作成本，让用户更快、更精准地触达搜索。

而且在输入网址或英文等字段时，搜索框下方会出现一个滑块区。点击就会变成长条的滑块，拖拽滑块即可改变光标位置。

让用户更方便地将光标快速移动到想要的位置中，以便更快地搜索信息，大大降低操作成本。而且夸克还会前置搜索结果， 比如在搜索框中输入“某城市+天气”的关键词，上方就会以卡片的形式显示该地区最近一周的天气。

用户无需触发搜索、进入结果页才能看到想要查询的信息。

欢迎关注作者的微信公众号：「和出此严」

编者按：如何做好优秀的版式设计？本文从主体和编排两个部分，通过一个实战案例，帮你掌握优秀版式设计的核心知识。更多版式设计干货：案例超多！

编者按：如何做好优秀的版式设计？本文从主体和编排两个部分，通过一个实战案例，帮你掌握优秀版式设计的核心知识。

更多 版式设计 干货：

案例超多！15种海报版式设计的创意形式 版式设计是设计师的必修课，研究再多都不为过，今天鱼先生继续与大家分享，关于版式设计的 15 种实用的版式设计创意术，干货系列~ 本文方法适用于所有版式设计的应用，比如常见的海报设计、画册设计、KV 设计等。

阅读文章 >

大家好，我是大猫，本周给大家带来一篇版式设计的文章，本期的侧重点在于主体和编排。

其实做一个相对来讲比较合格的版式，无非就是这两点，即好的主体与好的编排。

好的主体，即精致美观的主体。

在版式中主体的好坏对版面的影响是非常大的。所以在选择主体的时候一定要谨慎。那么什么才是好的主体呢？

好的主体无外乎有足够的分辨率、独特的造型视角，以及丰富的表现力（质感、光影、纹理等都可以算在表现力之中）。

分辨率高，即选做主体的图尺寸一定要够（不止是主体，其他的图也是越清晰越好）。分辨率不够或者有锯齿的图片一定不要用。

以此图为例，左侧的苹果非常糊，分辨率不够，其视觉效果就比右侧的差很多。

其二就是独特的视角或造型，选主体尽量选新颖的造型或独特的视角，这样会使版面的冲击力更大，同时也更吸睛，达到的效果是事半功倍的。

同样是建筑海报，右侧的要比左侧的好很多，究其原因就是视角的问题。左侧的图片不能说不行，只是视角太常见了，论独特性和设计感远没有右侧仰视视角好。

其三就是主体的表现力，质感、光影、纹理等等都算是表现力。表现力强的更为吸睛。严格来算的话视角、造型、创意性等都算是表现力。

在此案例中右侧的金属质感更为丰富，所以其品质感和设计感更强，而左侧随手拍摄的就逊色很多。

接下来说一下好的编排是怎么样的。

好的编排实际上就是在编排上要严谨有序。

层次的清晰、字型选择的契合性、留白是否工整、段落文字编排是否适合阅读，这些都是能够影响编排好坏的。

接下来我们以一个海报评改为例分别讲这四点。原海报如下

这个海报在文字编排和主体选择上都有问题，我们先对照知识点看一下文字的编排。

对比合理，文字层级的清晰与否决定着版面的视觉顺序。过大或过小的对比都会使版面的品质感下降。

海报中信息的层级划分是十分明确的，这点没啥问题，但是主标题与底下的英文对比过大了，所以视觉上非常不美观。

鉴于此我们可将英文放大，使其对比的更和谐一点。

除了放大英文，在正文与标题和时间之间加了两条竖线做区分，会是层次关系分的更明显。层次关系处理好后，可以去调整字型。

选择字体也是版式设计中非常重要的环节，不同的字体传达的气质是不一样的，要选择与项目契合且非常精致的中英文字体。

原图中中英文字体用的都是方正中雅宋，中文部分用此字体没啥问题，但英文却不是很精致，所以英文符最好选择英文字体。

修改后中文选择了思源宋体，英文选择了 baskervill，其气质更为契合。

更多英文字体推荐：

提升设计感必备！5 款别具一格的高质量无衬线英文字体 大家好，这里是和你们聊设计的花生~ 好久没有给大家推荐字体方面的资源了。

阅读文章 >

下一步是修改段落文字的编排，原先的行间距太密，段落工整，因为顿号太多字距又显得太散，文字也参差不齐，这些都是我们要去修改的。

修改后更为工整了，视觉效果也会更好。

留白工整影响版面的精致程度，虽然到这里字体选择和层级关系没啥问题，但版面的留白不够，显得太挤太满，所以我们可以适当缩小字体，以留出更多的空间。

修改后的明显空间更工整匀称，同时也更美观。至此文字编排就处理好了。我们把编排好的文字放到原海报上看一下对比效果：

虽然现在文字编排更为美观了，但主体并不好，所以要去找一个更好的主体。

这里我选择了一个俯视钢琴的局部，并将背景变成黑色，其设计感一下子就上去了。

也可以选择正在弹奏的图片作为主体，只不过现在有些问题，就是版面底部太空了，这种情况我们可以添加一些与音乐有关的装饰元素，如下

将活动的主旨放大曲线排列并做成描边的形式，使其不是那么抢眼。同时添加曲线和点元素，象征音乐的节奏与高低起伏。另外这些点元素也可以替换成音符哦。

好的主体+好的编排=合格的版式，这是基础，如果想要做的更好，那么就需要在创意上下文章了。那么本期文章就到这里了，大家学会了嘛？

欢迎关注作者微信公众号：「大猫设计」

编者按：如何做好优秀的版式设计？本文从主体和编排两个部分，通过一个实战案例，帮你掌握优秀版式设计的核心知识。更多版式设计干货：案例超多！

编者按：如何做好优秀的版式设计？本文从主体和编排两个部分，通过一个实战案例，帮你掌握优秀版式设计的核心知识。

更多 版式设计 干货：

案例超多！15种海报版式设计的创意形式 版式设计是设计师的必修课，研究再多都不为过，今天鱼先生继续与大家分享，关于版式设计的 15 种实用的版式设计创意术，干货系列~ 本文方法适用于所有版式设计的应用，比如常见的海报设计、画册设计、KV 设计等。

阅读文章 >

大家好，我是大猫，本周给大家带来一篇版式设计的文章，本期的侧重点在于主体和编排。

其实做一个相对来讲比较合格的版式，无非就是这两点，即好的主体与好的编排。

好的主体，即精致美观的主体。

在版式中主体的好坏对版面的影响是非常大的。所以在选择主体的时候一定要谨慎。那么什么才是好的主体呢？

好的主体无外乎有足够的分辨率、独特的造型视角，以及丰富的表现力（质感、光影、纹理等都可以算在表现力之中）。

分辨率高，即选做主体的图尺寸一定要够（不止是主体，其他的图也是越清晰越好）。分辨率不够或者有锯齿的图片一定不要用。

以此图为例，左侧的苹果非常糊，分辨率不够，其视觉效果就比右侧的差很多。

其二就是独特的视角或造型，选主体尽量选新颖的造型或独特的视角，这样会使版面的冲击力更大，同时也更吸睛，达到的效果是事半功倍的。

同样是建筑海报，右侧的要比左侧的好很多，究其原因就是视角的问题。左侧的图片不能说不行，只是视角太常见了，论独特性和设计感远没有右侧仰视视角好。

其三就是主体的表现力，质感、光影、纹理等等都算是表现力。表现力强的更为吸睛。严格来算的话视角、造型、创意性等都算是表现力。

在此案例中右侧的金属质感更为丰富，所以其品质感和设计感更强，而左侧随手拍摄的就逊色很多。

接下来说一下好的编排是怎么样的。

好的编排实际上就是在编排上要严谨有序。

层次的清晰、字型选择的契合性、留白是否工整、段落文字编排是否适合阅读，这些都是能够影响编排好坏的。

接下来我们以一个海报评改为例分别讲这四点。原海报如下

这个海报在文字编排和主体选择上都有问题，我们先对照知识点看一下文字的编排。

对比合理，文字层级的清晰与否决定着版面的视觉顺序。过大或过小的对比都会使版面的品质感下降。

海报中信息的层级划分是十分明确的，这点没啥问题，但是主标题与底下的英文对比过大了，所以视觉上非常不美观。

鉴于此我们可将英文放大，使其对比的更和谐一点。

除了放大英文，在正文与标题和时间之间加了两条竖线做区分，会是层次关系分的更明显。层次关系处理好后，可以去调整字型。

选择字体也是版式设计中非常重要的环节，不同的字体传达的气质是不一样的，要选择与项目契合且非常精致的中英文字体。

原图中中英文字体用的都是方正中雅宋，中文部分用此字体没啥问题，但英文却不是很精致，所以英文符最好选择英文字体。

修改后中文选择了思源宋体，英文选择了 baskervill，其气质更为契合。

更多英文字体推荐：

提升设计感必备！5 款别具一格的高质量无衬线英文字体 大家好，这里是和你们聊设计的花生~ 好久没有给大家推荐字体方面的资源了。

阅读文章 >

下一步是修改段落文字的编排，原先的行间距太密，段落工整，因为顿号太多字距又显得太散，文字也参差不齐，这些都是我们要去修改的。

修改后更为工整了，视觉效果也会更好。

留白工整影响版面的精致程度，虽然到这里字体选择和层级关系没啥问题，但版面的留白不够，显得太挤太满，所以我们可以适当缩小字体，以留出更多的空间。

修改后的明显空间更工整匀称，同时也更美观。至此文字编排就处理好了。我们把编排好的文字放到原海报上看一下对比效果：

虽然现在文字编排更为美观了，但主体并不好，所以要去找一个更好的主体。

这里我选择了一个俯视钢琴的局部，并将背景变成黑色，其设计感一下子就上去了。

也可以选择正在弹奏的图片作为主体，只不过现在有些问题，就是版面底部太空了，这种情况我们可以添加一些与音乐有关的装饰元素，如下

将活动的主旨放大曲线排列并做成描边的形式，使其不是那么抢眼。同时添加曲线和点元素，象征音乐的节奏与高低起伏。另外这些点元素也可以替换成音符哦。

好的主体+好的编排=合格的版式，这是基础，如果想要做的更好，那么就需要在创意上下文章了。那么本期文章就到这里了，大家学会了嘛？

欢迎关注作者微信公众号：「大猫设计」

编者按：遇到复杂的业务产品，设计师该如何破局，如何站在业务的视角主动视察？本文用58的实战案例，给大家带来一点思路。更多相关干货：如何应对复杂场景下的B端产品设计？

编者按：遇到复杂的业务产品，设计师该如何破局，如何站在业务的视角主动视察？本文用58的实战案例，给大家带来一点思路。

更多相关干货：

如何应对复杂场景下的B端产品设计？我总结了这3个方面！ 最近做的产品还是挺复杂的，牵扯到多个用户角色，并且分布在不同的网络环境中，用户对信息安全性要求又比较高。

阅读文章 >

58 拥有丰富的业务品类，其功能也多，若重要的功能或业务没有在首页进行合理的曝光，则可能导致重要信息缺失，一些符合用户诉求的业务信息不能快速有效的传达给用户，用户体验也会下降，导致用户流失。那么在这种情况下，我们该采取何种有效的设计策略？如何通过设计给平台带来新的体验和价值？又该怎样去挖掘设计的可能性呢？即在满足业务需求的同时，也能真正给到用户想要的服务，发挥出设计的价值。本文将从自己的一些理解出发，希望能给大家带来一点设计思路。

一、如何在丰富的业务产品中破局 面对复杂且多样的产品业务，很多时候设计师都是被动地接受需求。如果想发掘出更多的设计价值，就需要转被动为主动，要转变身份不断地思考，设计师如何在复杂的产品业务中破局？发挥更大的设计价值呢？

对于设计师来说，除了保质保量的完成设计需求，我们还可以通过其他方式来创造价值，比如：

可以将项目的视觉表现、交互流程、产品结构等方面做出更优的设计，让用户用起来更流畅体验更好； 可以分析产品数据和用户画像，为用户提供更加个性化的设计体验和服务，促成业务转化； 可以做好用户分层引导和提示，降低用户的认知负荷和操作门槛； 可以通过挖掘业务和用户场景之间的关系，了解每个业务线特有的业务逻辑，洞察设计机会点，对业务目标进行拆解，通过提升信息容量、调整模块结构以及拓展内容维度等手段，设计出符合各个产品业务目标的最佳方案等； 通过这些方式直接或间接地为产品带来收益，也可以实现业务目标和价值。所以我们要让自己站在更高的全局视角而不是设计的本位视角，从多个维度展开前期的分析工作，主动发现问题提出设计策略，实现设计执行到设计驱动的突破。

创造业务价值的方式方法

二、如何站在业务的全局视角主动视察？ 我一直秉持着设计师是产品与用户之间的桥梁，所以想要利用设计思维和手段为业务创造更多的价值，那如何开展呢？

在日常的设计工作中，要怀着让设计发挥更大价值的初心，从业务出发挖掘问题，深入业务主动与业务的设计或产品关键角色进行沟通，了解业务的背景、逻辑及痛点，还可以主动询问身边的小伙伴使用产品时遇到的核心痛点是什么？多维度的去审视问题出现的原因是什么？站在全局视角从产品侧、用户侧和体验侧多个角度进行深入洞察，去挖掘能够发挥的机会点，要辅助业务实现业务目标，解决业务问题，创造业务价值。

三、如何将上面两点在实际项目中应用呢？ 案例说明：

自 APP 11.0 升级以后， 首页几乎没有做过重大的视觉调整，但随着行业及业务多样化的服务升级，用户对服务的需求不断提升。当前已无法满足业务及用户的需求。在这中间，我们一直主动做一些服务升级的尝试，比如在首页做中颗粒度业务的分发，再比如思考如何通过设计给平台带来新的体验和价值。在不断尝试新的可能性和满足业务需求的同时，也希望能真正给到用户优质的服务，提高用户获取服务的效率，提升首页整体的用户的体验，促进业务的增长，发挥设计的价值。

首页页面结构分析

先来看首页的一个流量分配，高流量区 、中流量区、低流量区，借助流量分区再找产品和用户之间的平衡点，打造更好的体验发挥更大的价值。

来给大家简单讲一下我们做的其中一个实验，针对高流量区金刚位测试实验

首页页面结构分析

1. 设计前的问题定位 洞察问题

基于是否能满足中颗粒度业务分发能力看当前的首页，业务增长及分发依赖首屏金刚位，我们拥有丰富的业务类型，用户不能快速感知 58 的核心业务，且了解有一些业务比较重要的业务没有得到曝光，不能快速有效触达用户，所以业务希望透出更多不同的服务，建立服务的关键触点，促成业务转化，用户希望满足他们在不同阶段的服务诉求，当前金刚位的展示模式，已经不能满足用户也不能满足业务了。

金刚当前业务图标梳理

定义问题

多维度地去审视问题出现的原因是什么？为什么拥有丰富的业务供给和服务，却不能满足现状呢？

通过对当前展示策略的分析、行业竞品的分析及结合当前产品数据情况，多个维度、多元的立体化思考，来定义问题。

与业务沟通，了解每个业务线特有的业务逻辑，以及一些特定场景/城市的推荐策略，洞察设计机会点，定义展示方式。

金刚位漏出 14 个入口，只有 2 个个性化入口，导致我们的金刚位很难做用户分层，不能透出业务的一些重要服务； 首页的屏效有限，我们要控制金刚的展示区域，也要考虑 feed 的漏出情况；

思路：更丰富灵活的业务配置

分析问题

如何在即满足业务有更多服务曝光又能满足用户的核心诉求，有以下几种方法：

拓展展示形式：调整了金刚位的信息架构策略，将分散的核心业务信息进行层级整合，强化 5 大核心业务，帮助用户快速感知，而用户的需求往往是在动态流转，尝试增加业务入口，既能满足更灵活的业务配置，又可以随着用户的画像提供更多不同阶段的服务，以此来提升首页业务的分发和转化能力。

交互形式优化：金刚位入口增加，但也要避免入口展示过多，防止业务信息被淹没，寻找解决 feed 下顶太多的解决手段，减少 feed 点击率的流失；

既然问题已经确定了，那就要去解决问题。根据对问题的分析，如何设计呢？

2. 设计中的目标定义 确定设计目标

产品目标：优化金刚位的信息架构，提高用户的点击率。

用户目标：用户希望快速找到想要的服务。

用户的痛点：用户在金刚区不能快速找到想要的服务入口，就会导致用户找服务的路径过长，从而导致用户流失，所以需要细分用户场景，让功能、信息更加精确，让用户在不同场景下可以快速获取到。

设计目标：通过优化金刚位结构样式，提供业务分类，透传核心业务，优化信息层级，tab 交互样式，实现金刚位的样式升级，快速让用户找到服务，培养用户心智，提高金刚位的点击率；

推导设计目标，制定设计策略

设计策略

确定好设计目标之后，需要通过制定设计策略进行设计方案的推导。

优化金刚位结构划分，强化一级核心业务，对金刚进行层级处理； 优化 tab 交互体验，减少 feed 下顶太多，影响 feed 信息露出； 优化内容主次，避免信息过载，导致内容淹没； 3. 设计后的效果验证 项目上线后，我们也会去收集反馈信息，关注我们设定好的指标去衡量、验证构建的设计方案是否解决了用户的问题以及是否达成了产品目标，因为这样设计工作才能实现一个闭环。

因为项目还在灰度，逐渐扩量中，我们后续全量上线后的数据和反馈也在时刻关注，目前灰度的数据表现，对比发现在核心业务的点击都表现正向，整个首页的点击提升显著，能看出大家对这次升级还是认可的。

以上，是我对首页金刚位的优化及一些小思考，所做一切，都是为了给用户持续提供更好的体验。

总结 很多时候，我们不要着急去出设计方案，多对当前要解决问题的结论进一步审视、拓展和验证的态度。要多站在多个角度、多个维度的立体化思考，精确地定位问题，深入挖掘能够发挥的机会点，以此来产出最优的方案。我们对首页的探索之路还在继续，用设计赋能产品更多的 业务场景 。

欢迎关注「58UXD」的 微信 公众号：

编者按：遇到复杂的业务产品，设计师该如何破局，如何站在业务的视角主动视察？本文用58的实战案例，给大家带来一点思路。更多相关干货：如何应对复杂场景下的B端产品设计？

编者按：遇到复杂的业务产品，设计师该如何破局，如何站在业务的视角主动视察？本文用58的实战案例，给大家带来一点思路。

更多相关干货：

如何应对复杂场景下的B端产品设计？我总结了这3个方面！ 最近做的产品还是挺复杂的，牵扯到多个用户角色，并且分布在不同的网络环境中，用户对信息安全性要求又比较高。

阅读文章 >

58 拥有丰富的业务品类，其功能也多，若重要的功能或业务没有在首页进行合理的曝光，则可能导致重要信息缺失，一些符合用户诉求的业务信息不能快速有效的传达给用户，用户体验也会下降，导致用户流失。那么在这种情况下，我们该采取何种有效的设计策略？如何通过设计给平台带来新的体验和价值？又该怎样去挖掘设计的可能性呢？即在满足业务需求的同时，也能真正给到用户想要的服务，发挥出设计的价值。本文将从自己的一些理解出发，希望能给大家带来一点设计思路。

一、如何在丰富的业务产品中破局 面对复杂且多样的产品业务，很多时候设计师都是被动地接受需求。如果想发掘出更多的设计价值，就需要转被动为主动，要转变身份不断地思考，设计师如何在复杂的产品业务中破局？发挥更大的设计价值呢？

对于设计师来说，除了保质保量的完成设计需求，我们还可以通过其他方式来创造价值，比如：

可以将项目的视觉表现、交互流程、产品结构等方面做出更优的设计，让用户用起来更流畅体验更好； 可以分析产品数据和用户画像，为用户提供更加个性化的设计体验和服务，促成业务转化； 可以做好用户分层引导和提示，降低用户的认知负荷和操作门槛； 可以通过挖掘业务和用户场景之间的关系，了解每个业务线特有的业务逻辑，洞察设计机会点，对业务目标进行拆解，通过提升信息容量、调整模块结构以及拓展内容维度等手段，设计出符合各个产品业务目标的最佳方案等； 通过这些方式直接或间接地为产品带来收益，也可以实现业务目标和价值。所以我们要让自己站在更高的全局视角而不是设计的本位视角，从多个维度展开前期的分析工作，主动发现问题提出设计策略，实现设计执行到设计驱动的突破。

创造业务价值的方式方法

二、如何站在业务的全局视角主动视察？ 我一直秉持着设计师是产品与用户之间的桥梁，所以想要利用设计思维和手段为业务创造更多的价值，那如何开展呢？

在日常的设计工作中，要怀着让设计发挥更大价值的初心，从业务出发挖掘问题，深入业务主动与业务的设计或产品关键角色进行沟通，了解业务的背景、逻辑及痛点，还可以主动询问身边的小伙伴使用产品时遇到的核心痛点是什么？多维度的去审视问题出现的原因是什么？站在全局视角从产品侧、用户侧和体验侧多个角度进行深入洞察，去挖掘能够发挥的机会点，要辅助业务实现业务目标，解决业务问题，创造业务价值。

三、如何将上面两点在实际项目中应用呢？ 案例说明：

自 APP 11.0 升级以后， 首页几乎没有做过重大的视觉调整，但随着行业及业务多样化的服务升级，用户对服务的需求不断提升。当前已无法满足业务及用户的需求。在这中间，我们一直主动做一些服务升级的尝试，比如在首页做中颗粒度业务的分发，再比如思考如何通过设计给平台带来新的体验和价值。在不断尝试新的可能性和满足业务需求的同时，也希望能真正给到用户优质的服务，提高用户获取服务的效率，提升首页整体的用户的体验，促进业务的增长，发挥设计的价值。

首页页面结构分析

先来看首页的一个流量分配，高流量区 、中流量区、低流量区，借助流量分区再找产品和用户之间的平衡点，打造更好的体验发挥更大的价值。

来给大家简单讲一下我们做的其中一个实验，针对高流量区金刚位测试实验

首页页面结构分析

1. 设计前的问题定位 洞察问题

基于是否能满足中颗粒度业务分发能力看当前的首页，业务增长及分发依赖首屏金刚位，我们拥有丰富的业务类型，用户不能快速感知 58 的核心业务，且了解有一些业务比较重要的业务没有得到曝光，不能快速有效触达用户，所以业务希望透出更多不同的服务，建立服务的关键触点，促成业务转化，用户希望满足他们在不同阶段的服务诉求，当前金刚位的展示模式，已经不能满足用户也不能满足业务了。

金刚当前业务图标梳理

定义问题

多维度地去审视问题出现的原因是什么？为什么拥有丰富的业务供给和服务，却不能满足现状呢？

通过对当前展示策略的分析、行业竞品的分析及结合当前产品数据情况，多个维度、多元的立体化思考，来定义问题。

与业务沟通，了解每个业务线特有的业务逻辑，以及一些特定场景/城市的推荐策略，洞察设计机会点，定义展示方式。

金刚位漏出 14 个入口，只有 2 个个性化入口，导致我们的金刚位很难做用户分层，不能透出业务的一些重要服务； 首页的屏效有限，我们要控制金刚的展示区域，也要考虑 feed 的漏出情况；

思路：更丰富灵活的业务配置

分析问题

如何在即满足业务有更多服务曝光又能满足用户的核心诉求，有以下几种方法：

拓展展示形式：调整了金刚位的信息架构策略，将分散的核心业务信息进行层级整合，强化 5 大核心业务，帮助用户快速感知，而用户的需求往往是在动态流转，尝试增加业务入口，既能满足更灵活的业务配置，又可以随着用户的画像提供更多不同阶段的服务，以此来提升首页业务的分发和转化能力。

交互形式优化：金刚位入口增加，但也要避免入口展示过多，防止业务信息被淹没，寻找解决 feed 下顶太多的解决手段，减少 feed 点击率的流失；

既然问题已经确定了，那就要去解决问题。根据对问题的分析，如何设计呢？

2. 设计中的目标定义 确定设计目标

产品目标：优化金刚位的信息架构，提高用户的点击率。

用户目标：用户希望快速找到想要的服务。

用户的痛点：用户在金刚区不能快速找到想要的服务入口，就会导致用户找服务的路径过长，从而导致用户流失，所以需要细分用户场景，让功能、信息更加精确，让用户在不同场景下可以快速获取到。

设计目标：通过优化金刚位结构样式，提供业务分类，透传核心业务，优化信息层级，tab 交互样式，实现金刚位的样式升级，快速让用户找到服务，培养用户心智，提高金刚位的点击率；

推导设计目标，制定设计策略

设计策略

确定好设计目标之后，需要通过制定设计策略进行设计方案的推导。

优化金刚位结构划分，强化一级核心业务，对金刚进行层级处理； 优化 tab 交互体验，减少 feed 下顶太多，影响 feed 信息露出； 优化内容主次，避免信息过载，导致内容淹没； 3. 设计后的效果验证 项目上线后，我们也会去收集反馈信息，关注我们设定好的指标去衡量、验证构建的设计方案是否解决了用户的问题以及是否达成了产品目标，因为这样设计工作才能实现一个闭环。

因为项目还在灰度，逐渐扩量中，我们后续全量上线后的数据和反馈也在时刻关注，目前灰度的数据表现，对比发现在核心业务的点击都表现正向，整个首页的点击提升显著，能看出大家对这次升级还是认可的。

以上，是我对首页金刚位的优化及一些小思考，所做一切，都是为了给用户持续提供更好的体验。

总结 很多时候，我们不要着急去出设计方案，多对当前要解决问题的结论进一步审视、拓展和验证的态度。要多站在多个角度、多个维度的立体化思考，精确地定位问题，深入挖掘能够发挥的机会点，以此来产出最优的方案。我们对首页的探索之路还在继续，用设计赋能产品更多的 业务场景 。

欢迎关注「58UXD」的 微信 公众号：

大家好，这里是你们聊设计的花生。今天继续英文字体推荐系列，为大家推荐 5 款典雅华丽、具有流畅连笔的英文花字体——铜版手写体（Copperplate Script ）。海报设计如何更优雅？

大家好，这里是你们聊设计的花生。今天继续 英文字体 推荐系列，为大家推荐 5 款典雅华丽、具有流畅连笔的英文花字体——铜版手写体（Copperplate Script ）。

海报设计如何更优雅？加上这个元素准没错！（附素材下载） 大家好呀， 我是和你们聊设计的花生~ 之前和大家分享了纤细的手写英文字体在海报中的运用，他们可以丰富画面层次并烘托氛围，让海报不再沉闷呆板。

阅读文章 >

一、铜版手写体（Copperplate Script ）简介 「铜版体」是指 17 世纪末起在英国流行的、模仿典雅手写体的活字字体的总称，也是有史以来最著名、最受欢迎的书法风格之一，因当时多用于铜版印刷而得名。早期书写这种字体需要使用细尖的羽毛笔，工业化的兴起后使用了更灵活、更耐用的细尖金属笔尖。

使用金属笔尖书写的铜版体。图片来源：Pinterest

随着时代发展，这种风格的字体被数码化为电脑字体，比较著名的有 Snell Roundhand 和 Shelley Script。而现在除了在纸上手写，在数位板或 ipad 上使用特定笔刷也可以复刻出与金属笔尖同样的书写效果。

Shelley Script 的字形

铜版手写体字形微微向右倾斜，不同的字母间有极细的笔画相互连接，延绵流畅，如同时书法家用钢笔一气呵成写成的，具有音乐韵律般的节奏和美感。字形精致，气质华丽典雅，在明信片、邀请函、红酒包装等设计上有广泛的运用，适合与女性、婚礼、餐饮美食等相关的主题。

二、 5 款免费可商用的西文铜版手写体 下面为大家推荐 5 款我精心整理的 Copperplate Script 字体，都是免费可商用的，字体安装包见文章开头/结尾的链接。使用这类字体有以下几点需要注意：

不能全部用大写字母排版。 为了不破坏连笔的节奏和流畅性，不应该随意放宽或缩进字间距，也不要随意添加与笔画风格不同的装饰或随意拉伸变形，最好的方法就是直接使用。 适合与传统正规的衬线体或宋体搭配使用，比如 Baskervill、Garamond 和思源宋体等。 1. Italianno

2. England hand OB

3. Exmouth

4. Dynalight

5. Bolina

好啦以上就是今天为大家推荐的 5 款适合婚礼使用的英文花体字，喜欢本期推荐的话记得点赞收藏，也可以转发给身边有需要朋友。有关本文或设计的问题可以在评论区提出，我会第一时间为回复 ~

推荐阅读：

5个经典的付费英文字体，我们都帮你找到了免费可商用替代款！（二） 大家好，我是和你们聊设计的花生。

阅读文章 >

除了思源宋体，这7款免费可商用的宋体字也不容错过！ 大家好，我是和你们聊设计的花生~ 如果让大家推荐一款好用免费可商用的宋体，估计很多小伙伴都说思源宋体，毕竟真的非常好用。

阅读文章 >

大家好，这里是你们聊设计的花生。今天继续英文字体推荐系列，为大家推荐 5 款典雅华丽、具有流畅连笔的英文花字体——铜版手写体（Copperplate Script ）。海报设计如何更优雅？

大家好，这里是你们聊设计的花生。今天继续 英文字体 推荐系列，为大家推荐 5 款典雅华丽、具有流畅连笔的英文花字体——铜版手写体（Copperplate Script ）。

海报设计如何更优雅？加上这个元素准没错！（附素材下载） 大家好呀， 我是和你们聊设计的花生~ 之前和大家分享了纤细的手写英文字体在海报中的运用，他们可以丰富画面层次并烘托氛围，让海报不再沉闷呆板。

阅读文章 >

一、铜版手写体（Copperplate Script ）简介 「铜版体」是指 17 世纪末起在英国流行的、模仿典雅手写体的活字字体的总称，也是有史以来最著名、最受欢迎的书法风格之一，因当时多用于铜版印刷而得名。早期书写这种字体需要使用细尖的羽毛笔，工业化的兴起后使用了更灵活、更耐用的细尖金属笔尖。

使用金属笔尖书写的铜版体。图片来源：Pinterest

随着时代发展，这种风格的字体被数码化为电脑字体，比较著名的有 Snell Roundhand 和 Shelley Script。而现在除了在纸上手写，在数位板或 ipad 上使用特定笔刷也可以复刻出与金属笔尖同样的书写效果。

Shelley Script 的字形

铜版手写体字形微微向右倾斜，不同的字母间有极细的笔画相互连接，延绵流畅，如同时书法家用钢笔一气呵成写成的，具有音乐韵律般的节奏和美感。字形精致，气质华丽典雅，在明信片、邀请函、红酒包装等设计上有广泛的运用，适合与女性、婚礼、餐饮美食等相关的主题。

二、 5 款免费可商用的西文铜版手写体 下面为大家推荐 5 款我精心整理的 Copperplate Script 字体，都是免费可商用的，字体安装包见文章开头/结尾的链接。使用这类字体有以下几点需要注意：

不能全部用大写字母排版。 为了不破坏连笔的节奏和流畅性，不应该随意放宽或缩进字间距，也不要随意添加与笔画风格不同的装饰或随意拉伸变形，最好的方法就是直接使用。 适合与传统正规的衬线体或宋体搭配使用，比如 Baskervill、Garamond 和思源宋体等。 1. Italianno

2. England hand OB

3. Exmouth

4. Dynalight

5. Bolina

好啦以上就是今天为大家推荐的 5 款适合婚礼使用的英文花体字，喜欢本期推荐的话记得点赞收藏，也可以转发给身边有需要朋友。有关本文或设计的问题可以在评论区提出，我会第一时间为回复 ~

推荐阅读：

5个经典的付费英文字体，我们都帮你找到了免费可商用替代款！（二） 大家好，我是和你们聊设计的花生。

阅读文章 >

除了思源宋体，这7款免费可商用的宋体字也不容错过！ 大家好，我是和你们聊设计的花生~ 如果让大家推荐一款好用免费可商用的宋体，估计很多小伙伴都说思源宋体，毕竟真的非常好用。

阅读文章 >