菜单的表现方式——体验并列和包含的关系交互设计 -电脑资料

电脑资料 时间:2019-01-01 我要投稿
【meiwen.anslib.com - 电脑资料】

    在软件设计中尝试过很多菜单的表现形式,其中含义各不相同,随着表现形式的多样化,整理使用的方式也显得比较重要,

菜单的表现方式——体验并列和包含的关系交互设计

    一、预览样式

   

    可以看到操作系统或者操作软件都采用了这种表现方式,这种表现方式的优点在于可以很好的明确包含关系,上下级的显示较为清晰,在专属的行业软件中比较注重操作的上下级关系,使用频率是比较多的,例如软件的一级菜单下包含了多个二级菜单。当然这样的排列方式就多了一个烦恼,不能清晰的定义下级菜单的多少,会给排版带来不好的影响。

   

    如上图:当二级菜单在不之情的范围下,使用这样的预览模式,可能对二级菜单的样式控制造成不好的影响。甚至不得已的情况下撑破页面。特别是在商业的领域中,二级的种类更是不可控制的,所以它的使用就比较受限。

    二、“树”就是我们常用的列表试图

   

    树的应用一般是在数据量大时,嵌套关系比较复杂,在二层关系以上的情况使用较多,它具有很好的扩展性,能够明确的从主干看到树的基本内容或者分类属性。但是一般来说,它会伴随滚动轴的出现,所以网页中很少出现,目前我在看图软件和产品分类较多的情况下看到过。

    三、并列筛选

   

    就是说简单的连动,后面的选择是依据前面的选择结果而控制的。最多的情况应该就是出现在上图的方式中,

电脑资料

菜单的表现方式——体验并列和包含的关系交互设计》(http://meiwen.anslib.com)。但是也有一些网站是按照这样的方式进行筛选;这种方式限制用户的眼光是从左到右,逐个缩小筛选的范围,就像很多导航一样,先通过分类,再详细选择;它的优点是空间比较省哦,但是当层次比较多时,就难以应付了;从用户使用角度,距离用户最近的就是用户上一步选择的结果,这样就比较容易记忆,鼠标的移动范围也相对的较小,比较快捷。

   

    上图是并列筛选和下拉结合运用比较好的例子,但是使我比较模糊的是,它采用了并列的排版方式,省去了大量的空间,但是选择采用的却不是逐级缩小的关系。当用户点击“marke”时,是针对此类的筛选,似乎和后面的“farbe”等是并列的关系,是无级别关系的。

    四、目前使用较好的菜单表现关系(1)

   

    a点击前如上图排列

   

    b点击后如上图排列

    这种方式的好处是,一目了然,a让用户知道所有的分类,首页的效果就达到了,告诉用户这个网站给你提供了什么;由于每一项的二级层次种类较多,故使用了b的表现方式,中间用竖线间隔,进行合理的分类。

    五、目前使用较好的菜单表现关系(2)

   

    这个是目前拍拍和淘宝等多家c2c网站使用的方式,最多不能代表最好,个人认为从视觉上容易造成视觉上的疲劳;从数量上,滚动轴表现的范围有限制,对用户记忆造成了不便;从定位上,撤销上一步操作好像鼠标动作上有点不便。是不是可以引入国外的方法,进行结合处理呢?希望和大家一起探讨!

    来自:http://www.xibeidesign.cn/xibei/article.asp?id=54

最新文章