风向标网页设计代码 第1篇
一个专门搜集 Linears 的网站，需要更多灵感可以去逛逛。
来复习一下，前面我们了解了 Linear 这款产品，一起拆解了 Linear 的设计思路，并对其设计进行了复刻实操，最后又欣赏了一些 Linear 风格的产品。
既然学习了 Linear 的设计风格，也更应该学习其背后先进的产品理念。
Linear 的 CEO 认为，当下软件市场竞争激烈，所有的产品团队实际上都是边冲刺边工作的，大家都在追求增长，几乎没有精力去打磨设计，造成产品同质化严重又毫无生气。
反过来，无法在功能上提供太多实用价值的产品，又会通过堆砌各种有趣的设计元素来转移注意力，造成过度设计，给用户的操作铺满障碍，让人不知所措。
如何兼顾设计体验与实用性是创新型产品必须去考虑的事情。Linear 给很多产品都打了样，也帮很多初创产品树立了信心。
这里再插播一下，前段时间硅谷银行危机导致很多初创公司受到影响，Linear 则自发向初创公司（即使不是 Linear 的客户）无偿提供借款，以帮助他们临时过渡，格局之大也的确值得称道。
也许做一款设计精美、性能卓越、有格局讲格调，又能平衡好产品体验和商业价值的产品。并不在于雇佣多少人分多少组，不在于讲多少 PPT 和开多少会，更不在于打不打卡坐不坐班，甚至不在于设计稿要不要给图层命名。
只要做这件事的人都是专业的，就足够了！
学习资料：
提醒一下，互联网产品迭代快，所以文章内容具有时效性。仅能保证文章发出时，相关内容和图片都是最新的，非必要不对内容进行更新。若对产品感兴趣建议收藏以下地址，筛选了学习资料一并贴出，请自行拓展阅读。
Linear 相关资料
Linear 风格网站
Framer 相关资料
文中涉及图片格式和 CSS 属性
WebP：
SVG：
蒙版属性：
渐变函数：
噪点效果：
风向标网页设计代码 第2篇
Linear 的服务市场主要面向北美和欧洲，服务器在国外，在国内几乎没有使用场景。
毕竟国内也有不少项目协同工具，中小团队用 Teambition、Worktile 或者 Tower 足够了，要求不高的用石墨、语雀、飞书、Notion 这类文档工具也都可以 cover 日常需求。大厂更不必说，出于数据安全考量，基本都使用内部自研系统。
所以这里，我们不花太多篇幅来探讨 Linear 的功能细则，了解一下即可。
既然叫 Linear，那么产品肯定就是要强调线性解决方案的。敏捷开发已经过时，Linear 打造的是现代软件开发的新标准。
首先，一切操作都可以通过键盘组合键来进行，内置全局命令菜单，50ms 的实时同步速度，内置专为现代化软件团队打造的工作流。
其次，可以快速创建任务并在上下文中讨论问题，可以无缝切换列表和看板视图并支持自定义，支持周期管理和跨团队 roadmap 规划。
再者，集成了专业开发组件并能联动各大代码、数据、设计平台，任务可无缝衔接，使软件开发实现自动化。
最后，Linear 还提供了设计精美的高级报告和分析功能，支持数据导出。
官网有详细介绍和演示，这里不一一展开讲述了。
不过，我们倒是可以通过 Linear 的「Roadmap」设计来感受一下其功能考究程度。
Linear 的 roadmap 不光设计得很漂亮，还非常灵活实用。你可以在 timeline 上随意拖动任务条来调整优先级，也可以通过拖拽任务条来改变日期跨度。此外，系统内置的各种任务状态和属性图标也非常精致。
Roadmap
另外，Linear 还有一个类似 Apple 人机交互指南的使用准则：「Linear Method」，不同于使用文档，更偏重理念性，感兴趣也可以去看看。
Linear Method
风向标网页设计代码 第3篇
首推 Raycast，一款我自己在用的 Mac 上的效率工具，类似 Mac 原生的 Spotlight，听名字都知道它也是 Linear 那挂的。Raycast 有强大的插件社区，目前产品也已接入 AI 功能，正在内测中。
Raycast 官网
Raycast 的设计也是自成一派，每打通一个应用就会为其重设计一款 Raycast 风格的应用图标（犹记得当年锤子手机也是这么干，时光啊！），包括当时给 Arc 设计的这个图标一放出来，也是立马就被刷屏了！
Raycast 的官网设计文件可以在 Figma 里打开来看一下细节：
切换到轮廓模式，可以看到设计图是相当复杂的，层级很多。
风向标网页设计代码 第4篇
Linear 应用内工作台样式，弹出的浮层，背景都做了半透模糊处理。
Linear 应用内截图
Linear 系统还内置了至少 8 款界面皮肤供用户选择。
用户也可以自定义主题，可以在开源网站 上查找更多主题。
但主题不能多端同步，而且只能设置自己在使用的应用程序皮肤，团队成员看到的还是他自己的主题样式。