• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >心得技巧 > 从这4个维度,教你分析一款相册类产品

从这4个维度,教你分析一款相册类产品

作者: 字体:[增加 减小] 来源:互联网 时间:2018-08-23

本文主要包含App设计,产品设计,经验分享等相关知识,希望在学习及工作中可以帮助到您

@苏大牙牙牙:随着人们手机拍照成为一种习惯,每天都会产生一波又一波新的照片。在手机内存有限的情况下,相信很多同学都会选择将自己照片存放在云相册或者网盘上,来节省手机内存的同时,方便管理备份自己的照片。

但是,身为云相册类产品,除了满足用户备份或储存照片这种基础需求以外,还能为用户做些什么呢?怎么才能让自己变得更有价值?

接下来分享本周关于相册类产品的一些思考。

经过分析,相册类产品除了最基础的存储和备份功能以外,还可以从4个维度满足用户的不同需求。分别是:1.快速查找;2.沉浸浏览;3.快捷编辑;4.轻松共享。

1. 快速查找

用户既然把图片传在相册平台上,那么就会有查找的需求。

想要帮助用户高效查找目标照片,需要产品做到智能化整理。所谓智能化,就是最大程度上模拟用户希望看到的整理结果。大致可以从3个维度去处理:a.时光轴;b.相册分类;c.搜索入口。

a.时光轴

以时间的维度查找照片,是最简洁直观的方式之一。

时光轴,能够运用在一切需要以时间维度对单个个体状态改变(更迭)进行展示的地方;相册类产品,运用时光轴,可以根据用户上传照片的时间,倒序排列呈现,引导用户以时间维度去查找照片。

时光轴页面的图片布局样式,也同样影响着用户查找效率。经过分析,图片样式的展示大致可以分为3种:

1. 宫格的形式,像百度网盘:

2. 混排的形式(高度一致的情况下,自适应图片宽度),像google photo:

3. 图片真实比例,像icloud:

具体采用哪种样式更高效呢?

考虑到页面的使用率和浏览效率,我认为google photo更高效一些。

因为,1.它虽然采用的混排方式,但是不会让页面看起来杂乱无章,反而更有节奏感,避免审美疲劳;2.由于图片的大小会根据图片真实比例适当的缩放,比全是正方形的图片更能区分内容的差异,方便用户在选择时,快速做出判断。

不过具体做方案选择时,还是需要一些数据支撑或者用户调研来辅助判断。

b. 智能分类

除了时间维度的方式以外,智能分类,也是一个有效查找照片的办法。

相册类产品,可以通过获取照片的地点/时间/延续性,来判断符合哪种分类,把照片放在相应的相册里。给忘记照片时间(时光轴)的用户,多一种查找照片的途径。

c. 手动搜索

如果时间和分类的维度,都没有让用户高效找到目标照片,那么最终的大boss就是手动搜索了。

包括,大多数存储类产品都支持识别图片上文字的功能。因此,你可以在搜索框输入图片上带有的文字,比如:各种证件、广告文字、文档,等等…

以上可以看出,产品帮助用户整理照片的优先级,应该高于用户主动整理的优先级。用智能的整理方式,让用户高效的查找并获取目标照片,才能把用户的注意力放在产品其它有趣的地方。

2. 沉浸浏览

除了储存和快速查找的功能,相册类产品还希望能够增加用户的使用时长和粘度。

因此,产品要做到让图片浏览更沉浸,使相册成为用户回忆的一种方式,而不是一个冰冷的云端硬盘。那么除了要做到交互上的流畅体验和布局上的合理性以外,还需要 :a.建立人与人的关系,b.照片有的故事性。

a. 建立人与人的关系

在照片详情里,可以展示关联人物的头像,点击关联人的头像便能查看更多关于他/她的照片。连接点和点,形成一个关系网。这么做能够让整个浏览相册的体验更加流畅和沉浸。

b. 故事板的展示

对用户的照片进行判断,尽量以最合适、情感化、沉浸的方式呈现出来。

比如:如果根据判断用户近几天的照片定位和类型,确定是在出游,从而给用户自动生成一个类似游记的相册集的展示方式。在提升照片浏览的沉浸感的同时,还会给用户一些惊喜。

3. 便捷编辑

简单来说,就是引导用户在自己相册产品里,把照片玩儿起来。

翻译过来:在我这儿存储,在我这儿编辑。(而不是再导入美图秀秀啊美颜相机啊instagram啊这种的 你懂) ,提供一条龙服务的功能,从而提升用户的使用频率。

那么照片的编辑大致可以分为3个部分:a.美化,b.在线冲印。

a. 美化

在这个照骗横行的时代,美化是妹子们的刚需。它能让妹子减少整容(肉毒杆菌,玻尿酸,欧式平行大双眼皮…)的冲动,通过滤镜满足我们追求美的需求。嗯,没毛病。

当然,美化不只是瘦脸,拉腿,放大眼的功能,同时有趣味贴纸,增加滤镜,智能剪切,制作视频等,一系列装逼的需求。

b.在线冲印

在线冲印,不仅满足用户不出门就能收到照片的需求,同时对于产品来说,也是一种盈利模式。包括:冲印费用,相纸费用,实物相册增值服务,等等…

下面要为我家产品打个广告了,百度网盘里面就有云冲印功能喔 ( 不过由于人力有限,体验有待提升,后续会优化 ) …

4. 轻松共享

相信大家都碰到过这种场景,跟基友一起出去浪,大家拍了好多合影,但都分散在不同人的手机里,那么我们会分别说:“快快快,把照片微信发给我”。等收到照片后,你还要筛选,哪些照片有自己,哪些照片自己更好看(小姐姐们都懂),等等…?多么繁琐的步骤。

这时候,建立共享相册,可以解决以下两方面问题:

a. 照片聚合

建一个大家的共享相册,能实时的把自己手机里有的照片上传到共享相册里,大家可以随意选择想要的合影/自己照片。同时,你点击共享人的头像,也可以轻松分享照片给他,或者查看他/她的所有照片。

b. 照片提醒

如果你建立了家人、情侣或者闺蜜的共享相册,肯定比较关注谁上传了新照片。

比如,宝宝共享相册,妈妈上传照片时,会给共享组里的爷爷奶奶,7大姑8大姨提醒,一起关注乖(xiong)宝(hai)宝(zi)的健康成长~

总结

以上是我对相册类产品的一些思考,总的来说,相册类产品的设计要做到:1.功能上,体现安全、便捷;2.体验上,达到高效、沉浸;3.情感上,满足好玩儿、生动;4.最终让用户乐于共享、连接。相册,不仅是一个小小的储存工具,也是连接你生活和回忆的地方。

欢迎关注作者的微信公众号:

「大牙的设计好文合集」

  1. 《用这个流程,4步完成一个有理有据的LOGO 设计》
  2. 《规范、方法、一致性,真有那么重要吗?》
  3. 《非鸡汤全干货!瓶颈期的设计师该如何走出迷茫?》
设计微博:拥有粉丝量200万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推

您可能想查找下面的文章:

  • 手机APP用户界面设计的10点建议
  • 关于音乐播放App(应用软件)的分析与重设计 如何设计出漂亮的音乐播放界面
  • 写给新手的APP结构指南:首页相关(上)
  • 基础科普!重复与突变在产品设计中的应用
  • 超全面的导航设计基础知识总结(一)
  • 写给UI新手的APP结构指南:注册和登录
  • 用户体验是一种过程,而不是结果
  • 超全面的移动端UI 设计规范整理汇总
  • 感觉设计不舒服但又不知道原因?可能是这8个常见的交互细节问题
  • 这个帮你改善睡眠的APP,是这样设计出来的

相关文章

  • 2018-08-23学会用标签式设计,让你的作品又快又好!
  • 2018-08-23对色彩没感觉?三个方法提高你的色感训练
  • 2017-08-06网页设计中的交互:关于分页问题的浅谈
  • 2018-08-23在这些实例中,学会用动效赋予你APP生命力
  • 2018-08-23版本控制工具 Abstract 是如何提升设计团队协作效率的?
  • 2017-08-06CSS样式表与格式布局详解
  • 2018-08-23老妈,才是那个最难搞的甲方!
  • 2018-08-23那些很熟悉但又叫不出名字的设计法则:选择架构
  • 2017-08-06网页中使用任意字体之实际操作附演示
  • 2018-08-23大产品小细节!5分钟了解格式塔原则

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • 设置块元素居窗口中间的位置实现方法
    • 如何写出没有“硬伤”的文案?这里有4个实用技巧
    • 交互设计中的“无意识错误”:如何帮助用户防错?
    • 如何给小程序做设计?来看网易高手的设计实战案例!
    • 网页设计制作科学化原则建议总结
    • 借鉴别人的海报?得先学会这个平面构成分析法!
    • 设计好用、易用web应用程序的10个技巧
    • 从设计默认值开始,让你的产品体验更优秀
    • html5中几个不容错过的api或者tips小结
    • 高手帮你学规范!iOS和Android规范解析之按钮

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有