•   

    搬动修设端交互界面UI安排案例解析

      

    搬动修设端交互界面UI安排案例解析

      

    搬动修设端交互界面UI安排案例解析

      智慧社区交互终端包含功能 系统功能 当前 时间 天气 预报 屏保 广告 新闻 头条 已明确二级栏 目 政务 公告 物管通 畅游 常州 投资 理财 图览 龙城 缴费 查询 价比 三家 出租 出售 交互界面用户操作 ? 点击作为基础,滑动作为辅助的操作方式 向右滑动:返回上级目录 向上滑动:翻看下一页内容 点击:进入相应界面 向下滑动:翻看上一页内容 左滑动:切换子栏目目录 屏保广告形式 视频播放窗口,尺寸1080*635 天气预报 显示日期及时间 1. 屏保大图由前端发 布,可设定每隔*秒 切换至下一张图 2. 切换过程为从右向 左滑入方式 3. 屏保模式下不响应 用户触摸操作 广告图片区域,从系统 端某固定位置获取,得 到该组共*张,每*秒自 动更新 首页 屏幕尺寸:1080*1920 天气及时间显示区域, 单独背景颜色 天气预报 1. 背景图片,可按时 间、天气等一定规 则自动更换 2. 图片内容取自系统 端某固定位置 视频播放窗口,尺寸1080*635 显示日期及时间 1. 七巧板为功能菜单按钮,点击从该位 置展出所有二级功能菜单(后有示意 图) 2. 首页七巧板以2秒周期自动晃动,提 示用户此处可点击操作 栏目名称显示区,首页下显示 “欢迎来到智慧社区”,二级栏 目下显示二级栏目对应图标(后 有示意图) 平铺二级界面入口,其中某些固定栏目 (新闻头条、图览龙城、投资理财)每5 秒自动刷新各栏目内最新5条图文内容 (参考WIN8界面效果) 广告图片区域,从系统 端某固定位置获取,得 到该组共*张,每*秒自 动更新 首页-2 1. 首页二级界面平铺展 示区在一屏内平均分 为A、B两部分,同样 第二屏乃至更多屏内 容也将均分(C、D等) 2. 用户向右滑动一次屏 幕,则显示B、C部分 内容,再滑动一次则 显示C、D部分内容, 以此类推 3. 若目前只有A、B、C 三部分内容,则界面 只会出现A&B、B&C 的组合形式 4. 滑动至尽头再向相同 方向滑动不响应 5. 滑动过程需要有过场 效果 屏幕尺寸:1080*1920 功能菜单——导航栏 栏目图片,展示当前用户处于哪个栏目 下 1. 七巧板为功能菜单按钮,点击后从该 位置展出导航栏 2. 此时七巧板仍处于自动晃动状态 3. 再次点击,从七巧板位置收回导航栏 点击导航栏中某栏目,则 先向导航栏回收至七巧板 内,再进入对应二级栏目 首页 1. 导航功能栏由七巧板处展开,要有动 态效果 2. 导航栏列出全部二级栏目,左右滑动 可滚动显示(不可循环) 3. 导航栏区域采用95%不透的形式,叠 加在底层内容之上显示 4. 在导航栏出现的情况下,点击导航栏 区域外部分,导航栏回收至七巧板处 新闻头条 栏目图片,展示当前用户处于哪个栏目 下 返回至首页 翻看下页内容 翻看上页内容 无响应 1. 每页显示4条新闻内容,点击进入新 闻详情页 2. 新闻采用图片+标题的形式呈现 3. 新闻图片及标题内容从新闻栏目中获 取,若该条新闻无图片,则从固定位 置获取该栏目默认图片 4. 从下向上滑动屏幕,从该区域中间采 用杂志上翻页形式半屏翻动更新至下 页内容 5. 从上向下滑动屏幕,下翻页更新上一 页内容(不可循环) 6. 翻页过场如需加载,显示LOADING 过度界面 新闻详情 返回至上一级 翻看下页内容 翻看上页内容 无响应 1. 新闻详情采用新闻标题+图片+正文 的形式呈现 2. 从下向上滑动屏幕,从该区域中间采 用杂志上翻页形式半屏翻动更新至下 页内容 3. 从上向下滑动屏幕,下翻页更新上一 页内容(不可循环) 4. 翻页过场如需加载,显示LOADING 过度界面 政务公告 栏目图片,展示当前用户处于哪个栏目 下 返回至首页 翻看下页内容 翻看上页内容 无响应 1. 每页显示4条政务公告内容,点击进 入政务公告详情页 2. 政务公告采用标题+图片的形式呈现 3. 政务公告图片及标题内容从政务公告 栏目中获取,若该条新闻无图片,则 从固定位置获取该栏目默认图片 4. 从下向上滑动屏幕,从该区域中间采 用杂志上翻页形式半屏翻动更新至下 页内容 5. 从上向下滑动屏幕,下翻页更新上一 页内容(不可循环) 6. 翻页过场如需加载,显示LOADING 过度界面 政务公告详情 返回至上一级 翻看下页内容 翻看上页内容 无响应 1. 政务公告详情采用标题+图片+正文 的形式呈现 2. 从下向上滑动屏幕,从该区域中间采 用杂志上翻页形式半屏翻动更新至下 页内容 3. 从上向下滑动屏幕,下翻页更新上一 页内容(不可循环) 4. 翻页过场如需加载,显示LOADING 过度界面 图览龙城 栏目图片,展示当前用户处于哪个栏目 下 返回至首页 翻看下页内容 翻看上页内容 无响应 1. 每页显示4条图片内容,点击进入图 片详情页 2. 从下向上滑动屏幕,从该区域中间采 用杂志上翻页形式半屏翻动更新至下 页内容 3. 从上向下滑动屏幕,下翻页更新上一 页内容(不可循环) 4. 翻页过场如需加载,显示LOADING 过度界面 图片详情 返回至上一级 翻看下页内容 翻看上页内容 1. 图片详情采用图片+描述的形式呈现 2. 从下向上滑动屏幕,从该区域中间采 用杂志上翻页形式半屏翻动更新至下 页内容 3. 从上向下滑动屏幕,下翻页更新上一 页内容(不可循环) 4. 翻页过场如需加载,显示LOADING 过度界面 无响应 物管通 栏目图片,展示当前用户处于哪个栏目 下 返回至首页 翻看下页内容 翻看上页内容 无响应 1. 每页显示4条物管内容,点击进入详 情页(与新闻头条相同) 2. 物管内容采用标题+图片的形式呈现 3. 图片及标题内容从物管通栏目中获取, 若该条新闻无图片,则从固定位置获 取该栏目默认图片 4. 从下向上滑动屏幕,从该区域中间

      移动设备端交互界面UI设计案例分析_互联网_IT/计算机_专业资料。智慧社区交互终端包含功能 系统功能 当前 时间 天气 预报 屏保 广告 新闻 头条 已明确二级栏 目 政务 公告 物管通 畅游 常州 投资 理财 图览 龙城 缴费 查询 价比

    上一篇:

    下一篇:

    信息交互
    交互屏幕案例
    2019-10-05 15:29
    阅读数 2881
    评论数 1
I'm loading
 家电维修|北京赛车pk10