必赢亚洲手机app下载


本身延伸

必赢亚洲手机app无标题文借助脾性定制商场之风

必赢亚洲手机app列表视图Vs网格视图

固然现行反革命手提式有线电电话机荧屏的可行性是越做越大,不过事实上真正使得手提式有线电话机这样方便的地方正在于它的小尺寸。相比较于台式电脑,甚至台式机电脑的显示器,手提式有线电话机的小显示屏都只能容纳更少的剧情新闻,用户在滚动查看越来越多内容前不得不在脚下显示器中看出很少一些。

明日自家要再度审视音信展现的二种基本方式——列表视图和网格视图,并为各自提供相关用例加以表明。

列表视图和网格视图

一 、列表视图

1个列表垂直突显三个再三再四的行元素。列表视图重在文本内容,由此普通唯有一些小图标穿插在文本音信内。为了同目前间能在现阶段显示器中突显更加多的列表项内容,这就需求列表中的每一项在笔直方向上占有比较于图片更少的长空。

列表视图示例

壹 、内容浏览

列表视图的剧情展现方式更切合人们自然的翻阅情势,如F形模式

网页上的F形示例

列表视图最符合用来体现同品种的数目,并不难人们的阅读驾驭。通过减弱页面(即每一页蕴含越多内容),列表视图降低了用户的轮转压力。对图纸的排外(列表视图只有缩略图,完整的图形占用空间)更使得视图的每一屏允许你以适应越多的始末。

超级浏览格局下的列表示例

最后一点一律关键的是,当用户浏览列表视图时,他们的注意力从上到下依次下降。

贰 、用户是怎样做选用的

用户首要借助阅读文本音信来做出决定。

3、优缺点

对待于网格视图,列表视图有以下优点:

(1)列表视图遵从人们的当然阅读格局;

(2)每一屏能够显得越来越多消息/选项,减轻了给用户带来太多滚动翻页的难为;

其症结在于:

(1)列表视图在视觉外观上缺少表现力;

(2)列表视图中,用户的注意力会自上而下收缩;

② 、网格视图

网格视图是正统列表视图的一种替代方案。网格视图由用来做布局的网格线和任何视觉线索将其显明不相同出来。一个网格视图由在笔直和水准方向上再一次排列的要素项整合。

网格视图示例

壹 、内容浏览格局

网格视图创设了二个略带有停顿感的浏览形式,使得它最符合于视觉内容。平时情状下,图片占用了视图成分的大举上空。

数一数二浏览方式下的网格视图

用户的注意力在每一个网格单元间均匀迁移。网格视图更易于视觉精通,并分别相似类型的数额。

贰 、用户是什么做取舍的

网格视图下用户首要依靠图片来做出选拔/决定。而必要注意的少数是用户在一如既往时刻只可以注意到4-伍个网格单元。

Ecommerce 中的网格视图应用

3、优缺点

网格视图有以下优点:

(1)网格视图更抓住用户眼球;

(2)网格视图有助于用户区分单元项间的视觉差别;

(3)视觉视图中用户注意力均匀迁移;

不足之处:

(1)网格视图会招致内容音讯分布在更加多的页面,因而,用户需求为了见到愈来愈多音讯供给滚动更频仍。下边例子中您能够看出三种视图的对比意况:

红线部分标示出每一屏容纳的新闻量

三 、关于缩略图使用的相似准则

必赢亚洲手机app,那便是说到底对于剧情突显来讲什么是最有效的布局方案吗?你到底该行使列表视图依然网格视图呢?正确的答案是:看事态而定。

选料列表视图?照旧网格视图?二个主要的因素是用户为了做取舍/决定毕竟须要浏览/相比较多少信息。那毕竟是神马意思?那整个都归为贰个第1标准,即情节为王。你应当遵照你的剧情类型来选拔与之合适的视图布局。

端详使用列表,图片采用网格

货物页面是三个颇为适合的例子。对于像家电那样的货色,其产品型号、评分和尺寸规格是用户做取舍的关键因素,选用列表视图就很有意义。

WallMart iOS客户端

网格视图则更契合于那一个供给更少的商品新闻也许商品类似的处境。比如衣裳类货物,你挑选时更在意商品外观,对于文本描述则次要很多。在这种意况下,用户更关切单元成分间的视觉差别,也更愿意滚动页面来进展比较,而不是数次重复的在列表页和详情页间来回切换。

MrPorter iOS客户端

当设计那么些布局时,挑选适合的图片尺寸,一方面使其大到丰盛用户识别,一方面使其小到同一屏能显得更加多商品。

④ 、使用哪个种类方案关乎于用户体验

最后,毕竟选用列表视图仍然网格视图,这亟需您从哪一类音讯(是文件描述照旧图片)是对用户最有价值来度量。切记,用户体验关乎于人性研究,绝不只是停留在方式层次。找出最契合于用户或对用户最和谐的方案自然简单:将第一流程实体建立模型后找一局地用户进行测试。那些能增高用户成效的方案便是赢者。

译自:https://uxplanet.org/mobile-ux-design-list-view-and-grid-view-8f129b56fd5b\#.keyi6kjst

相关文章

No Comments, Be The First!
近期评论
    功能
    网站地图xml地图