BLOG
-
你能说出 Navigation bar 是哪一块 UI 吗?最近名字又变了……iOS & Android 各类 Bar 系 UI 新旧名称汇总
在移动应用 UI 中,有很多名字带有 Bar 的 UI,例如 Navigation Bar、Toolbar 等。最近 iOS 和 Android 两边都对它们的名称和规范做了大幅调整。尤其是 Navigation Bar 这个名称,在 iOS 还是 Android、当前还是以前,指向的 UI 完全不同,非常容易混淆。本文用表格的形式梳理各操作系统中各部位的名称和外观,并附上官方规范的链接。
-
Design -
UI
-
-
我不喜欢 Tailwind(和 React)的理由
本文将解读我对 Tailwind CSS 与 React 组合所感到的问题点。包括样式定义与文档结构的混杂、对 scoped CSS 使用的不满,以及与 Astro、Svelte、Vue 等其他框架的对比。
-
React -
tailwind
-
-
Best Buy 2024
2024 年买到的好物清单。每年年初都会写。
-
Review -
Life
-
-
[定期打扫・预防式打扫] 一个独居 15 年的懒人总结：只做这些就能让家保持整洁的习惯 [收藏版]
我本质上是一个超级懒的人，但有自信不管什么时候有人来都能保持房间整洁。独自生活十多年、住过 4 个不同的出租屋之后，我逐渐摸清了「维持整洁最省力的打扫方式」，于是把它整理成这篇文章。年末大扫除也即将来临，并且我也会推荐很多适合在黑五购买的清洁好物。
-
Life
-
-
用鼠标的人,如果能用左手按 Enter 和方向键的话会变得更幸福
一篇关于工作效率化的文章。推荐给右手用鼠标的设计师、创作者,以及其他所有人。同时介绍一些值得入手的左手设备。
-
figma -
Review
-
-
Best Buy 2023
2023年买到的好物清单。每年年初都会写。
-
Review -
Life
-
-
想用一台显示器、一套鼠标键盘控制多台电脑？KVM 与 PbP 显示器超级方便
你听说过显示器的 KVM、PBP、PIP 等功能吗？当用一台显示器、一套鼠标键盘连接多台电脑时，这些功能可以让多设备切换变得轻松许多。如果你在挑选显示器时从未注意过这些功能，请务必看一看本文。
-
Review
-
-
open Best Buy 2022
2022年买到的好物清单。因为搭建了「家庭健身房」并重新审视了「包里的东西」,所以这方面的内容比较多。
-
Review -
Life
-
-
用耳机同时听 Switch 游戏声音和手机语音聊天通话 [Splatoon3]
在 Nintendo Switch 上一边语音聊天一边玩游戏时,如何区分游戏声音与通话声音是个难题。本文整理了我尝试过的耳机环境的最佳方案,以及挑选时值得了解的信息。让我们为《喷射战士3》中与朋友的舒适体验做好准备吧!
-
Review
-
-
这就是完整的2022年Android可折叠设备·响应式适配方案
由于在自家应用中做了可折叠设备(折叠屏手机)的适配,本文从UI设计的角度,总结一下最新的Android多设备·响应式适配方案。内容稍长,可以从目录中挑感兴趣的部分阅读。
-
UI -
Design
-
-
Best Buy 2021
2021年买到的好物清单。新年都过了再写也没什么问题嘛。包括数码产品、家具、烹饪相关等。
-
Review -
Life
-
-
Material Design 3 简明梳理
随着 Android 12 的发布，Material Design 的官方文档也迎来了一次重大更新（俗称 M3）。我大致通读了一遍，这里把要点简单梳理介绍一下。本文默认读者已经了解此前的 Material Design。
-
UI -
Design
-
-
【Mac效率化】你也许还不知道的 Alfred 推荐设置与使用技巧
整理一下 Mac 上经典的工作效率化应用「Alfred」的推荐使用方式与设置。这是一款超人气应用,所以类似的文章已经很多,但本文尽量介绍一些可能还不为人知的小技巧和隐藏玩法。前提是已购买付费版(Powerpack)。把所有功能都写出来会太长,所以只介绍我每天都在实际使用的那部分。
-
App・Service
-
-
open 给检视设计的人看的 Figma 用法 (面向工程师与项目经理)
本文不是讲怎么用 Figma 做设计,而是面向那些需要审阅设计师作品的人,介绍 Figma 的用法。
-
figma -
UI
-
-
为每个服务设置不同的强密码,而且还能轻松记住的管理与生成技巧
为了安全起见,密码必须使用难以猜测的复杂组合,并针对不同的应用和服务分别设置。本文将介绍一种既能为每个服务使用强壮且安全的密码、又能轻松记住的方法。
-
App・Service
-
-
open 用 Vue 3 + Hugo 打造兼具 SPA 与 SEO 优势的博客网站
前几天，我对自己的个人博客网站进行了改版。在搭建博客的过程中，关于 CMS 的选型让我纠结了不少，同时也想把使用 Vue 3 后的一些心得总结分享出来。这篇内容主要面向前端工程师。
-
Vue -
HUGO
-
-
open 用 Vue 制作了一个把 Chrome 新标签页变成类 VS CODE 的 WYSIWYG Markdown 编辑器的扩展
因为我喜欢 VS CODE、Chrome 和 Vue,所以自然而然就做出了这个东西,请允许我介绍一下。
-
Vue
-
-
open UI设计师的办公桌@U-NEXT
在某些圈子里,把桌面收拾得井井有条似乎是一种潮流,我也来凑凑热闹,详细写一写自己的讲究。听说U-NEXT里对办公桌有讲究的人很多,而我已经是第5个写办公桌系列note的人了。
-
UI
-
-
open UI设计师应当理解的平台原则是什么
本文总结了UI设计师理解和学习平台原则的必要性和意义。对于初学者来说,这是一个学习方式和学习意义本身都不易理解的领域,希望本文能够有所帮助。
-
UI
-
-
open 仅用CSS就能让网页支持深色模式。终于在Chrome中也能用的 prefers-color-scheme 超级方便
通过使用 prefers-color-scheme 这个设置值,可以轻松地让网页支持深色模式。Chrome也在今天发布的76版本中开始支持,本文将简单介绍。
-
Web -
CSS
-
-
open 一行 CSS 实现优雅的背景模糊・毛玻璃效果!Chrome 终于支持的 backdrop-filter 太方便了
之前在 Web 设计中难以实现的背景模糊效果,现在通过 backdrop-filter 这一个 CSS 属性就能极其简单地表达出来了。
-
Web -
CSS
-
-
open 在 Sketch 和 XD 中使用 iOS13 的 SF Symbols
在设计文件中使用 SF Symbols 时遇到了一些小问题,在此分享一下使用方法。
-
UI
-
-
Pixel3相机的价值就在于「拍摄体验」
Pixel3从发售之初就因相机的优秀而备受关注,在各种地方都被介绍过。当然相机性能本身也很出色,但我认为Pixel3真正优秀的地方在于它「拍摄体验」之好。借此机会,请允许我介绍一下我一直以来感受到的Pixel的优点。
-
Review -
UX
-
-
open 最详细的 Sketch、XD、Figma、Studio 对比
-
figma -
App・Service
-
-
不再带钱包出门后的发现以及目前的最佳方案
前几天买了 Pixel3 这款手机以后,我就不再带钱包出门了。随身携带的只有 Pixel3 和卡包,主要靠支付应用 Google Pay 和信用卡完成所有支付。
-
Review -
App・Service
-
-
2018年值得购买的15件好物
汇总了2018年购买、签约后觉得不错的东西。今年的目标是提升生活品质,所以买了不少东西。按数码产品、订阅服务、猫咪、其他类别分类。每个类别中大致按购入后觉得最满意的顺序来写。
-
Review -
Life
-
-
[Chrome扩展] 自由改变常逛网站的设计! 加载自制CSS和JS的方法 [纪念Stylish下架]
只要具备最基本的HTML和CSS知识就OK。可以把Google搜索或GitHub等网站的背景换成黑色,或是去除不需要的元素。这是一种在本地制作扩展的方法,具有「安心」「JS也能用」「SCSS也能用」等众多优点。
-
Chrome -
Web
-
-
无论是Atom用户还是Sublime用户,都来换用毫无死角的编辑器「VS CODE」吧
世上的编辑器数不胜数,但功能不足、速度不够、学习成本、价格等让人头疼的因素也很多。本文为您介绍其中一款几乎没有弱点、日常使用恰到好处且舒适的编辑器——「VS CODE」。这是一篇主要面向Atom、Sublime、Brackets以及Coda等用户的安利文章。
-
App・Service -
Web
-
-
终于来了!被誉为最强原型工具、备受期待的 inVision Studio. (early access 版)上手体验
去年仅放出宣传视频就引发巨大反响的 inVision Studio. 这是一款对标 Sketch 和 XD 的应用,从视频来看据说功能强大到能把它们都驱逐出局。我终于收到了登记的 early access 版邀请邮件,这就来调查一下。
-
App・Service
-
-
【收藏版】gulp、webpack、parcel...理解层出不穷的任务运行器的特点,选择最合适的那一个
前端开发依赖大量的库和框架,管理它们的任务运行器也百花齐放、群雄割据。本文目的在于简要介绍各类工具的特点和理念,让读者能更直观地把握它们之间的差异。
-
JavaScript -
Web
-
-
如何用电脑实时在手机上预览正在制作的网页
在 Mac 上不需要任何特殊准备,就可以快速架起本地服务器,从手头的手机上预览正在制作中的网页或 Web 应用。
-
Web
-
-
设计师该重视的「指意符(Signifier)」,以及容易被混淆的「可供性(Affordance)」
你听说过「可供性(Affordance)」和「指意符(Signifier)」这两个词吗?如果你只听说过「可供性」,那要小心了。
-
Design -
UX
-
-
只要会一点 JS 或 jQuery 就来做个书签小工具吧
书签小工具(Bookmarklet)是一种登记到浏览器中,可以在任意网页上执行的小程序。只要懂一点 JS 就能轻松制作,完全不需要特殊的开发环境。
-
JavaScript
-