美文网首页交互设计
Form教程翻译(七)扁平化设计

Form教程翻译(七)扁平化设计

作者: 凌乐歌 | 来源:发表于2016-08-10 17:09 被阅读59次

扁平化组件是创建  符合扁平化设计要求的  原型的基础组件。patch库里面许多扁平化组件是组,可以进入组并进行自定义修改。下面是部分组件的描述,您可以查看库里面所有的扁平化组件。

部件Components

扁平化设计组件包括标题栏、多媒体卡片、浮动按钮、或其他扁平化元素,帮你快速建立扁平化风格的原型。

你可以使用扁平化调色板组件Material Color Palette Patch从扁平化色板里选择颜色,也可以用扁平化图标组件Material Icon Patch 直接从扁平化设计的图标套装里选择图标。

扁平化设计组件

运动Motion

扁平化设计组件也包括一些常用的运动曲线,同样适用于径向扩散形式的过渡。

运动曲线

扁平化视图Material View

扁平化视图提供了一个在扁平化设计规范中规定的扁平化卡片。形状可在矩形和圆形之间变化(通过调整圆角),具有阴影,并且可以响应带有涟漪效果的触摸交互。(本节图片丢失)

扁平化视图

相关文章

  • Form教程翻译(七)扁平化设计

    扁平化组件是创建 符合扁平化设计要求的 原型的基础组件。patch库里面许多扁平化组件是组,可以进入组并进行自定义...

  • Form教程翻译(六)组织Form文档

    本节原文教程 ------------- 保持Form文档的简洁和条理性非常重要,这能帮助别人更好的理解原型的逻辑...

  • Form教程翻译(三)交互

    本节原官方教程地址 ----------- 交互Interactions 交互组件处理用户在视图views中的输入...

  • Form教程翻译(二)视图

    本节原官方教程地址 ------------ 视图Views 视图用来在界面上显示内容。视图的属性有位置、尺寸等。...

  • Form教程翻译(五)设备

    本节原文教程 ----------- From能调用设备的许多特性。 相机拍照camera preview 拍照组...

  • Form教程翻译(一)基础原理

    (最近想要做一个交互demo,觉得principle很好用,逻辑和操作都很简单,但唯一的缺憾是不能加条件--当满足...

  • Form教程翻译(四)动效

    本节原教程地址 -------------- 过渡transition 过渡映射值的变化区间从input0-1到o...

  • Form教程翻译(八)简易组件

    本节原文地址 ----------- 简易组件simple patches使Form中的一些常用操作更简单和直观。...

  • 扁平化设计面面观

    扁平化设计# 以下内容由网络搜索整理,正文附部分原文链接。 1.什么是扁平化设计 扁平化设计:在进行设计的过程中,...

  • 分享个人体会到的国内网页设计的趋势--进行时

    ① 响应式的设计 ② 高清大图、视频的使用 ③ 拒绝过度设计 ④ 扁平化的设计--内容、设计扁平化 ⑤ 为大屏幕设...

网友评论

    本文标题:Form教程翻译(七)扁平化设计

    本文链接:https://www.haomeiwen.com/subject/pdpdsttx.html