交互设计

构建无障碍组件之Checkbox pattern复选框（Checkbox）是表单中最常见的交互元素之一，支持双状态（选中/未选中）和三状态（选中/未选中/部分选中）两种类型。本文基于 W3C WAI-ARIA Checkbox Pattern 规范，详解如何构建无障碍的复选框组件。

构建无障碍组件之Accordion PatternAccordion（手风琴）是一种常见的交互组件，由垂直堆叠的可交互标题组成，每个标题包含一个内容部分的标题、摘要或缩略图。本文基于 W3C WAI-ARIA Accordion Pattern 规范，详解如何构建无障碍的 Accordion 组件。

构建无障碍组件之Disclosure Pattern展开收起（Disclosure）是一种常见的交互组件，也被称为 Collapse（折叠），允许内容在折叠（隐藏）和展开（可见）状态之间切换。本文基于 W3C WAI-ARIA Disclosure Pattern 规范，详解如何构建无障碍的展开收起组件。

构建无障碍组件之Dialog Pattern模态对话框是 Web 应用中常见的交互组件，用于在不离开当前页面的情况下展示重要信息或获取用户输入。本文基于 W3C WAI-ARIA Dialog Pattern 规范，详解如何构建无障碍的模态对话框。

构建无障碍组件之Alert Dialog PatternAlert Dialog 是 Web 无障碍交互的重要组件。本文详解其 WAI-ARIA 实现要点，涵盖角色声明、键盘交互、最佳实践，助你打造中断式对话框，让关键信息触达每位用户。

初级代码游戏

软件界面设计培训初级代码游戏的专栏介绍与文章目录-CSDN博客我的github：codetoys，所有代码都将会位于ctfc库中。已经放入库中我会指出在库中的位置。

初级代码游戏

云存储的删除设计最近看到有人抱怨云存储的删除文件。一个是Ondrive同步完成后删除了本地文件，一个是iCloud“全部删除”删除了所有数据而且无法找回。

用心写好一个登录页：代码、体验与细节的平衡今天，我们将使用 React + Vite + Tailwind CSS + Lucide React，快速搭建一个简洁、响应式且注重细节的登录页面，并顺手拆解几个提升用户体验的小技巧。

我用AI写了个小程序，却被人说没有底线…今天想和大家分享一下我用AI开发的一款微信小程序——【破冰神器】。作为一个喜欢和朋友聚会但又经常面临“冷场”尴尬的i人，我一直在寻找一款能够活跃聚会氛围的小程序。但市面上的应用要么做工粗糙功能单一，要么一堆广告没法玩。于是，我决定自己动手（其实只动了嘴，是AI动的手），开发一款好用、功能丰富的“破冰神器”。

Flutter 开发的极简风格聊天界面项目中使用到的一些第三方组件Podfile 文件Info.plist 中增加对权限的描述动画的Key需要传递到第二个页面。

Agent时代下，ToB前端的UI和交互会往哪走？最近在负责 Agent 项目前端部分的落地，深感 Agent + ToB 不仅仅是功能的叠加，更是一个需要前端开发、交互设计与业务逻辑深度融合的全新领域。因此，我想通过这篇文章梳理一下架构设计层面的思考。

使用motion实现小宇宙贴纸墙效果该文章的交互效果和完整代码可以在我的博客查看小宇宙个人页面有一个贴纸墙的小功能，用来展示自己获得的一些成就，这个贴纸墙可以自己来调整贴纸位置，感觉是一个很好的功能，于是用motion复刻了一下

使用motion实现小宇宙节目广场的效果本文可以在我的博客查看交互效果和完整代码小宇宙app节目广场有一个效果，感觉特别好，想用motion复刻一下：

PPT太丑？用InDesign制作电影级的交互式在线演示文档本文旨在解决传统演示软件（如PowerPoint、Keynote）在制作商业提案、设计报告时，普遍存在的模板化严重、视觉表现力不足、动态效果廉价的核心痛点。我们将介绍一套常被设计师们“误解”或“忽略”的“降维打击”工作流，核心是利用印刷排版软件 Adobe InDesign 强大的版式控制、动画与交互功能，来创建电影级的动态演示文稿，并通过其在线发布 (Publish Online) 功能，一键生成可在任何浏览器中流畅访问的网页版交互式文档，从而极大地提升提案的专业度与视觉冲击力。

产品研究员

教你3个原型设计的高级交互用法，0基础产品经理适用！高保真交互原型在很多新人产品经理眼里，似乎是一个“高阶玩法”。即便是经验丰富的PM，或许也未必真正掌握高级交互功能的使用方法。这些年，产品经理们似乎逐渐远离了交互设计，普遍认为高级交互**“功能难用”“不好实现”**。

开源分享程序员专用作品集网站 - StudioX这是一个现代化的个人作品集网站，专为开发者、设计师和创意工作者设计。网站采用响应式设计，支持移动端和桌面端，提供优雅的用户体验和丰富的交互功能。

墨刀监听变量实战：1个案例搞定高保真交互原型（附教程）墨刀最近上线了一个实用又强大的监听变量功能，让我这个常年制作高保真交互原型的产品经理感到惊喜！第一时间上手测试，结果超出预期。相比Axure那套复杂的交互逻辑和变量配置，墨刀的监听功能显得更直观、更轻量化，功能性却一点不打折扣。我特地准备了一个基于高保真APP页面的实战案例，通过一个输入框字数计数的小交互，教你掌握“监听变量”的具体使用方式，无需写代码，轻松搞定动态交互。

从零打造前沿Web聊天组件：从设计到交互作者现在制作一款网页端聊天室（青春版），之前一直有这个想法，现在总算是迈出了第一步开始制作了...... 雄关漫道真如铁，而今迈步从头越！

UI 设计｜提高审美｜极简扁平过时吗？在做UI界面时，极简扁平一直是个稳妥又高适配的选择。它没有复杂的质感和装饰，更强调清晰、直接和功能导向，能快速搭建出干净、有秩序的界面，适合大多数场景落地。

结构化知识课堂

Axure全链路交互设计：快速提升实现能力（基础交互+高级交互）想让你的设计稿像真实App一样丝滑？本专栏带你玩转Axure交互，从选中高亮到动态面板骚操作，再到中继器表单花式交互，全程动图教学，一看就会！