中文 | English
- 🦆🦆 DoubleDuckLab (DDLab)
一个基于 Astro 构建的现代化课题组官网模板， 为科研团队设计。
- 基于 Astro 构建，静态生成，速度极快
- JSON / Markdown 内容驱动，无需后端
- 专为 科研团队官网 场景设计
- 响应式布局
- 深色 / 浅色模式
- 可直接部署到 Cloudflare Pages / Vercel
左：Light / 右：Dark（点击图片可直接访问 doubleducklab.com）
克隆项目：
git clone https://github.com/nightt5879/doubleducklab.git
cd doubleducklab安装依赖：
npm install构建项目：
npm run build本地预览：
npm run preview访问：
http://localhost:4321
网站主要内容存储在：
src/content/
例如：
members/*.md
papers/*.md
news/*/*_cn.md
news/*/*_en.md
project/
join/*/overview_cn.md
join/*/overview_en/md
修改这些文件即可更新网站内容。接下来将从主页开始讲解能修改的内容：
brand：用于左上角品牌（Header）siteName：用于首页 Hero 标题和浏览器标签页标题（<title>）
请编辑文件：
src/data/site.zh.json
与
src/data/site.en.json示例：
{
"brand": "DOUBLEDUCK·LAB",
"siteName": "DoubleDuckLab"
}修改后效果：
- Header 左上角显示
brand - 首页主标题显示
siteName - 页面标题显示为
页面名 · siteName（例如：新闻 · DoubleDuckLab）
执行验证：
npm run build
npm run preview首页 Hero、Highlights、Featured Projects 标题都来自：
src/data/site.zh.json（中文）src/data/site.en.json（英文）
重点字段（两份文件都建议保持同结构）：
{
"siteName": "DoubleDuckLab",
"home": {
"intro": "首页 Hero 副标题文案",
"sections": {
"highlights": "Highlights/重点信息 标题",
"featuredProjects": "Featured Projects/精选项目 标题"
},
"highlights": [
{ "title": "研究方向", "desc": "研究方向描述" },
{ "title": "近期成果", "desc": "近期成果描述" },
{ "title": "招生与合作", "desc": "招生方向、合作方式、联系方式描述" }
]
}
}/join 与 /en/join 采用 Markdown 内容驱动，路径如下：
src/content/join/recruitment/
overview_cn.md
overview_en.md
说明：
- 中文页读取
overview_cn.md - 英文页读取
overview_en.md frontmatter.title可选，用于页面主标题- 正文支持完整 Markdown（列表、图片、代码块等）
成员内容使用 Astro Content Collections，文件位置：
src/content/members/*.md
头像资源目录：
public/member/images/
默认头像（未匹配到成员头像时使用）：
public/images/avatar-default.png
---
id: "zhang-wei"
name:
zh: "张伟"
en: "Wei Zhang"
role:
zh: "博士生"
en: "PhD"
area:
zh: "多模态智能体"
en: "Multimodal Agents"---
id: "li-ming"
name:
zh: "李明"
en: "Ming Li"
role:
zh: "硕士生"
en: "Master"
status:
zh: "在读"
en: "Current"
area:
zh: "机器人规划"
en: "Robot Planning"
bio:
zh: "研究方向聚焦于机器人规划与控制。"
en: "Focused on robot planning and control."
avatar: "/member/images/custom-li-ming.png"
links:
scholar: "https://scholar.google.com/"
github: "https://github.com/yourname"
homepage: "https://example.com"
email: "liming@xxx.com"
---字段说明：
- 必填：
id、name.zh/en、role.zh/en、area.zh/en - 可选：
status、bio、avatar、links links子字段可选：scholar、github、homepage、email
显示规则（不填即不显示）：
- 不写
bio：详情页不显示简介区块 links四项都不写：详情页不显示 Links 区块links.email写了：详情页显示完整邮箱文本，可点击复制。- 不写
status：列表卡片右上角不显示状态角标（PI 默认也不显示）
系统会自动按 name 去找同名头像：
public/member/images/<name>.png
public/member/images/<name>.jpg
public/member/images/<name>.svg
示例：
name.zh: "张教授"->public/member/images/张教授.pngname.en: "Prof. Zhang"->public/member/images/Prof. Zhang.jpg
支持中文文件名。
列表页默认按以下顺序展示：
- PI（负责人）
- 在组成员：PhD -> Master -> RA
- 离组成员：PhD -> Master -> RA
状态角标颜色：
- 蓝色：
在读 / 在职（Current / Active） - 绿色：
已毕业 / 已离开（Alumni / Former）
项目模块采用“每个项目一个目录 + 中英文各两篇 Markdown（概览/背景）”的结构。
目录结构：
src/content/projects/<slug>/
overview_cn.md
overview_en.md
background_cn.md
background_en.md
说明：
<slug>会作为项目详情页路径：/projects/<slug>/与/en/projects/<slug>/overview_*用于“项目概览”区块background_*用于“背景与目标”区块- 正文是标准 Markdown，支持图片、列表、代码块等
overview 文件支持可选 frontmatter（建议写）：
title: "Project Orion"
tag: "Embodied AI"
status: "进行中"
links:
repo: "https://github.com/xxx"
demo: "https://example.com/demo"
paper: "https://example.com/paper"显示逻辑：
- 详情页固定保留：项目概览、背景与目标
links三项（repo/demo/paper）全部可选- 三项都不写：
Links区块不显示 - 只写某几项：只显示对应按钮
- 列表卡片只显示上方 badge 状态，不再重复显示“项目状态：xxx”文案
将项目图片放到：
public/prj/
在项目 markdown 里引用：
或者也可以单独一个项目创建一个文件夹方便管理
- 新建目录：
src/content/projects/my-new-project/ - 放四个文件：
overview_cn.md、overview_en.md、background_cn.md、background_en.md - 在
overview_cn.md / overview_en.md顶部填title/tag/status/links(可选) - 正文写 Markdown，图片放
public/prj后用/prj/xxx.png引用 - 运行
npm run build与npm run preview验证
论文内容使用 Astro Content Collections，文件位置：
src/content/papers/*.md
每篇 paper 的 frontmatter 最小模板（仅必填）：
year: 2025
title: "Embodied Skill Transfer with Sparse Demo"
venue: "ICRA"完整模板（可选字段全部展示）：
---
year: 2025
title: "Embodied Skill Transfer with Sparse Demo"
venue: "ICRA"
abstract: |
We study skill transfer with sparse demonstrations and propose a lightweight pipeline
that improves generalization across tasks.
links:
online: "https://example.com/paper"
pdf: "/papers/embodied-skill-transfer.pdf"
project: "https://doubleducklab.com/projects/embodied-skill-transfer"
code: "https://github.com/nightt5879/DoubleDuckLab"
bibtex: |
@inproceedings{demo2025,
title={Embodied Skill Transfer with Sparse Demo},
author={First Author and Second Author},
booktitle={ICRA},
year={2025}
}
---字段说明：
- 必填：
year、title、venue - 可选：
abstract、links、bibtex links子字段全部可选：online、pdf、project、code
详情页显示规则：
- 不写
abstract：不显示 Abstract/摘要 区块 links四项都不写：不显示 Links 区块links只写某一项：仅显示对应按钮- 不写
bibtex：不显示 Citation (BibTeX) 区块
links.pdf 支持两种写法：
- 外链：
https://... - 站内静态路径：
/papers/xxx.pdf
如果使用站内路径，请把 PDF 文件放到：
public/papers/xxx.pdf
新闻模块采用“每条新闻一个目录 + 中英文各一篇 Markdown”的逻辑。
你只要按下面 4 步操作，就会自动出现在新闻列表和详情页。
src/content/news/<slug>/
<slug> 会直接作为详情页路径：
- 中文：
/news/<slug>/ - 英文：
/en/news/<slug>/
示例：
src/content/news/2026-02-20/
src/content/news/<slug>/
实验室春季招新启动_cn.md
Spring_recruitment_started_en.md
命名规则：
- 中文文件必须以
_cn.md结尾 - 英文文件必须以
_en.md结尾 - 文件名前半部分会作为该语言标题（
_会自动转空格）
也就是说，上面示例最终标题会是：
- 中文标题：
实验室春季招新启动 - 英文标题：
Spring recruitment started
正文可以直接使用 Markdown 语法：
- 段落、标题、列表
- 图片、链接
- 代码块、引用等
可选 frontmatter（推荐保留 date）：
date: "2026-02-20"说明：
date可选；不写时会尝试从目录名推断（如2026-02-20）- 中英文正文互相独立，可分别编辑
建议目录：
public/news/
在 Markdown 里这样写：
与project一样，是可以分具体的小文件，方便进行管理
- 只放了
_cn.md或只放了_en.md：该新闻不完整。 - 文件名后缀写成
_zh.md：不会被识别，必须是_cn.md。 - 图片不显示：确认路径是
/news/xxx.png，并且文件真实位于public/news/xxx.png。
推荐使用 Cloudflare Pages。
构建命令：
npm run build
输出目录：
dist
上面指令就完成了网站的静态编译，接下来会从0开始完成使用cloudflare pages进行配置，具体请点这里
计划中的功能：
- 可视化编辑主页元素
- 自动通过Google scholar抓取论文
- 更加0代码基础的可视化编辑后台（优先本地）
欢迎提交 Issue 或 Pull Request。
MIT License
DoubleDuckLab 来源于中山大学的一个网络昵称 “双鸭山大学”。
项目旨在为科研团队提供一个简单、现代、易维护的官网模板。