网站首页 > 博客文章正文

时间戳展示设计思路分享

baijin 2024-12-03 10:03:03 博客文章 4 ℃ 0 评论

时间戳在产品中被广泛应用，不论是面向用户的C端产品还是面向客户的B端产品，展示一条数据是在什么时候发布的或者未来什么时候要发布，都十分重要。这就引申出时间戳展示的设计理念，以下就简单分享一下历史记录和预告的常用设计思路。

常用的设计思路：向下取整，比如1天前就是48小时前—24小时前的数据。

今日的数据可以按照秒、分、小时来细化区分，但是由于秒的范围太小，没有必要，所以最细粒度为分，1分内展示“刚刚”即可。

分区	时间范围	展示示例	说明
当日	59秒前——此刻 59分59秒前——60秒前 23小时59分59秒前——60分0秒前	刚刚 1分钟前、...、59分钟前 1小时前、...、23小时前	1分钟内展示“刚刚” 其他数据向下取整，比1分钟40秒前------展示“1分钟前” 23小时50分10秒前-----展示“23小时前”
当周	6天23小时59分59秒前——24小时0分0秒前	1天前、2天前、...、6天前	向下取整，间隔为1天：1天10小时50分10秒前------展示“1天前”
当月	13天23小时59分59秒前——7天0小时0分0秒前 20天23小时59分59秒前——14天0小时0分0秒前 27天23小时59分59秒前——21天0小时0分0秒前	1周前 2周前 3周前	向下取整，间隔为7天：11天10小时50分10秒前------展示“1周前”
当年	59天23小时59分59秒前——28天0小时0分0秒前 89天23小时59分59秒前——60天0小时0分0秒前 ...（30天累加） 364天23小时59分59秒前——330天0小时0分0秒前	1月前 2月前 ...（30天累加） 11月前	向下取整，间隔为30天：29天10小时50分10秒前------展示“1月前” 79天10小时50分10秒前------展示“2月前”
N年	729天23小时59分59秒前——365天0小时0分0秒前 1094天23小时59分59秒前——730天0小时0分0秒前 ...(365天累加）	1年前 2年前 ...(365天累加）	向下取整，间隔为365天：364天10小时50分10秒前------展示“11月前” 365天10小时50分10秒前------展示“1年前”

常见的设计思路：向下取整，比如1天后就是24小时—48小时后。基本与记录的时间戳展示规则类似。

分区

时间范围

展示示例

说明

当日

此刻——59秒后

60秒后——59分59秒后

60分0秒后——23小时59分59秒后

5秒后

1分钟后、...、59分钟后

1小时后、...、23小时后

1分钟内都是展示秒

其他数据向下取整，比1分钟40秒后------展示“1分钟后”

23小时50分10秒后-----展示“23小时后”

N天

24小时0分0秒后——

1天后、2天后、...

向下取整，间隔为1天：1天10小时50分10秒后------展示“1天后”

99天10小时50分10秒后-------展示“99天后”