微信与QQ交互设计的一些思考

这几天简单研究了一下微信和QQ的交互设计，发现了不少有趣的点，下面分享我的一些想法。

首先是架构方面

微信使用的是底部导航栏，四个，分别是“微信”、“通讯录”、“发现”、“我”，然后上方的应用栏右侧有搜索和添加的图标。应用栏的内容是相对固定的，切换标签时不会变动。

对应的，QQ使用的是底部导航栏加上侧边栏，底边是“消息”、“联系人”、“发现”，侧边栏是个人相关的内容。跟微信基本一致，只是将个人相关的内容统一收进侧边栏里面。
另一个区别就是上方的应用栏，会根据下面的内容不同而变化，搜索功能也不是一个图标，而是在应用栏下方独占一行。

问题1：为什么QQ要使用侧边栏？或者说，为什么微信不使用侧边栏？
问题2：应用栏的使用，是应该与当前内容相关，还是放置一些全局的内容？

侧边栏的可见性确实差一点，特别是QQ中使用用户头像作为入口，不如按钮直接。但与微信相比，QQ的个人中心更有"感觉"。

首先是侧边栏自身所带来的空间感，就像打开一个属于自己的小天地，而此时侧边栏带来的可见性问题也变成了隐秘性好，让用户感觉这就是属于自己的一块地方，有自己的东西，像收藏、文件、钱包等。当然，这种感觉还需要视觉设计来渲染。另外，QQ的功能比较多，侧边栏也算是一个比较好的收纳方式，可拓展性和灵活性都比较好。

微信所表达的则是另一种情感，就是简洁。可以直接用底部标签搞定的事，为什么还要加上一个侧边栏，还要增加一个小空间。还有就是一致性，个人标签其实还是一个信息的集合，与其他标签没有本质的区别，所以也应该是一样的。

再来看看QQ上的分段控件，可以用其他方式代替吗？可以使用标签，或者将分段控件放置在应用栏下方，但是在只有两个分类的情况下，目前的设计还是比较合理的。那么这样一来，应用栏的右侧空间就不够放置“搜索”和“更多”两个图标。在两个功能都需要明显展示的情况下，因为搜索功能本身就要打开一个输入框，不如就直接放置在下面，也比较直观。

因为分段控件的分类只是针对“消息”标签，所以其他标签自然需要更换相应的内容。这里我不太理解的是，为什么除了“消息”标签，其他都将“更多”的图标换成文字按钮，而且只是一个单一的功能。
微信的应用栏则比较统一，有搜索和更多两个功能，在任何一个标签页都可以打开。

“更多”这个功能，其实就是一个溢出菜单，溢出菜单里面要包含什么功能，为什么要使用加号作为icon？有没有提供这些功能的其他入口？这里更多还是涉及到业务还有需求方面，就不展开说了。

接着来看聊天列表

包括聊天信息的展示，正常情况和有未读信息的情况，以及聊天信息的操作，长按或手势。（个人聊天列表不太好贴出来，大家基本都有使用，就不贴图了）

第一个差异是头像的形状，QQ是圆形，微信是方形。与之相关的区别就是，QQ的群组是有独立的头像的，微信的群组则是直接使用成员头像的缩略图。还有就是QQ头像有各种装饰，圆形百搭。所以给我的感觉跟上面框架中一样，QQ有趣、微信简洁。QQ可以有各种玩法，各种自定义，微信则干脆没有，我记得刚开始使用微信，是可以没有头像的，就是一个系统默认的图片。

第二个差异是未读信息，也就是小红点。QQ是显示在右边，相对独立的一个小气泡，里面会显示未读信息的数目。然后可以直接拖住气泡扔掉，这个效果一开始我没发现，后来才知道，感觉挺好玩的。还有就是可以左滑呼出操作，有“置顶”“标记为已读”“删除”等，三者用不同的颜色区分。
微信依旧是走简洁路线，直接在左边的方形头像右上角有一个小红点。具体的未读信息数目在列表中显示，也没有相应的动画和手势操作。长按相应的消息会弹出操作，操作内容与QQ基本一致，对了，QQ中也可以使用长按呼出操作选项。

未读消息的设计，跟头像也有一定的关系。毕竟在QQ上，如果你的头像有装饰，再加上小红点就不太合适，所以将其放置右边也算合理。记得前段时间，有人在微信上用了一些自带小红点的头像，让很多强迫症用户忍不住一次次点开。那不知道可不可以这样认为，微信让标记为已读的操作不够直接，是要引导用户去打开聊天记录。不仅标记已读，删除，置顶的功能在微信上也不够方便，相比于QQ而言。
QQ上左滑的手势很方便，而且三个操作有颜色区分，可点击范围也足够大，再加上未读消息的气泡可以拖动去除，或许用户会觉得这些操作比起点开查看信息再关闭来得爽快得多。

最后来看一些聊天窗口
其实就是聊天时各种工具的选择。QQ直接在最下面排成一排，微信则相对比较少，但同时尺寸比较大。简单地说就是相应工具曝光率的问题，还有就是业务上的需求。当然也可以上升到产品角度，是要给用户更多的选择，尽量满足用户各种需求，还是我们帮用户做决定，保证大多数人的需求，有选择强迫症的用户应该更喜欢后者吧。

QQ和微信表情的显示方式也不同，QQ也是最近更新才改变的，就是表情是上下滑动，然后一屏的数量也变多，总体上表情选择的效率提高了不少。

ps：才发现，原来微信可以自己跟自己聊天...

以上。