产品逻辑中的图片设计方案

浪子
8 评论 14110 浏览 123 收藏 5 分钟
B端产品经理要负责对目标行业和市场进行深入的分析和调研,了解客户的需求、痛点、期望和行为,找到产品的价值主张 🔗

大部分APP都拥有看图传图等功能,那么在这些场景下面,该如何处理图片的功能逻辑呢?本文作者就此来简单分析一下。

图片的技术处理方案还是比较成熟的,网上有很多方法可以调用。但是PM还是应该了解相应的技术逻辑,尤其是需要提升图片展示效率、减轻图片存储压力的时候。

接下来我从图片的选择-上传-存储-下载-展示等步骤,慢慢的梳理图片的功能逻辑。

选择图片

产品中的图片,往往来源于用户的上传。而上传的方式分两种,现拍和从本地相册中选择。

上传图片

这一步不一定是原图上传,一般来说前端会对原图的分辨率和大小进行一定的压缩,从而减小存储空间。

不少初级PM理解上传图片=上传到服务器,而事实上在此之前还有本地压缩处理的步骤。

图片的分辨率压缩

网上有很多知名APP的处理规则,比如微信、Facebook、知乎等。可自行搜索并参照采用。也可以根据自身业务而定制。

图片的大小压缩

通过调整图片质量的方式来减小图片占用空间。

注意压缩分辨率也会导致图片变小,但2者不可混同理解。

存储图片

服务器存储的图片,一般是前端上传过来的图片,请注意不一定是用户最初选择的图片。

那么是不是只存储这一份呢,也不一定。某些功能需要长期展示固定尺寸缩略图。比如社交app需要在多处显示同样的小尺寸头像,此时服务端需要另存储一份固定尺寸的小图。

至于,到底需不需要在服务端自动生成缩略图,根据业务需求而定,大原则是权衡用空间换时间的价值。

下载图片

需要注意的是,根据业务场景不同,下载的可能是原图可能是某一种尺寸的缩略图。

展示图片

往往是前端做一定处理并渲染展示。如果是展示缩略图的时候,可能会截取部分展示。这一块比较复杂,还涉及到具体的截取规则。下篇文章我们细讲。

图片功能汇总

最终得到你整个APP大概有这些功能用到图片,以及具体的图片尺寸和缩略图介绍。

总结

相信PM童鞋们看完这篇文章,应该对图片处理的逻辑有一个比较清晰的了解。有不对的地方,也欢迎大家指正。

下篇文章会详细讲解一下缩略图的功能逻辑。

#专栏作家#

浪子,业务型PM,浪子PRD系列51prd.com,公众号langzisay。

本文由 @浪子 原创发布于人人都是产品经理。未经许可,禁止转载。

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 图片是先剪裁再压缩,还是先压缩再剪裁,那种方式比较好?

    来自广东 回复
  2. 谢谢分享

    来自北京 回复
  3. 谢谢分享

    来自广东 回复
  4. 点赞~~

    来自上海 回复
    1. 666

      来自重庆 回复
  5. 😉 老师,我来了,谢谢你今天帮我 😥

    来自广东 回复
    1. 666

      来自重庆 回复
    2. 不客气

      来自上海 回复
专题
13730人已学习12篇文章
为了推动公司业务的正常运转操作,我们需要建立一定的业务模型来推动运作。本专题的文章分享了如何构建业务模型。
专题
17631人已学习17篇文章
随着互联网的不断发展,不少产品开始了适老化改造,帮助老年人更好地融入智能生活。本专题的文章分享了适老化的设计思路。
专题
44859人已学习22篇文章
可用又易用,产品逻辑和情感化体验两手抓,用户才会爱上你的产品。
专题
15001人已学习12篇文章
用户故事在软件开发过程中被作为描述需求的一种表达形式,本专题的文章分享了如何讲好用户故事。
专题
15523人已学习12篇文章
运费是电商的基础功能模块之一,承担着商品运费计算的作用。本专题的文章分享了如何设计运费规则。