AXURE 中分类,关于分类显示的实现效果(以电商 商城产品分类为例) 适合初学者

修涵
8 评论 14820 浏览 129 收藏 4 分钟
🔗 B端产品经理需要进行售前演示、方案定制、合同签订等,而C端产品经理需要进行活动策划、内容运营、用户激励等

实现后的效果是下面这样的:

2

这个做法:其实很简单:用动态面板的方法.现在一步步截图给大家:

3

做一个基础的,先做好左边大的分类(上图 3)

4

做一个详细分类的动态面板。(上图4)

5

动态面板含4种状态(上图5)

6

服饰鞋包(上图6)

7

美容护肤(上图7)

8

运动户外(上图8)

9

家具用品(上图9)

如果你要问我,那个形状是怎样形成的,用矩形。实在不行就用直线。

10

用这种加直线的方式可以组合(上图10)

下面我们来看下逻辑

鼠标移入某个分类,就让某个分类的详细分类显示出来,所以我们将详细分类的(4个状态)动态面板覆盖在上面,并隐藏。如下图步骤:

1、设置每个大分类的交互,即鼠标移入某个大分类,就显示这个大分类的小分类(动态面板对应的状态),然后等待多长时间后,自动隐藏小分类(动态面板)

11

12

详细的交互,以服饰鞋包为例(上图11   12其它分类,也同样的方法添加同样的交互)

将我们之前做好的动态面板,覆盖分类上面,并隐藏。

13

隐藏是黄色的(上图13)

这样能运行就实现啦!试试看吧!

 

本文由 @Suha 原创投稿,并经人人都是产品经理编辑。未经许可,禁止转载。

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 既然想做的详细,那我这有个复杂的需求你看能解决吗:“当鼠标指向大分类时显示了小分类,这时鼠标指向小分类,小分类依然显示,然后鼠标指向空白的地方,小分类马上消失。” 这个功能我想了挺久没想出来咋整,就最后一步:“鼠标从小分类里任意时间移走,小分类能马上消失”这个功能 不好整

    来自北京 回复
    1. 我就是在找这个,也是想了好久不知道怎么去实现

      来自广东 回复
    2. 我已经做出来了,要用动态面板。给动态面版两个动态,动态1.隐藏小分类,动态2显示小分类。大分类设置鼠标移入时显示动态面板2 移出时显示动态面板1

      来自北京 回复
    3. 我也遇到了这个问题 具体应该怎么取实现呢?在线等

      来自山东 回复
  2. 有更简单的?介绍一下

    来自上海 回复
  3. 说着的……做这么细致并没有什么实际用途……

    来自江苏 回复
  4. 做麻烦了

    来自广东 回复
    1. 介绍一下简单的

      来自北京 回复
专题
14408人已学习12篇文章
行业总是处于动态变化之中,那么,处于大环境下的产品经理应当如何规划好自身、选择合适的工作方向呢?本专题的文章分享了产品经理的职业方向和规划。
专题
14945人已学习14篇文章
用户生命周期是每个产品经理都必须要注意的一个点,它能够衡量用户对产品产生的价值,也是运营手段的最终衡量指标。本专题的文章分享了如何做好用户生命周期管理。
专题
18186人已学习15篇文章
本专题的文章分享了Android和iOS在产品、设计、交互等方面的差异。
专题
14405人已学习11篇文章
本专题的文章分享了收银台功能设计的流程以及过程中需要注意的问题等等。
专题
13649人已学习12篇文章
追热点蹭热点是互联网相关从业人员的一种潜意识,尤其是运营岗、市场岗。本专题的文章分享了如何做节日营销。
专题
12478人已学习12篇文章
在各大产品中,都离不开会员体系的建立,那么会员权益模块产品该如何设计?本专题的文章分享了会员权益设计的思考