产品原型图介绍
会议OA项目原型图的目的及意义...
界面
排版
菜单栏:软件相关设置
工具栏:常用便捷操作
页面:软件功能菜单界面
概要区域:页面中包含的所有组件
元件:页面元素组成
母版:相当于PPT模板,适用于所有页面的统一版面
菜单栏
菜单栏-文件
菜单栏-编辑、视图
默认是没有网格线的
菜单栏-发布
菜单栏-其他功能
ctrl+9 回到x=0,y=0的位置
工具栏
工具栏操作详解
选择模式:交叉选中、包含选中
链接:连线
插入:图形
顶层、底层
组合、取消组合
居中+垂直:垂直平均分布
中部+水平:水平平均分布
页面区
页面区域操作详解
文件夹的管理
页面的管理
生成流程图:主要是里面的页面元件包含关系
概要区
概要区域操作详解
能看到当前页面所有的概要元件,因为部分元件因为层级关系(上层、下层呈现遮挡问题)
元件区
元件库面板操作
对外公开的元件库、自定义元件(通用的元件)
母版
母版区域操作
重复使用的元件做成母版,引用的地方都会一同改变,如head.jsp
元件库可以跨rp文件使用,母版不能跨rp文件使用
交互区
交互面板操作
交互面板包含了事件及交互样式
- 添加单击效果
- 添加双击效果
样式
样式面板操作
主要设置元件本身相关样式,也可以设置交互样式
说明区
说明编辑区功能特点
备注说明
元件
默认元件
...
表单元件
...
菜单元件
...
标记元件
...
重点掌握
1.热区&动态面板
热区通常作用有两个:当前页面定位留白,置于图片顶层添加事件
动态面板:设置不同状态,用于场景切换,如轮播图
2.内联框架&中继器
3.表单元件
...
4.菜单表格元件
...
5.标记元件
...
相关案例
案例1:轮播图
案例2:封装一个通用的元件,如手机顶部界面,搜索栏,底部按钮
案例3:导入公开的开放的通用设计元件库
案例4:后台管理系统的布局页面页眉页脚
轮播图
封装一个通用的元件,如手机顶部界面,搜索栏,底部按钮
注意:一个.rplib文件中可以放多个自定义元件
导入公开的开放的通用设计元件库
原型图设计页
打开第三方元件库,可以二次编辑