IT技术博客大学习 共学习 共进步
全部 移动开发 后端 数据库 AI 算法 安全 DevOps 前端 设计 开发者

设计

共 957 篇文章

IT 2026-06-03 09:03:24 / 累计浏览 83

Day for Night

在CSS中常规使用`invert(1)`滤镜会导致所有颜色反转,包括原本的色彩信息。若想仅反转黑白(明暗关系)而保持色彩不变,可采用组合滤镜方案:先执行反转操作,再通过色相旋转进行补偿。具体实现方式为`hue-rotate(180deg) invert(1)`。这一技巧的原理在于:在HSL颜色模型中,单独反转亮度(L)分量可保留色相(H)与饱和度(S),而先整体反转再旋转180度色相,数学上等效于仅对L分量取反。该方法适用于需要高对比度暗色主题或图像处理的场景,能够在不改变主色调的前提下实现视觉反色效果。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 20

Your Prototype Is Not Being Honest With Your Users (And Here’s How To Fix It)

这篇文章聚焦于提升交互原型在可用性测试中的真实性,核心论点是用户对原型的信任度直接影响测试数据质量,尤其在金融等高敏感领域。文章指出,当用户察觉原型缺乏真实认证机制时,其行为会偏离真实场景,导致团队收集到无效的测试洞察。针对这一问题,解决方案是重点打造登录环节的交互保真度。 教程以使用ProtoPie构建一个功能完备的银行登录界面为例,逐步演示了关键技术实现:将设计工具中的静态图层转换为可实际输入的文本字段;通过变量实时捕获用户输入;设置条件逻辑以验证特定凭证(如用户名和密码),仅允许正确登录;创建动态的错误状态反馈。此外,教程详细说明了如何集成Lottie动画模拟Face ID生物识别流程,并通过精细的时间轴编排使其体验原生化。 这些步骤共同将一个演示性界面转变为一个行为真实的应用模型。当登录流程可信时,测试就能有效评估用户对错误信息的理解、重试行为以及对替代认证方式的偏好等关键交互细节,从而为产品决策提供高质量的用户信号。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 13

Fixed-Height Cards: More Fragile Than They Look

固定高度卡片看似能保证视觉对齐,实则依赖内容始终适配预设尺寸的脆弱假设。当遇到多语言翻译、字体缩放或内容变化时,固定容器与动态内容会产生冲突,导致布局破裂或内容溢出。作者通过博客组件实例指出,单纯依赖 `overflow: hidden` 和行截断(如 `-webkit-line-clamp`)只是掩盖了结构性张力。 解决方案的关键在于移除三重约束:取消固定高度、避免绝对定位用于布局、停止强制截断内容。通过使用 CSS Grid 的自动行高对齐(`align-items: stretch`)替代固定高度,配合 Flexbox 构建卡片内部流式布局(如 `flex: 1` 让内容区自适应填充),可使组件自然响应内容变化。同时,采用 `clamp()` 函数实现流式字体大小,增强跨视口适配能力。 文章强调,健壮的布局应基于内容驱动而非预设限制。通过模拟压力测试(如极端文本、字体放大、图片缺失)可提前暴露脆弱性。最终,从“预测内容”转向“适应内容”的结构性调整,使组件能在多变场景下保持稳定,无需依赖防御性隐藏规则。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 6

Designing For Agentic AI: Practical UX Patterns For Control, Consent, And Accountability

本文聚焦代理式人工智能用户体验设计,从概念落地到具体实施。核心观点是:代理式AI从“建议”转向“自主行动”,需通过明确的设计模式赋予用户控制感、同意权与问责能力,建立可信赖的人机协作关系。文章提出一套覆盖交互全生命周期的六大实用设计模式:行动前的意图预览与自主性调节拨盘,确保用户知情同意并定制代理权限边界;行动中的可解释理由与置信度信号,实时透明化代理的决策逻辑与不确定性;行动后的操作审计与升级路径,提供纠错与高风险干预机制。这些模式通过具体案例(如航班变更、基础设施运维)阐释如何将“自主性”转化为用户授予的特权而非系统夺取的权力,并给出了基于信任密度、接受率等指标的评估方法。设计目标是在提升代理能力的同时,通过可控的摩擦设计、渐进式授权和上下文解释,维持用户对系统的准确认知与掌控感。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 6

Building Digital Trust: An Empathy-Centred UX Framework For Mental Health Apps

设计心理健康应用的核心挑战在于,用户的情绪状态并非次要场景,而是产品运行的根本环境。一个色彩刺眼、提示“破戒”或设置付费墙的界面,不仅体验糟糕,更会对脆弱用户造成实质伤害并侵蚀信任。在此背景下,同理心导向的UX设计从可选项转变为根本要求,其核心目标是超越功能,在用户旅程的每一步持续满足其深层情感与心理需求,从而建立数字信任。 作者提出了一个基于三大支柱的可操作框架。第一支柱是将引导流程设计为一次支持性对话,而非功能清单。关键在于使用验证性语言(如“你有这样的感觉是可以的”)、通过渐进式信息收集实现个性化,并极度强调简洁与选项可控,让用户在首次互动中便获得被理解的感受与即时缓解。第二支柱是构建适应“受压大脑”的情感界面。认知能力下降的用户需要低刺激、可预测的环境。设计需遵循无障碍基准,采用舒缓的视觉语言(如非霓虹的暖色调),避免信息过载与突然的感官刺激。这可以通过具象化的“安全空间”隐喻、将复杂情绪视觉化的非文字界面(如情感气泡),以及可选的触觉微交互(如模拟捏泡泡纸的动效)来实现,目的是在数字空间中建立根本的安全感。必要时,语音输入可作为高压力时刻下比文字更低摩擦的交互选择。第三支柱涉及留存策略,旨在通过持续满足情感需求而非施加压力来深化信任,这一点在具体案例中通过“渐进式承诺”和赋予用户对数字空间的心理所有权(如个性化相框)得以体现。整个框架强调,建立信任的本质是将产品环境塑造为一种持续、可靠且尊重用户心理脆弱性的支持性体验。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 4

Designing A Streak System: The UX And Psychology Of Streaks

设计一个有效的连续记录(Streak)系统,远不止是简单地记录用户连续活动的天数。其强大的用户粘性背后,深刻的心理学原理与UX设计原则是关键。本文深入剖析了驱动连续记录的核心心理机制:损失厌恶是首要动力,用户对失去已投入大量努力的记录会产生强烈的规避心态;福格行为模型(B=MAP)解释了行为如何发生,强调需在动机、能力和提示同时具备时,低门槛的行动(如完成一分钟冥想)才能促成习惯;蔡格尼克效应则指出未完成的任务会持续占据心智,使用户自发地维持记录状态。然而,这种机制存在“阴暗面”——设计不当可能将好习惯转化为强迫行为,使用户因恐惧而非内在动力行动。因此,一个道德的连续记录系统必须平衡内外动机,其UX设计的核心在于:让每日行动变得极其轻松,以降低门槛;并提供清晰、积极的视觉反馈,用进展而非惩罚来鼓励用户,从而真正助力其长期目标的实现。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 11

A Designer’s Guide To Eco-Friendly Interfaces

本文探讨了可持续用户体验(Sustainable UX)设计的核心理念与实践方法。作者指出,云端数字产品依赖于高能耗的物理基础设施,因此设计师需从追求视觉震撼转向优先考虑能效。文章提出了四项关键策略:首先,采用深色模式作为默认设计,因为其在OLED屏幕上能显著降低像素点能耗;其次,优化图片与视频,采用AVIF等现代格式并考虑用SVG或CSS代码替代大体积素材,以减少数据传输与渲染负担;再者,限制不必要的复杂动画,优先使用CSS过渡实现有实际意义的动效,降低GPU负载;最后,为每个项目设定明确的数据预算,从根本上控制页面体积。这些措施不仅能减少碳足迹,还能直接提升页面加载速度与核心性能指标,改善用户体验并增强产品可访问性,最终实现环境、用户与商业价值的共赢。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 5

Persuasive Design: Ten Years Later

十年前,说服性设计是提升用户转化与留存的新方法,其核心是利用心理学引导用户行为。十年后,该领域已演进为更成熟、更具伦理考量的行为设计。当前的核心挑战在于,仅靠改善可用性无法弥合用户行为缺口。成功的实践需超越孤立的优化,转变为系统性的行为策略,旨在诊断行为障碍并设计双赢方案。 早期将游戏化(如积分、徽章)等同于行为设计的做法已被证明存在局限。脱离用户真实目标与内在动机(如自主、能力、关联)的机制终将失效。有效的游戏化元素应服务于用户的核心体验,帮助其感受进步与意义,而非仅是界面的装饰。 行为建模的范式也发生了根本转变。从早期简单的“触发器”模型,发展到更强调环境、能力与动机交互作用的COM-B模型。设计需采用系统思维,认识到行为受多重反馈环路影响,关注长期效应而非短期指标提升。这意味着不再优化单一路径,而是构建一个支持多元用户目标、尊重情境复杂性的包容性环境。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 5

Anime vs. Marvel/DC: Designing Digital Products With Emotion In Flow

数字产品的情感体验设计可借鉴动漫与电影叙事的差异。文章通过对比动漫《Dan da Dan》的“情感流动”与电影《超人》中的“情感冲突”,阐释了关键设计原则:情感流动要求情绪转变被充分铺垫、平滑过渡,使用户沉浸感得以维持;情感冲突则因突兀转折(如在严肃场景插入幽默)打断用户情绪,增加认知负荷。 文章结合唐纳德·诺曼的情感设计三层理论——感官层、行为层、反思层,提出设计需对齐产品的情感节奏。成功的设计应像优秀的动漫叙事:在用户流程中明确铺设不确定性、清晰度、期待感、成就感和收尾情绪等节点,并通过微交互(如过渡动画、状态提示)自然衔接。例如,支付流程应优先确保操作清晰与完成确认,而非提前插入庆祝效果。 设计者需主动规划情感峰值与终点,根据任务风险调整语调(高风险操作保持冷静直接),并通过情感节拍表映射每一步的情绪目标。测试时应关注用户情绪变化是否连贯,避免在关键操作中出现干扰性幽默或弹窗。最终目标是引导用户记忆积极的情感峰值与清晰的结束,而非流程中的情绪断裂。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 6

Modal vs. Separate Page: UX Decision Tree

在用户界面设计中,选择使用模态窗口还是独立页面是一个关键决策,它直接影响用户的工作流程、上下文感知以及任务完成效率。模态窗口的优势在于能保持当前屏幕的完整上下文,包括已输入的内容、滚动位置和筛选状态,适用于简短、独立的任务,例如快速确认、防止数据丢失或执行高优先级的轻量级交互。然而,模态窗口本质上具有干扰性,会阻断背景操作,因此不适用于错误提示、功能通知或复杂的多步骤流程。 相比之下,独立页面更适合需要用户全神贯注或涉及多步骤的复杂任务,因为它允许用户自由地对比数据、复制粘贴或参考其他信息,避免了模态窗口造成的上下文割裂。当任务需要频繁引用背景数据时,覆盖层或抽屉式面板也是比模态更友好的选择。 文章进一步提出了一个决策流程:首先评估是否需保持底层页面上下文,其次判断任务复杂度,然后考虑用户是否需要参照背景内容,最后在选择覆盖层时优先考虑非模态对话。总体原则是,除非打断用户具有明确价值(如防止严重错误),否则应尽量避免阻断整个界面,转而使用更柔和的交互方式来提升任务效率。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 7

Testing Font Scaling For Accessibility With Figma Variables

数字无障碍的实现需要融入团队日常工作,而非在功能优先级上做出妥协。其中,字体缩放是影响可读性与合规性的关键因素。数据显示约四分之一的移动设备用户会调大系统默认字体。根据WCAG 2.2的AA级合规标准,文本必须能在不借助辅助技术的情况下放大至原始尺寸的200%,且不损失内容或功能。 设计不应试图阻止或抵消用户的辅助功能操作。相反,应主动在设计阶段进行验证,确保界面在不同缩放比例下的适应性。现代设计工具如Figma为此提供了高效解决方案。团队可以借助变量功能,为文本样式创建一系列尺寸变量(如100%、120%至200%),通过切换变量组快速模拟用户调整字体大小后的界面状态,观察布局变化并评估是否需要适配。 要实现这一测试流程,设计文件需具备高度系统化。首先需完成界面的初步设计,并确保所有元素应用了自动布局。核心步骤是建立与文本样式关联的尺寸变量体系,从而能一键切换不同缩放比例,直观地进行无障碍审查。这种方法将无障碍测试无缝嵌入设计验证环节,使团队能在日常工作中高效践行包容性设计原则。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 5

A Practical Guide To Design Principles

设计原则是产品设计中的核心工具,用于统一团队目标、记录组织价值观,并指导决策,而非僵化的规则。本文提供了建立和应用设计原则的实用指南,强调它们能帮助团队在快速变化的技术环境中保持一致性和目的性。文章以 Dieter Rams 的 10 设计原则为例,说明好的原则应清晰、实际,反映产品追求的品质,同时列举了 Anthropic、IBM 等现代企业的设计原则实例。核心部分详细介绍了通过 8 步工作坊建立设计原则的方法:包括前期用户研究、团队参与创意提取、属性关联到真实痛点、形成价值陈述,并最终转化为持久原则。文章指出,原则需跨职能团队共同参与

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 5

Session Timeouts: The Overlooked Accessibility Barrier In Authentication Design

会话超时机制在认证设计中常被忽视,但它已成为影响残障用户数字访问的关键无障碍障碍。全球约13亿存在显著残疾的人群,包括运动、认知及视觉障碍者,在需较长时间完成在线操作时,常因超时被强制登出,导致工作丢失和挫败感。 运动障碍者输入速度较慢;认知差异(如ADHD、阅读障碍)导致信息处理需要更多时间;视觉障碍用户依赖屏幕阅读器逐元素导航,同样耗时。当前常见的设计缺陷包括:缺乏提前警告或警告不足、会话不可延长、以及超时后未保存表单数据,这些都直接导致数据丢失和重复劳动。 为平衡安全与无障碍性,推荐以下改进模式:实施清晰的事先时间提示与倒计时警告,并提供一键延长会话的选项;采用活动检测式超时并辅以绝对超时上限;利用客户端存储(如localStorage)实现自动保存,确保用户重认证后可恢复进度。这些措施符合WCAG 2.2(如SC 2.2.1)标准,能有效保障包括残障人士在内的广大用户群体的顺畅体验,避免因设计疏漏造成不必要的使用壁垒。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 10

The UX Designer’s Nightmare: When “Production-Ready” Becomes A Design Deliverable

文章指出,当前UX设计领域出现了一种将设计师推向“设计工程师”模型的趋势,要求他们不仅负责用户体验,还需通过AI工具直接生成并交付“生产就绪”的代码。这种角色扩展被视为一种职业困境,因为它迫使设计师试图同时精通用户体验设计与软件开发两个深奥领域,结果很可能导致两者均只达到平庸水平。核心问题在于,AI生成的代码虽然能快速实现功能,但往往伴随着严重的质量隐患。设计师缺乏深度的编程知识来审计这些代码,从而可能引入安全漏洞、可访问性缺陷(如语义缺失的组件)以及性能问题(如代码冗余),最终产生高昂的“技术债务”和“返工税”。文章批判了市场重输出速度而轻体验质量的价值观偏移,并建议应摒弃“全能设计师”的幻想,转向设计师与工程师的协作模式:设计师聚焦于用户意图与体验流程的提示构建,工程师负责架构与性能优化,同时依托内置可访问性标准的设计系统作为护栏,从而让AI真正用于增强设计思维,而非替代专业工程能力。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 8

写给设计师:如何设计一份 AI 友好的设计规范

本文从AI无法有效解析传统设计规范(如PDF)的痛点出发,指出其根本原因是格式的视觉化、规则的非结构化和知识的碎片化。文章提出的核心解决方案是将设计规范“翻译”为AI可精确解析的结构化数据,实现从“人读文档”到“人机双读接口”的转变。具体实践采用Markdown、JSON与YAML的组合格式,其中JSON用于定义颜色、字号等精确的Design Token数据,YAML用于描述组件的变体、状态和约束规则,Markdown则用于阐述设计原则与使用场景。改造流程包括五步:将数值决策Token化、用结构化Schema描述组件、将设计禁忌转化为带ID和严重等级的可执行规则、提供指引AI读取顺序的入口文件,以及将抽象原则操作化。文章最终给出了一个清晰的文件结构范例,并建议渐进式实施、保持多版本同源、将规范代码化以便集成与审查,强调AI时代的设计规范更应关注意图传达与规则可执行性,使其成为可被工具“调用”的活文档。

本机暂存
IT 2026-06-03 09:03:24 / 累计浏览 6

银河系观赏指南

本文是一篇面向业余爱好者的银河观赏与拍摄实用教程。核心在于指导读者如何在正确的时间与地点,借助必要装备捕捉银河景象。观赏时机方面,需把握6至10月(尤其是7-8月)的银河核心高亮期,并严格避开月光干扰,选择农历月初或月末、且日落1-2小时后的晴朗无云夜晚。地点选择至关重要,必须远离光污染,推荐前往博特尔暗空等级4级及以下的区域,高海拔环境能进一步提升清晰度。拍摄实操部分强调使用广角大光圈镜头与稳固三脚架,掌握“500定律”进行基础曝光,并介绍了使用星空跟踪器延长曝光以获取更细节的方法。文中同时提醒需提前通过应用查询天文信息,注意夜间野外安全并结伴同行。

本机暂存
IT 2026-06-03 09:03:23 / 累计浏览 7

卡牌构筑类桌游核心规则之二

卡牌构筑类桌游的核心规则设计侧重于平衡玩家行动与决策深度。传统TCG通过打出卡片的费用限制强力牌,但DBG采用购买费用作为限制,确保牌组逐步增强。Dominion限制每回合打出行动卡的数量,通过特定卡牌扩展行动次数,防止早期运气优势。Ascension则不限制打牌数量,但通过VP获取的双重途径(符文购买与杀怪)和公共市场的随机性来制约强力组合的发挥,玩家需在构筑时权衡符文与力量能力。 Nightfall引入六色轮连锁系统,要求按颜色顺序出牌,并允许对手在玩家回合加入连锁,增加互动性。其伤害卡机制将受到攻击的惩罚转化为手牌优势,但限制额外抽牌以防失衡。Unchained作为重置版,改进市场为3x3矩阵,简化费用为两级,并引入天赋点资源;起始手牌改为随机抽取,加快游戏节奏。游戏设计中,通过限制手牌打出、弃牌和构筑行为,为玩家提供有意义的选择空间。Nightfall和Unchained的变化体现了

本机暂存
IT 2021-05-27 07:10:31 / 累计浏览 1,582

从用户嘴里找答案

这篇讲的是产品客服如何与用户有效沟通,以及如何从反馈中挖掘真实需求。作者观察到,很多产品的反馈区充满火药味,根源在于产品方与用户之间的信息差和沟通姿态问题。 文章指出,大部分客服答疑工作本质是消除信息差,但这容易变得机械,失去人性关怀。而用户的情绪化表达背后,其实蕴藏着对产品的期望与思考。作者认为,破解僵局的关键在于转变视角:客服应尝试理解用户,顺着吐槽揪出产品痛点并坦然承认,这样才能建立共情,引导对话走向对本质诉求的探讨。 作者进一步提出,产品的驱动力分为自驱力和外驱力,而后者最核心的来源正是用户反馈。要从用户“嘴里”找到答案,需要解决一个根本挑战:如何让用户愿意且持续真诚地吐露心声?文章最后点明,明白了这一点,反馈区的火药味就会少一些,产品也会做得更好一点。

本机暂存
IT 2020-02-01 19:45:48 / 累计浏览 2,105

ECS 中的概念缺失

这篇讲的是作者团队在实际项目中对 ECS(实体-组件-系统)架构的一次重要反思与演进。他们指出,传统 ECS 过分强调 Component 和 System 这两个底层概念,导致在搭建复杂业务(如现代渲染管线)时,开发者需要手动组合数十个组件和系统,流程繁琐且极易出错。 为此,他们引入了两个更高层的抽象概念来解决问题。第一是 **Policy**,它将实现某个特定功能(如“可渲染物件”)所需的所有 Component 及其初始化流程封装起来。开发者创建 Entity 时只需描述其具备哪些 Policy,而无需关心底层数据构成。第二是 **Pipeline**,它用一棵树状结构来定义 System 的执行顺序,开发者可以将 System 注册到流水线的特定节点上。 通过这套设计,他们实现了将框架的复杂性封装起来,让业务层开发者只需关注 Policy 列表、Pipeline 配置和初始数据,无需直接处理 ECS 的底层细节。这既保持了 ECS 解耦与数据驱动的核心优势,又大幅降低了实际使用的门槛,确保框架能真正服务于业务开发效率。

本机暂存
IT 2020-02-01 16:44:33 / 累计浏览 2,346

资源文件的转换问题

这篇讲的是作者在自研游戏引擎中遇到的一个资源转换缓存失效问题,以及由此展开的架构优化。 他们引擎的资源转换采用惰性策略:在虚拟文件系统中,根据`.lk`描述文件和平台信息按需生成最终资源。但最近发现,对于 shader 这类依赖其他 include 文件的“代码型”资源,仅靠源文件和`.lk`文件的 hash 作为缓存 key 是不够的——修改依赖文件后,系统并未感知变化,错误地返回了旧缓存。 根因在于初始设计过于简化,未考虑编译的完整依赖链。放弃惰性构建的方案很快被否决,团队最终提出一个更巧妙的方案:当请求构建时,系统会在后台无条件重新编译,并将此次编译的**完整参数和依赖关系**(包括所有依赖文件的路径及当前 hash)写入一个新的构建脚本文件(如 `a.sc.lk.ios`)。这个文件本身唯一确定了一个编译结果,其 hash 就成了新的、精确的缓存 key。 这个机制既保留了惰性转换的优点,又实现了准确缓存。相比 Unity 的 cache server,它的优势很明显:缓存键是包含依赖的完整过程,因此可以跨项目复用(同一张贴图不会因路径改变而需重新编译)。此外,文件服务器还能利用空闲时间预编译其他平台版本,这是纯键值存储的 cache server 做不到的。这个设计有点类似 Git 大文件存储,用一个轻量引用指向背后的编译服务。

本机暂存