郎启旭的写字本

我的 App 截屏排版心得

2013.04.05

经常会在工作和写作中涉及到手机 app 话题(例如本文),难免会碰到无图无真相,没图说不清的境地,但由于手机屏幕尺寸的关系,简单粗暴地把 app 截屏放到正文当中并不是一种好的体验。今天就来说说我在平时写作中是如何处理手机 App 截屏排版的。

一、图片长宽比例

由于现在大部分手机都是高分屏 16:9 的竖屏样式,如果直接将每张截图原图放到文章中,会使得展示效率极其低下,不利于阅读,为解决这个问题,需要将多张截图并排,如下图。

糟糕的和好的阅读体验对比

但同时,为了保证应用截屏的清晰可见和贴图的长宽比例,并排 2-3 个截屏为佳。

二、图片背景色

这个其实更多看个人偏好,我用的是一个灰度色,也可以选择纯黑或者其他适合阅读的颜色,但也需要阅读感受,比如贴在知乎,纯黑的图片会和页面白色产生强烈对比,可能对阅读不太友好。

三、App 截屏与背景的区分

有时候截屏图片会有内容和背景色颜色相溶或者反差过大,为了更好的区分截屏图片和背景,需要对其做一些处理,比如加一个边框、阴影或是外发光。

App 截屏和背景的区分

四、为截屏添加必要的备注

某些时候,截图还需要一些必要的文字说明才能让读者明白截屏所处的上下文,尤其是一些操作流程截屏,例如:

添加必要的备注

不过仍然需要把握文字备注是作为辅助信息的度,不宜太过抢眼,例如:

文字不宜太过抢眼

以上,欢迎大家补充。


原文载于:在知乎上回答应用(app)相关问题,怎样贴截屏图才够美观漂亮,从而方便阅读?

Comments
Write a Comment