什么是B端产品经理？和C端产品经理有什么区别？
大部分产品中都含有一些引导帮助的功能，这些功能有什么作用呢？对于设计者来说，应该秉持怎样的初心来设计呢？目前，引导帮助功能又有哪些常见的分类呢？带着这些问题，我们一起走进这篇文章，看看作者为我们的分享。推荐相关人员阅读与学习。
前几天眼睛不太舒服，去医院做了一个检查（视疲劳导致）。
因为要走商保，所以需要使用社保卡，之前我记得社保结算都需要去人工窗口，我刚过去就被一个穿着红马褂的大妈拦住说自助机也可以用社保，要我扫她胸前挂的码（可以快速到达电子社保二维码界面），扫完她就开始帮我点击操作。
她觉得我应该不会操作，所以让我看一遍，其实这个操作并不难，只是因为我不知道自助机上可以用，自助机周围也没引导操作流程。而且她这种方式让很多年纪大的人和外地过来看病的觉得你是个骗子，后面好几个人都还是去了窗口。
在B端产品中也有很多类似问题，用户不知道有这个功能、也不知道这个功能怎么使用，特别是一些数据类产品，专业性比较强。产品、技术都认为用户和他们一样都懂，实际上并不是，这个时候你需要提供一些邀请，引导用户进行使用。
邀请就是引导用户进行操作前的提醒和暗示，通常包括实时的提示信息和预期功能，以表明在当前界面或下个界面可以做什么，这是成功的交互式界面关键所在。
例如：飞书-我的空间，当鼠标停留在可编辑区域上时，就会实时地显示邀请（复选框），这个例子的缺点是鼠标如果不处于相应区域上，就不会显示邀请。
另一种方案是任何时候都显示邀请，例如：石墨文档-我的桌面，复选框一直显示。
静态邀请就是通过直接在页面上给出交互提示，可以让用户随时看到期望的界面功能。
静态邀请主要有两种模式：引导操作邀请、漫游探索邀请。
01 步骤引导
例如：华为云HECS服务器产品就给出1、2、3操作步骤
引导操作会占据页面较大的空间，同时也会吸引用户的眼球。所以在设计时需要思考一下，你希望引导用户执行什么操作，用户是否可以多次查看，这样有利于设计出明晰的页面和信息层。
02 白板引导
另一种引导操作邀请叫白板式引导。
意思很明确：现在只有一个空白页面，需要引导用户创建内容。
利用空白区域“变废为宝”，如何对该区域应有的功能给出提示，是诱导用户创建内容（填补空白）的有效方式。
与引导操作邀请关系密切的是漫游探索邀请。假设你重新设计了某个页面并添加了一组全新的功能，怎样才能保证用户恰当地使用新页面，同时发现新添加的功能呢？漫游邀请是向用户介绍新功能最好的方法。
最佳实践：
静态邀请适合提示用户当前界面中包含什么功能。然而，许多调查试验表明，用户经常不会阅读指导说明性的文字。而在用户交互过程中，在他们需要的时候提供邀请则是一种不错的方式。动态邀请就是在用户交互过程中的某个点上吸引用户，并引导他们继续下一步操作。
吸引用户的一种方式是通过鼠标悬停来显示邀请
例如：飞书消息列表鼠标移入后， 背景变化的同时会有一个“勾”图标来吸引用户，鼠标移入上去后提示可以点击完成，点击后消息移除列表。
最佳实践
唐纳德·诺曼将这个术语引入到设计领域。最经典的例子是门把手，门把手的预期功能是可以抓握、扭转或按压。屏幕元素可感知的预期功能没有物理属性，不过，由于习惯、术语、图形及一致性等原因，用户能够在某种程度上感觉到他们可以操作这些元素。
例如：第一张图飞书文档sheet页“加号”图标与第二张图“三个点”图标，就是一种预期功能邀请。用户没触发之前就能猜到触发后会是什么效果。
预期功能邀请之所以有效，是因为利用人们已知的习惯与认知引入交互，从而让用户顺利完成一连串操作。
最佳实践
设计邀请时怎么才能猜测用户的想法，也是一项重要挑战。如果用户下一步可能会执行多种操作，而事实上又不可能准确判断用户想法，那么面临的困难就会比想象的大很多。
在google sketchup （ 3D）绘图工具中，当鼠标点击某个点后，进行第二个点连接时，会有多种可能性，这个时候系统也不确定用户会怎样连接，但会给出对应的提示，比如：端点、中点、背面、侧面等点位来辅助用户进行连接。
例如：这种工作流场景个人觉得也算是一种，点击“加号”右侧会滑出面板，给出你可以添加的动作。
这种在交互期间以可见方式向用户表明系统推断出的用户想法被称为推论邀请。
图片类型的更多邀请，例如：站酷相关推荐
文字更多邀请，例如：QQ邮箱右侧最近联系人
精心设计的应用能够通过邀请体现出各自的细微差别，无论是静态还是动态，都是引导用户顺利进入下一个交互层次的有效方法。
谢谢观看！
作者：夜莺YEAH；公众号：夜莺B端UX设计
本文由 @夜莺YEAH 原创发布于人人都是产品经理，未经作者许可，禁止转载
题图来自 Unsplash，基于 CC0 协议
该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。
兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。我们建立了一个微信群，每天分享国内外优秀的设计，有兴趣请加入一起学习成长，咨询及进群请加蓝小助微信ben_lanlan
设计是通过美感和逻辑来提升用户体验，提高企业满意度。本文探讨美感设计在用户体验中的作用，从五个维度分别论述美感设计的重要性，一起来看看吧。
设计是通过逻辑和美感来解决人们的问题，满足他们的愿望。本文将探讨美感在用户体验设计中的作用，以此提高用户和企业的满意度。
数字产品的成功与否，除了其功能性能以外，美感也扮演了至关重要的角色。在竞争日益激烈的市场，用户的选择不仅仅局限于功能是否满足需求，审美愉悦和情感需求也成为了影响购买决策的关键因素。因此，设计对于产品的成功至关重要。
随着需求层次的提高，人们的选择越来越多样化和理性化。教育和收入水平的提高，使他们开始思考超越功能的问题。此外，用户更加注重产品的美感和和谐性，因此美学在其选择中扮演着越来越重要的角色。
马斯洛金字塔，展示需求层次
美感在用户体验设计中发挥以下作用：
创新农业服务FarmSense的网站设计
美学是将设计的过去、现在和未来连接在一起的重要桥梁。当今的布局和图形基于世界文化数百年来积累的丰富遗产。现代设计师和艺术家通过各种趋势和创新对其进行改造，创造出一个新的文化历史圈子，展示了历代最杰出艺术家的杰作。这正是艺术和审美在设计中所发挥的作用。我们不是要重新发明轮子，而是要让它变得更现代化，以解决当下的问题。
美学可用性效应是指用户更倾向于认为外观吸引人的产品更加实用。即使实际上这些产品并没有更加有效或高效。这种现象被用户体验设计大师 Nielsen Norman Group 视为一种重要原因，因为既有吸引力又实用的界面才能真正提供良好的用户体验，而不仅仅是功能性 UI。
在1995年，日立设计中心进行了一项研究，研究人员Masaaki Kurosu和Kaori Kashimura探究了人机交互实践中的美学吸引力和易用性。该研究测试了252名研究参与者对26种ATM用户界面的易用性和美学吸引力进行评分。结果分析表明，审美情趣评级与感知易用性之间的相关性高于审美情趣评级与实际易用性之间的相关性。因此，该研究得出结论，无论用户试图评估系统的功能，任何界面的美感都会对用户产生强烈的影响。
在 UX 设计中，美感是一个关键因素，它对用户体验目标有着深远的影响。UX 设计通常包括四个核心方面：外观吸引力和视觉和谐、可用性、可访问性和效用性。这些方面综合起来，使得产品具有吸引人的外观、易于操作、适用于不同能力和设备、能够解决问题以及让用户感到愉悦。
Flower Store 应用程序指导用户完成订购个性化花束的过程
然而，对于那些开始推出新产品或改进知名产品的公司来说，他们也必须从不同的角度考虑。他们需要思考各种财务、转换、销售和所有其他业务运营方面的因素。
设计美学是否会对他们的商业目标产生影响呢？当然会。色彩理论和心理学、屏幕上的和谐、易读的文本内容以及吸引人的图像不仅对于满足用户需求非常重要，而且对于销售和让企业获得满意度也至关重要。
不同的元素可以融入用户界面并构建其美感，其中包括：
这些要素一起形成了交互美学，对于积极的用户体验有着直接的影响。另外，建议我们将过长的句子分解为短句，以减少重复，并提供改进建议。
加密博客设计使用有限的调色板使其看起来严肃但不沉闷，并呼应大报的传统布局以设置印刷媒体迁移到数字世界的强烈美感。
在 UX 和业务的交叉点上，一致性是实现美学和可用性效果的核心。Jacob Nielsen 曾指出：“一致性是最强大的可用性原则之一，因为当事物表现始终一致时，用户不必担心会发生什么。”因此，为了实现一致性，必须确保整个产品中的界面元素和交互方式始终保持一致，并遵循统一的设计准则。
事实上，它比交互更进一步。它还有助于建立强大的品牌。标志和品牌项目、网站、应用程序、电子邮件和社交网络——产品与用户的每一个接触点都应该遵循一个总体理念和一套价值观，并以一致和完整的风格包装。
金融科技服务 Crezco的身份设计采用一致的方法，使品牌能够通过各种沟通渠道建立有吸引力、值得信赖和稳固的形象。
在全球范围内，所有设计解决方案都需要回答一个关键问题——为什么？Simon Sinek，一位领袖力专家曾说过：“人们购买的不是你做的事情，而是你为什么这样做。”你所做的只是证明你的信念，这是产品和服务保持一致和鼓舞人心的原因。从“为什么”开始做出的决策将决定如何与用户交流，无论通信方式是什么。因此，您需要明确您所沟通的内容，无论与品牌的联系是什么。这样可以建立信任，使品牌更加强大，这正是美学在用户体验中发挥作用的地方。此外，您应该简化长句，减少重复，并提供改进建议以提高文本的清晰度和简洁性。
设计不仅要解决功能问题，还要考虑美感与情感需求。在数字产品市场竞争激烈的今天，美感对于产品的成功非常重要。人们的需求也逐渐提高，开始关注产品的美感和和谐性。美感在用户体验设计中的作用包括：使设计情感化，保持数字产品与现实世界的联系，支持使用感官，满足审美需求，以风格将不同事物结合在一起，让产品在竞争中脱颖而出。用户更倾向于认为外观吸引人的产品更加实用，这也是良好用户体验的重要原因。
原作者：Marina Yalanska
本文由 @唐小白 翻译发布于人人都是产品经理，未经许可，禁止转载
题图来自 Unsplash，基于 CC0 协议。
该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。
兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。我们建立了一个微信群，每天分享国内外优秀的设计，有兴趣请加入一起学习成长，咨询及进群请加蓝小助微信ben_lanlan
按钮是产品中十分常见的交互元素之一，好的按钮设计可以很大程度地提升用户体验。那么，怎么打造出符合用户需求、深受用户喜爱的优秀按钮？这篇文章里，作者对按钮UX设计进行了拆解分析，一起来看一下。
在数字产品中，按钮是最常用的交互元素之一。一个好的按钮设计可以提高用户体验和产品的使用率。
本文将探讨一些关于按钮UX设计的方法，包括明确按钮功能、选择合适的颜色、确定按钮大小、添加标签和描述、考虑交互方式、测试和优化等。
通过综合考虑这些因素，我们可以打造出符合用户需求的优秀按钮，提升产品的用户体验和竞争力。
按钮是一种用户界面元素，用于触发特定的操作或行为。
它可以是文本、图像或交互式元素，通常位于页面的底部或顶部，以便于用户快速访问。
根据不同的用途和设计风格，按钮可以分为多种类型和分类，例如：
以上仅是一些常见的按钮类型和分类，实际上还有很多其他的类型和分类。在设计按钮时，需要根据具体的场景和目的选择合适的类型和分类，并结合用户体验和产品需求进行优化。
按钮的位置和大小对于用户体验和产品可用性非常重要。一般来说，按钮应该位于用户视线的中心位置，以便于用户快速访问。同时，按钮的大小也应该适中，不要过大或过小，以免影响用户的操作。
在实际设计中，可以通过以下几种方式来确定按钮的位置和大小：
除了位置和大小之外，按钮的布局方式和排版规则也非常重要。合理的布局方式和排版规则可以提高用户的使用体验和产品的可用性。以下是一些常见的按钮布局方式和排版规则：
按钮的颜色对于用户体验和产品可用性非常重要。一般来说，按钮的颜色应该与产品的品牌色或主题色相匹配，以便于用户识别和记忆。同时，按钮的颜色也应该具有明显的对比度，以便于用户在不同的背景下快速找到目标按钮。
以下是一些常见的按钮颜色选择原则：
除了颜色之外，按钮的样式设计也是非常重要的。合理的样式设计可以提高用户的使用体验和产品的可用性。
以下是一些常见的按钮样式设计要点：
按钮文字的设计对于用户体验和产品可用性非常重要。一般来说，按钮文字应该简洁明了、易于理解和记忆，同时要符合产品的品牌形象和主题风格。
以下是一些常见的按钮文字设计原则：
除了文字之外，按钮标签也是非常重要的。合理的标签设计可以提高用户的使用体验和产品的可用性。
以下是一些常见的按钮标签设计要点：
按钮的交互设计对于用户体验和产品可用性非常重要。合理的点击效果和反馈机制可以提高用户的使用体验和产品的可用性。
以下是一些常见的按钮点击效果和反馈机制：
除了点击效果之外，按钮的动画效果和过渡效果也可以提高用户的使用体验和产品的可用性。
以下是一些常见的按钮动画效果和过渡效果：
按钮的测试和优化对于提高产品的用户体验和可用性非常重要。合理的测试和优化策略可以发现并解决产品中存在的问题，提高产品的品质和用户满意度。
以下是一些常见的按钮测试方法和流程：
除了测试之外，按钮优化也是提高产品用户体验和可用性的重要手段。以下是一些常见的按钮优化策略和技巧：
按钮UX设计对于提高产品的用户体验和可用性非常重要。合理的按钮设计可以增加用户的参与度、趣味性和便利性，从而提高用户对产品的满意度和忠诚度。
在进行按钮UX设计时，需要考虑按钮的位置、大小、颜色、样式、功能、反馈机制等多个方面，以确保产品能够满足用户的需求和期望。同时，还需要进行测试和优化，发现并解决产品中存在的问题，提高产品的品质和用户满意度。因此，按钮UX设计对于现代产品开发和用户体验设计都具有重要的意义和必要性。
本文由 @MO鱼山寨 原创发布于人人都是产品经理，未经许可，禁止转载
题图来自 Unsplash，基于 CC0 协议
该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。
兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。我们建立了一个微信群，每天分享国内外优秀的设计，有兴趣请加入一起学习成长，咨询及进群请加蓝小助微信ben_lanlan
本文深入分析了B端弹窗设计的尺寸规范问题，提供了科学定义弹窗尺寸的方法和思路，旨在帮助设计师提升操作效率并确保良好的用户体验，希望对您在弹窗设计上的决策有所启发。
相信大多B端设计师对web弹窗设计的规范都不陌生：比如弹窗按交互形式可分为模态弹窗和非模态弹窗；
按承载内容类型分为：提示类、操作类、展示类弹窗；按弹窗承载信息量的大小可以分为：小尺寸弹窗、中尺寸弹窗、大尺寸弹窗…等等但最近，在做一个操作提效的需求设计时遇到了需求方对弹窗尺寸的规范挑战~
大致需求是这样：为节省弹窗内对选项选择的时间，现将原本弹窗内的级联选择下拉框改成平铺按钮的形式。（见下图）ps：本平台为人工审核平台，使用用户为审核员，平台设计要为审核员的审核效率负责，审核效率一般表示为：单人单天（8小时）xxx条审核量。
问题点：承载内容信息量不固定原因：弹窗内用户选择项为不通过原因，而此选择项是用户根据自身企业的风险标签来自定义配置，这就涉及到级联选择数量的问题，有的客户风险标签体系细，多则几百个，有的客户只需要粗粒度标签，例如只有一级标签，总数可能不超过十个…
需求方：我要一个这么大的弹窗！好让信息呈现更全面！
但做设计从来不是凭空定义一个弹窗大小，要做到有理有据；前期选择先跟使用此平台的审核负责人沟通，来确定目前已接入的客户在此处自定义配置的原因数量量级并整理出沟通结论：
存在少量客户10个以内的原因个数、常规客户在30个左右的原因个数、现存一家客户使用最大量级100+原因个数。但由于控制权在客户方，原因量级不可控，未来也可能出现几百的数量。在以上结论中，可以确定出可能的备选 600px中弹窗、800px的大弹窗、或者需求方提出的将近1200px的超大弹窗，但到底哪个最为合适需要进一步判断。
在有可能的600px、800px、1200px三种宽度中选取最合适的弹窗尺寸，分别从操作效率与适配性角度对其进行判断。操作效率层面：
当原因个数在30个以下时：
若不同宽度时，都选择第一个处置原因，根据交互方法论–菲茨定律，指点设备到达目标的与两个因素有关：（1）设备当前位置和目标位置的距离（D）。距离越长，所用时间越长；（2）目标的大小（S）。目标越大，所用时间越短。
由此可见此操作的最终目标按钮为右下角的确定按钮，目标按钮大小不变，但整体的选择距离是相对两个较小弹窗要远的。D3>D2>D1，所用时间 T3>T2>T1。由于对审核员任务操作时间和效率要考虑到秒或毫秒级别，此大小对用户快速完成此操作起到负向作用。
另外，当原因个数10个以内时，可见此时弹窗宽度过宽，导致空白区域过大。
当原因个数在30个以下时，操作效率评分：
1200px ⭐️⭐️
800px ⭐️⭐️⭐️
600px ⭐️⭐️⭐️
当超过100个原因个数时：1200px 一屏内展示完全，不需要滚屏滑动；800px 可在两屏内展示完全，需要滚屏滑动；600px 超出两屏展示才可展示完全，需要滚屏滑动。
当原因个数超过100时，操作效率评分：
1200px ⭐️⭐️⭐️
800px ⭐️⭐️⭐️
600px ⭐️⭐️
适配性层面：
根据市面主流屏幕分辨率尺寸调研：
市面上存在部分 1024 分辨率的显示屏，所以：600px能够适配所有市面主流分辨率显示器；800px能够适配所有市面主流分辨率显示器；1200px不能能够适配市面主流1024*768的分辨率显示器，弹窗不能在显示器内显示完全，固适配性相对较弱。
综合三种弹窗大小的操作效率和适配性：
800px的表现最优，固选取800px的弹窗大小。
高度规范：由于信息量的不同可以根据内容多少进行自适应高度，限定max high 700px。由于一般超出800px可能出现浏览器外滚动条，所以选取高度为600-800px之间。
滚动条规范：限高后，若信息超出max high支持出现内滚动条。浏览器适配规范：浏览器窗口>800px，弹窗宽度保持固定宽度800px。浏览器窗口600-800px之间弹窗同步在600-800之间自适应。浏览器窗口<600px，弹窗宽度保持600px，出现浏览器外滚动条。
本文由人人都是产品经理作者【Clippp】，原创/授权 发布于人人都是产品经理，未经许可，禁止转载。
题图来自Unsplash，基于 CC0 协议。
兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。我们建立了一个微信群，每天分享国内外优秀的设计，有兴趣请加入一起学习成长，咨询及进群请加蓝小助微信ben_lanlan
在互联网领域中，人机之间的互动过程就是交互。交互也有一些可预测的、重复出现的规律，作者总结了其中常见的七种C端交互模式，可以提高大家的工作效率，分享给大家。
前段时间有个产品童鞋，他刚加我就问了一大串问题。
什么是模式（Pattern）？什么是模版（Template）？这两个概念有什么区别？
作为一个热心好学、乐于助人的产品仔，我当然和他畅聊了一个多小时，顺便总结下聊天内容。
你是不是也经常在生活工作中，碰到类似“行为模式、设计模式、语言模式、文档模版、表格模版”等名词。
但又搞不清它们有什么区别，搞懂了又有什么用？
别急，我们花几分钟，先来唠唠什么是模式。
可预测、重复出现的现象或规律，通过归纳总结，就变成了某一种模式。
我们的生活中，就有许多模式的影子。
比如常见的商业模式、营销模式、行为模式、数学模式、语言模式等。
举个例子：
简单说下行为模式，它分为了“习惯模式、消费模式、学习模式”等等。
苦逼打工仔普遍的消费模式，一般是工作日花钱少，到了周末都爱到商场逛街和购物。
但又有特例，我有个朋友就特别宅，他只喜欢在上班的时候，摸鱼逛淘宝下单，简直离谱~
掌握模式，有什么用？
当你掌握了模式的概念，并尝试在生活中使用，相信你一定能感受到这 7 个好处。
我们试着再举个例子，加深下对模式的理解，顺便学学交互设计。
什么是交互？
简单来说，交互指的是在互联网领域中，人、机之间的一系列互动过程。
我还提炼了 3 种常见模式（简单反馈、数据操作、业务判断），比较粗糙凑合也能用。
现在试着再系统总结下，我常用的 7 种 C 端交互模式，主要有：导航模式、搜索模式、反馈模式、输入模式、编辑模式、分享模式、引导模式。
学完就能用，赶紧卷起来~
有人就问了，还有更多交互模式吗？
确实可以有，等我有时间再编几个。。
话说回来，如果是一些特别复杂的业务规则，可能会涉及到 N 个交互模式的任意组合。
常见的导航模式有按钮组合、标签菜单、宫格布局、列表视图等。
导航模式的主要作用是，告知用户当前在网站的位置，以及接下来到哪些页面，这有点像地图 APP。
上面这张图中，包含了几种导航组件呢？
搜索，是各大电商 APP 常见的交互模式。
搜索模式允许用户输入关键词，然后系统返回搜索结果。
打个比方，这有点像在 Navicat 中写了一段 SQL 查询。
SELECT id, name, age
FROM users
WHERE age > 18
这段 SQL 的作用是，查询大于 18 岁的用户信息，包含序号、名称、年龄。
常见的反馈模式组件，涉及了对话框、吐司提示、气泡提示等。
反馈模式用的比较多的场景是，告知用户一些信息或提示，比如“输入密码错了、展示订单取消的注意事项”等。
输入模式主要用于新数据创建，例如淘宝下单时，你新增了一个收货地址。
打开美团叫个外卖，整个订单创建流程，也是输入模式。
有很多人可能会把输入模式和编辑模式搞混。
区别它们的一个方法是，交互流程涉及新数据创建，还是改旧数据。
改数据的话，那就是编辑模式。
我们在看到一些干货文章，或好用的小程序想要转发给朋友，那就要用到分享模式。
分享模式可以很简单，也可以往复杂了做，看产品阶段去实现。
引导模式和反馈模式有点像，都是展示特定的内容。
那怎么分辨它们呢？
以设计师视角来看，反馈模式需要用户触发，系统被动显示。
而要让用户特别关注的信息，那就是引导模式。
模式，即抽象的规律。——好夕雷
说了这么多概念和例子，你是不是对模式的认知更清晰了呢？
模式运用在产品领域，就有了这 7 种交互模式，分别是“导航模式、搜索模式、反馈模式、输入模式、编辑模式、分享模式、引导模式”。
如果学会了模式，那么无论生活还是工作，相信你一定能轻松应对、事半功倍。
本文由 @好夕雷 原创发布于人人都是产品经理，未经许可，禁止转载
题图来自Unsplash，基于CC0协议
该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。
在前面的文章中，我们定义了交互思维和流程、目标，接下来我们分享交互设计思维与我们常说的产品思维、体验思维等的融合。
在现代产品开发中，交互思维与产品设计思维的融合已经成为提升用户体验的关键。两者看似独立，却可以在实际设计过程中形成互补，打造出更加契合用户需求的产品。本文将从两者的特点、融合的价值，以及实际应用场景中如何落地等角度出发，深入探讨它们的结合。
交互思维：聚焦人与界面的连接
交互思维的核心在于用户与产品的互动体验。它关注的是：
交互思维倾向于优化用户的操作路径，将复杂的技术逻辑隐藏在背后，让用户感受到简单和直观。
例子：在淘宝购物车中，“全选”功能按钮被设计在靠近商品列表的顶部，方便用户快速选中所有商品；而删除操作则以批量和单选两种方式提供，提升操作灵活性。
产品设计思维：关注用户价值与商业目标
产品设计思维则是更全局的，它关注的是产品能否满足用户需求并实现商业价值。核心问题包括：
产品设计思维更偏向战略层面，要求对市场、用户和商业有全局的理解，并制定产品的发展方向。
例子：微信从“即时通讯”入手，以简单的聊天功能切入市场，但通过持续扩展支付、朋友圈、公众号等模块，构建了一个完善的生态系统。
两种思维的结合，能够更好地兼顾用户体验和商业价值。以下是几种主要的融合方式：
1）以用户为中心，兼顾商业目标
交互思维： 设计流畅、直观的操作流程，提升用户体验。
产品设计思维： 在流畅体验的基础上，引导用户完成关键行为（如购买、注册等），实现商业目标。
案例：美团外卖的下单流程
2）用户需求与技术限制的平衡
交互思维： 关注用户直观感受，简化复杂操作，让用户专注于目标任务。
产品设计思维： 在技术和资源限制内，找到实现用户需求的最佳方案。
案例：滴滴出行的“一键叫车”功能
3）数据驱动与用户体验的结合
交互思维： 基于用户行为数据优化界面和流程，提升操作效率。
产品设计思维： 基于数据分析判断用户需求的优先级，调整产品功能布局。
案例：淘宝推荐算法与界面设计
淘宝的个性化推荐系统通过AI分析用户浏览和购买行为，推荐相关商品。交互设计确保推荐商品的展示方式简洁、直观，不打扰用户正常浏览，增强购物体验的同时提升成交转化率。
4）感性设计与理性分析的结合
交互思维： 关注情感体验，设计让用户愉悦的互动。
产品设计思维： 从用户行为和反馈中提炼需求，找到情感体验的落地点。
案例：支付宝的“年度账单”功能
随着AI技术的深入发展，交互思维与产品设计思维的融合将进一步进化：
案例展望：
在未来的外卖App中，AI不仅能推荐菜品，还能根据天气、饮食偏好提供动态优惠，让用户感到“被理解”。同时，界面交互会变得更加智能，比如直接通过语音完成点餐和支付。
在数字产品开发中，交互思维和用户体验设计思维（UX Design Thinking）常常交织在一起，共同塑造出令人满意的产品体验。两者的融合不仅能提升产品的使用效率，还能激发用户的情感共鸣，最终实现用户目标与商业价值的双赢。
1）交互思维：聚焦人与界面的高效互动
交互思维主要关注用户与产品之间的操作过程，旨在通过直观的界面设计和高效的交互方式，帮助用户轻松完成任务。其核心要素包括：
2）用户体验设计思维：以用户为中心的全局视角
用户体验设计思维是以用户需求和用户感受为核心的一种方法论，涉及产品从设计到使用的整个生命周期。其重点在于：
简单类比：
交互思维像是一位专注于修路的工程师，确保路径笔直流畅；而用户体验设计思维更像是一位城市规划师，考虑如何让整个城市的交通系统高效且宜居。
1）从细节到全局，满足用户操作与体验的双重需求
交互思维注重细节，优化每一个交互动作；而用户体验设计思维关注全局，确保整个使用流程的流畅性和一致性。两者结合能让用户在每个环节都感到舒适且顺畅。
案例：微信的语音消息功能
2）情感设计与功能设计的结合
交互思维解决“怎么用”的问题，用户体验设计思维则深入到“为什么用”和“用后感受如何”。情感设计是两者融合的一个关键点，既提升用户满意度，又增强产品粘性。
案例：支付宝的完成支付动画
3）用户需求与设计约束的平衡
交互思维帮助优化操作路径，而用户体验设计思维则考虑设计的合理性和场景适配性。在技术和资源的限制下，两者需要共同探索最佳方案。
案例：滴滴出行的路线规划与确认
4）数据驱动与用户感知的结合
数据分析是用户体验设计思维的重要部分，而交互思维则利用这些数据优化每一次用户操作。两者的结合能实现功能的个性化和体验的精准化。
案例：淘宝的商品推荐系统
抖音作为短视频平台，在交互与用户体验设计的结合上表现得尤为出色：
随着AI的普及，交互思维与用户体验设计思维的融合将进入新的阶段：
案例展望：智能客服系统
未来的智能客服不仅能准确理解用户问题，还能根据情绪识别调整对话语气，同时提供即时解决方案与友好的互动体验。
交互思维与界面设计思维的融合，是现代产品设计中的核心命题。二者分别专注于用户操作路径和界面视觉呈现，彼此互补，共同打造出功能性与美观性兼具的产品体验。本文将从两者的概念、融合的价值以及实际案例中剖析如何实现这种深度结合。
1）交互思维：聚焦操作路径与用户效率
交互思维的核心在于优化用户操作的每一步，降低操作复杂度，提升使用效率。
其关注的主要问题包括：
特点：逻辑性强，重在用户的操作行为，强调功能可达性和可用性。
2）界面设计思维：聚焦视觉呈现与情感体验
界面设计思维则以视觉表现为中心，关注界面的美感和信息传达的有效性。其关注点包括：
特点：更注重感性表达，强调用户的情感体验和对产品的第一印象。
简单类比：
交互思维像是设计产品的操作说明书，确保逻辑清晰易懂；而界面设计思维则为产品包装，让它看起来有吸引力且直观。
1）信息分层与视觉引导的结合
交互思维： 根据用户操作逻辑，对信息进行层级划分，优先展示关键信息，隐藏次要内容。
界面设计思维： 通过颜色、字体大小、对比等视觉元素，强化信息的层级感和用户的关注点。
案例：支付宝首页的布局
交互层面： 核心功能（如转账、收付款）被放置在显眼的首屏区域，次要功能（如理财推荐）隐藏在二级页面。
界面层面： 不同模块的背景颜色和按钮样式有明显区分，用户一眼就能找到核心功能。
2）动效与反馈设计的结合
交互思维： 动效作为用户操作的反馈机制，提示操作结果或状态变化。
界面设计思维： 动效的风格和节奏与界面整体视觉风格保持一致，增强整体体验的连贯性。
案例：抖音的点赞动效
交互层面： 用户双击屏幕后，出现心形动画，明确提示“点赞成功”。
界面层面： 动效的色彩与抖音的品牌风格一致，给用户带来视觉和情感上的满足感。
3）视觉布局与操作路径的优化
交互思维： 确保核心操作路径最短，减少用户不必要的点击和跳转。
界面设计思维： 通过对页面布局的优化，让用户在操作路径中感到界面简洁且层次分明。
案例：京东购物车的设计
交互层面： 重要操作（如全选、去结算）被放置在用户触手可及的位置，减少多余步骤。
界面层面： 清晰的分组、直观的价格信息展示，让用户轻松理解购物车内容。
4）情感设计与功能优化的结合
交互思维： 通过优化功能满足用户需求，让操作过程简单高效。
界面设计思维： 在视觉设计中融入情感化元素，让用户感到愉悦或被关怀。
案例：网易云音乐的“听歌识曲”功能
交互层面： 用户只需点击一个按钮，系统即可快速识别歌曲，操作简单高效。
界面层面： 启动时有动态音波效果，识别成功后展示专辑封面和歌词，增强情感连接。
微信的朋友圈功能是交互思维与界面设计思维结合的经典案例：
交互设计：
用户可以通过简单的下滑操作浏览动态，上滑时加载更多内容，操作自然流畅。
点赞和评论的交互逻辑简单，长按可以删除自己的评论，符合用户直觉。
界面设计：
动态展示以卡片形式分隔，保持视觉整洁。
文本和图片的排版统一，评论区域的缩进样式使信息层级清晰。
交互思维与产品思维、体验思维、视觉设计思维的融合，是用户体验优化的基础。在实际设计中，我们既需要从全局出发，规划产品战略，也需要关注用户的每一步操作细节。
通过两者的互相补充，我们能设计出既符合用户需求，又实现商业价值的产品，更精准地满足用户需求，让产品不仅好用，还能打动人心。为用户和企业带来双赢的结果。
未来，随着技术的进步和用户需求的多样化，这种融合将持续推动数字产品体验的升级，成为提升产品竞争力的核心动力。
本文由 @ DesignLink 原创发布于人人都是产品经理。未经作者许可，禁止转载
兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。我们建立了一个微信群，每天分享国内外优秀的设计，有兴趣请加入一起学习成长，咨询及进群请加蓝小助微信ben_lanlan
在前面的文章中，我们定义了交互思维和流程、目标，接下来我们分享交互设计思维与我们常说的产品思维、体验思维等的融合。
在现代产品开发中，交互思维与产品设计思维的融合已经成为提升用户体验的关键。两者看似独立，却可以在实际设计过程中形成互补，打造出更加契合用户需求的产品。本文将从两者的特点、融合的价值，以及实际应用场景中如何落地等角度出发，深入探讨它们的结合。
交互思维：聚焦人与界面的连接
交互思维的核心在于用户与产品的互动体验。它关注的是：
交互思维倾向于优化用户的操作路径，将复杂的技术逻辑隐藏在背后，让用户感受到简单和直观。
例子：在淘宝购物车中，“全选”功能按钮被设计在靠近商品列表的顶部，方便用户快速选中所有商品；而删除操作则以批量和单选两种方式提供，提升操作灵活性。
产品设计思维：关注用户价值与商业目标
产品设计思维则是更全局的，它关注的是产品能否满足用户需求并实现商业价值。核心问题包括：
产品设计思维更偏向战略层面，要求对市场、用户和商业有全局的理解，并制定产品的发展方向。
例子：微信从“即时通讯”入手，以简单的聊天功能切入市场，但通过持续扩展支付、朋友圈、公众号等模块，构建了一个完善的生态系统。
两种思维的结合，能够更好地兼顾用户体验和商业价值。以下是几种主要的融合方式：
1）以用户为中心，兼顾商业目标
交互思维： 设计流畅、直观的操作流程，提升用户体验。
产品设计思维： 在流畅体验的基础上，引导用户完成关键行为（如购买、注册等），实现商业目标。
案例：美团外卖的下单流程
2）用户需求与技术限制的平衡
交互思维： 关注用户直观感受，简化复杂操作，让用户专注于目标任务。
产品设计思维： 在技术和资源限制内，找到实现用户需求的最佳方案。
案例：滴滴出行的“一键叫车”功能
3）数据驱动与用户体验的结合
交互思维： 基于用户行为数据优化界面和流程，提升操作效率。
产品设计思维： 基于数据分析判断用户需求的优先级，调整产品功能布局。
案例：淘宝推荐算法与界面设计
淘宝的个性化推荐系统通过AI分析用户浏览和购买行为，推荐相关商品。交互设计确保推荐商品的展示方式简洁、直观，不打扰用户正常浏览，增强购物体验的同时提升成交转化率。
4）感性设计与理性分析的结合
交互思维： 关注情感体验，设计让用户愉悦的互动。
产品设计思维： 从用户行为和反馈中提炼需求，找到情感体验的落地点。
案例：支付宝的“年度账单”功能
随着AI技术的深入发展，交互思维与产品设计思维的融合将进一步进化：
案例展望：
在未来的外卖App中，AI不仅能推荐菜品，还能根据天气、饮食偏好提供动态优惠，让用户感到“被理解”。同时，界面交互会变得更加智能，比如直接通过语音完成点餐和支付。
在数字产品开发中，交互思维和用户体验设计思维（UX Design Thinking）常常交织在一起，共同塑造出令人满意的产品体验。两者的融合不仅能提升产品的使用效率，还能激发用户的情感共鸣，最终实现用户目标与商业价值的双赢。
1）交互思维：聚焦人与界面的高效互动
交互思维主要关注用户与产品之间的操作过程，旨在通过直观的界面设计和高效的交互方式，帮助用户轻松完成任务。其核心要素包括：
2）用户体验设计思维：以用户为中心的全局视角
用户体验设计思维是以用户需求和用户感受为核心的一种方法论，涉及产品从设计到使用的整个生命周期。其重点在于：
简单类比：
交互思维像是一位专注于修路的工程师，确保路径笔直流畅；而用户体验设计思维更像是一位城市规划师，考虑如何让整个城市的交通系统高效且宜居。
1）从细节到全局，满足用户操作与体验的双重需求
交互思维注重细节，优化每一个交互动作；而用户体验设计思维关注全局，确保整个使用流程的流畅性和一致性。两者结合能让用户在每个环节都感到舒适且顺畅。
案例：微信的语音消息功能
2）情感设计与功能设计的结合
交互思维解决“怎么用”的问题，用户体验设计思维则深入到“为什么用”和“用后感受如何”。情感设计是两者融合的一个关键点，既提升用户满意度，又增强产品粘性。
案例：支付宝的完成支付动画
3）用户需求与设计约束的平衡
交互思维帮助优化操作路径，而用户体验设计思维则考虑设计的合理性和场景适配性。在技术和资源的限制下，两者需要共同探索最佳方案。
案例：滴滴出行的路线规划与确认
4）数据驱动与用户感知的结合
数据分析是用户体验设计思维的重要部分，而交互思维则利用这些数据优化每一次用户操作。两者的结合能实现功能的个性化和体验的精准化。
案例：淘宝的商品推荐系统
抖音作为短视频平台，在交互与用户体验设计的结合上表现得尤为出色：
随着AI的普及，交互思维与用户体验设计思维的融合将进入新的阶段：
案例展望：智能客服系统
未来的智能客服不仅能准确理解用户问题，还能根据情绪识别调整对话语气，同时提供即时解决方案与友好的互动体验。
交互思维与界面设计思维的融合，是现代产品设计中的核心命题。二者分别专注于用户操作路径和界面视觉呈现，彼此互补，共同打造出功能性与美观性兼具的产品体验。本文将从两者的概念、融合的价值以及实际案例中剖析如何实现这种深度结合。
1）交互思维：聚焦操作路径与用户效率
交互思维的核心在于优化用户操作的每一步，降低操作复杂度，提升使用效率。
其关注的主要问题包括：
特点：逻辑性强，重在用户的操作行为，强调功能可达性和可用性。
2）界面设计思维：聚焦视觉呈现与情感体验
界面设计思维则以视觉表现为中心，关注界面的美感和信息传达的有效性。其关注点包括：
特点：更注重感性表达，强调用户的情感体验和对产品的第一印象。
简单类比：
交互思维像是设计产品的操作说明书，确保逻辑清晰易懂；而界面设计思维则为产品包装，让它看起来有吸引力且直观。
1）信息分层与视觉引导的结合
交互思维： 根据用户操作逻辑，对信息进行层级划分，优先展示关键信息，隐藏次要内容。
界面设计思维： 通过颜色、字体大小、对比等视觉元素，强化信息的层级感和用户的关注点。
案例：支付宝首页的布局
交互层面： 核心功能（如转账、收付款）被放置在显眼的首屏区域，次要功能（如理财推荐）隐藏在二级页面。
界面层面： 不同模块的背景颜色和按钮样式有明显区分，用户一眼就能找到核心功能。
2）动效与反馈设计的结合
交互思维： 动效作为用户操作的反馈机制，提示操作结果或状态变化。
界面设计思维： 动效的风格和节奏与界面整体视觉风格保持一致，增强整体体验的连贯性。
案例：抖音的点赞动效
交互层面： 用户双击屏幕后，出现心形动画，明确提示“点赞成功”。
界面层面： 动效的色彩与抖音的品牌风格一致，给用户带来视觉和情感上的满足感。
3）视觉布局与操作路径的优化
交互思维： 确保核心操作路径最短，减少用户不必要的点击和跳转。
界面设计思维： 通过对页面布局的优化，让用户在操作路径中感到界面简洁且层次分明。
案例：京东购物车的设计
交互层面： 重要操作（如全选、去结算）被放置在用户触手可及的位置，减少多余步骤。
界面层面： 清晰的分组、直观的价格信息展示，让用户轻松理解购物车内容。
4）情感设计与功能优化的结合
交互思维： 通过优化功能满足用户需求，让操作过程简单高效。
界面设计思维： 在视觉设计中融入情感化元素，让用户感到愉悦或被关怀。
案例：网易云音乐的“听歌识曲”功能
交互层面： 用户只需点击一个按钮，系统即可快速识别歌曲，操作简单高效。
界面层面： 启动时有动态音波效果，识别成功后展示专辑封面和歌词，增强情感连接。
微信的朋友圈功能是交互思维与界面设计思维结合的经典案例：
交互设计：
用户可以通过简单的下滑操作浏览动态，上滑时加载更多内容，操作自然流畅。
点赞和评论的交互逻辑简单，长按可以删除自己的评论，符合用户直觉。
界面设计：
动态展示以卡片形式分隔，保持视觉整洁。
文本和图片的排版统一，评论区域的缩进样式使信息层级清晰。
交互思维与产品思维、体验思维、视觉设计思维的融合，是用户体验优化的基础。在实际设计中，我们既需要从全局出发，规划产品战略，也需要关注用户的每一步操作细节。
通过两者的互相补充，我们能设计出既符合用户需求，又实现商业价值的产品，更精准地满足用户需求，让产品不仅好用，还能打动人心。为用户和企业带来双赢的结果。
未来，随着技术的进步和用户需求的多样化，这种融合将持续推动数字产品体验的升级，成为提升产品竞争力的核心动力。
本文由 @ DesignLink 原创发布于人人都是产品经理。未经作者许可，禁止转载
兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。我们建立了一个微信群，每天分享国内外优秀的设计，有兴趣请加入一起学习成长，咨询及进群请加蓝小助微信ben_lanlan
前排提示：本文多Gif需耐心加载，且需要有一定Ae基础才能便于理解内容。
你有没有注意过，App底部的图标是如何变成选中的？大多数产品是将静态图标替换（硬切过渡），来完成状态切换。
当我看完上百个动态后，找到了更有趣的方式...
02 App底部导航构成
通常由图标、文字/点线装饰、和底板卡片组成，（当然也有些产品只使用图标或文字），但设计师在进行动态设计时则是针对这3部分。
03 Tab Bar动态类型
动态效果由弱到强，视觉层级由低到高依次排序：图标动态 — 装饰元素动态 — 底板卡片动态。（根据本文案例效果来排序，但效果不同会有所差异）
▍图标动态․
我们知道图标风格可以简单的分为：线性、面性还有线面。在这基础上通过修改颜色或造型，又能延展出更多风格。
最常用的是添加修剪路径（Ae的一种路径效果），你可以把它理解成托尼老师，可以通过调整百分百参数来控制线条生长。
但只是单色修剪，看起来很单调。我们可以在这个动画基础上再多复制几层，并分别加入品牌色，这样可以让视觉看起来更丰富。
也可以换一种方式，只调整不同颜色图标的位置属性，便能得到故障效果。
如果你觉得这些太浮夸，那么单个图标添加修剪路径，再配合位移、旋转等基础属性则是更好的选择。
通用的方法是调整不透明度，相比于硬切更柔和，且不会过多吸引用户注意力。但对于带有娱乐类属性的产品来说，可能会显得有些普通。
我们可以考虑使用遮罩来制作动态，首先在图标周围绘制几个圆，再将图标外轮廓，作为圆的遮罩，来控制其显示范围，最后调整圆的缩放即可。
在一些特殊的时间，设计师们可能会技痒，而将图标绘制的更加丰富，来营造氛围。
对于这类图标，只需要参考它们的物理状态[下方解释]，再遵循从下往上，从中心往四周扩张的原则来调整基础属性，便能制作出细节丰富的出场动画。
（物理状态：该物体在现实场景下的状态，上图奖杯真实世界状态通常是放置地面，所以出场方向是从下到上。但假如你的图标是锦旗，那么物理状态应该是挂在墙上，所有出场方向是从上到下）
当然如果去掉高光和投影，在制作一些动态时会更方便。
例如：复制一颗星，将其初始位置设定为一个奖杯的距离，并记录关键帧，然后整体再移动一个奖杯距离。耳朵则调整路径来完成移动和变形，这样便能营造出3d旋转的错觉。
对于结构复杂的图标，可以提前分层。其中线条依旧可以使用修剪路径（在Tab bar中，不同图标修剪路径的起始点方向通常相同，以便保持一致性），而填充只需要调整元素缩放，并借助蒙版限制其显示范围就行。
▍装饰元素动态․
如果你觉得前面这些方案不够新颖，那我们可以对装饰元素下手。（当然这类方案很少见，原因在于商业价值不足，实现成本高，所以这里也只是提供一些创意练习思路）
在一些年轻化产品中，如果图标含义很容易理解，那么设计师可能会用线或点来替代文字，让整体更简洁。
国外设计师Tubik，通过让点元素在移动时呈现心电图样式，让人眼前一亮。
通过动态效果，甚至能体现出产品行业属性。
尝试修改轨迹样式，然后为元素不透明度和位置添加动画，你能猜出这是什么类型的产品吗？
又或者再夸张些，将轨迹设计成电路图。其中线条添加修剪路径，再借助Ae路径跟踪方法，使圆点沿路径运动。最后通过蒙版来控制整体动画显示范围，这个方案看起来适合科技或游戏类产品。
通过调整元素路径来改变其造型，模拟液体滴落，再通过蒙版缩放，让选中状态下的图标出现。
假如你的图标设计的足够巧妙，我们可以提前绘制好关键笔画的运动轨迹，便能通过修剪这条轨迹来完成笔画的移动。
▍底板卡片动态․
这类动态少见的原因在于其动态效果面积大，视觉层级高，容易过度吸引用户注意力。目前也只是在个别产品中看过卡片凸起效果。
在Ae中要制造这样的效果，最先想到的可能是调整卡片路径，但这样的方式在制作弹性时非常麻烦。
我们有更简单的方法，先多画出一个圆，然后与卡片路径合并。
为了让边缘圆滑，整体添加高斯模糊和简单阻塞，分别加大参数，便能让边缘圆滑。（这种方式有个缺点：会收缩原有卡片宽高。所以添加效果后，需要借助参考线再次调整卡片大小）
完成圆滑处理后，修改其他元素的基础属性即可。
目前能记起的只有美团外卖看过这效果。但为了降低视觉干扰，其弱化了弹性次数。
这个效果灵感来源于Dribbble设计师（EuroART93），我们只需要将凸起案例中，圆与底板卡片的布尔运算模式改为相减就行，其他元素同样调整基础属性。
此方案目前还没有在其他产品中看过，究其原因还是效果太过抢眼。
看了这么多，其实不难发现。同一个图标，只需要改变不同属性或元素的运动方式，便能带来不一样的感受。
或许创意的产生，并不是脑袋突然迸发出全新的东西。而是许多我们熟知的旧有内容组合了起来。
正是它们之间这种奇妙的融合，给我们带来了新鲜感，或许这就是我们要的创意。
最后再说两句：
每个产品都有自己的调性和目标用户，动态效果也有强有弱。好的动态应该是能与其进行匹配，而不是根据某个产品得出一个绝对的答案。
本文演示了不同类型图标用什么动态，并不代表只能这样用。动态效果类型远远不止这些，而以上只是最常见的动态属性组合方式，所以请不要局限你的想法。
蓝蓝设计的小编 http://www.lanlanwork.com
