一次面向社区增长的重构:HAMi 文档与官网为什么要全面改版

从信息架构、首页设计、社区展示、案例沉淀、博客体验、移动端适配到搜索能力,这次重构不是简单“换皮”,而是一次围绕 HAMi 社区影响力与文档可用性的系统升级。

这次改版不是简单地换一套样式,而是希望把 HAMi 社区的技术表达、内容组织与用户体验,一次性拉到一个更适合长期演进的基础上。欢迎体验新版 HAMi 官网 https://project-hami.io,也欢迎给 HAMi 官网 提交 Issue

过去两个月里,我围绕文档官网做了一轮比较彻底的重构(见 GitHub)。对外看,它像是一次“视觉改版”;但从社区维护者和内容建设者的角度看,这更像是一次信息架构、内容系统和前端体验的整体升级。

这篇文章想系统说明三件事:我们为什么要做这次重构、这次到底改了什么、以及这些改动对 HAMi 社区意味着什么。

为什么要重构官网和文档

HAMi 是一个 CNCF 托管的开源项目,由「Dynamia 密瓜智能」发起和贡献给 CNCF,这几年在 GPU 虚拟化、异构算力调度和 AI 基础设施方向的影响力持续扩大。社区内容越来越多,用户类型也越来越复杂:既有第一次了解项目的新访客,也有来查部署文档、看架构图、找案例、了解生态的工程师和企业用户。

原有站点并不是不能用,但随着内容量增长,几个问题逐渐暴露出来:

  • 首页表达的信息密度不够,难以快速建立对项目价值的整体认知。
  • 文档、博客、社区信息之间的连接不够顺畅,内容入口分散。
  • 搜索体验不稳定,外部方案在实际使用中并不理想。
  • 移动端访问体验还有不少细节问题,尤其是导航、卡片布局和页脚区域。
  • 页面视觉风格不够统一,难以把社区影响力和工程成熟度直观传递出来。

对于一个处在快速演进期的开源社区来说,官网不只是“放文档的地方”,而是社区的公共界面。它需要同时承担项目介绍、知识入口、采用证明、社区连接和品牌表达的职责。

所以这次重构的目标很明确:不是做一次表层美化,而是把官网真正升级为 HAMi 社区的系统化入口。

这次重构重点做了什么

这轮更新并不是单点修改,而是连续完成的一组系统性改造。

首页重新设计,信息架构彻底梳理

这次最明显的变化是首页。

我们重新设计了首页结构,不再只是简单堆叠若干内容区块,而是围绕“项目定位 -> 核心能力 -> 生态入口 -> 内容沉淀 -> 社区信任”这条主线来组织页面。

具体来说,首页完成了几类关键升级:

  • 重做了 Hero 区域,强化第一屏的信息传达和行动入口。
  • 优化了 CTA 设计,让用户可以更快进入文档、博客和资源内容。
  • 新增并强化了多个首页 section,用更结构化的方式展示项目价值和社区外延。
  • 调整了区块之间的视觉层次、背景氛围和滚动节奏,让首页从“内容列表”变成“叙事页面”。

这部分改动包含首页 Hero 动效与氛围层、研究/故事 section、新的资源入口 section、CTA 刷新、统一背景层设计,以及后续对视觉噪音的持续收敛。它们共同解决的是一个核心问题:让访问者在几秒钟内理解 HAMi 是什么、为什么值得继续看下去。

架构图重绘,让技术表达更直观

对于基础设施项目来说,文字说明远远不够,架构图质量会直接影响理解成本。

图 1: HAMi 官网首页的架构图
图 1: HAMi 官网首页的架构图

这次改版过程中,一个非常重要但容易被低估的工作,就是把首页和相关内容中的架构表达重新梳理,并持续重绘关键图示。这样做的价值不只是“更好看”,而是让用户更容易理解 HAMi 在整个 AI 基础设施体系中的位置、能力边界和协作关系。

本次重构,围绕 GPU 虚拟化、控制面/数据面、依赖关系、分层结构、治理路径等主题,站点新增和更新了多张 SVG 与静态图。这意味着官网正在从“文字驱动”转向“图文共同承担解释任务”的表达方式。

图 2: 使用 HAMi 前后对比图,凸显 HAMi 的 GPU 虚拟化和共享能力
图 2: 使用 HAMi 前后对比图,凸显 HAMi 的 GPU 虚拟化和共享能力

对于 HAMi 这样的项目,这种变化非常关键。因为社区面对的不是单一功能点,而是一整套与 Kubernetes、调度器、GPU Operator、异构设备和企业平台协同的系统问题。图示质量上去以后,官网本身就成了更好的技术入口。

新增案例、社区与生态表达,让影响力更可见

这次重构还有一个很重要的方向,就是补齐“社区证明”层。

过去很多开源项目的网站都容易陷入一个问题:文档很全,但用户看不出来这个项目到底有没有被真正采用、社区是否活跃、生态是否在扩展。HAMi 官网这次改版,显然是在有意识地解决这个问题。

图 3: HAMi 生态和设备支持
图 3: HAMi 生态和设备支持

我们重点强化了几类内容表达:

  • 更适合承载案例与实践经验的内容入口。
  • 更清晰的社区板块与关于信息。
  • 更直观的生态与资源 section。
  • 对贡献者、采用者、生态伙伴这类“社区影响力信号”的集中展示。

这里面有些模块已经直接体现在首页和导航结构里,有些则体现在内容入口与整体表达方式的变化中。核心思路是一致的:HAMi 不应该只被看作一个“功能型项目”,而应该被看作一个持续成长的开源社区与生态节点。

网站首页新增:采用者和贡献者组织列表。

图 4: HAMi 采用者
图 4: HAMi 采用者
图 5: HAMi 贡献者组织
图 5: HAMi 贡献者组织

这也是为什么改版后,首页会更强调社区、生态、资源和外部链接的组织方式。对一个开源项目来说,被理解、被采用、被信任,很多时候同样重要。

博客样式和内容阅读体验整体升级

除了首页,这次对博客系统也做了很多细节重构。

博客卡片、博客列表、分类信息、元数据样式、分页、链接表现和封面元信息都做了持续调整。博客卡片从更传统的展示方式,逐步优化成更统一、更干净、阅读负担更低的样式。

图 6: HAMi 网站的博客列表页面
图 6: HAMi 网站的博客列表页面

这件事的意义不只是“看起来更舒服”。

因为对 HAMi 社区而言,博客并不是附属内容,而是文档之外非常重要的传播层。很多用户第一次认识一个项目,并不是从安装文档开始,而是从一篇技术文章、一次案例解读或者一张架构图开始。

把博客样式和内容承载体验做好,实际上是在增强社区的叙事能力:

  • 技术文章更易读。
  • 项目进展更容易被传播。
  • 架构思考和实践经验更容易被沉淀。
  • 社区公众号和官网博客之间的联动也会更顺畅。

从这个角度看,博客系统的重构,本质上也是社区基础设施的一部分。

移动端体验做了大量细节优化

这轮更新里,移动端优化是一个很明确的主线,而且不是一次性修修补补,而是持续多轮打磨。

本次重构还对移动端进行了优化:

  • 导航栏间距与折叠菜单交互。
  • 菜单按钮点击热区。
  • 语言切换与下拉表现。
  • 卡片布局、首页区块间距与 Hero 偏移。
  • 移动端页脚排版与信息密度。
  • 搜索入口和导航滚动行为。

这些改动看起来碎,但它们决定了手机访问时是不是“顺手”。

图 7: HAMi 网站移动端
图 7: HAMi 网站移动端

HAMi 社区有很多用户会直接在手机上看文章、搜资料、转发内容,移动端体验如果做不好,社区传播链路就会被切断一大截。现在这部分明显更稳了,导航更易点,页面更清楚,信息也没有以前那么拥挤。

这次改版另一个很值得一提的点,是页脚区被认真重做了。

过去很多技术站点的 Footer 都只是几个链接的堆叠,但这次更新里,Footer 的布局、可访问性、移动端表现和链接组织方式都做了明显增强。它不再只是页面底部的“附属区域”,而是承担了站点导航补充、社区触点和品牌收束的作用。

图 8: HAMi 网站 footer
图 8: HAMi 网站 footer

这对开源社区尤其重要。因为用户在页面底部往往会寻找几个关键信号:

  • 还有哪些内容入口可以继续看。
  • 如何联系社区。
  • 站点是否持续维护。
  • 项目的对外表达是否完整。

一个更成熟的 Footer,实际上会提升整站的可信度和完成度。

替换掉不好用的 Algolia 搜索,回到站点内建搜索

搜索是这次改版里最务实、也最能直接提升体验的一项改动。

图 9: HAMi 网站内建搜索
图 9: HAMi 网站内建搜索

过去外部搜索方案虽然看起来“高级”,但在多语言、内容组织和实际交互上并不总是适合当前站点。我对网站的内建搜索做了增强,包括:

  • 搜索索引结构优化。
  • 搜索按钮与触发交互修复。
  • 搜索结果样式统一。
  • 搜索结果去重、评分与限制优化。
  • 对中文场景和内容分类的更好适配。

对文档站来说,搜索不是锦上添花,而是核心路径。用户找不到内容,再好的页面设计都没有意义。

因此,这次从不好用的外部搜索切回更可控的站内搜索方案,本质上是在把“内容可达性”重新掌握在自己手里。这对多语言技术文档和博客混合型站点尤其重要。

这次改版对 HAMi 社区意味着什么

如果只从页面截图看,这次更新像是“官网变好看了”。但从社区建设的角度看,它的意义更深一层。

第一,HAMi 的对外表达开始更系统了。

官网不再只是分散的页面集合,而是在逐步形成一条完整的叙事链:用户可以从首页理解项目价值,从文档理解能力细节,从博客理解实践路径,从社区和生态模块理解项目影响力。

第二,社区内容资产被重新组织了。

过去很多有价值的文章、图示和说明,可能存在但不够容易被看见。现在通过首页 section、导航和搜索重构,这些内容被更有效地串联起来了。

第三,HAMi 的社区形象更成熟了。

一个成熟的开源项目,不只是代码仓库活跃,还需要有清晰、稳定、可持续的官网表达。网站的结构、风格和易用性,本身就是社区工程能力的一部分。

第四,这为后续继续扩展案例、采用者、贡献者与生态内容打下了基础。

基础框架理顺之后,未来不管是增加更多 case study、补充社区协作入口,还是展示更多采用者和生态伙伴,都会比过去更自然,也更容易被用户理解。

作为社区贡献者,我最看重这次改版的三点

如果用一句话概括,我会认为这次重构真正做对了三件事:

  • 把官网从“内容堆放处”升级成了“社区入口”。
  • 把视觉优化和信息架构调整一起做,而不是只换皮肤。
  • 把搜索、移动端、导航、页脚这些基础体验补齐了。

这几件事听起来不如发一个新特性那样显眼,但它们会直接影响社区内容传播、用户理解成本和项目的长期形象。

对于 HAMi 这样的基础设施项目来说,技术能力当然是根本,但把技术能力讲清楚、组织好、持续呈现出来,同样是一种基础设施。

总结

这轮 HAMi 文档与官网的重构,本质上是在补社区“表达层”的基础设施。

它一方面提升了页面视觉和阅读体验,另一方面也重新梳理了内容组织、首页叙事、搜索路径、移动端访问和社区信号展示方式。首页重新设计、架构图重绘、博客样式统一、移动端优化、Footer 增强,以及从外部搜索回归内建搜索,这些改动合在一起,才构成了这次真正意义上的“重构”。

对外,它让更多人更快理解 HAMi;对内,它也让社区后续继续沉淀案例、扩展生态、服务采用者与贡献者有了更稳固的载体。

官网不是开源社区的附属品,而是社区长期影响力的一部分。HAMi 这次改版,正是在把这件事认真做起来。

如果你关注 Kubernetes 中的 GPU 虚拟化,想要提高 GPU 资源利用率,可以添加我的微信 jimmysong,或者扫描下面的二维码获取更多资讯。

图 10: 加入 HAMi 社区
图 10: 加入 HAMi 社区
宋净超(Jimmy Song)

宋净超(Jimmy Song)

专注于 AI 原生基础设施与云原生应用架构的研究与开源实践。

文章导航

评论区