首页/风格学院/Palm webOS

Palm webOS 是什么风格?

Palm webOS 示例

Palm webOS 让每个运行中的应用都成为一张卡片,可左右翻看、一甩即关,外面是安静的灰色场景和带光泽的炭灰系统外框。

Palm webOS 速览

Palm webOS 是一个存在时间不长却影响深远的移动操作系统的界面语言。2009年它随 Palm Pre 在 CES 上亮相,带来了一个比公司本身活得更久的想法:每个运行中的应用就是一张卡片。你左右滑动翻看已打开的卡片,把其中一张往屏幕顶端一甩,它就关掉了。这个手势有身体感,反馈即时,也很容易教会别人。

每张卡片里面是一个 Mojo 场景,也就是框架的默认页面:浅灰色的安静底面,黑色与炭灰色的文字,标签用 Palm 蓝,选中时铺上明黄色的高亮。字体是 David Berlow 为 Font Bureau 设计的 Prelude,一款人文无衬线,选它是为了在屏幕上不抢戏。

场景外面是系统的黑色外框:顶部的状态栏、屏幕底部半透明的通知条,以及显示屏下方的一道白色手势光条。带光泽的炭灰色胶囊给按钮和列表项一种精致、略带触感的质地。库里的这套设计保留的,就是这片浅色场景、这些胶囊,以及它们外面那圈黑色外框。

Palm webOS 用在文章页上

Palm webOS 从何而来?

这套系统诞生于加州森尼韦尔的 Palm 公司,2009年随 Palm Pre 和更小的 Pixi 一起发布。十年前 Palm 定义过个人数字助理,到了2000年代末,它需要一个能与新一代触屏手机竞争的平台。长期负责硬件和产品的资深高管 Jon Rubinstein,是推动公司重新出发的人物之一。

设计方向很大程度上归功于主导 webOS 用户体验工作的 Matias Duarte。团队的核心洞察是:人用手机时会同时处理多件事,界面应该让这种“同时”看得见。卡片把多任务变成一种空间排布,而不是藏起来的列表;通知则被处理成悄悄出现在屏幕下方的东西,而不是打断整个画面。

webOS 也是用网页技术搭建移动系统的早期范例。应用用 Mojo 框架编写,采用标准的网页标记和脚本,后来的 Enyo 框架延续了这条思路。正因如此,那些场景看上去就像配色安静、排得整齐的网页:它们本来就是穿着统一系统样式的网页内容。

这个平台的寿命很短。2010年推出 Pre 2 和 webOS 2.0,2011年登陆更大的 HP TouchPad,之后商业上的路基本走到了头。但卡片隐喻和“一甩即关”的手势被后来的移动系统吸收,谈到以手势为先的界面,设计师至今还会提起 webOS。素材里列出的几个源流,卡片式多任务、手势优先的移动界面和网页技术应用框架,说明它的遗产远大于它的销量。

Palm webOS 的视觉特征是什么?

以卡片为工作单元

每个运行中的应用是一张卡片,这组卡片就是整个任务切换器。卡片在水平方向上并排摆放,可以调整顺序,往上一甩即关。设计从不让用户为管理应用去打开单独的菜单。视觉上,这意味着每个界面都有清楚的矩形边界和柔和的圆角,仿佛是一件可以被拎起来的实物。

色彩

场景是平静的浅灰,文字为黑色或炭灰色,标签与链接用 Palm 蓝,选中状态用黄色高亮。颜色各有职责:蓝色表示可以操作的标签,黄色表示当前选中。唯一的重色来自场景外面的黑色系统外框,它像画框一样圈住那片灰。整屏铺品牌色的背景在这里不存在。

字体排印

Prelude 是 David Berlow 为 Font Bureau 设计的人文无衬线,也是整个系统唯一的声音。它字形开阔、对比适中,在手机屏幕的小字号下依然易读,亲切却不花哨。层级靠字重、颜色和位置建立,而不靠换字体。列表行里,蓝色的简短标签位于较安静的灰色细节文字之上或旁边。

光泽炭灰胶囊

按钮、开关和部分列表项采用圆角胶囊的形状,上半部带有柔和的光泽,在灰色场景上呈炭灰色。它们看起来略微凸起、可以按下,符合那个年代对触感质地的偏爱,又克制得不去和内容争抢。光泽只被限制在胶囊内部,周围页面依然是平的。

系统外框与手势区

顶部是黑色状态栏,底部升起一条半透明的通知条,显示屏下方有一道细细的白色手势光条。系统外框在所有应用中保持一致,用户只需学一次。它也给较浅的内容加上了一圈坚实、高对比的边界,让卡片像嵌在深色设备里的窗口。

动效与方向感

动作遵循卡片的逻辑:横向滑动是浏览,离开应用时卡片缩小,被关掉时向上飞出。过渡迅速并直接跟随手指,界面像是在追着你的手而不是在播放动画。方向从不随意:横向表示浏览,纵向表示丢弃。

Palm webOS 用在仪表盘上

谁塑造了 Palm webOS?

Matias Duarte

webOS 用户体验的设计负责人。他塑造了卡片隐喻和以手势为先的多任务方式,这些想法后来在其他移动操作系统里再度出现。

Jon Rubinstein

Palm 的资深产品与硬件高管,推动公司走向 Pre 和 webOS。他的领导解释了为什么软件与设备上的实体手势区是被一同构想出来的。

Roger Black

与 Font Bureau 相关联的字体与出版物设计师,Prelude 正是这家字体公司发行的。他对面向屏幕的字体设计的影响,是 webOS 对文字格外用心的原因之一。

David Berlow

Prelude 的字体设计者,这款人文无衬线贯穿整个 webOS。他的设计有意低调,这恰恰是系统字体应有的样子。

今天怎么用 Palm webOS?

当你想要一个平静、以实用为先、又带着手势时代个性的界面时,Palm webOS 风格很有用。它适合用户要同时处理多件事、且内容应当压过品牌的产品。收敛的配色让它很容易与真实的数据、列表和表单结合。

做演示文稿时,封面可以把黑色系统外框当作边,里面放一张灰色卡片,用深色字写标题,用一个蓝色标签作副标题。内容页最适合做成一叠卡片,每张只承载一个想法,从左到右排开来讲一个顺序。数据页也把图表当成卡片,上方放一排胶囊形控件,下方是安静的灰色说明文字。

做网页界面时,这种风格适合任务管理器、收件箱、多文档工具和移动优先的仪表板。用圆角柔和的矩形卡片搭版面,把操作放进带光泽的炭灰胶囊,只在可点击的标签上用蓝色。定价页可以并排放三张卡片,用明黄高亮而不是醒目的徽章标出推荐方案。

做编辑与营销内容时,最好的用法是有内容的怀旧:一篇移动设计回顾、一段产品史,或是想要2010年代初质感又不愿沦为戏仿的发布页。文案要短,用人文无衬线排,让黑色外框与灰色场景承担视觉。设备照片可以放进卡片里,四周留足空白。

常见的错误是把光泽推得太过,满页都是闪亮的渐变,把那片安静的场景冲没了。原版把光泽收在胶囊里面,页面本身保持平整。另一个错误是把蓝色当装饰用;在这套系统里,蓝色永远表示可以操作,黄色永远表示选中。

Palm webOS 用在幻灯片 · 封面上

Palm webOS · 常见问题

Palm webOS 设计风格是什么?

这是 Palm 公司2009年推出的 webOS 的界面语言:应用是可以左右翻看、往顶端一甩即关的卡片,呈现在浅灰场景里,配炭灰色光泽胶囊、蓝色标签、黄色选中高亮和黑色系统外框。

webOS 是随哪款设备推出的?

随 Palm Pre 推出,2009年在 CES 上与 Pixi 一同亮相。2010年出现了 Pre 2 和 webOS 2.0,2011年则是 HP TouchPad。

它用什么字体?

Prelude,David Berlow 为 Font Bureau 设计的人文无衬线,因为低调、在小屏幕上易读而被选用。

为什么 webOS 影响了后来的移动系统?

它的卡片式多任务和一甩即关的手势,让应用间切换变得可见而有身体感。尽管 webOS 自身的商业寿命很短,这些想法后来在其他移动操作系统里得到了呼应。

借用这种外观时该保留什么?

保留卡片的边界、安静的灰色场景与黑色外框、光泽被收在内部的炭灰胶囊,蓝色只给可操作的标签、黄色只给选中状态。少了这些,它就成了一个泛泛的灰色界面。

获取 Palm webOS 完整设计系统
© 2026 Curio