各类终端原型设计尺寸参考 – Axure中文学习网

您所在的位置:网站首页 手机页面宽多少 各类终端原型设计尺寸参考 – Axure中文学习网

各类终端原型设计尺寸参考 – Axure中文学习网

2024-03-28 19:31| 来源: 网络整理| 查看: 265

大家在开始设计原型时,新手都是比较纠结,我们的原型尺寸应该设置多少合适。

下面将分享不同设备的设计尺寸仅作为参考,在实际设计时可以根据业务需要进行调整。另外,设计尺寸一般只限定宽度,不限高度,高度是随着内容自动变化的,预览时则可以滚动查看。

一、各类终端原型设计尺寸标准

类型 原型尺寸  内容尺寸 左右留白 顶部栏 底部栏 侧导航 WEB端网站类 1920px 1200px 360px 48px 无 无 WEB端中后台 1920px 1664px 24px 48px 208px 苹果移动端 375px 351px 12px 44px 49px 安卓移动端 360px 336px 12px 44px 49px IPAD移动端 1024px 1000px 12px 48px

二、设计建议

1、WEB端网站类系统设计时,可以将顶部导航、页脚转为母版,母版便于后期的维护和快速修改。通过【页面载入时】交互事件,设置对应菜单为选中,即可以设置导航菜单的选中效果。

2、WEB端中后台系统设计时,可以将顶部导航和侧导航抽离出来单独放一个页面,其他页面只剩下右侧页面内容,只需要用内联框架元件链接对应页面即可。即给导航添加,点击事件,选择内联框架中打开对应页面。

3、移动端设计时,同样可以将公共组件抽离为母版,统一管理。如状态栏、标题栏背景、底部栏,图标、按钮等元件,便于后期修改主题样式。

在工作中,我们可以将我们的原型页面抽离成组件维护管理起来,制定相关交互规范及UI样式规范,便于后期团队成员的协作配合、约束统一不同项目原型间的规范,也提高原型绘制效率和页面开发效率。

三、Axure样式面板升级

Axure8软件右侧的样式面板只有排版、背景色等功能。

各类终端原型设计尺寸参考

Axure9则增加了页面尺寸这个功能,便于用户快速设置原型页面尺寸,并提供多种设备尺寸参考,我们可以根据自己的爱好,选择自己喜欢的原型尺寸。

各类终端原型设计尺寸参考



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3