新闻APP首页原型图制作
作者:暂无发布时间:2019年11月07日 11:39

1、本课主要内容如图示。


2、原型图绘制的思路方向,具体图解如图示。


3、[打开]Axure软件,[新建]任意大小的界面。具体效果如图示。


4、在元件库[拖出]矩形框,调整至手机大小,具体尺寸如图示。具体效果如图示。


5、根据设计思路[拖入]矩形框,高度为44PX,放置状态栏位置。具体效果如图示。


6、[选择]矩形框,添加[描边]。[拖入]文字标签,输入时间,调整时间大小,排列至状态栏合适的位置,[拖入]矩形元件,调整大小和颜色,排列至合适的位置。具体效果如图示。


7、按Alt键[拖动复制]矩形框,[填充]白色,排列至下方合适的位置。[拖入]文字标签,输入文字,调整大小排列至合适的位置。具体效果如图示。


8、[拖入]矩形框,调整大小和颜色,排列至标题栏上方合适的位置。根据设计思路,[拖入]十字形Icon图标,调整大小,排列至合适的位置。具体效果如图示。


9、根据设计思路,[拖入]标题标签,输入文字,调整文字大小排列至合适的位置。[拖入]矩形元件,调整大小和属性,排列至合适的位置。具体效果如图示。


10、根据设计思路,[拖入]矩形元件,调整大小,放置合适的位置。[拖入]文字标签,输入关联文字信息,调整文字大小,排列至合适的位置。具体效果如图示。


11、[拖入]椭圆形元件,调整大小,排列至合适的位置。根据设计思路,绘制关闭按钮。具体效果如图示。


12、[拖入]水平线元件,调整宽度375PX,排列至合适的位置。根据设计思路,按Alt键[拖动复制]至合适的位置,调整大小340PX。具体效果如图示。


13、[选择]标题文字关联对象,按Alt键[拖动]复制至下方合适的位置,根据设计思路,调整排列版式和内容信息。具体效果如图示。


14、根据设计思路,[拖入]矩形元件,调整大小,绘制指示器图标,排列至底部合适的位置。具体效果如图示。


15、根据设计思路,[拖入]矩形元件,调整大小,排列至标签栏位置。[拖入]椭圆元件绘制椭圆,调整大小,排列至标签栏上方合适的位置。[拖入]文字标签,输入对应的文字信息,调整大小,排列至合适的位置。具体效果要如图示。


16、[选择]顶部关联对象,按[Ctrl+G]编组,右击[转换为母板]。[重命名]页面为首页,[单击]page2,[重命名]新闻,[双击]进入编辑页面。具体效果如图示。


17、使用相同的方法,[拖入]矩形元件,调整矩形大小。[拖入]母版元件,排列至顶部合适的位置。具体效果如图示。


18、使用相同的方法,根据设计思路,[拖入]合适的元件对象,调整属性和大小,排列至画面合适的位置。具体效果如图示。


19、单击Page3,[重命名]我的。[双击]进入编辑页面,使用相同的方法,根据设计思路绘制版面信息。具体效果如图示。


20、[返回]首页,[选择]新闻关联信息,按[Ctrl+G]编组,单击[属性]-[添加用例]-[鼠标单击时],单击[创建链接],[选择]新闻页面。具体参数如图示。



21、[选择]新闻页面,[选择]返回按钮,单击[属性]-[添加用例]-[鼠标单击时],单击[创建链接],[选择]首页。具体参数如图示。

点击观看视频教程
UI-新闻APP首页原型图制作
初级练习30729人已学视频时长:39:10
立即学习
特别声明:以上文章内容仅代表作者本人观点,不代表虎课网观点或立场。如有关于作品内容、版权或其它问题请与虎课网联系。
500+精品图书
20G学习素材
10000+实用笔刷
持续更新设计模板
立即领取

下载虎课APP

随时随地学技能
APP更方便
每天免费学课程
下载虎课网APP
随时随地学海量会员教程
特惠
充值
7折购
今日还在继续学习的你,太棒了!
7
折扣券可用于
年费无限VIP
立 即
使 用
此活动优惠不可与其他活动叠加使用
有效期:000000
消息
登录即可查看消息记录
建议
意见
官方
客服
在线咨询客服热线

您可以与在线客服进行沟通获得帮助

工作日:9:00~22:00节假日:9:00~18:00

联系在线客服

您可以电话联系客服进行沟通获得帮助

工作日:9:30~18:30

400-862-9191
虎课
积分
免费学习89000+个教程!
配套素材、源文件一键下载!
昨日学员已学习了27,078
并提交了210份作业!
登录后立即学习!
loading
微信扫码关注即可登录
您需要同意协议才可以进行登录
登录虎课网,每天免费学课程全站 89000+ 视频会员教程 | 每日可免费学 1
为确保账户信息安全
请先进行真实姓名验证后进行充值付款
立即验证