#81 Unbox: Quiche Browser

简单体验一款定制化手机浏览器

第 81 期封面。使用了 DALL·E 3 生成的图像,并在 Photoshop 中大幅修改。目的是体现传统产品体验与尖端科技的冲突感。

现代用户体验设计一般默认会给予用户最好的统一体验,自定义、模块化等词都代表着面向专业用户的体验标准,这类产品会尽可能开放功能以供用户实现个性化界面和顺手的工作流。

在浏览器应用品类下,Vivaldi 浏览器的高度自定义化让它几乎可以在任何浏览器新人面前谈笑风生。然而到了移动端 Vivaldi 像其他浏览器一样收起了锋芒——主打起了去广告和隐私安全体验。

本文主角 Quiche Browser 则是一款可以自定义地址栏和菜单栏的移动端浏览器,极简主义并未制约它的功能,webkit 也可以如此夺目。

📱
写作时版本为 1.11.1,平台为 iOS 17.1,机型为 iPhone 14 Pro。

咸挞,启动!

Quiche 在 1.11 版本加入了 onboarding 流程,直接调用了设置界面里的选项。

Quiche 引导流程和默认首页

可以看到 Quiche 没有账户系统,天然地隐私保护,不放糖才是零糖。

Quiche 默认布局类似大多数底部地址栏的浏览器,平平无奇。巧合的是自带的几个网站我也订阅了,都有着不错的内容。整体没有冗长的动效,对于大部分常用操作反应非常敏捷。

核心特色

通过上面引导进入设置,终于发现了新天地。

Quiche 设置中的 Toolbar Gallery

开发者 Greg de J 开门见山地给出了多种 toolbar(地址栏+工具栏)默认样式,这在传达其实 toolbar 在这里不止一种形态。我们可以直接点选这里的成品 toolbar 套用,也可以在下面紧接的设置中继续自定义。

不过,作为位数不多的引导性质页面,我觉得也可以尝试在这里直接给到自定义布局的捷径。一种是在顶部直接提示,另一种是下滑一段距离后给出悬浮按钮的提示。

Quiche 设置中的 Toolbar Gallery 界面以及右边的更改界面

点击上面的按钮(如果存在的话),可以来到 Layout 设置页面。

Quiche 设置中的 Layout 界面

Quiche 支持如下定制:

  • 回退
  • 前进
  • 撤回
  • 重新加载
  • 地址栏
    • 搜索
  • 标签
    • 新标签页
    • 关闭标签
    • 关闭所有标签并清除数据
    • 起始页(标签页 → 新建)
  • 菜单(更多功能)
  • 页中查找
  • 分享
  • 历史记录
  • 桌面版网站
  • 禁止 JS
  • 默认浏览器中打开
  • 复制网址
  • 前往网站主页

Quiche 支持定制许多 toolbar 选项,但一些功能殊途同归,只是少了一些操作节点。上图是我的平时的一些常用操作选择,其他不常用的则放在菜单中。如果你有更多快捷操作想要加入,甚至可以再第二行再加入 7 个操作——这是一个 7x2 的布局网格,非常自由。

Quiche 设置的双行 toolbar 展示
Quiche 设置的双行 toolbar 展示

如果再 PRO 一点,感觉可以加入不同的 Mode / Work Space,这有点像 Arc 浏览器的思路,实质上是针对自由化产物的管理机制。目前 Quiche 并未区分。


上面定制 toolbar 的过程中可以看到地址栏和菜单右边有一个 > 的指示。点击即可进行进一步细节的定制化。先点击地址栏。

Quiche 地址栏设置项

地址栏中可以定义:

  • 地址栏基本内容展示
    • 域名
    • 全部网址
    • 网页标题
  • 网站 favicon
  • 阅读时长
  • 展示样式
  • 对齐方向
  • 字体大小

经常在 Figma 摸爬滚打的设计师此时已经看出来,这不是 component variants 吗?

toolbar 映射到 Figma 组件

有时候创新,可能就是把我们习以为常的东西「放错」了位置。

阅读时长是开发者自己的需求,开启后会根据页面内容来估算阅读用时。在标签的列表页可以按照阅读时间长短来排序所有标签页。


到了菜单的定制化,大体是上面 layout 定制的选项,只不过是以菜单形式出现。为了节省空间,菜单也从松到紧分 3 种布局,纵向看有点像以前 Firefox 浏览器的菜单形式,「横向看」也有 macOS 可定制的菜单栏之形。

Quiche 菜单设置项}

3 种布局的取舍形式——

  • Large: 图标,文字,仅单列
  • Medium: 图标,文字,可多列
  • Small: 仅图标,可多列

——代表了不同的重要程度,使排序更加符和直觉。我自己感觉 medium 布局有点鸡肋,但总归是多一个选项。最上方带有一个预览按钮,也是方便之处。

Quiche 菜单设置项与预览

上下文菜单(长按菜单)同样可以定制,但只能添减选项和更换顺序;除此之外还有手势,新标签页和主题模式等设置,感兴趣可以自行下载体验。

不足的点

Quiche 的定制化之旅让人愉悦,但就其流程本身还有不少优化空间。当前定制操作基本都放在设置中,顺序并非如本文层层递进。这在一开始使用时难免会产生困扰,且相关设置比较分散。比如地址栏在主题手势显示有相关设置,标签页在新标签显示也有相关设置。Quiche 以属性分类——把手势、显示等属性单独作为设置项目分组——个人认为是打乱了信息架构,我更想在同一主体下看到全部设置。

Quiche 不索求用户信息固然好事,但也无法同步个人配置。目前版本并无导出配置文件功能,每次重新安装都需要重新配置。

Quiche 的起点是满足开发者个人,公开后它可能需要处理来自大众的需求。移动端浏览器几乎已经标配去广告和隐私保护功能,不知 Quiche 之后会如何实现,期待。

上面两点均已在开发 roadmap 里。

结语

Quiche 虽然简单小巧,但我们应该惊讶于市面上主流浏览器几乎没有如此体验。

各大主流浏览器底部toolbar

可定制化产品的一个难点是,将传统产品解构后的信息梳理,用toC的思路去做toB 的内容,还经常费力不讨好。我一直是定制化体验的拥趸者,作为用户,每当遇到这种体验都会感到一些尊重。

在 AI 领域高速发展的今天,层出不穷的新技术应用让人恍如梦寐。向下观望时,我们会发现基础的应用体验并非尽善尽美乃至完满。之前在做 Google 系设计业务时,会高强度使用 Google 文档产品。然后就会感受到一幅奇妙的景象:世纪初的交互体验融合了二十年后先进的 LLM,结果就是前者遏制了后者更多的创造力,每每思考至此都令人感叹。在这种「代沟」之下,我们要做的事还有很多。Quiche 这类应用便如繁星中不起眼的一点亮光,虽然微不足道,但与其他渺小共同映射出了这片正在大放光明的星空。

拓展


如果你觉得文章对你有些帮助,可以请我的猫吃罐头 ↓

带有微信赞赏码和文字 A kind and compassionate act is often its own reward. 的横幅图像

订阅 Design Scenes

发布最新文章时,会以邮件通知你
zelda@link.com
订阅