防止微信内出现全文翻译提示。因此在这里放一个充满中文的分区。 防止微信内出现全文翻译提示。因此在这里放一个充满中文的分区。 防止微信内出现全文翻译提示。因此在这里放一个充满中文的分区。 防止微信内出现全文翻译提示。因此在这里放一个充满中文的分区。

设计垂点

过设计点 A,作业务目标 BC 的思考辅助垂线。
它们的交点即设计垂点。
2024年9月4日@Aragakey.
关于 shadcn/ui 的思考与启发
我认为 shadcn/ui 的取巧之处在于两点:对最佳实践的探讨,自由度和掌控感的建立。
阅读文章
cover

2024年8月27日@Aragakey.
如何依靠 transform 模拟 iOS 原生滚动体验
这篇文章将介绍利用 inertia + 手势动画尽可能模拟 iOS 原生滚动体验的方法,以及这样做的原因。
阅读文章
cover

2024年8月3日@Aragakey.
交互动画的层级设计
所谓“感觉很好”的二维 UI 设计,基本来源于人们对真实三维世界的认知。只不过是在此之上,或效仿,或衍伸。这篇文章的主题是层级,是我反向地从 UI 出发,去寻找关于层级的原型的一次尝试。
阅读文章
cover

2024年7月22日@Aragakey.
回顾:制作朋友圈广告年度评选
我享受和设计师合作的创作过程。我们职责互补,但不模糊。我们忘却时间,将对个人实现的追求托付于我们的作品。我这个人很简单,只想要做优雅和精致的 UI。我很庆幸遇到这样适配自己特长的项目。
阅读文章
cover

2024年7月16日@Aragakey.
回顾:制作微信广告官网
微信广告官网是一个非常完整的项目。我将总结自己在设计、前端及支撑其内容的后台系统上的工作,全面地回顾官网的开发历程。
阅读文章
cover

2024年7月10日@Aragakey.
回顾:制作微信广告设计语言 AD UI
我对设计语言的价值观,主要分为设计、组件、效能、流程这四个方面。我将从这四个方面阐述我对设计语言的理解,以及我的具体工作。
阅读文章
cover

2024年7月9日@Aragakey.
画出完美的文字圆形环绕 UI
2024 年 7 月 5 日是微信广告十周年的日子。做了一些围绕“文字圆形环绕”(实在不知道如何取名)的 UI 及过渡。当时做得不够好,我在这里完善一下。
阅读文章
cover

2024年6月21日@Aragakey.
用 framer-motion 实现优雅的 conic-gradient 旋转动画
随着今年微信广告榜单页面的升级,我和设计师一起完成了基于 conic-gradient 的旋转动画。这篇文章中,我将简单总结使用 framer-motion 逐步优化的过程。
阅读文章
cover

2024年6月6日@Aragakey.
Functional Motion:UI 组件库的动效设计细节
功能优先的动效设计。you see, fun is in functional.
阅读文章
cover

2024年6月2日@Aragakey.
我的 CSS 生成艺术世界
在 2019 年第五届 CSS 大会上,一位名为 yuanchuan 的分享者花了 10 分钟的时间差点让我睡着。但是在这之后的时间里,我被他的 CSS 艺术世界深深地震撼,直到今天也是。
阅读文章
cover

2024年4月30日@Aragakey.
我做的点赞/投票动画集合
好像在工作的这些年中,我做的最多的动画就是点赞或按钮动画。那就简单地整一个集合吧。
阅读文章

2024年4月16日@Aragakey.
用 react-spring 设计有“惯性”的交互动画
最近我为设计垂点的链接文字加入了一个交互动画。思考一个有趣的交互动画并且将它实现,是一件让人快乐的事。
阅读文章

2024年3月16日@Aragakey.
转盘交互动画:以关键参数,细化我们的感受
我们将通过文字和交互式 demo 穿插的方式,一起思考和体验:有哪些关键参数影响着最终结果。以此细化对交互动画的感受,体会“对”或“不对”之间的具体差异。
阅读文章
carousel

2023年12月31日@Aragakey.
2023:面对自我的提问与面对自我的回答
记录了我于 2023 一整年间,断断续续自说自话的一些文字。我喜欢,并且需要用文字的形式梳理思绪。
阅读文章
covercovercover

2016年9月26日@Aragakey.
我们认真地想了想 font-family
一个设计团队,存在一些需要标准化的课题。字体,也许是其中最为基础的一环。
阅读文章
cover