0ec6c00e3f
品牌定位升级： - 🎯 产品名称：赋灵犀素材管理系统 - 💡 核心价值：企业素材，本地存储，安全无忧 - 🔐 主打卖点：部署在您的NAS · 数据100%掌控 · 永久免费使用 导航优化（Header）： - 📱 精简导航菜单：从5项减少到3项 - 系统功能（原功能特性） - 版本定价（原定价） - 联系购买（原联系我们） - 🗑️ 移除：技术规格、更新日志 - 🎯 更聚焦核心转化路径 内容精简（Pricing）： - 🗑️ 移除冗余服务说明（技术支持、培训描述等） - ✨ 优化定制版功能描述（更专业、更清晰） - UI界面深度定制 - 第三方系统集成对接（ERP/CRM/OA） - 私有化部署方案设计 - 长期技术维护服务 代码优化：-26行 +12行，提升页面加载速度
FLNXI电商素材系统 - 官方网站
📖 项目简介
FLNXI电商素材系统官方网站，采用苹果官方UI设计规范，展示系统功能特性、技术规格和定价方案。
核心特点
- 🎨 苹果风格设计 - 遵循Apple Design Guidelines
- ⚡ 性能优化 - Next.js 14 + React 18
- 📱 响应式布局 - 完美适配各种设备
- 🎭 流畅动画 - Framer Motion动画效果
- 🔍 SEO优化 - 完整的Meta标签和结构化数据
✨ 功能特性
页面模块
- Hero区域 - 醒目的标题和CTA按钮
- 功能展示 - 8大核心功能介绍
- 技术规格 - 详细的系统要求和技术架构
- 定价方案 - 标准版和定制版选择
- 联系方式 - 多种沟通渠道
- 响应式导航 - 桌面端和移动端适配
UI特点
- 玻璃态效果（Glassmorphism）
- 流畅的滚动动画
- 悬停交互效果
- 渐变色彩搭配
- 阴影和模糊效果
🛠️ 技术栈
- 框架: Next.js 14 (App Router)
- UI库: React 18
- 样式: Tailwind CSS 3
- 动画: Framer Motion
- 图标: Lucide React
- 语言: TypeScript
- 部署: Docker
🚀 快速开始
环境要求
- Node.js 18+
- npm 或 yarn 或 pnpm
安装依赖
npm install
# 或
yarn install
# 或
pnpm install
开发模式
npm run dev
# 或
yarn dev
# 或
pnpm dev
访问 http://localhost:3000 查看网站
构建生产版本
npm run build
npm start
🐳 Docker部署
构建镜像
docker build -t flnxi-website .
运行容器
docker run -p 3000:3000 flnxi-website
Docker Compose
docker-compose up -d
📁 项目结构
xiaso/
├── app/
│ ├── globals.css # 全局样式
│ ├── layout.tsx # 根布局
│ └── page.tsx # 主页
├── components/
│ ├── Header.tsx # 页头导航
│ ├── Hero.tsx # 英雄区
│ ├── Features.tsx # 功能特性
│ ├── TechSpecs.tsx # 技术规格
│ ├── Pricing.tsx # 定价方案
│ ├── Contact.tsx # 联系方式
│ └── Footer.tsx # 页脚
├── public/ # 静态资源
├── package.json
├── tailwind.config.ts
├── tsconfig.json
└── next.config.js
🎨 设计规范
本网站严格遵循苹果官方UI设计规范：
颜色系统
- 主色调：Apple Blue (#0071e3)
- 灰度：Apple Gray系列
- 渐变：蓝色到紫色
字体
- SF Pro Display / SF Pro Text
- -apple-system字体栈
间距
- 使用4px基准网格
- 大量留白空间
动画
- 缓动曲线：ease-out
- 时长：300-600ms
- 微交互反馈
🔧 自定义配置
修改品牌信息
编辑 app/layout.tsx 中的metadata：
export const metadata: Metadata = {
title: '你的网站标题',
description: '你的网站描述',
// ...
}
修改Logo
替换 next.config.js 中的图片URL，或将Logo放入 public/ 目录
修改配色
编辑 tailwind.config.ts 中的颜色配置
📝 许可证
Copyright © 2025 FLNXI. 保留所有权利。
📞 联系我们
- 📧 Email: contact@flnxi.com
- 🌐 演示站: http://sc.flnxi.com
- 💬 微信: 扫码添加企业微信
使用 ❤️ 和 Next.js 构建