| 1 | <!DOCTYPE html> |
| 2 | <html lang="zh-CN"> |
| 3 | <head> |
| 4 | <meta charset="UTF-8"> |
| 5 | <meta name="viewport" content="width=device-width, initial-scale=1"> |
| 6 | <title>XHS Pastel Card</title> |
| 7 | <link rel="stylesheet" href="../../../assets/fonts.css"> |
| 8 | <link rel="stylesheet" href="../../../assets/base.css"> |
| 9 | <link rel="stylesheet" href="style.css"> |
| 10 | </head> |
| 11 | <body class="tpl-xhs-pastel-card"> |
| 12 | <div class="deck"> |
| 13 | |
| 14 | <!-- 1. COVER --> |
| 15 | <section class="slide is-active"> |
| 16 | <div class="xp-blob b1"></div> |
| 17 | <div class="xp-blob b2"></div> |
| 18 | <div class="xp-blob b3"></div> |
| 19 | <div class="xp-topbar"><div class="xp-chip">A soft manifesto</div><div class="xp-page">01 · 08</div></div> |
| 20 | <div class="xp-kicker">Living With AI · 2026</div> |
| 21 | <h1 class="xp-h1">放慢一点,<br>让 <em>AI</em> 帮你<br>过一种 <span class="rose">更温柔</span><br>的生活</h1> |
| 22 | <div class="xp-divider"></div> |
| 23 | <p class="xp-sub">这不是一份效率指南。这是一份「怎么用 AI 少做一些事」的清单 —— 把挤出来的 4 小时还给你自己。</p> |
| 24 | <div class="xp-footer"><span>by lewis · pastel edition</span><span>cover</span></div> |
| 25 | </section> |
| 26 | |
| 27 | <!-- 2. SECTION --> |
| 28 | <section class="slide"> |
| 29 | <div class="xp-blob b2"></div> |
| 30 | <div class="xp-blob b3"></div> |
| 31 | <div class="xp-topbar"><div class="xp-chip mint">Chapter one</div><div class="xp-page">02 · 08</div></div> |
| 32 | <div style="margin:auto 0"> |
| 33 | <div class="xp-kicker">先问自己</div> |
| 34 | <h1 class="xp-h1" style="font-size:120px">什么事<br>是你 <span class="mint">其实不想做</span> 的?</h1> |
| 35 | <p class="xp-sub">不是「不得不做」,是「做的时候灵魂在叹气」。</p> |
| 36 | </div> |
| 37 | <div class="xp-footer"><span>section · chapter 1</span><span>02 · 08</span></div> |
| 38 | </section> |
| 39 | |
| 40 | <!-- 3. CONTENT 2x2 pastel cards --> |
| 41 | <section class="slide"> |
| 42 | <div class="xp-blob b1"></div> |
| 43 | <div class="xp-topbar"><div class="xp-chip rose">Four little escapes</div><div class="xp-page">03 · 08</div></div> |
| 44 | <h2 class="xp-h2">四件可以<br>完全交给 <em>AI</em> 的小事</h2> |
| 45 | <div class="xp-grid-2"> |
| 46 | <div class="xp-card peach"><div class="xp-num">01</div><h4>回复那种「收到」邮件</h4><p>它们不需要你思考。让 AI 按你的语气自动处理,一周省 40 分钟。</p></div> |
| 47 | <div class="xp-card mint"><div class="xp-num">02</div><h4>订餐厅、改签、查路线</h4><p>一句话外包出去。你只负责选最后选项,不负责翻十个 app。</p></div> |
| 48 | <div class="xp-card sky"><div class="xp-num">03</div><h4>把会议录音变成行动项</h4><p>录音 → 摘要 → todo 一键完成。你只需要确认和签字。</p></div> |
| 49 | <div class="xp-card lilac"><div class="xp-num">04</div><h4>整理上周拍的 300 张照片</h4><p>按事件分类、挑 10 张精选、写图说。整理档案这件事终于被自动化了。</p></div> |
| 50 | </div> |
| 51 | <div class="xp-footer"><span>content · 2x2</span><span>03 · 08</span></div> |
| 52 | </section> |
| 53 | |
| 54 | <!-- 4. QUOTE --> |
| 55 | <section class="slide"> |
| 56 | <div class="xp-blob b3"></div> |
| 57 | <div class="xp-blob b2"></div> |
| 58 | <div class="xp-topbar"><div class="xp-chip lilac">A small pause</div><div class="xp-page">04 · 08</div></div> |
| 59 | <div class="xp-hero-card"> |
| 60 | <p class="xp-quote">效率工具的终点,不是<em> 做更多</em>,<br>而是 <em>有资格做更少</em>。</p> |
| 61 | <div class="xp-divider"></div> |
| 62 | <p class="xp-sub">当你把「收到」邮件、订餐、行程、照片整理都交出去,你才会惊讶地发现 —— 原来一周有 4 个小时是空的。</p> |
| 63 | </div> |
| 64 | <div class="xp-footer"><span>quote</span><span>04 · 08</span></div> |
| 65 | </section> |
| 66 | |
| 67 | <!-- 5. CODE / PROMPT --> |
| 68 | <section class="slide"> |
| 69 | <div class="xp-blob b1"></div> |
| 70 | <div class="xp-topbar"><div class="xp-chip">My auto-reply prompt</div><div class="xp-page">05 · 08</div></div> |
| 71 | <h2 class="xp-h2">把「<em>收到邮件</em>」<br>自动化的 <span class="rose">一段 prompt</span></h2> |
| 72 | <pre class="xp-codebox"><span class="cm"># auto-reply skill</span> |
| 73 | <span class="kw">when</span> email matches <span class="st">"收到 / 好的 / 确认 / 收到谢谢"</span>: |
| 74 | reply: |
| 75 | tone: <span class="st">"温柔,简短,不要太商业"</span> |
| 76 | max_lines: <span class="hl">2</span> |
| 77 | sign_with: <span class="st">"— Lewis"</span> |
| 78 | |
| 79 | <span class="kw">always_skip</span>: |
| 80 | - from: [<span class="st">"家人"</span>, <span class="st">"伴侣"</span>, <span class="st">"亲密朋友"</span>] |
| 81 | - contains: [<span class="st">"紧急"</span>, <span class="st">"合同"</span>, <span class="st">"付款"</span>] |
| 82 | |
| 83 | <span class="cm"># 一周省 38 分钟,测过</span></pre> |
| 84 | <div class="xp-footer"><span>content · prompt</span><span>05 · 08</span></div> |
| 85 | </section> |
| 86 | |
| 87 | <!-- 6. CHART — time donut --> |
| 88 | <section class="slide"> |
| 89 | <div class="xp-blob b2"></div> |
| 90 | <div class="xp-topbar"><div class="xp-chip mint">Your week, rebuilt</div><div class="xp-page">06 · 08</div></div> |
| 91 | <h2 class="xp-h2">一周 4 小时 <span class="mint">还给自己</span></h2> |
| 92 | <div style="display:flex;align-items:center;gap:60px;margin-top:30px"> |
| 93 | <svg viewBox="0 0 260 260" style="width:300px;flex-shrink:0"> |
| 94 | <circle cx="130" cy="130" r="100" fill="none" stroke="#fef0e4" stroke-width="40"/> |
| 95 | <!-- email 12% --> |
| 96 | <circle cx="130" cy="130" r="100" fill="none" stroke="#f48b5c" stroke-width="40" stroke-dasharray="75 628" stroke-dashoffset="0" transform="rotate(-90 130 130)"/> |
| 97 | <!-- logistics 18% --> |
| 98 | <circle cx="130" cy="130" r="100" fill="none" stroke="#2e9d70" stroke-width="40" stroke-dasharray="113 628" stroke-dashoffset="-75" transform="rotate(-90 130 130)"/> |
| 99 | <!-- meetings 14% --> |
| 100 | <circle cx="130" cy="130" r="100" fill="none" stroke="#4e7ed6" stroke-width="40" stroke-dasharray="88 628" stroke-dashoffset="-188" transform="rotate(-90 130 130)"/> |
| 101 | <!-- photos 6% --> |
| 102 | <circle cx="130" cy="130" r="100" fill="none" stroke="#7b5dc4" stroke-width="40" stroke-dasharray="38 628" stroke-dashoffset="-276" transform="rotate(-90 130 130)"/> |
| 103 | <text x="130" y="130" text-anchor="middle" font-family="Playfair Display" font-size="44" font-weight="900" fill="#2a2340">4h</text> |
| 104 | <text x="130" y="156" text-anchor="middle" font-family="Inter" font-size="12" fill="#9089a8">per week saved</text> |
| 105 | </svg> |
| 106 | <div style="flex:1"> |
| 107 | <div class="xp-grid-2" style="grid-template-columns:1fr;gap:12px;margin-top:0"> |
| 108 | <div class="xp-card peach" style="padding:14px 20px;display:flex;align-items:center;gap:14px"><div style="width:14px;height:14px;border-radius:50%;background:var(--xp-peach-d)"></div><div><h4 style="margin:0;font-size:17px">48 min · 邮件</h4></div></div> |
| 109 | <div class="xp-card mint" style="padding:14px 20px;display:flex;align-items:center;gap:14px"><div style="width:14px;height:14px;border-radius:50%;background:var(--xp-mint-d)"></div><div><h4 style="margin:0;font-size:17px">72 min · 订/改/查</h4></div></div> |
| 110 | <div class="xp-card sky" style="padding:14px 20px;display:flex;align-items:center;gap:14px"><div style="width:14px;height:14px;border-radius:50%;background:var(--xp-sky-d)"></div><div><h4 style="margin:0;font-size:17px">56 min · 会议摘要</h4></div></div> |
| 111 | <div class="xp-card lilac" style="padding:14px 20px;display:flex;align-items:center;gap:14px"><div style="width:14px;height:14px;border-radius:50%;background:var(--xp-lilac-d)"></div><div><h4 style="margin:0;font-size:17px">24 min · 照片整理</h4></div></div> |
| 112 | </div> |
| 113 | </div> |
| 114 | </div> |
| 115 | <div class="xp-footer"><span>chart · donut</span><span>06 · 08</span></div> |
| 116 | </section> |
| 117 | |
| 118 | <!-- 7. CTA --> |
| 119 | <section class="slide"> |
| 120 | <div class="xp-blob b1"></div> |
| 121 | <div class="xp-blob b3"></div> |
| 122 | <div class="xp-topbar"><div class="xp-chip rose">This weekend</div><div class="xp-page">07 · 08</div></div> |
| 123 | <h2 class="xp-h2">这周末,<br>先给自己 <em>放一个小假</em></h2> |
| 124 | <div class="xp-grid-3"> |
| 125 | <div class="xp-card lemon"><div class="xp-num">☕</div><h4>Saturday morning</h4><p>挑一个你最烦的小事,写 prompt,让它从此不再烦你。</p></div> |
| 126 | <div class="xp-card peach"><div class="xp-num">🌸</div><h4>Saturday afternoon</h4><p>去散步。什么都不带。AI 在家帮你看着消息。</p></div> |
| 127 | <div class="xp-card sky"><div class="xp-num">🌙</div><h4>Sunday night</h4><p>复盘:哪 4 小时是真的空的?下周继续。</p></div> |
| 128 | </div> |
| 129 | <div class="xp-footer"><span>cta</span><span>07 · 08</span></div> |
| 130 | </section> |
| 131 | |
| 132 | <!-- 8. THANKS --> |
| 133 | <section class="slide"> |
| 134 | <div class="xp-blob b2"></div> |
| 135 | <div style="margin:auto 0;text-align:center"> |
| 136 | <div class="xp-kicker" style="text-align:center">thanks for reading</div> |
| 137 | <h1 class="xp-h1" style="font-size:160px;text-align:center">谢谢 <em>·</em> thanks</h1> |
| 138 | <div class="xp-divider" style="margin:24px auto"></div> |
| 139 | <p class="xp-sub" style="margin:0 auto">如果你也想过更温柔的一周,评论区跟我说说你打算把哪一件事先交出去 ♡</p> |
| 140 | </div> |
| 141 | <div class="xp-footer"><span>end</span><span>08 · 08</span></div> |
| 142 | </section> |
| 143 | |
| 144 | </div> |
| 145 | <script src="../../../assets/runtime.js"></script> |
| 146 | </body> |
| 147 | </html> |
| 148 |