Github 的设计系统是开发者设计的绝佳资源。以下是一些明确针对开发者角色定制的原则：
因此，秉承这些原则，以下是我团队今年发布的一些关键界面。需要注意的是，我的团队只有 4 个人（2 名设计师和 2 名开发人员），我们是一家节奏飞快的初创公司。我们的设计最初都是以 MVP 的形式发布的，上线后会进行迭代，并且经常基于现有系统进行构建，从 0 到 1，并尽快获得真正的外部验证。本文中的所有设计均由我和Will Rust共同创作。设计是一项团队运动。
我将介绍的屏幕：
作为终端用户，我们现在对聊天界面非常熟悉。作为开发者，使用 LLM（大型语言模型）进行聊天，与Chat GPT、Duck Assist或Perplexity等 AI 平台上的终端用户体验几乎完全相同。关键在于尽可能简洁明了，并提供快速简洁的答案。
主要区别在于，人工智能开发人员还会根据模型的速度、构建的简易性、兼容性和部署性来评估模型。
保持与传统搜索引擎一样简洁，但提供更细致的第二层信息，展现其底层运作，包括文档链接、展示模型速度的基准数据，以及每个令牌成本等其他数据。以下是我们在 Modular 中解决这个问题的方法。
我们使用的UI 框架：https : //www.gradio.app/、Mantine、Tailwind
屏幕 1 — 简单的“开始聊天”介绍屏幕，向用户展示它的型号、运行的硬件以及处理的流量。
当然，所有内容都兼容明暗模式。以下是暗黑模式版本，我们将聊天功能嵌入到了开发者控制台中。
屏幕 2 — 聊天结果，显示基准数据，以及教程、代码和部署此模型的后续步骤的链接。
截图 3 — 嵌入式版本。为了实现此版本，我们使用 RAG 专门针对我们的文档对 MAX 进行了训练。此实验目前仅面向内部用户，并有望尽快发布。
AI 开发者需要做的最重要的事情之一就是评估 GenAI 模型。首先，你需要搜索模型库——也称为“模型花园”、“模型库”或“模型中心”。出于市场营销/SEO 的原因，这通常需要用户注销登录，主要目的是向用户展示你的平台兼容的所有模型，并鼓励他们登录后再进行更深入的模型测试。我们的模型库位于builds.modular.com。
这里最重要的功能本质上是搜索和过滤。你要确保用户能够从包含数百甚至数千个模型的庞大数据集中找到他们想要的内容。
屏幕 2 — 模型详情页。此页面会告诉用户每个模型有多少个变体，如何在本地快速运行模型，以及如何根据需要将其部署到云端的 GPU。
有一些有趣的技术细节与模型参数大小、量化、硬件兼容性等有关。但最终一切都归结为格式塔聚类和创建正确的层次结构。
我在这里最常参考的是 Huggingface（因为他们是这个领域的领导者）、Kaggle（因为他们拥有蓬勃发展的社区）、Together AI（因为他们是企业级的）和 Replicate（因为每天 8 万次点击量已经很多了）：
与所有成功的 UI 一样，设计时务必牢记用户思维。AI 开发者在设计模型时，会考虑模型能够完成哪些任务、模型的大小、性能以及开发者是谁。
游乐场是指专为实验、测试和学习而设计的环境，不会影响现有系统或生产环境。对于 AI 开发者来说，更具体地说，它包括试用 AI 模型、测试提示以及微调参数等功能，无需大量的基础设施。
我们现在才刚刚开始运行，所以我只会谈论主要功能并展示一些参考。
主要特点：
这与整个控制台体验完美衔接。
从布局和信息架构的角度来看，这与其他桌面控制台类似。我们使用 Tailwind、Mantine 和 ChartJS 来制作。
这里最有趣的 UI 功能是数据监控仪表盘。如果你曾经设计过企业仪表盘，那么其余部分其实都差不多——基于角色的访问控制、计费、组织层级结构（内部成员可以邀请其他成员）、通知、设置等等。
好吧，让我们开始讨论最重要的部分——文档！每个人都喜欢设计文档 ;)这就是我们的文档。这实际上是我第一次完全自主设计一个文档网站。我们使用Docusuarus和Algolia搜索，它的用户界面非常棒，开箱即用！
就信息架构而言，我们在这里讨论了几种方法，并归纳为两个总体概念：
无论您选择哪种方式，重申这一点的登录页面都至关重要。
我们访问量最大的页面是“快速入门”（这并不奇怪！）。我们正在持续优化此页面，以加快竞争速度并提高完成率。
一些参考：
正如我之前提到的，Algolia 搜索功能非常强大。它的效果如下：
食谱（或烹饪书）是一种简单却标准化的分步说明。它们最具交互性的形式是笔记本，每个部分都是可执行代码。最简单的形式是一系列包含可复制/粘贴代码片段的说明。
正如我提到的，我们的构建过程极其迭代，所以我们的 MVP 实际上只是渲染一个 GitHub 代码示例，并在右侧标注元数据。我发现，对于这类受众来说，越简洁明了越好。内容本身非常密集，设计不应该过于引人注目。
这些文章的设计系统很大一部分在于如何渲染代码，因此，拥有一个井然有序的明暗模式系统至关重要。我们使用mantine 系统来实现这一点，并在其中设置自定义颜色。您也可以参考 CLI 配色方案的最佳实践，例如本文所示：https ://hamvocke.com/blog/lets-create-a-terminal-color-scheme/
别忘了体验一下命令行界面 (CLI)、ASCII 字体和清晰的进度条！至于命令行界面的用户体验，我试着教我的工程团队成员 10 条基本的 NNG 原则，其中最重要的一条就是“系统状态可见性”。
我非常高兴能够构建更多工作流程并分享它们。我希望接下来专注于代理工作流程和云监控仪表板。
作为参考，以下是我为 Modular 创建的通用角色模型。目前我们的目标人物是“解决方案构建者”。
敬请关注，感谢您的阅读
