<?xml version='1.0' encoding='UTF-8'?>
<?xml-stylesheet href="/rss/stylesheet/" type="text/xsl"?>
<rss xmlns:podcast='https://podcastindex.org/namespace/1.0' xmlns:content='http://purl.org/rss/1.0/modules/content/' xmlns:taxo='http://purl.org/rss/1.0/modules/taxonomy/' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns:itunes='http://www.itunes.com/dtds/podcast-1.0.dtd' xmlns:googleplay="http://www.google.com/schemas/play-podcasts/1.0" xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:atom='http://www.w3.org/2005/Atom' xmlns:podbridge='http://www.podbridge.com/podbridge-ad.dtd' version='2.0'>
<channel>
  <title>untitled</title>
  <language>en-us</language>
  <generator>microfeed.org</generator>
  <itunes:type>episodic</itunes:type>
  <itunes:explicit>false</itunes:explicit>
  <atom:link rel="self" href="https://cms.elliothu.me/rss/" type="application/rss+xml"/>
  <link>https://elliot-personal-site-cms.hqy841440305.workers.dev</link>
  <itunes:image href="https://cms.elliothu.me/assets/default/channel-image.png"/>
  <image>
    <title>untitled</title>
    <url>https://cms.elliothu.me/assets/default/channel-image.png</url>
    <link>https://elliot-personal-site-cms.hqy841440305.workers.dev</link>
  </image>
  <copyright>©2026</copyright>
  <item>
    <title>把我的猫咪做成护眼 APP！</title>
    <guid>fHGFF8132TI</guid>
    <pubDate>Sat, 02 May 2026 05:57:09 GMT</pubDate>
    <itunes:explicit>false</itunes:explicit>
    <description>
      <![CDATA[<p>最近 X 上一个日本开发者把自家猫咪做成了护眼时钟 Chrome 插件，叫 Cat Gatekeeper，超级可爱！</p>
<p>但是这个插件只能在浏览器里用，而且不能替换猫咪形象，于是博主自己动手做一个，把我家的小毛球做成了 App。</p>
<p>当你连续看屏幕太久，猫猫就会走进屏幕里开始倒计时，温柔但坚定地挡住，提醒你该休息一下眼睛了。</p>
<p>成品 App 已经开源，Mac 和 Windows 都支持，GitHub 即可下载。如果大家想把自己家的宝宝形象放进去，接下来是教程，只需要四步。</p>
<figure><img src="https://static.elliothu.me/production/images/item-25b726cd85d6b4dcea0209e37800d736.png" alt="Cat Gatekeeper 与 Kitty Screen 效果示例"><figcaption>原版浏览器插件和 Kitty Screen 的效果示例</figcaption></figure>
<h2>第一步：准备猫咪参考照片</h2>
<p>先收集清晰、高分辨率的猫咪照片。图片模型需要足够多的视觉信息，才能在每一帧里稳定保持同一只猫身份。</p>
<p>建议准备这些照片：</p>
<ul><li>正脸高清近照</li><li>左右侧脸</li><li>全身站立或行走姿态</li><li>坐姿</li><li>躺姿或放松姿态</li><li>能看清毛色、花纹、爪子、尾巴、眼睛、耳朵形状和毛发长度的细节图</li></ul>
<p>参考图里尽量只出现一只猫。避免使用有其他动物、复杂背景、重滤镜、服装或极端光照的照片。如果你的猫有明显花纹，至少准备一张能清楚看到这些花纹的图。</p>
<figure><img src="https://static.elliothu.me/production/images/item-77054ab1221375fe52f45645d5333ef9.png" alt="猫咪参考照片示例"><figcaption>用于保持猫咪身份一致的参考照片</figcaption></figure>
<h2>第二步：生成绿幕关键帧</h2>
<p>使用支持参考图生图的模型，生成一组按编号排列的关键帧。目标是让你的猫按照项目内置示例动作走位，同时保持自己的外观。</p>
<p>每张图都应该使用纯绿幕背景。保持背景干净，不要地面、阴影、渐变、道具、文字、UI、家具、房间背景或其他动物。背景越纯，后续 FFmpeg 抠像越稳定。</p>
<p>可以直接从 GitHub 里的 prompt 开始改。替换猫咪形象描述时要写清楚你猫的特征，但动作、构图和绿幕约束尽量保持严格。</p>
<p>博主这里用的是 Lynx Agent 生成的。</p>
<figure><img src="https://static.elliothu.me/production/images/item-2db9026c38775d639b5e02ba6a6bacbb.png" alt="使用 Lynx Agent 生成猫咪绿幕关键帧"><figcaption>Lynx Agent 中的关键帧生成任务</figcaption></figure>
<h2>第三步：生成入场视频和循环视频</h2>
<p>使用支持首帧、尾帧或有序关键帧控制的视频生成工具。把关键帧按编号顺序上传，生成一段连续的绿幕猫咪动画。博主这里用的是可灵。</p>
<p>建议视频设置：</p>
<ul><li>16:9 输出</li><li>镜头固定</li><li>全程保持同一只猫的形象</li><li>全程保持均匀的 <code>#00ff00</code> 绿幕背景</li><li>动作节奏是缓慢入画、停下，最后稳定挡住屏幕</li><li>不要镜头缩放、平移、俯仰、跟随、房间背景、道具、文字、UI、阴影或第二只动物</li></ul>
<p>最终导出两段视频：</p>
<ul><li>第一段是完整入场动画，应该包含猫咪进入画面、移动到目标位置并稳定挡住屏幕的过程。</li><li>第二段保留轻微动作，比如呼吸、眨眼或小幅尾巴动作。这样屏保持续显示时不会一直重复完整入场动画。</li></ul>
<figure><img src="https://static.elliothu.me/production/images/item-fc6276de21ab7f10a3d15b23a5f43b94.png" alt="绿幕猫咪入场与循环视频示例"><figcaption>猫咪绿幕视频生成要求</figcaption></figure>
<h2>最后一步：放入 App</h2>
<p>博主已经把所有步骤写成了脚本，支持一键导入并生成 App 需要的资源格式。</p>
<p>按照 GitHub 里的 README.md，把生成视频放入项目，然后运行：</p>
<pre><code>npm run videos</code></pre>
<p>这个命令会运行生成脚本。它会读取绿幕视频文件，用 FFmpeg 去掉绿色背景、做绿色溢色处理、检查 alpha 通道，并输出 macOS 和 Windows 平台资源。</p>
<p>如果你只在调某个平台，可以只生成单个平台：</p>
<pre><code>npm run videos -- --platform macos
npm run videos -- --platform windows</code></pre>
<p>然后再运行：</p>
<pre><code>npm run app:build:mac
npm run app:build:windows</code></pre>
<p>稍等片刻，即可拥有自己的小猫桌面。</p>
<figure><img src="https://static.elliothu.me/production/images/item-308233da6aa553d5dc78ee6eadec2fe4.png" alt="Kitty Screen 构建结果"><figcaption>构建好的 macOS App</figcaption></figure>
<h2>下载与源码</h2>
<p>App 下载链接、所有源码、资源和用到的 prompts 全都开源在 GitHub，需要的友友自取，欢迎 Star：</p>
<p><a href="https://github.com/elliothux/kitty-screen">github.com/elliothux/kitty-screen</a></p>
<p>本 App 的源码和用到的图片资源，都使用 Lynx Agent 生成。</p>
<p>Lynx 是首个具备操作系统级上下文的 AI Agent，能够看见你的屏幕，理解你当前的工作环境，记住你的工作习惯。你不需要告诉它任何上下文，它就能自己主动完成工作。即将上线内测，感兴趣的友友可以蹲蹲。</p>
<figure><img src="https://static.elliothu.me/production/images/item-c39e6f49bdaa33de55ea7d7142fdf09a.png" alt="Kitty Screen GitHub 仓库"><figcaption>项目源码与技术栈</figcaption></figure>
<hr><p><a href="https://www.xiaohongshu.com/explore/69f592350000000023014086">原始小红书笔记</a></p>]]>
    </description>
    <link>https://cms.elliothu.me/i/%E6%8A%8A%E6%88%91%E7%9A%84%E7%8C%AB%E5%92%AA%E5%81%9A%E6%88%90%E6%8A%A4%E7%9C%BC-app/</link>
    <itunes:image href="https://static.elliothu.me/production/media/image-210eae61554eb862b5ff702590a6ab4c.png"/>
  </item>
</channel>
</rss>