【案例】LOFTER 信息框架改版(iOS版)

对于一款APP的信息框架改版,可以分为以下几个步骤

  1. 竞品的信息框架分析

    目的:找出差异点和共同点

    作用:差异点可以根据产品的定位,做特色设计,成为产品特征;共同点是指同类产品的框架/布局共同点,可以用来寻找用户的一些习惯认知/操作。

  2. 功能卡片分类

    目的:了解目标用户对功能点的认知。

    作用:通过卡片分类,可以了解到用户对功能点的认知,用于优化信息框架,以及功能点的重新归类。

  3. 根据前面的分析,优化新的信息框架
  4. 输出优化后的交互稿

具体内容如下:

一、竞品信息框架分析

竞品一:足记 APP(3.2.2  iOS版)

这是一款图片社交软件,通过发布自己的图片,与他人进行社交互动。最大的特色在于将电影里面的取景地跟用户拍摄的照片做一个结合。
1467337706-1285-tD1FLp-HziZ8D0UNscesLg

竞品二:nice  APP(3.9.9  iOS版)

这也是一款图片社交软件。

特色主要有

1、每张图片都可以添加多个标签,通过添加标签让用户之间有一定的互动性。

2、有一个匿名交流功能,叫纸飞机,类似于漂流瓶的方式,不同是以图片在媒介。 3、支持视频直播功能(目前还处于少量用户体验阶段)。

1467337706-1224-8QXHFchI8DVLDZ4WFI7xDQ

竞品三:Instagram APP(8.0 iOS版)

这是国外的一款图片社交软件。相比国内的几款同类APP来说,它的功能没有过于杂乱,整体都是围绕图片分享社区这样一个思想来设计。

它更注重交流这个功能,有一个Direct的功能,类似于收件箱,可以实现“点对点”的图片信息交流。

同时拥有强大的图片美化功能。

1467337705-2905-fqNa89FzDsd6gbv7iCqItA

LOFTER APP(5.2.1 iOS版)

相对而言,LOFTER一样没有太多杂乱的功能,专注于图片分享功能。通过话题活动,提供整体社区的活跃度。

在同城好友功能下,LOFTER展示的是附近用户的信息,而不是附近用户更新的信息,这点也不同与其它竞品。可见LOFTER更希望用户从这个平台上认识新的朋友,形成自己的社交圈。

1467337712-7941-o3TruUC772cMTg7b-u6lhQ

总结

这几款软件基本都是以图片为核心的社交平台APP。

整体的信息框架基本上由5部分组成:

首页(关注的内容更新),发现(强化社交功能),发布(核心功能),信息,个人中心(包含其它次要功能)

而且“发布”功能都是这类APP重点突出的功能点。

足记:

以“电影取景地”为核心,通过普及电影知识,告知用户附近有哪些电影取景地,引导用户去发自己的图片,再通过分享,让其它用户参与互动讨论。另一个渠道则是将用户拍摄的照片,处理成电影风格,给用户带来一定的社交筹码。

用户发布的内容,大多数与电影相关,内容多偏向文艺范。

nice:

相对同类APP,特色点较多,包含:有图片添加标签,纸飞机匿名交流,直播互动等特色功能。这些功能都想强化社交这个属性。

用户发布的内容,偏向日常生活化,整体用户偏向低龄化。

Instagram:

功能简单,没有过多的附件功能,让用户专注与图片分享这个核心点上,拥有的Direct功能也是少见的,其美化图片的功能也是亮点之一。用户发布的内容,偏向日常生活化。

LOFTER:

专注图片分享的轻博客,从现世至今,一直要强化社交功能点,也带来很多新的附加功能,如乐乎印品,福利市集,摄影课堂等。在社交发展方向上,更偏向于为用户发现“同道中人”,形成自己的“社交圈子”,这点与nice的社交发现方向有些差异。

用户发布的内容,偏向于文艺范。

二、功能卡片分类

从LOFTER的信息框架中,提取了36个功能点,并找了3名用户进行卡片分类测试。在提取功能点的名称时,尽量做成用中性词,比如将“分享LOFTER”改为“分享 APP”。另外找的这三位用户都体验过LOFTER产品,再测试之前,也对卡片的功能点进行简单的介绍。

具体功能点如下:

关注者动态、私信聊天、新的喜欢、新的粉丝、新的通知、新的评论、新的专题活动、上传图片、美化图片、完善图片信息、同步管理、可见性管理、精选 内容、标签推荐、同城用户、达人推荐、微博好友、推荐用户、搜索、我喜欢的内容、我的粉丝、我关注的用户、个人主页、参与的标签分类、福利市集、乐乎印 品、关于APP、分享APP,意见反馈、偏好设置、夜间模式、清理缓存、帐号绑定、隐私设置、版权设置、退出登录。

1467337712-6705-Tv6e3WzCuf6bgVcDBD-6EA
1467337710-9148-oGrK7WJJsr3TLk0uTQXM0w
1467337724-5941-aHR24oGp8b3uQtSr-33cHQ

三位用户的分类结果大同小异,其中有几个值得留意的点:

1、用户2把“微博好友”的功能归为个人设置分类里。

进一步了解用户这样分类的原因时,用户的回答是“这个不是关联新浪微博后,就一次性把好友自动添加好吗?后续还会用到?”后续跟用户2解释后“微博好友”的功能,但他还是觉得应该归为个人设置里面。再次了解后,才发现这是用户从其它软件培养的习惯,造成这种分类差异。

2、用户1把“福利市集”归为个人信息里面,而其它两位用户都把它归为“推广”分类。

进一步跟用户了解后发现,原来她这样分类的原因是,福利市集每天都可以签到,可以换取自己的东西,觉得这是跟自己关系密切的功能。

3、在这三位用户中,都把“版权设置”归为设置分类里,而原版的分类,则是在发布信息类别里。

通过进一步了解后,他们都觉得发布的内容版权设置,第一次设置好就行了,后续也不会去修改的。这点跟“可见性管理”和“同步管理”有所差异,所以他们都把“全版权设置”归为到设置里。

三、改版后的LOFTER信息框架

1467337725-5838-cmEO5RWSvEqyjvjfa9vwlw
综上,这是改版后的LOFTER信息框架。相对原版,主要修改了以下几点:

1、首页的“订阅”功能移到“发现”页面。

原因:

a、减少首页的度,让首页结构更简单。

b、在观察3位用户使用APP中,发现首页的订阅功能操作步骤有点多,因为这个功能是“订阅分类”,但是在页面中显示的是订阅的分类内容更新数量,如果要看内容本身,需要多点击一次。

c、在首页功能中,用户更关注自己的好友更新了什么内容,对于自己订阅的分类内容来说,更偏向于“发现”这个分类,因为订阅的内容不是他们最关注的,而他们更希望从订阅功能中获得惊喜。

2、信息页面的“专题介绍”移到“发现”页面。

原因:

a、根据三个用户的卡片分析结果,“专题介绍”从信息页面,移动到“发现”页面会更合适些。

b、用户什么情况下会去点击“发现”页面?其中一种情况就是用户想闲逛,看看能不能发现更多自己感兴趣的内容/用户。在这种情况下,“专题介绍”可以也许就是用户感兴趣的内容,或者说,起到了用户闲逛消磨时间的作用。

3、设置功能区里,“夜间阅读设置”移到“偏好设置”里。

原因:

a、现有的设置页面功能“度”数过多,“夜间阅读设置”可归属于“偏好设置”里。

b、现有的版本独立出来,却无法做到一步切换阅读模式。再者,阅读设置可以设置为自动启动,结果用户采用这种设置后,就会减少该设置的使用频率。

4、设置功能区里,“意见反馈”和“分享LOFTER”移到“关于LOFTER”里。

a、减少设置页面的“度”。

补充:

关于前面提到的这点:“在这三位用户中,都把“版权设置”归为设置分类里,而原版的分类,则是在发布信息类别里。”

经过思考后,改版后的LOFTER忽略了用户的分类,让“版权设置”功能保留在发布流程中。

虽然用户觉得版权设置,头一次使用设置后,后续都不会常用。

但如果把该功能放到“设置”页面中,当用户在发布信息时,万一需要改动到版权,就要进入设置页面修改。

这样一来容易打断用户的发布流程,二来用户也容易忘记版权设置藏在哪。

综上,“版权设置”经过思考后,还是放在发布流程的页面中,但视觉上一定程度的弱化,减少干扰。

目前LOFTER的版本是5.2.1,这个更新假设的版本是5.3,因为LOFTER不是一个从0到1的产品,它的用户已经有自己的一些行为习惯,因此这个改版跳过了几个版本,用于慢慢过渡到新的信息框架上。

四、输出交互稿

这部分页面较多,这里只展示首页和发现页这两个主要改版的页面

1467337726-1418-5FPZidS3M9-r1HBb5fpdKA

五、后记
1、信息框架保留模块,不是拆分得越细越好。

早期竞品分析,信息框架制作时。不能把功能点分得太细,一些模块的信息不需要拆分。

比如:用户名、用户头像、用户ID可以直接分为“用户名片”模块。尽量将产品的层级控制到2到3层。

2、提炼卡片功能点时,需要把控好数量,把功能点不能分得过细,可以将一些重叠的功能点合并,功能点之间的关系,也不能出现包含关系。

感谢Mufly分享,原文链接:http://mufly.lofter.com/post/179451_b52f6bc

原创文章,作者:Tinadmin,如若转载,请注明出处:https://www.iamue.com/16067/

(0)
TinadminTinadmin
上一篇 2016-07-01
下一篇 2016-07-01

相关推荐

  • O2O/商场权限管理系统设计方案

    一、管理权限分级概览 二、管理账号管理逻辑 三、账号权限定义 管理账号预设角色分为四种:超级管理员、商场管理员(独立收银)、商场管理员(统一收银)、店铺管理员; 超级管理员: 具有商场后台所有功能的权限,…

    2017-12-28
  • 12个线框图示例,来自Dribbble的UX设计师分享。

    在设计过程的最初阶段,我们知道很有可能直接选择word或邮件原始需求。但是,用线框技术解决问题有很多好处,它可以节省时间,更易于发现可用性问题,并让设计人员专注于创造可靠的用户体验

    2017-12-26
  • 淘宝天猫个性化推荐技术演进史

    小编说:个性化推荐技术直面用户,可以说是站在最前线的那个。如今,从用户打开手机淘宝客户端(简称“手淘”)或是手机天猫客户端(简称“猫客”)的那一刻起,个性化推荐技术就已经启动,为你我带来一场个性化的购物…

    2017-05-09
  • 5步快速制作移动动效

    Sketch+Keynote双剑合璧:5步快速制作移动动效 2014年,Facebook推出了新闻阅读应用Paper,诸多交互细节与炫酷动效启动了界面设计的新时代,Google的Material Design更是将移动动效提升到了app基础体验环节的高度。…

    2015-04-11
  • JDC丨京东设计中心 - 电商大促攻略页设计指南

    通常我们看到的旅游攻略,游戏攻略等都是以文章资讯的形式呈现,只可阅读不可交互。而电商大促活动中的攻略页,可不仅仅是一篇资讯文章那么简单,除了要向用户传达促销信息,往往承载着引流,预约,发券,传播等营…

    2018-03-27
  • 面对未知的产品我们要如何去做?

    当我们遇到这种东西的时候,我们首先一定是要定位用户,要分析用户的场景,用户所遇到的一些情况等等很多问题,分析的方法可以是5W1H也可以其它的科学分析法的模型,什么都可以,这是一个思路,是从几个大的问题开始的。

    2016-02-25
  • Axure-小红书APP登陆界面划屏效果制作

    有一款叫做小红书的APP(不是小黄书)登陆界面做的非常清新脱俗,教他家用Axure模仿练习一下他的登陆界面划屏效果,这个内容虽然有些多,但是制作方法并不难,耐心跟着做的话肯定没问题哒!点击观看效果 效果分析 …

    2016-01-06
  • 对话界面的现在与未来

    计算机与人类并不使用同一种语言。所以为了之间的交互成为可能,我们依赖于图形化的用户界面(GUIs)。但是GUIs同样有着天然的屏障:人们必须去学习如何使用他们。他们不得不去学习一个汉堡icon隐藏着一个菜单,这是一个button触发一个操作。但是随着技术的发展,语言识别和处理效率的提高改善,我们当前的交互方式正在变得更直观,简单而又高效-通过对话界面

    2016-07-20
  • [自译]企业UX案例研究:在紧张期限内提高可用性

    在四个月的时间里,LiquidPlanner塑造了一个新的dashboard模板功能,这让用户印象深刻,并且有很高的使用率和很好的商业效益。

    2016-08-24
  • 平衡用户体验设计和精益设计

    来源:人人都是产品经理 作者:AB Tester Blog 对你而言哪个更重要:是制作出拥有杀手级用户体验的产品来吸引用户?还是尽快制作出能满足用户的产品并抢占大量的市场份额? 如果一款产品用户体验很差的话,用户不会使…

    2014-09-27