1. 主页 > 网络营销 >

Web后台产品的详情页规范

编辑导语:Web靠山产物的详情页凡是是表单页的查察结果,PM常常碰着,那么画它的时候遵循哪些常见类型呢?本篇文章作者具体先容了Web靠山产物的详情页类型,我们一起来看一下。

Web靠山产物的详情页类型

Web靠山详情页主要由字段名和字段值构成,按照需求也会包括图片,链接,附件等元素;各人可以看看作者利用类型画出来的详情页是否较量简捷整齐。

一、实现类型

对付完全由字段名和字段值构成的详情页,发起回收Axure的表格元件来画原型,简朴快速;结果如下图。

操纵步调:从默认元件库中拖动“表格”到事情区符合位置,然后第一列填充相应的字段名,第二列填写相应的字段值,最后删除多余的第三列即可。

Web靠山产物的详情页类型

假如详情页尚有图片、链接、附件等元素。发起回收Axure的文本元件来画原型,适应性较量强;结果如下图。

操纵步调:先画字段名,从默认元件库中拖动“文本标签”到事情区符合位置然后双击输入名称;再画字段名,从默认元件库中拖动“文本标签”到事情区符合位置然后双击输入名称。

留意:字段值有时候需要选择图片/文字链接等其他Axure元件。

Web靠山产物的详情页类型

二、间距类型

字段间距需要保持一致(可能担保相邻字段的纵坐标差值),这样整体的显示结果会较量好。

假如字段回收默认的文本元件,发起字段间距回收10px。具体步调详见作者旧文 Axure如何调解线框图的对齐细节。

操纵步调:按照需求拖动相应的字段值,Axure自动显示相邻间距,然后逐步调解到符合的间距;可能本身按照第1个字段值的Y坐标+间距,从而得出第二个字段值的Y坐标。

Web靠山产物的详情页类型

三、对齐类型 1. 字段名对齐类型

字段名有长有短,发起节制在3~6字以内,这样的展示结果会较量好。

由于有多个字段,所以需要遵循相应的对齐类型,凡是是左侧对齐,有时候也会选择右侧对齐,可是居中对齐是不符合的。

字段名左对齐结果:

操纵步调:按住Ctrl同时选择所有的字段值然后点击常用东西栏的“左侧对齐”按钮,然后再修改X坐标到符合位置。

Web靠山产物的详情页类型

字段名右对齐结果:

操纵步调:按住Ctrl同时选择所有的字段值然后点击常用东西栏的“右侧对齐”按钮,然后再修改X坐标到符合位置。

Web靠山产物的详情页类型

2. 字段值对齐类型

字段值有长有短,别的字数无法节制在必然范畴内,所以不适合回收右侧对齐类型,只能回收左侧对齐类型;展示结果详见上面2张图。

给各人看一下右侧对齐的后面案例结果,相信有必然审美的PM都不会如此设计。

Web靠山产物的详情页类型

三、链接类型

Web详情页的凡是有文字链接、图片链接、附件链接、视频链接;他们需要遵循差异的交互类型。

1. 文字链接

文字链接发起利用蓝色字体,悬停显示下划线。

操纵步调:点击该文本链接,配置鼠标单击时事件,添加行动“打开链接”,然后选择打开在“通过新标签页打开”(有时候也回收原标签页打开),然后链接到相应的页面。

别的需要在交互样式——鼠标悬停的样式,点击勾选“下划线”。

Web靠山产物的详情页类型

2. 附件链接

附件链接发起利用图标+蓝色文字暗示,点击附件链接自动下载到当地。

操纵步调:点击该文本链接,配置鼠标单击时事件,添加行动“打开链接”,链接到“链接到URL或文件路径”;然后输入相对的当地路径,最后选择在当前窗口打开,文章开头的原型地点中可以体验相应的交互进程。

Web靠山产物的详情页类型

相关文章:

Web靠山产物的表单页类型

Axure如何调解线框图的对齐细节

#专栏作家#

荡子,小我私家微信langzipm,公家号:荡子画原型(langzisay)。专注于APP原型设计和产物类型。

本文由摸索网(http://www.lnmosuo.com)发布,不代表摸索网立场,转载联系作者并注明出处:

联系我们

工作日:9:30-18:30,节假日休息