Material Design Fortnightly

2019-11-06 11:54:48

 

 

目录

关于Fortnightly

产品架构

布局

颜色

排版

图标

形状

组件

动效

Fortnightly是一种新闻应用程序，它使用材料设计组件和材料主题来创建一种品牌化的，以内容为中心的客户体验。

 

关于Fortnightly

Fortnightly是一款涵盖各种主题新闻的应用程序。 该应用程序的重点在内容上，特别是文稿和摄影。

Fortnightly的品牌旨在以一种将内容本身置于用户体验最前沿的方式提供各种内容。 品牌是通过Fortnightly图标，排版系统和紫色（应用程序的辅助色）在原本灰度应用程序中来表现。 这种微妙的方法确保品牌在通过颜色或排版表达时会引人注目。

 

内容为重点

Fortnightly的审美将重点放在内容上，通过使用灰度调色板使图片脱颖而出，并使用排版比例使头条新闻突出，长文本易于阅读。

应用程序的布局网格从报纸中汲取灵感，为其设计为提供传统、直观的结构，同时提供大量内容。

 

产品架构

Fortnightly的信息架构被梳理成一个目录结构。 目录包含分类的层次信息，目录顶层由包含了从属信息的同级节点组成。 Fortnightly的内容分为主要部分和从属部分，从属部分类似于报纸中的头版头条，世界版块，美国版块，政治版块和商业版块等。

目录结构使用户快速导航到感兴趣的区域。 导航抽屉非常适合浏览目录结构，这就是Fortnightly使用此组件的原因。

 

导航抽屉

Fortnightly在平板电脑和桌面上使用标准导航抽屉，在移动设备上使用模态导航抽屉。 导航图标放置在顶部应用栏是为了提示用户去打开导航抽屉。

 

导航

导航部分仅包含文本。 带有小节的部分有一个箭头，表示它们可以打开。

 

品牌推广

Fortnightly还使用导航抽屉做品牌推广，将logo放置在导航抽屉里。

导航抽屉用于移动，平板电脑和桌面。

 

顶部应用栏和纸片

Fortnightly的顶部应用栏包含导航图标，logo，搜索功能和纸片。 这些纸片呈现出热门标签。

当点击纸片时，与标签相关的文章会填充页面。 这允许不同部分中的文章可以围绕共同的对象或主题聚在一起。

Fortnightly的顶部应用栏和纸片

 

短顶部应用栏

滚动时，顶部应用栏会折叠成为短顶部应用栏，从而为内容留出更多空间。短顶部应用栏包含两个元素：用于打开导航抽屉的导航图标和Fortnightly的logo

Fortnightly的短顶部应用栏

 

搜索

Fortnightly具有强大的搜索功能，可以快速让读者获得所需的内容。 点击搜索图标后，会出现一个带有搜索条目字段和热门标签的全屏对话框。 输入搜索词后，结果将显示在全屏对话框中。

选择搜索结果或对话框关闭按钮时，对话框将关闭。

在Fortnightly搜索

 

关键词：h5页面参考 h5是做什么的 h5编辑页面

↑ 回到顶部