列表如果都是统一的样式、高度未免有些过于单调和重重复。在一些关键性文章中加一些特殊的样式也是我们常用的举措，例如文章置顶。但是文章置顶多了就会看不见新文章，置顶折叠展示的力度又不够。所以对于有特殊意义的文章展示特殊的效果是非常必要的，丰富层次。 这个文章的核心思路就是给文章的markdown文件里添加一个large参数，当large=true时，则文章会添加一个class。然后针对这个class进行css的调整。让我们开始吧。 样式预览 Demo 修改源文件编辑themes/butterfly/layout/includes/mixins/post-ui.pug 12345mixin postUI(posts) each article , index in page.posts.data if article.hide !== true- .recent-post-item+ .recent-post-item(class= (article.large === true) ? 'post-card-large' : ' ...

有些时候我们需要对不同地域的用户做一些限制，比如在北京的用户不能查看文章正文等。如何判断用户所在的地域并针对不同的地域做出限制呢？这里利用sohu的地域判断API。这篇文章用Butterfly的评论功能做地域限制为例子。 本文以pug代码为例，html代码在文章后面。 城市获取1234script(language='javascript', type='text/javascript', src='//pv.sohu.com/cityjson')script(language='javascript', type='text/javascript'). var city = returnCitySN['cname']; //- console.log(city) city变量则为城市名。例如北京市。然后可以通过city变量内容字符串是否包含北京即可。 判断 ...

找音在钢琴上找哆音位置 钢琴上的黑键表示方法 五线谱五线谱名称 五线谱上哆音位置 五线谱上黑键表示 音程音程度数计算 八个标准音程 音程计算 计算键数与标准音程键数的差别 参考乐球网

本文为转载文章，以下内容来源于 设计中的试验设计 腾讯FXD “ Never stop testing, and your advertising will never stop improving. ” 这是奥美公司创始人大卫奥格威的一句经典名言。 我们所熟悉的一些互联网公司佼佼者都崇尚快速实验，通过验证自己的想法推进产品的优化：Google每年运行超过1万次A/B测试；Booking通过大量试验实现超过同行业2-3倍的转化率；美国前总统奥巴马政府在募集选举资金的时候，通过测试对募资网站的图片以及文案进行测试优化，网站点击率提升了40.6%，而点击率的提升为奥巴马团队带去了预估6000万美元的捐赠… 从种种数据资料中，我们可以看到通过测试我们可以量化和提高运营效率、优化产品体验甚至还可以搞钱！ 随着现代互联网的发展，试验的门槛不断降低，A/B测试已经被普遍运用在各行各业，就算你没有做过A/B测 ...

在产品开发的阶段，特别是产品初期，总会有很多非常繁杂的产品需求。当这些需求一窝蜂的砸过来时，首先要对这些需求进行筛选、归类和排序。并且实时跟踪进度来进行完善。 开发什么需求？选择当下的需求当产品出现多个需求时，我们要区分战略性需求和当前需求。在与开发沟通产品发展方向后，决定发展方向的战略性需求应滞后。例如用户有想要分享自己生活的需要，现在有两个需求： 添加一个动态功能，用户可以类似微博一样表达自己的看法。 增加一个相册功能，用户可以发送自己的照片到相册中，其他人也能看到。 从体量上判断，相册功能体量会远小于动态功能；从功能上判断，动态功能的添加会影响产品逻辑。当出现此类情况，应该以体量小、实现功能、简单满足需求的前提选择第二条进行开发。当通过数据表现出用户强烈的分享欲望——当相册功能不满足用户的需求时，再考虑开发第一项。 即不过度规划、不过度设计、不过度开发 即使在做决策的时候感觉未来一定会做动态，也不要去强烈追求一步到位。即需求推动着产品，而不是产品走在需求之前，臆想真实需求的开发。 产品领先需求的后果当产品的开发规划是远超用户需求的时候，就会出现浪费开发资源的情况。当今时代很难 ...

写下一些对内容市场的观察和思考，首先抛出观点。对于PUGC视频创作者而言， 标题入口化 封面鲜明化 做视频不是做产品，你应该照顾到绝大多数可能不属于你的垂直圈层的用户，这样才有破圈的可能。那么提升播放量的主要手段每个内容制作者都很清楚，就是类似“标题党”。在人们接受到的学校教育中，标题通常起到的是「总结归纳」「内容核心」的作用。其实这样对每期播放量的稳定是不乐观的。很有可能出现忽高忽低的情况。那么标题该如何去取呢？ 对于选题非常有自信的内容，总结核心是关键。将选题最关键点作为标题或者封面上的文字。 对于选题一般，靠内容质量来说话的，重要的是靠用户点进来的这个操作，那么需要一些标题的优化和具备吸引力。具有吸引力的几个点 引起冲突 引起共鸣 引起悬念 默认观众是初中学历的中国三线城市高中生（降低标题门槛） 对于学校教育而来的我们大多数人，对于全文总结已经炉火纯青了。那么在这简单说一下对于选题自信的作者来说，有几个点可以注意一下 标题简洁干练 没有一个是多余的字，去掉任何一个都不行 封面标题无需是连贯的语言 封面标题抛出核心，文字标题深度解释 减少封面上的文字数量 很多创作者本着 ...

本文为转载文章，以下内容来源于 官方复盘！2021全新淘宝品牌Logo升级设计解读 思鱼耶 全新的2021已经到来，在这个适合展望未来的时候，淘宝也迎来了品牌形象的升级，一个万象更新的淘宝正在向我们走来。 “淘宝直播很有趣味”，“淘宝人生很新潮”，“淘宝更好逛了”越来越多的用户在感受淘宝的新变化。新淘宝，让用户在“淘好物”过程中更能感受到“逛”的乐趣，从产品、直播等多场景多维度带给用户全新体验。作为淘宝的镜子，我们的品牌也伴随着产品的升级，在设计层面表达了全新内核。 设计思路在新淘宝的大背景下，设计的挑战在于如何将抽象的心智具象表达。此次品牌设计将围绕“连接”“开放”“有趣”三大设计理念透过字体传达淘宝的品牌新内核。 在新的字体中将有粘连但又不够流畅的笔画结构，让它们“一气呵成”起来，通过连笔来表达“连接”，它寓意了新淘宝要更好地连接商业、用户和内容。 “通透”是新的字体比较直观的感觉，让字体本身结构上有“呼吸”的空 ...

作为UI设计师，最重要的就是接触iOS的设计规范。苹果拥有引领世界的设计能力，iOS影响着一代又一代的设计师，所以这篇文章主要是来翻译和解析一下iOS的设计规范。这个规范算是所有移动设计师必看的内容了。 本文为翻译内容，来自苹果官方人机界面准则推荐访问英文原文地址：人机界面准则翻译： 张洪Heo（转载注明出处）非原创内容须知 该文章为系列内容：查看系列全部文章 交互3DTouch在支持的设备上，人们可以通过对触摸屏施加不同程度的压力来访问附加功能。应用程序可以通过显示上下文菜单(或支持窥视和弹出)进行响应，以显示项目以及人们可以用来影响项目的操作。 在运行iOS 13和更高版本的设备上，无论设备是否支持3D Touch，用户都可以使用触摸按住手势打开上下文菜单。在3D Touch设备上，手势可以更快地显示上下文菜单。 主屏互动在运行iOS 13或更高版本的设备的主屏幕上，当人们触摸并按住应用程序图标时，应用程序可以显示上下文菜单(在3D Touch设备上，人们只需简单地按一下图标就可以看到菜单)。应用程序的上下文菜单可以让人们快速执行常见的应用程序特定任务，并查看有趣的信息。例如， ...

作为UI设计师，最重要的就是接触iOS的设计规范。苹果拥有引领世界的设计能力，iOS影响着一代又一代的设计师，所以这篇文章主要是来翻译和解析一下iOS的设计规范。这个规范算是所有移动设计师必看的内容了。 本文为翻译内容，来自苹果官方人机界面准则推荐访问英文原文地址：人机界面准则翻译： 张洪Heo（转载注明出处）非原创内容须知 该文章为系列内容：查看系列全部文章 应用架构启动发布体验对人们对你的应用程序的感觉有很大影响。不管人们使用的是什么设备，也不管他们上次打开你的应用有多长时间，启动体验都应该是快速和无缝的。 下面的指导原则可以帮助你设计一个令人愉快的启动体验。有关开发人员指南，请参见响应应用程序的启动。 提供启动屏幕。当你的应用程序启动时，系统就会显示你的启动屏幕，并迅速将其替换为你的应用程序的第一个屏幕。启动屏幕的功能是给人一种你的应用程序速度快、反应灵敏的印象，同时允许加载初始内容。为了确保从你的启动屏幕无缝过渡，设计一个与你的第一个应用程序屏幕相似的普通屏幕，并且不会引起人们的注意。有关指导，请参见启动屏幕。 以适当的方向启动。如果你的应用程序同时支持纵向和横向模式，它应 ...

补充一下，动态定价违反了《关于平台经济领域的反垄断指南（征求意见稿）》第七条 纵向垄断协议的利用数据和算法对价格进行直接或间接限定，遵纪守法，每个公司都有责任，遇到问题建议举报 最近美团又因为定价火了一把，产品如何做定价，如何才能将产品的利润最大化呢？通过资料来看，平台是通过用户来判断收费价格，针对优质用户提供更高的配送费和更低的优惠政策的方式进行差异化定价，让不同消费能力的用户用最大的消费金额来购买，保障用户使用和利润的最大化。但是这带来的问题就是会产生舆论压力和公关风险，进而影响股价。那么有没有更好的定价方式呢？ 我们假设一份食物店铺50元，外卖原价70元。针对优质用户收费55元，针对其他用户收费45元。平台抽佣25%（17.5元）。 全部以标准价出售当我们修改成针对所有用户定价相同时产生的问题就是与竞品竞争和比店铺价高的问题。首先这个市场已经是几个平台垄断的情况，所以当价格略微高于其他平台时优质用户一半不会去比价，但是对于消费金额比较敏感的人群和初入平台的用户来说，当你一家店铺使用标准价格的时候，他们可能会放弃整个平台。所以在竞争对手使用差异化定价时，你使用标准定价显然对于价 ...

本文为转载文章，以下内容来源于 这份高德地图设计总结，让我觉得捡到宝了！! UX小学 前段时间，高德发布了新IP 高小德 ，酷酷的小鹰。最近，高德又更新了LOGO及品牌视觉，设计更为简单、干净、清晰、专业。所以，接下来的干货重点讲讲，高德这套设计总结，是如何推导并落地应用的。 高德地图设计理念 品牌意识 定位与DNA 在升级改造品牌之前，第一往往是需要先明确品牌升级目标，即第一要务是解决现有品牌问题，接着是进一步清晰高德的品牌定位与DNA。 通过多维度调研，我们积累了很多有价值的信息，也逐步清晰了我们第二阶段的品牌设计方向，即继承品牌资产、优化阶段性问题、增加品牌活力。 高德BRAND-LOGO 品牌方案 标志部分 通过调研，我们发现用户对于高德品牌的认同度已经较高，所以我们继承了现有的品牌资产的同时，通过设计为品牌增添活力，增加年轻用户覆盖。 图形上，我们保留了纸飞机这一具有高辨识度的元素，且对形态做了全新调整， ...

本博客是基于Butterfly主题进行魔改制作的，在最初从pure主题切换到butterfly中，我带着非常多的兴奋感。Butterfly的令人震撼的首屏和打字效果深深吸引着我。 博客用的久了就会产生一些想要调整的想法，于是经过了漫长时间的边改边用，现在博客已经魔改到了v3.3.2版本，相信每个魔改人都会有着自己的想法和思路改造一个完全属于自己的博客，那么我来表达一下我的看法。 理念设计理念：清晰、轻快、易操作 清晰首先解决清晰问题，博客的主要目的就是为了文章的阅读，所以首先我就要针对阅读体验进行改进。 原主题的字号真的太小了。小字体带来了美观，但是作为一个「实用性博客」，以快速找到需要的内容为核心，放大字体是不可避免的。那么多大合适呢？针对桌面屏幕来说，我选择了以我16寸mbp的屏幕距离1.2m左右能流畅阅读的程度作为参考依据。 1.2m 流畅阅读 在很多位置使用了隐喻的方式来表达这个部分是做什么的，例如右侧的卡片相比主题的失去了卡片标题。其实在我不告诉你标题的情况下，绝大多数人会知道这个卡片意味着什么。即使不清楚也完全不影响整个博客的阅读。包括文章下面的版权信息等。通过隐喻的 ...

Markdown表格我们可以使用插入一个空白div并自定义宽度的方式进行自定义。有的时候我们不是想要首行和首列出现自动换行的情况，这个时候就需要使用自定义宽度和高度来解决了。一些人通过空白img标签或者外置css样式来实现，感觉很麻烦效果还不好，这里推荐使用插入空白div的方式。 无自定义宽度 类别 含义 行为 独奏环境 声音不是必不可少的，但它会使其他音频静音。例如，有配乐的游戏。 响应静音开关。 不与其他声音混合。 在后台不播放。 周围 声音不是必不可少的，它不会使其他音频静音。例如，一个让人们在玩游戏时播放其他应用程序中的音乐来代替游戏原声的游戏。 响应静音开关。 与其他声音混合。 在后台不播放。 回放 声音是必不可少的，并且可能与其他音频混合。例如，教外语的有声读物或教育应用，人们在离开应用后可能想听。 不响应静音开关。 可能会或可能不会与其他声音混合。 可以在后台播放。 记录 声音被记录下来。例如，提供音频录制模式的笔记应用程序。如果此类应用允许人们播放已记录的笔记，则可能会将其类别切换为播放。 不响应静音开关。 不与其他声音混合。 可以在后台录制。 ...

本文为转载文章，以下内容来源于 小桔有车租买车业务体验设计升级 CDX创意设计中心 一.背景小桔租车1.0上线一段时间了，过程中很多功能点时间紧、迭代快，点状的设计迭代满足了租车前期的业务发展，接下来随着业务模式变化，需要整体性的思考，什么样的体验更符合现有业务模式？特此，设计和产品同学一起，以现有业务为基础，从全新的视野出发，以产品设计比赛的形式，从业务模式、产品框架到信息结构、设计语言全部进行了重构与升级，并推进产研开发落地，拿到结果。 二.调研分析及设计目标1.用户分析从有车的流量来看，大多数都是来自于滴滴出行端，从出行端用户的特性可细分为需求明确型、纠结对比型、闲逛型、商家（车企、销售）4种类型。每种类型的用户需求是不同的，因此我们需要从不同维度设计以解决不同问题。 2.线上问题业务探索调整前我们的业务以租车为主，业务发生调整后，模式由纯租到租买灵活，原有主流程和页面已经不能很好的支撑当前业务了，同时之前也存在一些体 ...

少废话，先用上极致灰1234极致灰sRGB 147, 149, 151极致灰Hex #939597极致灰Lab 62, 0, -1极致灰CMYK 49, 39, 36, 0 亮丽黄1234亮丽黄sRGB 245, 223, 77亮丽黄Hex #F5DF4D亮丽黄Lab 89, -3, 70亮丽黄CMYK 11, 13, 75, 0 潘通发布 2021 年度代表色PANTONE 17-5104 极致灰 + PANTONE 13-0647 亮丽黄 结合一对持久耐看又鼓舞人心的色彩， 传达力量与希望的讯息。 PANTONE 17-5104 Ultimate Gray（极致灰）与 PANTONE 13-0647 Illuminating（亮丽黄）这两个独立的色彩突显不同的元素如何在一起支持彼此，最能表达潘通 2021 年度代表色的精神。实用又稳固，同时也是温暖又乐观，PANTONE 17-5104 极致灰 + PANTONE 13-0647 亮丽黄是力量与正向的结合。这个色彩故事将深思熟虑的深层感受与阳光友善的希望浓缩在一起。 PANTONE 17-5104 极致灰 + PAN ...

团队名称：光音设计小分队交互设计师：Echo、张晶视觉设计师：齐杰、凯文、MiroCat、三牛、张晔 规范内容本套通用型规范旨在帮助广大设计师，快速入手制作属于自己团队App的设计规范，降低设计人力成本。 文件预览 下载地址 方法1（推荐）关注Echo的设计笔记微信公众号，在公众号后台回复设计规范 方法2（推荐）链接：百度网盘 提取码：766M 方法3蓝奏云

今天读到一篇文章讲的是视频横屏和竖屏的设计差异，发现每个人的观点差异还比较明显，这篇报告我也写一些对于视频播放器的设计看法。仅个人观点。 如今视频行业非常火热，我们可以发现曾经的优酷、爱奇艺、腾讯视频、B站等都是采用的横向屏幕；我们看到的电影、电视都是横向屏幕。抖音、快手等都是纵向屏幕。微信小视频是横向屏幕。那么他们是怎么来的呢？ 以人类为核心一些人们会将横竖屏作为硬件的变化，认为设备是怎样的，软件就去适应它，所以才会出现了竖屏的设计。那么最初的横屏是怎么来的呢？ 其实原因非常简单而且显而易见：人类的眼睛是横向的。 不仅如此，因为人类的每只眼睛是横向的，眼球的顶部和底部容易被上下眼皮遮住；两只眼睛处于横向水平线，造成了人眼本身的视觉就是一个宽屏的画幅。并且人眼的长宽比例会非常宽：电影的21:9的宽幅比例就是适应人们视觉的生理器官。 所以我们所谓的「沉浸感」「沉溺其中」其实就是内容占我们视觉的比例。当视觉内容占据整体视觉信息的比值越大，沉浸感越强。当我们的注意力只在屏幕上时，大脑并不只是分析手机上的内容，他还在同时分析其他环境内容、周围的环境音等等。大脑在做的这些额外工作会削弱沉浸感。 ...

我们在设计网页、设计App的时候会担心文字是否能在有色背景上清晰显示，其实WCAG向我们提供了非常好的检查方案。检查颜色是否有足够的对比度应加入到设计检查的流程中来。 为什么要做颜色对比度检查？对比度为3：1是[[ISO-9241-3]]和[[ANSI-HFES-100-1988]]为标准文本和视觉推荐的最低水平。使用4.5：1的比例来说明由于中度视力低下、先天或后天颜色缺陷或通常伴随年龄增长的对比度敏感度丧失而造成的对比度损失。 其基本原理是基于在ANSI标准中采用3：1对比度作为正常观察者可接受的最低对比度，以及b)人群中，20/40的视力与大约1.5的对比度敏感度损失。因此，20/40的用户需要3*1.5=4.5比1的对比度。根据类似的经验发现和相同的逻辑，视力为20/80的用户需要大约7：1的对比度。 对比度为4.5：1被选为AA级，因为它补偿了视力损失大约相当于20/40视力的用户通常经历的对比度敏感度的损失。(20/40计算约为4.5：1。)20/40通常被报道为大约80岁的老年人的典型视力。 7：1的对 ...

作为UI设计师，最重要的就是接触iOS的设计规范。苹果拥有引领世界的设计能力，iOS影响着一代又一代的设计师，所以这篇文章主要是来翻译和解析一下iOS的设计规范。这个规范算是所有移动设计师必看的内容了。 本文为翻译内容，来自苹果官方人机界面准则推荐访问英文原文地址：人机界面准则翻译： 张洪Heo（转载注明出处）非原创内容须知 该文章为系列内容：UI设计人机界面准则：交互UI设计人机界面准则：应用架构 iOSIOS设计主题。作为一名应用程序设计师，你有机会交付一款登上App Store排行榜榜首的非凡产品。要做到这一点，你需要满足对质量和功能的很高期望。 IOS有别于其他平台的三个主要主题： 清晰。在整个系统中，文字在任何大小下都是清晰的，图标是精确和清晰的，装饰品是微妙和合适的，对功能的突出关注激发了设计的灵感。负空间、颜色、字体、图形和界面元素巧妙地突出重要内容并传达交互性。 直观。流畅的运动和清晰、美观的界面帮助人们理解内容并与之互动，而不会与之互相争抢眼球。内容通常会填满整个屏幕，而半透明和模糊通常会暗示更多内容。最小限度地使用边框、渐变和投影使界面保持明亮通风，同时确 ...

我的好兄弟今天刚入职，结果发现啥软件都装不上。 这篇文章作为安装软件的错误排除流程进行探讨。大概率能解决在Windows系统下的软件无法安装问题。 管理员模式运行首先尝试右键单击安装包，选择以管理员身份运行，查看是否解决问题 兼容模式运行如果是windows10操作系统，可能有些软件没有办法在Windows10上正常运行，右键单击安装包，选择属性，然后点击兼容性，将兼容性设置为Windows7 安装运行库软件在编写的时候依赖运行库，有的时候电脑没有对应版本的运行库时就无法打开，解决的办法就是安装对应的运行库。有的时候我们不知道需要安装哪些运行库，所以就找一个运行库合集来一劳永逸。 这里提供两个下载链接，也可以在百度搜索 微软常用运行库合集 3DM游戏运行库合集离线安装包（1G）

关于webp格式的好处，我在很久之前转载过一篇文章：WebP 相对于 PNG、JPG 有什么优势？那个时候我的博客刚改成使用webp格式，不过后来出了一些问题导致我回滚了这个操作。 时隔近一年时间，我的博客再次重新支持webp格式了。这篇文章主要是介绍我的博客是如何判断浏览器是否支持webp格式并将所有的图片以webp格式展现。 我的配置因为我使用的是七牛云自带的格式转换的图片样式，所以我使用了替换全站img标签的src中的url参数。如果你使用的不是七牛云，可以根据我的代码进行二次修改。 主要思路使用的是js来判断浏览器的头部信息是否支持，如果支持则将原有我全站里面img标签里src中的!blogimg改为@blogwebp。 代码如下可以放在外置的js文件，也可以直接写进网页中 1234567891011121314151617181920212223242526window.onload=function(){ var checkPic = function(isWebP){ $("img").each(function ...

再博客优化的过程中我们经常会嵌入很多第三方的js，第三方js提供更丰富的功能，但是却拖垮了网页的加载速度。这个时候我们可以使用async/defer来推迟js的加载。 在HTML5以前，script标签没有这两个属性，而浏览器单纯的按照顺序解析（解析）并执行，HTML5之后，我们可以在脚本标签定义他的行为，包括网路请求是否同步，执行时机等等。 选择async还是defer 广泛地说，可以通过你加载的js用途来判断你的选择 顺序 DOMContentLoaded async 加载优先顺序。脚本在文档中的顺序不重要 —— 先加载完成的先执行 不相关。可能在文档加载完成前加载并执行完毕。如果脚本很小或者来自于缓存，同时文档足够长，就会发生这种情况。 defer 文档顺序（它们在文档中的顺序） 在文档加载和解析完成之后（如果需要，则会等待），即在 DOMContentLoaded 之前执行。 在实际开发中，defer 用于需要整个 DOM 的脚本，和/或脚本的相对执行顺序很重要的时候。 async 用于独立脚本，例如计数器或广告，这些脚本的相对执行顺序 ...

Heomagic 07 | 在mac上的视频转格式方案分享 近期非常常用视频转格式，我们使用一些油猴插件、视频下载插件经常能下载到flv、mkv、rmvb等格式，而这些格式有的时候不兼容你的播放器（可替换自带播放器解决），有时为了做一些其他的事情。有的时候可以使用premiere、finalcut等工具来进行转格式，但是这样不仅速度慢，而且不方便批量转格式。所以一个小巧的专门用来转格式的工具就显得非常重要了。 我们最常用到的就是MP4格式，而如何将各种各样的格式转换为MP4呢？ 这个时候就用到了一些mac上的视频转格式工具了。 几乎大部分视频转格式的软件我都试用过了。目前我用过的比较好的视频转格式软件在这里分享出来。 Permute官方网站： 引用站外地址，不保证站点的可用性和安全性 permute charliemonroe 这个是值得你付费购买的视频转格式软件（如果你是视频工作者并且这部分需求比较大的时候） 仅仅一个 ...

唧唧在最新版本中会弹出0x000002错误。这里放个旧版本下载地址。 官方介绍这是一个用于下载bilibili视频的PC应用程序,它能够下载99%bilibili视频(不支持番剧),并且它将会终身免费提供使用.现在它已经支持弹幕, 4K清晰度, 互动视频, 音频以及批量下载 下载地址前往官网下载最新版 网盘下载旧版

一个产品在视觉的UI程度做了很多努力，不仅在外观的流行度、切图的清晰度以及整个交互方式、交互风格上都走在前列。那么怎样才能让如此多的优秀产品中脱颖而出呢？其实在手机里，我们的产品已经占据了屏幕、扬声器、麦克风等，但是还有很多我们没有利用到，而绝大多数手机都有的一些传感器，例如：光线传感器、震动马达等。 这一期主要想说一下关于震动马达的事情。 震动不只是在手机上才会出现，我们生活的真实世界中经常能够遇见震动。当一个子扣卡在了母扣上，或是在档位调节上。我们通常都会通过声音和产生加速度变化造成的微弱震动来判断产品状态。震动无处不在，符合用户直觉、适时的震动是有必要的。 触发试想一下将震动功能融入到你的产品，你会将它放在什么地方呢？在这里我们可以头脑发散一下去思考。在这里提供几个方向。 首先就是在进行功能切换的时候：例如产品底部标签栏上的标签页切换，就可以在点击标签栏按钮的时候给予震动反馈。但是要注意的是，一般在可交互页面切换例如可以左右滑动切换的页面不应该加入震动功能。这取决于震动功能给人们带来的心智。 一般来说震动作为提醒功能最为常见。当一条新的消息送达时，由于信息是不可预见、非主动获取， ...

这篇文章中介绍一下我在mac上的压缩软件解决方案。我使用了两个第三方软件和官方自带的如那件进行协同配合，他们各有优劣。通过在不同场景下的需求，使用不同软件来解决问题。 归档实用工具 mac官方自带的压缩工具叫做「归档实用工具」。这个软件可以轻而易举的解压和压缩.zip格式的压缩包。虽然和访达一起搭配是最方便的，但是由于苹果自带软件的通病：兼容的格式有限。所以在平常压缩的时候会使用归档实用工具，在解压的时候可能就用不到它了。 解压软件解决方案在解压缩软件的选择上，我选择了「The Unarchiver」 L立即前往AppStore 在mac上安装软件肯定是优先选择App Store，因为苹果的审核让软件变得更加可靠（玄学）。并且能够很方便的更新。 这个软件的优势就是补齐了mac自带的归档实用工具的短板：兼容的格式比较少。这个软件没有压缩功能，只是作为解压软件使用。但是我们平常使用的压缩包就是zip格式就可以了。所以一个解压缩软件才是真正有需求的软件。 产品无广告，使用的时候在你将它设置为默认软件之后，你就可以再也不打开这个软件了。使用过程完全无感，非常方便。 加密压缩解决方案在加密的 ...

最近有人询问蓝湖有的元素选择不了，造成这个问题的可能性有很多。有的是蓝湖的自身造成的问题，但是大多数问题都是可以通过更改设计稿或者调整蓝湖来解决的。 检查不能点击元素上方是否有切图 当一个图层上方存在一个切片时，蓝湖点击会优先选中切片，而无法选中切片里面的内容。这个时候我们可以删除该切片或者通过给每个元素建立一个子切片。子切片可以通过两次单击被选中。 检查不能点击元素的组件是否存在多层嵌套并且有组件切图 当组件有多层嵌套的情况，原理和第一个类似，例如在父组件添加了一个切片，那么子组件通常就无法选中了。解决方式跟上一个一样。要么取消父组件的组件切片，要么建立子组件的切片。 查看图层结构如果实在无法选中，在不打算更改设计稿的情况下可以通过在需要的元素位置右键单击->选中图层的方式来选中。这种方式可以查看图层命名，方便理解元素的设计方式。

通常我们设计产品的时候都会兼顾到用户使用这个产品的效率。不仅要关注刚刚上手这个产品的用户的易用性，例如足够的提示、足够的可见性等；还要兼顾老用户的高效。这一次我们来模拟一个线下服务类产品的效率问题，这种问题可能考虑的效率就是其他的层面了。 这个报告是对线下店使用在线应用服务的一种理论支撑，仅个人观点。 线下类产品开了一个店铺、开了一个连锁店。当你有一个店铺的时候你会发现，店铺的地理位置变得非常重要，一个好的店铺位置能够带来更多的客流量。一个在用户回家必经之路的店铺更容易收获用户的票子。那么这种现象的原因是什么？ 原因其实也很简单，在这个人们生活紧张度、生活速度越来越快的社会环境下，人们都在追求主线任务的目标，而对于路上的风景却不愿去理睬。如果用户在完成主线任务的路上能够很快的完成额外的任务，人们也会顺带完成。人们对自己完成一件事情所需要的时间是有一定的心理预估的。特别是在做一个熟悉的事情、重复的事情下，即使这个事情可能有稍许变化，一般来说心理的预估时间是比较准确的。 如果用户路过一个奶茶店，奶茶店空无一人，用户预估可能在2分钟内就可以完成从购买到喝到奶茶的全部步骤，那么就会权衡两分钟的 ...

在设计功能的时候防误触机制无处不在，例如删除项目的确认弹窗和警示窗口、删除按钮做的尺寸会小一些、颜色足够特别、删除入口层级加深。但是有的时候我们会发现，我们经常做了很多无意义的防误触机制，这些多余的确认弹窗在无限制的占用着我们的时间和精力。我们真的需要这么多的确认弹窗吗？ 当然微博取消关注弹窗的产品原因有诸多方面，比如通过增加取消关注的步骤增加用户使用此功能的成本，减少用户使用这个功能的概率。本文主要是通过效率为侧重点进行分析，适用范围仅包含大多数需要效率和增强体验的场景。 误触率那么对于确认弹窗的关键因素在于：用户误触率有多高 在网页进行重复操作的场景（例如后台管理、后台运营等）这类场景误触率会出奇的高。因为它们的使用者自认为已经足够了解这个界面（事实也确实如此），所以不需要耗费很多精力去对自己的每一个操作进行思考。他们会存在肌肉记忆和预期。对于每一个步骤，用户能够简单的预知接下来的事情，如果出现了预期之外的情况，这些人可能会花时间去研究和判断。 那么用户的误触率高，我们就要增加多个窗口来进行防误触吗？ 我们可以观察一个场景。iPhone手机用户都知道，他们的手机抬起来或者轻点 ...

iOS14小组件功能官方设计指南 iOS14的小组件相比安卓更加简洁，我们可以看到组件设计的细节，还有多个第三方软件风格一致。这都要归功于官方的设计指南。 官方文档 译：陈子木 桌面小组件概述小组件能够提炼 APP 中的关键信息，呈现在 iPhone、iPad 和 Mac 当中最为醒目的位置。小组件以一种令人愉悦的视觉和交互形态，帮助用户个性化地呈现屏幕内容，优化主屏幕的体验。 小组件在 iOS 14 和 macOS 11 及更高的版本上才可用，而相关的开发人员文档可以点此阅读 仔细审视小组件 小组件通常有小、中、大三种不同的大小尺寸，在iPhone、iPad 和 Mac 系统当中，用户可以在小组件库当中找到小组件，并且选取合适的尺寸。选择了小组件之后，用户可以进入界面编辑模式，在这个模式下，用户可以移动小组件到想要的位置，并且可以根据需求进行进一步的设置和调整。比如可以在同一屏上放置多个小尺寸的天气小组件，并且通过设置，让每个小组件显示不同位置的天气。用户可以将组件放置到主屏幕上，也可以放到 iPhone 的 「今日」页面上（也就是所谓的最左侧的负一屏），iPad 的 「今日」 ...