查找常用列表页面列表页面是PM原型最容易键入的页面类型。你如何快速绘制和展示互动？

我们将从具体示例开始，以说明技术和各种演变场景。我希望主要的PM可以通过这篇文章改进他的画作。

列表页面基本上由页面框架，上部导航和内容区域列表组成。最重要的部分是今天文章的重点是列表部分。

它可以是文本列表，图片列表，图片列表，表单列表，单选按钮列表等。

绘制列表页面的基本步骤是什么？

1首先绘制页面框架

2再次在导航上画画

3最终图纸清单

绘图列表的常见绘图样式是什么？

让我们仔细看看应该如何绘制不同的列表项。

首先根据需要绘制一个列表项。

然后选择列表项并复制它。

然后将其粘贴到下方并捕捉到第一个列表项。

通过类比，您可以多次重复它。

你如何快速绘制完全相同的列表项？

完全相同的列表项表示除了字段值之外的值不同。

这样的列表项与中继器一起使用非常麻烦。

如何绘制由多个列表项组成的表单？

使用矩形框+文本组件，组合并复制粘贴。最后，修改了副本。

还建议制作通用列表项和其他组件，创建自己的组件库，然后逐个调用和修改名称。有兴趣的朋友可以试试我的汇总方法《高级PM教你定制APP通用元件库》

当然，如果您只绘制线框，请不要考虑交互。然后使用转发器是最麻烦的，添加，删除和修改非常方便。

如果列表项中存在一些差异，如何绘制？

一般来说，差异是列表项右侧的输入区域。您可以将公共部分绘制为列表项，并且区别是单独绘制的。这很有效。

例如，名称行应为矩形+文本框。

例如，性别行应该是矩形+单选按钮。

文件类型，性别相同。

身份证号码，同名。

此外，同一个应用程序中的列表框没有很多样式，因此建议将其添加到组件库中。

为什么列表项不使用主打印？

虽然master也可以用作列表项。但这种页面是一次性的，不适合主人。主设计的初衷是使用多个页面而不是同一页面。

您可以抽象出一致的部分来制作主人。只是主人不适合这个相同的页面场景。

顺便说一句，我的方法不仅仅适用于Axure。墨刀，小飘，mockplus试试看。

您需要为常见列表项使用多少个组件？

有人说：二，矩形，文字框。

有人说：三，矩形，文字标签，文字框。

事实上，是的，一般来说，使用两个组件就足够了，节省了便利。少用一个的技巧是在矩形中写一个矩形来表示列表项的标题。

绘画原型将省力且易于修改。要制作这样的列表项目，图3并不太累，但业务往往需要做3-5，这会浪费时间。此外，如果您需要修改，花费的时间将是两倍。

什么时候需要为列表项使用3个组件？

当两个不能满足时，使用三个，如下面的场景。

例如，矩形和标题具有不同的逻辑。

例如，矩形和标题具有不同的相互作用。

例如，列表项的标题是图标+文本。

还有一种情况，就像墨刀支架一样，显示原型的视觉注释，并推荐三种。

总结

以上是我总结的各种列表项目场景的绘制方法。我希望刚开始的PM能够理解这些技能。而不是盲目地去努力工作，而不是寻找捷径。

专栏

浪子，商业总监，浪子PRD系列51prd.com，公众号langzisay

本文最初由@浪子发表。未经许可，禁止复制。

该地图来自unsplash，基于CC0协议

« 设计规范是否限制了设计创意？ | 如何设计合格的LOGO？ LOGO Design Network为您提供答案！ »