队名：从容应队 队长：丁欣雨（前端：奥运详情） 队员：甘雨欣（UI设计全部） 钱逸文（前端：中国骄傲） 苏芷菱（前端：首页） 作品主题：奥运健儿风采展示
奥运，那是人类挑战自我极限的神圣舞台，而奥运健儿们则是 舞台上最璀璨的主角。他们如同追逐星辰的飞鸟，穿越风雨，跨 越阻碍，只为心中那团燃烧的奥运圣火。为了赞颂他们的竞技精 神，以奥运健儿风采展示为主题，开展网页设计。
该网页致力于展示奥运健儿的卓越风采，包括首页、奥运项目详情和中国优秀运动员介绍。首页设有奥运会发展历史与运动员缩略图，引导用户深入了解。奥运详情部分展示各项目的历史与获奖国家，通过图表展示奖牌数据。中国骄傲部分呈现了杰出运动员的成就与精彩瞬间，结合图片和文字，并结合各种动画。网页采用响应式设计，提供良好的用户体验，传播奥运精神与拼搏故事。
正在完善中...
.
|--.vscode
|--node_modules
|--public
|--src
| |--components
| |--DetailsOfTheOlypic
| | |--icons
| | |--images
| | |Detail-Gymnastics.vue
| | |Detail-Pingpong.vue
| | |Details.vue
| | |timelineGymn.vue
| | |timelinePingpong.vue
| |--images
| |--pages
| | |--Enter.vue
| | |--HomePage.vue
| |--router
| | |--index.ts
| |--router
| |--App.vue
| |--main.ts
|--gitignore
|--env.d.ts
|--index.html
|--package-lock.json
|--package.json
|--README.md
|--tsconfig.app.json
|--tsconfig.json
|--tsconfig.node.json
|--vite.config.ts
- 动画设计：主要通过css动画
- 交互设计：主要通过主要通过鼠标滚轮，点击等交互方式，减少用户交互负担的同时增强用户代入感
- 设计工具: Figma（UI设计）
- 色彩理念：奥运会网页色彩理念主要采用蓝色、红色和黄色，蓝色象征信任与和平，红色表达激情与活力，黄色体现希望与快乐，整体色彩组合传递出团结、竞争和友谊的奥林匹克精神，吸引用户关注。
- 包管理器：npm
- 前端框架：vue
# 安装依赖
npm install
# 运行项目
npm run dev
# 打包项目
npm run build
由于时间仓促，作品仍存在一些地方还需优化，部分动画效果没有精细的修改，敬请见谅。