V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
设计师推荐装备
WACOM 数位板
推荐阅读
版式设计基础教程 by 南云治嘉
版式设计全攻略 by 佐佐木刚士
orcx
V2EX  ›  设计师

iOS social类app三栏设计寻求突破

  •  
  •   orcx · 2012-11-07 15:41:16 +08:00 · 4135 次点击
    这是一个创建于 4383 天前的主题,其中的信息可能已经有所发展或是发生改变。
    Path,facebook一大票采取三栏设计,左滑导航,中间对应的feed流,右滑对应feed流的人或组列表,整体横向都是内容贯穿的,用起来确实tmd舒服且有逻辑。这是最优的设计吗?思维被禁锢了,寻解放!


    残念一:上下栏设计,顶栏下拉按钮出导航,点击上滑,出feed流,顶栏组按钮,再从下到上滑出用户列表? (自己都觉的垃圾!)

    残念二:ios app底部导航

    残念三:类linkedin,google+ 弹出个类似9宫格导航

    二、三都得割裂用户列表和feed列表。

    大家讨论下。

    p.s 这个贴这里没错吧
    7 条回复    1970-01-01 08:00:00 +08:00
    summic
        1
    summic  
       2012-11-07 15:57:20 +08:00
    目前三栏设计的缺点是什么?有什么不爽的地方么?
    orcx
        2
    orcx  
    OP
       2012-11-07 16:12:06 +08:00
    @summic 就是很爽啊,但不能都长一样啊。要不又说抄袭了,呵呵
    Keinez
        3
    Keinez  
       2012-11-07 16:51:55 +08:00
    版式是为内容服务的。

    Path, FB这样的网站/应用,需要在功能/feed/不同人的feed之间切换,三栏设计无可厚非。(当然你也可以根据自己需要写个两栏/四栏的style)

    我用微博就是一直用的两栏……什么?你说有三栏不用?开了三栏其实多了很多没用的东西好吧……

    Twitter也是两栏。

    ***
    至于上下左右的问题,还是和内容有关。网页的使用,你是自上而下浏览的(基本上),所以基本的布局单元是栏。
    一般来说你不会见到有哪个网页会把导航栏放底下。因为屏幕的大小和浏览器习惯决定了你不可能第一时间看下面。

    换成报刊/书籍/杂志的话,情况又不一样。因为翻书是从左往右(请无视日本人),自上而下阅览,而且不会有什么杂志比22寸屏幕还大。自然内容的排布就宽松许多。布局可以是栏为主,也可以是行为主。
    你可以大大方方的把标题放左下角来吸引视觉,然后再规规矩矩的排版。

    再来说手机。因为触屏的关系(你用黑莓?当我没说),切换页面的方式有了更多变化,不仅仅局限于鼠标滚轮/手指翻页,你可以用一根手指,或者两根,或拖动或按住……等等,来完成页面切换。
    So布局你可以分栏,分行,甚至划分成真正的网格布局。
    所以你大可以把主导航/主要浏览方式放在手指够得到的地方,其他地方放内容,甚至不一定放在『看得到的地方』——你需要滑一下手指才能看到其他的东西。

    似乎跑题了?不过还是希望对你有帮助。说了这么多只想表达,割裂还是不割裂,其实和使用方式是息息相关的。
    kkdexl
        4
    kkdexl  
       2012-11-07 16:54:30 +08:00
    顶栏下拉按钮出导航 这个系统决定这无法实现 你下拉一定出现的是通知窗口
    alexrezit
        5
    alexrezit  
       2012-11-07 16:54:34 +08:00
    Google+ 的交互就是屎一样的.
    orcx
        6
    orcx  
    OP
       2012-11-07 17:19:09 +08:00
    @Keinez 看得出来你也非常喜欢这种三栏设计,解释的也很明白,一切就是那么顺其自然。这也是我的感受,也是我困惑的地方,就是是否还有更好的体验设计?


    @kkdexl 你可以挂个球下拉啊,呵呵
    alexrezit
        7
    alexrezit  
       2012-11-07 17:22:30 +08:00
    @orcx
    @kkdexl
    下拉的可以参考这个: http://appfn.com/mailr
    貌似是最近刚出的非官方豆邮客户端.
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5108 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 03:50 · PVG 11:50 · LAX 19:50 · JFK 22:50
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.