百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 编程字典 > 正文

我对谷歌浏览器的优化设计:一键打开所有网站

toyiye 2024-06-24 19:17 16 浏览 0 评论

新版本的谷歌浏览器在界面上做了不少优化,但在用户体验上还有很多提升的空间。本文作者就是从这个角度出发,并设计了对应的解决方案,希望能给大家带来启发。

一、最初的直觉

在 PlayStation 实习的时候,我会用谷歌浏览器打开一组网站,开始我一天的工作:

  • PlayStation的社交网站
  • Adobe Analytics
  • Box.com
  • Slack.com

到家以后,我会打开另一组娱乐网站:

  • 脸书的Messenger
  • Gmail邮箱
  • YouTube

这只是我的一个直觉,我觉得人们在每种情况下首次启动浏览器都会倾向于打开相同的网站,而谷歌浏览器应该给这种常规行为提供流畅的用户体验。

所以,以下是我的设计目标:

改善谷歌浏览器在工作、浏览社交媒体、阅读新闻等不同情况下的使用体验。

二、谷歌当前的解决方案

谷歌浏览器其实已经有一个启动浏览器打开网站时的方案了。

谷歌浏览器偏好设置 > 启动 > 打开一个或者一系列特定的页面

不过,这个方案是应用于所有启动的情形。

它并不能满足我在不同的时间打开不同网站的要求,也就是说:我不希望每次在家的时候打开谷歌浏览器看到的是工作网站。

工作时我想要打开的内容与在家时并不相同

我查看了 Safari、Firefox 和 Opera,它们看起来和现在的谷歌浏览器都差不多。

我还查看了谷歌浏览器扩展插件,像One Tab这样的大多数插件也都不靠谱。例如:有一个用户就“丢失了所有保存超过一年以上的网站”。由于谷歌浏览器最近更新了它的主页,因此最佳的选择似乎是把这个功能添加到当前的主页设计上。

当前的谷歌浏览器主页:直接访问最常用的网站(没有分组)

三、用户观察

朋友 A 和朋友 B 的网站访问地图(来源于 Free Sketch Templates)

为了检测其他人是否觉得这项功能有用,我观察了朋友们是如何使用谷歌浏览器的。我发现用户访问记录显示他们在打开前几个网站时也有类似的模式。

  • 朋友A和朋友B一打开谷歌浏览器,就会立刻点开一组特定的网站。
  • 朋友A和朋友B提到他们会在特定的时间/地点/情况下打开同一组特定网站。
  • 朋友A和朋友B提到他们经常使用谷歌浏览器主页打开他们最常使用的网站。

更进一步说:这项功能还可以跟踪最常使用的几组网站,自动显示在主页上,类似谷歌现在做的那样。这比Pinned Tabs这样的功能更有优势,因为朋友A和B都不必手动输入任何内容,网站组就自动出现了。

四、低保真线框图

在了解了一般用户的访问习惯之后,我决定开始设计线框图。由于我没有做任务分析、调查或者结构化访问,因此我要在这里做一些假设

  • 人们只需要2-3组网站。
  • 每组网站下只需要2-4个网站。

这是我最初的设计:

设计 1

优点:

  • 在左侧点击能够打开组内所有的网站
  • 在右侧的组里点击能够打开单个的网站 —— Veronica Howell

缺点:

杂乱无章,内容太多了 —— Yerin Yoon

设计2

优点:

  • 集中、有条理
  • 即有网站组也有单个的网站

缺点:

无法选择组里的单个网站,在“网站A和网站B已经打开了,用户只想要打开网站C”的情况下,这项功能就显得很重要 —— Victor Lo

五、反思

从这两个线框图中我得到了这些反馈:

(1)人们想要一个清晰整洁的结构;

(2)人们希望能快速打开整组网站,但也希望能单独打开组里的某一个网站。

1. 可能的解决方案

  • 谷歌浏览器知道哪些网站已经打开了。当用户点击打开网站组而网站 A 已经打开的时候,那浏览器将只打开网站 B 和 C。(“呃,那也太智能了吧。”—— Roseanne Chao)
  • 谷歌浏览器可以在组里加一个图标,用来展开显示该组内的各个网站。(“听起来很酷。”—— Alex Li)

2. 高保真流程

我将解决方案纳入了最终设计和流程中。

注:最终设计的选择——悬停确认网站是可点击的,悬停后出现的向下箭头显示了组内包含的网站,在弹出菜单里可以轻松点击进入各个网站,还有一个“打开全部”按钮可以在用户想要打开全部网站时使用。

我向朋友展示了这个流程,他们立刻给出了积极的评价:

  • 打开整组网站和组内单个网站的流程“简单又简洁”—— Thomas Huang
  • 清晰的UI设计,与用户期望产生共鸣
  • “非常有谷歌的风格”—— Titus Hartmann

六、下一步

要想了解这项功能是否成功,我必须深入了解以下指标:

  • 对比第1/7/30天,每个用户的平均网站组数量
  • 对比第1/7/30天,每组网站的平均点击次数

假设用户A在第一天就有三个网站组,并且每天点击两次,这听起来像是成功了。

但是,假设到了第 0天,用户A只有一个网站组并且每周才点击一次,那这个功能就算是失败了。在整个功能发布过程中,跟踪用户留存是非常重要的。

总的来说:在设计这个灵光一现的小想法的过程中我获得了许多乐趣。

原作者:Hiroo Aoyama

原文链接:https://uxdesign.cc/google-chrome-ux-idea-opening-your-usual-websites-at-once-6027410072cc

翻译:即能,公众号:即能学习

本文由 @即能 翻译发布于人人都是产品经理。未经许可,禁止转载。

题图来自Unsplash,基于CC0协议。

相关推荐

为何越来越多的编程语言使用JSON(为什么编程)

JSON是JavascriptObjectNotation的缩写,意思是Javascript对象表示法,是一种易于人类阅读和对编程友好的文本数据传递方法,是JavaScript语言规范定义的一个子...

何时在数据库中使用 JSON(数据库用json格式存储)

在本文中,您将了解何时应考虑将JSON数据类型添加到表中以及何时应避免使用它们。每天?分享?最新?软件?开发?,Devops,敏捷?,测试?以及?项目?管理?最新?,最热门?的?文章?,每天?花?...

MySQL 从零开始:05 数据类型(mysql数据类型有哪些,并举例)

前面的讲解中已经接触到了表的创建,表的创建是对字段的声明,比如:上述语句声明了字段的名称、类型、所占空间、默认值和是否可以为空等信息。其中的int、varchar、char和decimal都...

JSON对象花样进阶(json格式对象)

一、引言在现代Web开发中,JSON(JavaScriptObjectNotation)已经成为数据交换的标准格式。无论是从前端向后端发送数据,还是从后端接收数据,JSON都是不可或缺的一部分。...

深入理解 JSON 和 Form-data(json和formdata提交区别)

在讨论现代网络开发与API设计的语境下,理解客户端和服务器间如何有效且可靠地交换数据变得尤为关键。这里,特别值得关注的是两种主流数据格式:...

JSON 语法(json 语法 priority)

JSON语法是JavaScript语法的子集。JSON语法规则JSON语法是JavaScript对象表示法语法的子集。数据在名称/值对中数据由逗号分隔花括号保存对象方括号保存数组JS...

JSON语法详解(json的语法规则)

JSON语法规则JSON语法是JavaScript对象表示法语法的子集。数据在名称/值对中数据由逗号分隔大括号保存对象中括号保存数组注意:json的key是字符串,且必须是双引号,不能是单引号...

MySQL JSON数据类型操作(mysql的json)

概述mysql自5.7.8版本开始,就支持了json结构的数据存储和查询,这表明了mysql也在不断的学习和增加nosql数据库的有点。但mysql毕竟是关系型数据库,在处理json这种非结构化的数据...

JSON的数据模式(json数据格式示例)

像XML模式一样,JSON数据格式也有Schema,这是一个基于JSON格式的规范。JSON模式也以JSON格式编写。它用于验证JSON数据。JSON模式示例以下代码显示了基本的JSON模式。{"...

前端学习——JSON格式详解(后端json格式)

JSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。它基于JavaScriptProgrammingLa...

什么是 JSON:详解 JSON 及其优势(什么叫json)

现在程序员还有谁不知道JSON吗?无论对于前端还是后端,JSON都是一种常见的数据格式。那么JSON到底是什么呢?JSON的定义...

PostgreSQL JSON 类型:处理结构化数据

PostgreSQL提供JSON类型,以存储结构化数据。JSON是一种开放的数据格式,可用于存储各种类型的值。什么是JSON类型?JSON类型表示JSON(JavaScriptO...

JavaScript:JSON、三种包装类(javascript 包)

JOSN:我们希望可以将一个对象在不同的语言中进行传递,以达到通信的目的,最佳方式就是将一个对象转换为字符串的形式JSON(JavaScriptObjectNotation)-JS的对象表示法...

Python数据分析 只要1分钟 教你玩转JSON 全程干货

Json简介:Json,全名JavaScriptObjectNotation,JSON(JavaScriptObjectNotation(记号、标记))是一种轻量级的数据交换格式。它基于J...

比较一下JSON与XML两种数据格式?(json和xml哪个好)

JSON(JavaScriptObjectNotation)和XML(eXtensibleMarkupLanguage)是在日常开发中比较常用的两种数据格式,它们主要的作用就是用来进行数据的传...

取消回复欢迎 发表评论:

请填写验证码