中国电信翼校通业客户端UI设计要求--优化版-副本讲述.doc

YD/T 200×—×××× YD/T 200×—×××× PAGE  PAGE I 保密等级：公开发放 中国电信集团公司 发布 2011-××-××实施 2011-××-××发布 中国电信翼校通客户端UI设计要求 （修订稿） Q/CT X-2011 中国电信集团公司企业标准 Q/CT X—2011  PAGE \* MERGEFORMAT 9 目??次 TOC \o 1-3 \h \z \u   HYPERLINK \l _Toc335062889 目次  PAGEREF _Toc335062889 \h I  HYPERLINK \l _Toc335062890 1 基本要求  PAGEREF _Toc335062890 \h 1  HYPERLINK \l _Toc335062891 2 Logo应用规范  PAGEREF _Toc335062891 \h 1  HYPERLINK \l _Toc335062892 3 登陆界面规范  PAGEREF _Toc335062892 \h 1  HYPERLINK \l _Toc335062893 4 主界面规范  PAGEREF _Toc335062893 \h 3  HYPERLINK \l _Toc335062894 5 信息列表页规范  PAGEREF _Toc335062894 \h 4  HYPERLINK \l _Toc335062895 6 详细内容页规范  PAGEREF _Toc335062895 \h 6  HYPERLINK \l _Toc335062896 7 导航设计规范  PAGEREF _Toc335062896 \h 7  HYPERLINK \l _Toc335062897 8 操作设计规范  PAGEREF _Toc335062897 \h 7  基本要求 本设计要求是基于前期下发的《中国电信翼校通业务规范-客户端分册（试行）》一个集中平台的实例，各省客户端默认界面需以此UI为准。翼校通客户端主要以480*800分辨率为基础进行设计。 Logo应用规范 翼校通Logo a) Logo图标：集团市场部最终下发Logo图标如图A.1所示。 b）尺寸规范：为了便于识别，logo的最小尺寸不能小于100dip*120dip。 登陆界面规范 主要元素：LOGO，用户名输入框，密码输入框，记住密码选项，登陆按钮。 元素排列规范： 每一个元素独占一行，让用户从上到下流畅操作； LOGO和用户名输入框的最小距离、LOGO和屏幕顶部的距离均不能小于LOGO高度的1/4； Logo必须放置在顶部，其他元素位于其下方。 登录界面规范布局图 登录界面效果图 主界面规范 主要元素：个人信息区、应用图标区。 个人信息区： 包括个人的头像、名字等信息，位于顶部。 应用图标区： 应用图标区展现客户端所具备的各项功能的图标，占据屏幕主要显示区域； 应用图标区按功能分成三个栏目（家校互动、交流园地、特色应用）。每个栏目中的图标采取横向方式排列，每行3个： 家校互动——通知公告、家庭作业、成绩信息、日常表现、出勤记录、课表； 交流园地——班级成员、班级相册、家校微博； 特色应用——有道词典、全球眼、天翼阅读、网易公开课、百度知道、百度百科（以上应用是示例性说明，各省根据具体需求引入第三方应用，后期将进行优质教育应用的推荐）、更多应用（链接指向翼校通平台的教育资源与应用，建设完成后链接地址另文下发）。 操作方式：应用图标区超过一屏采用滚屏方式展现，左右滑动可切换栏目。 主界面规范布局图 主界面效果图 信息列表页规范 主要元素：标题导航区，列表区，菜单区。 布局规范： 内容区的屏幕边距不能小于10dip； 信息标题文字大于等于18dip，小于等于48dip，当字数总宽度超过内容区宽度时，超出文字省略，用三个点号代替； 每条信息的高度不能小于50dip。 信息列表页规范布局图 信息列表页效果图 详细内容页规范 主要元素：标题导航区，列表区，菜单区。 布局规范： 标题文字的字号和信息列表页的字号一样，自动换行，行距1.5em； 内容的文字大于等于12px，小于等于18px；行距1.5em。 详细内容页规范布局图 详细内容页效果图 导航设计规范 导航跳转 位于内页顶部，高度不能小于50dip。 功能切换栏 位于屏幕底部，按功能的数量来均分宽度，最多同时显示5个功能，超出时可通过对该栏左右拖动进行滚动。 操作设计规范 物理按键操作规范 Home键：返回手机桌面； Menu键：调出关联菜单； 返回键：返回前一页面； 单击：打开，导航。 手势操作