请选择 进入手机版 | 继续访问电脑版

产品设计

    今日:34| 主题:18369
收藏本版 (1)
软件产品、PC、移动、网站、平台的开发、策划等内容。

[其他] 金融类App交互与视觉设计规范二

[复制链接]
死挣扎! 发表于 2016-10-17 10:43:06
281 2

立即注册CoLaBug.com会员,免费获得投稿人的专业资料,享用更多功能,玩转个人品牌!

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
本编主要详解移动端UI组件的交互与视觉规范
  UI组件交互与视觉设计规范
  按钮 Button
  按钮由文字和/或图标组成。
  按钮文字必须预示点击后的内容,且符合使用者的预期。
  按钮的文案应该把该操作说清楚,且不啰嗦。包含语意的按钮,例如「确认提交」比「确定」要好
  1)常规按钮
  按钮的设计应当和应用的颜色主题保持一致。
   

金融类App交互与视觉设计规范二

金融类App交互与视觉设计规范二

  关键操作按钮
  Call To Action button(下称CTA)
  当页面中的 CTA 按钮随着页面滚动消失在用户视野中时,该操作将出现在页面底部,并保持锁定。此动画可逆。
  CTA 按钮建议使用色块按钮。
   

金融类App交互与视觉设计规范二

金融类App交互与视觉设计规范二

  文本框 Text field

  文本框可以让用户输入文本。
  它们可以是单行的,也可以是多行的。点击文本框后显示光标,并自动显示键盘。
   

金融类App交互与视觉设计规范二

金融类App交互与视觉设计规范二

  吐司  Toast

  吐司是用来做通知的组件,告知用户眼下发生了什么,内容应该轻量,just come and go。
  如果通知内容需要常驻在界面上,应该使用通知栏。
  吐司从样式上分为两类:常规吐司与带图标的吐司
   

金融类App交互与视觉设计规范二

金融类App交互与视觉设计规范二

  对话框 Dialog

  对话框用于提示用户做决定,或者是完成某个任务时需要的一些其它额外的信息。
  所有的对话框都是模态对话框。对话框只能通过点击操作按钮关闭,不允许点击遮罩区域关闭,以确保用户看到当前的内容。
  对话框从页面底部向上升起,操作区域保持在页面下部,即用户单手操作的舒适区域。
   

金融类App交互与视觉设计规范二

金融类App交互与视觉设计规范二

  下一遍将详细介绍特殊情况下的规范



上一篇:BOSS直聘、前程无忧、智联招聘竞品分析报告
下一篇:步步为营:关于产品规划
ckiy7tOc 发表于 2016-10-17 13:41:38
LZ敢整点更有创意的不?兄弟们等着围观捏~
回复 支持 反对

使用道具 举报

刘鑫 发表于 2016-10-19 15:19:40
支持楼主,用户楼主,楼主英明呀!!!
回复 支持 反对

使用道具 举报

*滑动验证:
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

我要投稿

推荐阅读

扫码访问 @iTTTTT瑞翔 的微博
回页顶回复上一篇下一篇回列表
手机版/CoLaBug.com ( 粤ICP备05003221号 | 文网文[2010]257号 )

© 2001-2017 Comsenz Inc. Design: Dean. DiscuzFans.

返回顶部 返回列表