jack 的个人主页

🎨 设计理念

这个主页融合了 Tech-Minimalist 和 Cyberpunk 风格，反映了你的技术特质：

视觉风格

• 深色主题 (#0a0e17) - 符合程序员的夜间工作习惯
• 霓虹渐变 (蓝-紫) - 科技感与未来感
• 网格背景动画 - 工程思维的体现（结构化、精确）
• 等宽字体细节 (JetBrains Mono) - 程序员的标志

交互体验

• 滚动显现动画 - 内容随滚动优雅呈现
• 悬停效果 - 微交互提升用户体验
• 视差滚动 - Hero 区域的深度感
• 响应式设计 - 完美适配各种屏幕

📝 内容组织

1. Hero 区域

• 个人定位：AI 技能开发者 | 自动化工程师
• 核心价值：探索 AI 自动化边界 · 构建智能技能生态

2. 数据统计

• 100+ AI 技能开发
• 50+ 自动化流程
• 30K+ Moltbot 社区参与
• ∞ 技术好奇心

3. 关于我

四个核心特质：

• 🔧 务实主义者 - 注重实际效果，喜欢能解决问题的工具
• 🚀 自动化爱好者 - 相信自动化是提高效率的关键
• 🔒 隐私捍卫者 - 数据应该由用户自己掌控
• 💡 商业思维者 - 技术需要找到商业价值

4. 项目作品

1. 成就系统 (开发中) - 游戏化的成就追踪
2. AI 提示词转 Skill (运行中) - 完整的自动化工作流
3. Moltbot 研究 (持续中) - 深入分析生态系统
4. SearXNG 自建 (已部署) - 隐私保护搜索引擎
5. 技能市场探索 (规划中) - AI 技能商业化路径
6. 自动化工作流 (持续优化) - 全流程自动化

5. 兴趣爱好

• 🤖 AI 技能开发
• 📝 提示词工程
• ⚡ 自动化工作流
• 🔬 技术研究
• 🎮 游戏化设计
• 🛡️ 数据隐私

6. 联系方式

• Email
• GitHub
• Slack

🚀 如何使用

本地预览

# 使用 Python 启动本地服务器
cd /root/clawd/jack-portfolio
python3 -m http.server 8000

# 访问 http://localhost:8000

部署到静态托管

• GitHub Pages: 免费托管，支持自定义域名
• Netlify: 自动化部署，支持表单
• Vercel: 极速 CDN，全球分发
• Cloudflare Pages: 零配置部署

自定义配置

修改以下内容以个性化：

1. 联系方式 (#contact 部分)

   • Email 地址
   • GitHub 用户名
   • 其他社交平台

2. 项目链接

   • 将所有 href="#" 替换为实际的项目链接

3. 统计数据

   • 根据实际数据更新数字

🎨 自定义颜色

在 <style> 标签中修改 CSS 变量：

:root {
    --bg-primary: #0a0e17;        /* 主背景色 */
    --bg-secondary: #111827;      /* 次背景色 */
    --accent-primary: #3b82f6;    /* 主强调色 */
    --accent-secondary: #8b5cf6;  /* 次强调色 */
}

📱 响应式断点

• 桌面: > 768px
• 移动: ≤ 768px

🔧 技术栈

• HTML5 - 语义化结构
• CSS3 - 动画和布局
• Vanilla JavaScript - 交互效果
• Google Fonts - Space Grotesk + JetBrains Mono
• 零依赖 - 纯原生实现

✨ 特色功能

1. 动画背景网格 - 20秒循环移动
2. 滚动触发动画 - 元素优雅显现
3. 悬停卡片提升 - 微交互反馈
4. 渐变文字效果 - 现代视觉风格
5. 等宽代码字体 - 技术感细节

🎯 设计目标

✅ 独特性 - 避免通用的 AI 生成美学 ✅ 专业性 - 展示技术实力和品味 ✅ 记忆点 - 让访客记住你 ✅ 功能性 - 清晰传达价值主张 ✅ 性能 - 快速加载，流畅交互

📄 文件结构

jack-portfolio/
├── index.html          # 主页面 (30KB)
├── README.md          # 说明文档（本文件）
└── screenshots/       # 截图目录（可选）

🚀 下一步

1. 预览页面 - 在浏览器中打开查看效果
2. 替换链接 - 更新所有项目链接
3. 添加内容 - 补充更多信息
4. 部署上线 - 选择托管平台发布
5. 分享推广 - 在社交平台分享链接

💬 反馈

这是基于我们聊天记录创建的第一个版本。如果你想调整：

• 颜色方案
• 内容组织
• 动画效果
• 添加新板块

随时告诉我，我会立即修改！

---

Created with ❤️ by Momo · 2026-02-02