V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
HarperLucky
V2EX  ›  分享创造

开发了一个「陪伴式倒计时」网页小工具

  •  
  •   HarperLucky · 59 天前 · 2771 次点击
    这是一个创建于 59 天前的主题,其中的信息可能已经有所发展或是发生改变。

    大家好,感谢点击进来看~

    「陪伴式倒计时」是我尝试开发海外工具网站的第二个小项目。

    开发这个小项目的原因主要有 3 个:

    • 我自己需要一个倒计时来辅助工作时长和专注度。
    • 搜索到的倒计时工具基本满足需求,但是没有沉浸式的体验,或者说是陪伴式的体验。
    • 如果网站有了一定流量,还能通过广告赚一点零花钱。

    基于以上 2 点,我开发了这个小工具网站。


    这个倒计时工具,除了能够比较便捷的设置倒计时外,还提供了:

    1. 多种设置倒计时的方式:

      • 选择天、小时、分钟、秒;
      • 自定义日期和时间;
      • 自定义天数、小时数、分钟数和秒数,避免计算。
    2. 可选择倒计时结束时提醒铃声,目前虽然不多,但会持续新增。

    3. 可自定义倒计时标题,增加倒计时的仪式感。

    4. 可选择倒计时过程中的背景动图和背景音乐(持续新增中...),这是「陪伴式」的精髓吧,也是不同于其他倒计时的最大区别,灵感来源于油管上的 Lofi 频道。


    虽然网站已经上线了,但是还有一些 Bug 需要修复,也有一些功能需要完善,比如:

    • 没有倒计时暂停功能;
    • 页面更新时,背景音乐播放和按钮不一致的问题;
    • 倒计时过程中,不能单独修改倒计时结束时的提醒铃声;
    • 其他问题,欢迎大家补充~

    下面是网站的一张截图: 5minutetimer.com

    再次感谢大家耐心看完帖子,希望得到大家的建议和鼓励🫶

    网址: https://5minutetimer.com

    20 条回复    2024-04-03 10:11:07 +08:00
    GeekGao
        1
    GeekGao  
       59 天前
    不错,我在用 25min 适合番茄工作法
    HarperLucky
        2
    HarperLucky  
    OP
       59 天前
    @GeekGao 感谢使用呀。

    番茄工作法是个好东西,我在想,是否可以加一个功能,自定义类似番茄工作法计时:

    可以设置多长时间之后,休息一段时间(自定义),然后重新开始计时,依次循环。还可以设置循环几次。
    GeekGao
        3
    GeekGao  
       59 天前   ❤️ 1
    @HarperLucky 个人觉得,不要做那么复杂,不如优化下你这个界面交互,更容易使用 + 再增加一些白噪声
    GeekGao
        4
    GeekGao  
       59 天前
    才发现,到时间后竟然没有声音或者其他提示提醒我,算是个 bug ?
    HarperLucky
        5
    HarperLucky  
    OP
       59 天前
    @GeekGao 好嘞,谢谢宝贵建议啊,好像把设置按钮放在右上角,操作起来不太方便,也不太直观吧🤣,我优化一下。

    这两天增加一些白噪声和大自然的声音。
    GeekGao
        6
    GeekGao  
       59 天前
    @HarperLucky https://www.timerclock.net/25-seconds-timer 这家就挺简单的而且有提示音,但是就没有白噪声音乐功能。
    HarperLucky
        7
    HarperLucky  
    OP
       59 天前
    @GeekGao 因为默认进入页面就自动开始倒计时了,如果用户不在页面进行操作的话,浏览器默认是不会播放音乐的。

    我改一下吧,初次进入倒计时页面时,需要点击才能开始倒计时,这样倒计时结束就会有提醒了。
    HarperLucky
        8
    HarperLucky  
    OP
       59 天前
    @GeekGao 好嘞,我学习下,感谢感谢呀~
    inostarling
        9
    inostarling  
       59 天前
    太简陋了,不够美观,也没什么沉浸感,尤其是定时器的设置我认为还有很大的改进空间
    gxy2825
        10
    gxy2825  
       59 天前
    观感上页面要展示的东西太多了,或许可以精简一下?配置考虑放到二级菜单之类的
    HarperLucky
        11
    HarperLucky  
    OP
       59 天前
    @inostarling 感谢体验和反馈~

    页面简陋的问题,我是这么想的:倒计时本身不能是个小的需求,尽量简单一些比较好,页面留白比较多,不想让页面铺满内容,给人一种压迫感。

    关于「沉浸感」我是这么想的:后续增加一些白噪声和大自然的声音,大家可以选择自己喜欢的背景音乐,这样我们在倒计时的时候,可以安静的干活或者休息,让人心静下来,可能这样就有「沉浸感」了。

    倒计时的设置确实不好,上面的朋友也反馈了,我正在重新布局页面。
    HarperLucky
        12
    HarperLucky  
    OP
       59 天前
    @gxy2825 谢谢你的体验和反馈呀。你和上面的朋友看法正好相反,楼上的朋友感觉页面太简陋了,哈哈。

    页面这块,我尽量保持精简吧,按钮还是直接展示比较好,让用户少一步操作,接下来是打算把设置按钮放到倒计时下面,更直观一些,也方便大家直接操作,比如:暂停/继续,重置等。
    luckybigbear
        13
    luckybigbear  
       59 天前   ❤️ 1
    我对美观布局没有系统性的看法,但可以感受到页面元素的协调性确实是有些缺失
    比如倒计时组件小了,和中间动态 gif 放在一起,这两个搭配的不是那么突出,没有突出主次
    上面说的白噪音,我用番茄其实不太喜欢听声音,自己放的轻音乐。如果有白噪声说不定是个不错的添彩项

    至于另一个评论,说什么简陋、不够美观、改进空间大,这是 boss 来评论?像是讲了很多但是又讲不清楚的,不要听这些人的意见

    设计这块,可以问问设计的朋友,我第一眼看到的是协调的问题,可能色彩、布局也有其他的可以优化的

    有更新我会继续看看,加油~
    HarperLucky
        14
    HarperLucky  
    OP
       59 天前
    @luckybigbear 你好,非常感谢你的体验和好的建议啊!

    我当时的初衷是想突出 gif ,想让大家倒计时的同时,看着能让人安静下来的 gif ,听着轻音乐,快速进入专注和清静的状态。

    白噪声、大自然的声音以及其他轻音乐,接下来都会不断增加,下周应该就可以增加一些。

    设计这块,感谢你的建议,我找设计的朋友帮我看看,参谋参谋。在这之前,我先自己把已知的问题先修改一下,比如按钮布局等。

    再次感谢你的支持和鼓励🤝
    zhangweijian
        15
    zhangweijian  
       58 天前
    看到你的网站让我感触很大啊,之前刚学习的时候就用 js 写了一个类似这样的和倒计时闹钟播放音乐,挺有意思的。大哥如果 github 有仓库就好了大家可以一起提 issue
    HarperLucky
        16
    HarperLucky  
    OP
       58 天前
    @zhangweijian 哈哈哈,原来之前也是有相同想法的同道中人。目前代码还有不少需要优化的地方,重构的地方也不少,打算好好整一下。
    HarperLucky
        18
    HarperLucky  
    OP
       56 天前
    @ToDayMkCode 页面挺清爽、简洁的。这个感觉更像 TodoList 。我这个是倒计时,应用场景不太一样。
    HarperLucky
        19
    HarperLucky  
    OP
       56 天前
    今天更新了一个版本:
    1 、删除右上角「 Set 」按钮,在右上角不方便操作。
    2 、增加 [Edit] (原 Set 按钮)、「 Reset 」和「 Start/Stop 」按钮,方便操作,支持重置和暂停。

    接下来解决:
    1 、 [Edit] 的时候,带上当前倒计时信息,包括倒计时、闹铃等;
    2 、页面更新时,背景音乐播放和按钮不一致的问题;
    3 、倒计时过程中,不能单独修改倒计时结束时的提醒铃声;

    感谢大家的支持和鼓励🙏
    lianhua591
        20
    lianhua591  
       27 天前
    这个想法很不错呢
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   5851 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 34ms · UTC 02:41 · PVG 10:41 · LAX 19:41 · JFK 22:41
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.