<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>成都塔未餐厅电影之夜小红书图文方案</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
body {
background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);
color: #333;
padding: 20px;
min-height: 100vh;
}
.container {
max-width: 1200px;
margin: 0 auto;
background: rgba(255, 255, 255, 0.97);
border-radius: 20px;
box-shadow: 0 10px 50px rgba(0, 0, 0, 0.2);
overflow: hidden;
position: relative;
}
/* 小红书风格装饰元素 */
.xiaohongshu-dot {
position: absolute;
width: 20px;
height: 20px;
background: #ff2442;
border-radius: 50%;
opacity: 0.6;
z-index: 0;
}
.note-line {
position: absolute;
height: 100%;
width: 2px;
background: rgba(255, 36, 66, 0.1);
left: 50px;
top: 0;
z-index: 0;
}
header {
background: linear-gradient(to right, #ff2442, #ff9a9e);
color: white;
padding: 40px 30px 30px;
text-align: center;
position: relative;
overflow: hidden;
z-index: 1;
}
header::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="none"><path d="M0,0 L100,0 L100,100 Z" fill="rgba(255,255,255,0.1)"/></svg>');
background-size: 100% 100%;
}
.logo {
position: absolute;
top: 20px;
left: 30px;
font-size: 24px;
font-weight: bold;
display: flex;
align-items: center;
}
.logo i {
margin-right: 10px;
color: #FFD700;
}
h1 {
font-size: 2.8rem;
margin-bottom: 15px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
position: relative;
z-index: 1;
}
.subtitle {
font-size: 1.2rem;
opacity: 0.9;
max-width: 700px;
margin: 0 auto 20px;
position: relative;
z-index: 1;
}
.platform-tag {
display: inline-block;
background: white;
color: #ff2442;
padding: 8px 20px;
border-radius: 30px;
font-weight: bold;
margin-top: 10px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
.metadata {
display: flex;
justify-content: center;
gap: 20px;
margin-top: 20px;
flex-wrap: wrap;
}
.meta-card {
background: rgba(255, 255, 255, 0.25);
padding: 12px 20px;
border-radius: 8px;
text-align: center;
min-width: 140px;
backdrop-filter: blur(5px);
}
.meta-card h3 {
font-size: 0.85rem;
margin-bottom: 5px;
opacity: 0.8;
color: white;
}
.meta-card p {
font-size: 1.1rem;
font-weight: bold;
color: white;
}
.controls {
display: flex;
justify-content: center;
gap: 20px;
margin: 25px 0;
flex-wrap: wrap;
}
.btn {
padding: 14px 35px;
font-size: 1.1rem;
border: none;
border-radius: 50px;
cursor: pointer;
display: flex;
align-items: center;
gap: 10px;
transition: all 0.3s ease;
font-weight: 600;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.25);
position: relative;
overflow: hidden;
z-index: 1;
}
.btn::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 0;
height: 100%;
background: rgba(255, 255, 255, 0.2);
transition: all 0.5s ease;
z-index: -1;
}
.btn:hover::before {
width: 100%;
}
.btn:hover {
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}
.btn-download {
background: linear-gradient(to right, #ff2442, #ff9a9e);
color: white;
}
.btn-excel {
background: linear-gradient(to right, #0ba360, #3cba92);
color: white;
}
.btn-word {
background: linear-gradient(to right, #2b5876, #4e4376);
color: white;
}
.content {
padding: 30px;
position: relative;
z-index: 1;
}
.section {
margin-bottom: 40px;
background: white;
border-radius: 16px;
padding: 25px;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
position: relative;
overflow: hidden;
}
.section::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 5px;
height: 100%;
background: linear-gradient(to bottom, #ff2442, #ff9a9e);
}
.section-title {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 25px;
color: #ff2442;
padding-bottom: 10px;
border-bottom: 2px solid #ffecef;
}
.section-title i {
font-size: 1.8rem;
color: #ff2442;
}
.section-title h2 {
font-size: 1.8rem;
font-weight: 700;
}
table {
width: 100%;
border-collapse: collapse;
margin: 20px 0;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}
th {
background: linear-gradient(to right, #ff2442, #ff9a9e);
color: white;
text-align: left;
padding: 16px;
font-weight: 600;
font-size: 1.1rem;
}
td {
padding: 14px;
border-bottom: 1px solid #f9f9f9;
}
tr:nth-child(even) {
background-color: #fffafa;
}
tr:hover {
background-color: #ffecef;
}
.props-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 25px;
}
.prop-card {
background: #fffafa;
border-radius: 12px;
padding: 25px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
border-left: 4px solid #ff2442;
transition: all 0.3s ease;
}
.prop-card:hover {
transform: translateY(-5px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}
.prop-card h3 {
color: #ff2442;
margin-bottom: 15px;
display: flex;
align-items: center;
gap: 10px;
font-size: 1.3rem;
}
.prop-card ul {
padding-left: 25px;
}
.prop-card li {
margin-bottom: 10px;
line-height: 1.6;
}
/* 小红书正文样式 */
.xh-content {
background: #fffafa;
border-radius: 16px;
padding: 30px;
line-height: 1.8;
font-size: 1.1rem;
color: #333;
border-left: 4px solid #ff2442;
}
.xh-content p {
margin-bottom: 20px;
}
.xh-hashtag {
display: inline-block;
background: #ffecef;
color: #ff2442;
padding: 5px 12px;
border-radius: 20px;
margin-right: 10px;
margin-bottom: 10px;
font-size: 0.9rem;
}
.image-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 15px;
margin: 20px 0;
}
.image-card {
height: 200px;
border-radius: 12px;
overflow: hidden;
position: relative;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
background: linear-gradient(to bottom, #ff9a9e, #fad0c4);
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-weight: bold;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}
.image-card:nth-child(1) {
grid-column: span 2;
height: 250px;
}
footer {
text-align: center;
padding: 30px;
background: #ff2442;
color: rgba(255, 255, 255, 0.9);
font-size: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
position: relative;
z-index: 1;
}
footer p {
margin-bottom: 10px;
}
.footer-team {
display: flex;
justify-content: center;
gap: 40px;
margin-top: 20px;
flex-wrap: wrap;
}
.footer-member {
text-align: center;
}
.footer-member h4 {
color: #ffd700;
margin-bottom: 5px;
font-size: 1.1rem;
}
.footer-member p {
color: white;
font-weight: 500;
margin: 0;
}
@media (max-width: 768px) {
.metadata {
flex-direction: column;
align-items: center;
}
.meta-card {
width: 100%;
max-width: 300px;
}
table {
font-size: 0.9rem;
}
th, td {
padding: 12px 10px;
}
h1 {
font-size: 2.2rem;
}
.image-grid {
grid-template-columns: 1fr;
}
.image-card:nth-child(1) {
grid-column: span 1;
}
}
</style>
</head>
<body>
<div class="container">
<div class="xiaohongshu-dot" style="top: 100px; right: 150px;"></div>
<div class="xiaohongshu-dot" style="top: 300px; left: 80px; width: 30px; height: 30px;"></div>
<div class="xiaohongshu-dot" style="bottom: 200px; right: 200px; width: 15px; height: 15px;"></div>
<div class="note-line"></div>
<header>
<div class="logo">
<i class="fas fa-heart"></i>
<span></span>
</div>
<h1>电影之夜小红书图文方案</h1>
<p class="subtitle">成都塔未餐厅 · 95后社交主题 · 闺蜜聚会场景</p>
<div class="platform-tag">
<i class="fab fa-reddit-alien"></i> 小红书专属方案
</div>
<div class="metadata">
<div class="meta-card">
<h3>目标平台</h3>
<p>小红书</p>
</div>
<div class="meta-card">
<h3>目标人群</h3>
<p>95-00后女性</p>
</div>
<div class="meta-card">
<h3>发布地点</h3>
<p>成都塔未</p>
</div>
<div class="meta-card">
<h3>方案版本</h3>
<p>V1.0</p>
</div>
</div>
</header>
<div class="controls">
<button class="btn btn-download" onclick="downloadHTML()">
<i class="fas fa-download"></i> 下载HTML
</button>
<button class="btn btn-word" onclick="downloadWord()">
<i class="fas fa-file-word"></i> 下载Word文档
</button>
<button class="btn btn-excel" onclick="downloadExcel()">
<i class="fas fa-file-excel"></i> 下载Excel表格
</button>
</div>
<div class="content">
<div class="section">
<div class="section-title">
<i class="fas fa-pencil-alt"></i>
<h2>文案内容</h2>
</div>
<div class="xh-content">
<p>💖 和95后闺蜜在成都过夜，除了看电影还能干嘛？</p>
<p>上周末和一群吵吵闹闹的姐妹@成都吃货小美 @成都探店喵
在#塔未Tavie成都 的庭院里解锁了电影之夜的全新打开方式！</p>
<p>✨【氛围感直接拉满】<br>
- 幕布、串灯、懒人沙发… 想要的仪式感这里全都有<br>
- 晚风、星光、蝉鸣声… 成了最棒的天然背景音<br>
- 重点是！怎么拍都好看出片，9宫格根本不够发！</p>
<p>🍿【快乐加倍秘籍】<br>
1️⃣ 服装：舒服好看的睡衣/卫衣趴才是精髓！(OOTD在后面👇)<br>
2️⃣ 零食：爆米花+薯片+汽水是标配，但我们自带了冷吃兔和钵钵鸡！<br>
3️⃣ 电影：一起看恐怖片，尖叫完又抱成一团笑，感情升温利器❕</p>
<p>👯【属于95后的社交仪式】<br>
最后碰杯的那一刻，喊着"敬永不散场的姐妹局"<br>
突然就懂了，为什么我们都需要这样的夜晚<br>
是充电，是疗愈，是平凡生活里的高光时刻✨</p>
<p>👇【一些实用信息】<br>
📍 地点：塔未 TaVie Lifestyle（成都店）<br>
🎫 玩法：可以预约他们的庭院电影夜项目哦<br>
📷 拍照tips：一定要用串灯做前景，氛围感绝了！<br>
👗 OOTD：建议穿浅色、马卡龙色系的衣服，上镜很绝！</p>
<p>💡 你们和朋友的电影夜都会怎么玩？快在评论区给我种草！</p>
<div class="hashtags">
<span class="xh-hashtag">#成都周末好去处</span>
<span class="xh-hashtag">#成都探店</span>
<span class="xh-hashtag">#闺蜜拍照</span>
<span class="xh-hashtag">#电影之夜</span>
<span class="xh-hashtag">#城市浪漫地标打卡</span>
<span class="xh-hashtag">#塔未生活</span>
<span class="xh-hashtag">#周末去哪儿</span>
<span class="xh-hashtag">#成都拍照</span>
</div>
</div>
</div>
<div class="section">
<div class="section-title">
<i class="fas fa-images"></i>
<h2>图片规划</h2>
</div>
<table>
<thead>
<tr>
<th>图片顺序</th>
<th>内容描述</th>
<th>视觉风格</th>
<th>备注</th>
</tr>
</thead>
<tbody>
<tr>
<td>1. 首图</td>
<td>精心设计的封面图，大字标题突出主题："塔未电影夜｜95后的治愈式社交"</td>
<td>高饱和度、视觉冲击力强、标题清晰</td>
<td>最重要，决定点击率</td>
</tr>
<tr>
<td>2. 氛围细节</td>
<td>庭院电影院的空镜：幕布、串灯、散落的抱枕和毛毯</td>
<td>氛围感、特写、景深效果</td>
<td>突出环境美感</td>
</tr>
<tr>
<td>3. 成都特色</td>
<td>本地零食特写：冷吃兔、钵钵鸡、特色小吃搭配饮料</td>
<td>美食摄影、垂涎欲滴感</td>
<td>突出成都本地特色</td>
</tr>
<tr>
<td>4. 服装OOTD</td>
<td>平铺展示三位模特的服装搭配（卫衣、运动裤、鲨鱼夹等）</td>
<td>Ins风平铺、标签注明风格</td>
<td>提供穿搭灵感</td>
</tr>
<tr>
<td>5. 互动抓拍</td>
<td>女生们看电影时同步反应的瞬间（捂嘴笑、惊恐抱在一起）</td>
<td>动态感、故事感、自然</td>
<td>体现场景真实感</td>
</tr>
<tr>
<td>6. 碰杯特写</td>
<td>核心画面：多个汽水杯/果汁杯碰在一起的瞬间，杯壁倒映着灯光和笑脸</td>
<td>特写、闪光灯质感、突出"塔未碰杯"仪式</td>
<td>品牌记忆点</td>
</tr>
<tr>
<td>7. 个人美照</td>
<td>某个女生拿着零食，对着镜头微笑的美照，突出穿搭和放松的状态</td>
<td>人像模式、背景虚化、颜值高</td>
<td>吸引女性用户</td>
</tr>
<tr>
<td>8. 场地标志</td>
<td>塔未庭院的标志性建筑或门牌号，帮助用户定位</td>
<td>环境图、有辨识度</td>
<td>提供位置信息</td>
</tr>
<tr>
<td>9. 信息导览</td>
<td>自制一张拼图：包含地址二维码、预约方式、价格区间、活动关键词等</td>
<td>信息图、简洁明了</td>
<td>实用信息汇总</td>
</tr>
</tbody>
</table>
<div class="image-grid">
<div class="image-card">封面图</div>
<div class="image-card">氛围图</div>
<div class="image-card">美食图</div>
<div class="image-card">OOTD</div>
<div class="image-card">互动图</div>
<div class="image-card">碰杯图</div>
</div>
</div>
<div class="section">
<div class="section-title">
<i class="fas fa-hashtag"></i>
<h2>话题标签策略</h2>
</div>
<div class="props-grid">
<div class="prop-card">
<h3><i class="fas fa-fire"></i> 核心标签</h3>
<ul>
<li>#塔未生活</li>
<li>#电影之夜</li>
<li>#塔未Tavie成都</li>
</ul>
</div>
<div class="prop-card">
<h3><i class="fas fa-chart-line"></i> 流量大标签</h3>
<ul>
<li>#成都周末好去处</li>
<li>#成都探店</li>
<li>#周末去哪儿</li>
</ul>
</div>
<div class="prop-card">
<h3><i class="fas fa-bullseye"></i> 精准标签</h3>
<ul>
<li>#闺蜜拍照</li>
<li>#城市浪漫地标打卡</li>
<li>#成都拍照</li>
</ul>
</div>
<div class="prop-card">
<h3><i class="fas fa-users"></i> 人群标签</h3>
<ul>
<li>#95后</li>
<li>#姐妹聚会</li>
<li>#成都姐妹</li>
</ul>
</div>
</div>
</div>
<div class="section">
<div class="section-title">
<i class="fas fa-lightbulb"></i>
<h2>执行要点</h2>
</div>
<div class="props-grid">
<div class="prop-card">
<h3><i class="fas fa-clock"></i> 发布时间</h3>
<ul>
<li>最佳时间：周五晚上7-9点</li>
<li>备选时间：周六上午10-12点</li>
<li>避免工作日上班时间发布</li>
</ul>
</div>
<div class="prop-card">
<h3><i class="fas fa-user-check"></i> 账号互动</h3>
<ul>
<li>文案中@出镜的闺蜜账号</li>
<li>发布后请朋友点赞评论</li>
<li>回复所有优质评论</li>
</ul>
</div>
<div class="prop-card">
<h3><i class="fas fa-rocket"></i> 推广策略</h3>
<ul>
<li>发布24小时后投薯条推广</li>
<li>定向：成都、女性、18-28岁</li>
<li>兴趣标签：探店、拍照、闺蜜聚会</li>
</ul>
</div>
<div class="prop-card">
<h3><i class="fas fa-chart-pie"></i> 数据指标</h3>
<ul>
<li>目标点击率：≥10%</li>
<li>目标互动率：≥5%</li>
<li>目标收藏量：≥100</li>
</ul>
</div>
</div>
</div>
</div>
<footer>
<p>小红书图文推送方案 © 2025 成都塔未餐厅 | 最后更新: 2025-08-20</p>
<div class="footer-team">
<div class="footer-member">
<h4>运营总监</h4>
<p>大龙</p>
</div>
<div class="footer-member">
<h4>内容策划</h4>
<p>回声像素团队</p>
</div>
<div class="footer-member">
<h4>场地支持</h4>
<p>成都塔未餐厅</p>
</div>
</div>
</footer>
</div>
<script>
// 下载HTML文件
function downloadHTML() {
const htmlContent = document.documentElement.outerHTML;
const blob = new Blob([htmlContent], { type: 'text/html' });
saveAs(blob, '成都塔未电影之夜小红书方案.html');
}
// 下载Word文档
function downloadWord() {
const content = `
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>成都塔未电影之夜小红书图文方案</title>
<style>
body { font-family: Arial, sans-serif; line-height: 1.6; margin: 40px; }
h1, h2 { color: #ff2442; }
h1 { border-bottom: 2px solid #ff9a9e; padding-bottom: 10px; }
table { width: 100%; border-collapse: collapse; margin: 20px 0; }
th, td { border: 1px solid #ddd; padding: 12px; text-align: left; }
th { background-color: #ffecef; }
.section { margin-bottom: 30px; }
.xh-content { background: #fffafa; padding: 20px; border-radius: 10px; border-left: 4px solid #ff2442; }
.xh-hashtag { background: #ffecef; color: #ff2442; padding: 5px 10px; border-radius: 15px; margin-right: 8px; font-size: 0.9rem; }
</style>
</head>
<body>
<h1>成都塔未电影之夜小红书图文方案</h1>
<p><strong>目标平台：</strong> 小红书</p>
<p><strong>目标人群：</strong> 95-00后女性</p>
<p><strong>发布地点：</strong> 成都塔未餐厅</p>
<div class="section">
<h2>文案内容</h2>
<div class="xh-content">
<p>💖 和95后闺蜜在成都过夜，除了看电影还能干嘛？</p>
<p>上周末和一群吵吵闹闹的姐妹@成都吃货小美 @成都探店喵
在#塔未Tavie成都 的庭院里解锁了电影之夜的全新打开方式！</p>
<p>✨【氛围感直接拉满】<br>
- 幕布、串灯、懒人沙发… 想要的仪式感这里全都有<br>
- 晚风、星光、蝉鸣声… 成了最棒的天然背景音<br>
- 重点是！怎么拍都好看出片，9宫格根本不够发！</p>
<p>🍿【快乐加倍秘籍】<br>
1️⃣ 服装：舒服好看的睡衣/卫衣趴才是精髓！(OOTD在后面👇)<br>
2️⃣ 零食：爆米花+薯片+汽水是标配，但我们自带了冷吃兔和钵钵鸡！<br>
3️⃣ 电影：一起看恐怖片，尖叫完又抱成一团笑，感情升温利器❕</p>
<p>（更多内容请参考HTML完整版）</p>
<p>
<span class="xh-hashtag">#成都周末好去处</span>
<span class="xh-hashtag">#成都探店</span>
<span class="xh-hashtag">#闺蜜拍照</span>
<span class="xh-hashtag">#电影之夜</span>
</p>
</div>
</div>
<h2>图片规划</h2>
<table>
<tr>
<th>图片顺序</th>
<th>内容描述</th>
<th>视觉风格</th>
</tr>
<tr>
<td>1. 首图</td>
<td>精心设计的封面图，大字标题突出主题："塔未电影夜｜95后的治愈式社交"</td>
<td>高饱和度、视觉冲击力强、标题清晰</td>
</tr>
<tr>
<td>2. 氛围细节</td>
<td>庭院电影院的空镜：幕布、串灯、散落的抱枕和毛毯</td>
<td>氛围感、特写、景深效果</td>
</tr>
<tr>
<td>3. 成都特色</td>
<td>本地零食特写：冷吃兔、钵钵鸡、特色小吃搭配饮料</td>
<td>美食摄影、垂涎欲滴感</td>
</tr>
<!-- 更多行省略 -->
</table>
<h2>执行要点</h2>
<p><strong>发布时间：</strong> 周五晚上7-9点或周六上午10-12点</p>
<p><strong>互动策略：</strong> 文案中@出镜的闺蜜账号，发布后请朋友点赞评论</p>
<p><strong>推广策略：</strong> 发布24小时后投薯条推广，定向成都、女性、18-28岁用户</p>
</body>
</html>
`;
const blob = new Blob([content], { type: 'application/msword' });
saveAs(blob, '成都塔未电影之夜小红书方案.doc');
}
// 下载Excel表格
function downloadExcel() {
// 创建工作簿
const wb = XLSX.utils.book_new();
// 第一个工作表：文案内容
const ws1Data = [
["成都塔未电影之夜小红书图文方案"],
[""],
["文案内容"],
["💖 和95后闺蜜在成都过夜，除了看电影还能干嘛？"],
[""],
["上周末和一群吵吵闹闹的姐妹@成都吃货小美 @成都探店喵"],
["在#塔未Tavie成都 的庭院里解锁了电影之夜的全新打开方式！"],
[""],
["✨【氛围感直接拉满】"],
["- 幕布、串灯、懒人沙发… 想要的仪式感这里全都有"],
["- 晚风、星光、蝉鸣声… 成了最棒的天然背景音"],
["- 重点是！怎么拍都好看出片，9宫格根本不够发！"],
[""],
["🍿【快乐加倍秘籍】"],
["1️⃣ 服装：舒服好看的睡衣/卫衣趴才是精髓！(OOTD在后面👇)"],
["2️⃣ 零食：爆米花+薯片+汽水是标配，但我们自带了冷吃兔和钵钵鸡！"],
["3️⃣ 电影：一起看恐怖片，尖叫完又抱成一团笑，感情升温利器❕"],
[""],
["话题标签"],
["#成都周末好去处", "#成都探店", "#闺蜜拍照", "#电影之夜"],
["#城市浪漫地标打卡", "#塔未生活", "#周末去哪儿", "#成都拍照"]
];
const ws1 = XLSX.utils.aoa_to_sheet(ws1Data);
// 第二个工作表：图片规划
const ws2Data = [
["图片顺序", "内容描述", "视觉风格", "备注"],
["1. 首图", "精心设计的封面图，大字标题突出主题", "高饱和度、视觉冲击力强", "最重要，决定点击率"],
["2. 氛围细节", "庭院电影院的空镜：幕布、串灯、散落的抱枕和毛毯", "氛围感、特写、景深效果", "突出环境美感"],
["3. 成都特色", "本地零食特写：冷吃兔、钵钵鸡、特色小吃", "美食摄影、垂涎欲滴感", "突出成都本地特色"],
["4. 服装OOTD", "平铺展示三位模特的服装搭配", "Ins风平铺、标签注明风格", "提供穿搭灵感"],
["5. 互动抓拍", "女生们看电影时同步反应的瞬间", "动态感、故事感、自然", "体现场景真实感"],
["6. 碰杯特写", "多个汽水杯/果汁杯碰在一起的瞬间", "特写、闪光灯质感", "品牌记忆点"],
["7. 个人美照", "某个女生拿着零食，对着镜头微笑的美照", "人像模式、背景虚化", "吸引女性用户"],
["8. 场地标志", "塔未庭院的标志性建筑或门牌号", "环境图、有辨识度", "提供位置信息"],
["9. 信息导览", "包含地址二维码、预约方式、价格区间等", "信息图、简洁明了", "实用信息汇总"]
];
const ws2 = XLSX.utils.aoa_to_sheet(ws2Data);
// 第三个工作表：执行要点
const ws3Data = [
["执行要点", "", "", ""],
["", "", "", ""],
["发布时间", "账号互动", "推广策略", "数据指标"],
["最佳时间：周五晚上7-9点", "文案中@出镜的闺蜜账号", "发布24小时后投薯条推广", "目标点击率：≥10%"],
["备选时间：周六上午10-12点", "发布后请朋友点赞评论", "定向：成都、女性、18-28岁", "目标互动率：≥5%"],
["避免工作日上班时间发布", "回复所有优质评论", "兴趣标签：探店、拍照、闺蜜聚会", "目标收藏量：≥100"]
];
const ws3 = XLSX.utils.aoa_to_sheet(ws3Data);
// 添加工作表到工作簿
XLSX.utils.book_append_sheet(wb, ws1, "文案内容");
XLSX.utils.book_append_sheet(wb, ws2, "图片规划");
XLSX.utils.book_append_sheet(wb, ws3, "执行要点");
// 导出Excel
const wbout = XLSX.write(wb, { bookType: 'xlsx', type: 'binary' });
// 转换并保存
function s2ab(s) {
const buf = new ArrayBuffer(s.length);
const view = new Uint8Array(buf);
for (let i = 0; i < s.length; i++) view[i] = s.charCodeAt(i) & 0xFF;
return buf;
}
saveAs(new Blob([s2ab(wbout)], { type: "application/octet-stream" }), '成都塔未电影之夜小红书方案.xlsx');
}
// 添加装饰元素动画
document.addEventListener('DOMContentLoaded', function() {
const dots = document.querySelectorAll('.xiaohongshu-dot');
dots.forEach((dot, index) => {
// 随机延迟动画
setTimeout(() => {
dot.style.animation = `float ${3 + Math.random() * 2}s infinite ease-in-out`;
}, index * 300);
});
// 添加动态CSS
const style = document.createElement('style');
style.innerHTML = `
@keyframes float {
0% { transform: translateY(0) rotate(0deg); }
50% { transform: translateY(-15px) rotate(5deg); }
100% { transform: translateY(0) rotate(0deg); }
}
`;
document.head.appendChild(style);
});
</script>
</body>
</html>
index.html
style.css
index.js
index.html