stoa 是一家虚构的建筑事务所，在莫斯科和迪拜设有工作室，业务涵盖建筑、公共空间和室内。我把它的网站做成概念，展示我如何为设计事务所打造编辑式作品集：让项目撑起页面，文字保持克制。

名称刻意使用小写。stoa 是古希腊城市中带顶的柱廊，一个没有墙的公共空间，网站也保持同样的克制：黑白配色、小写英文排版、方括号按钮。动效要显得缓慢而有分量，但不能妨碍访客抵达任何一个项目、文章或职位。

十个页面：首页、项目列表、项目页、工作室、专栏、文章页、招聘、联系、隐私和 404。内容虽是虚构，但很完整：10 个项目、5 篇专栏文章、6 个招聘职位，以及深色地图上的 2 个工作室。

首页以计数加载器和视频首屏开场，随后依次是随滚动点亮的价值观、服务、带计数器的事务所故事、配浮动图片的精选项目、以 [ + ] 折叠面板呈现的奖项，以及可拖动的专栏轮播。项目页可按专业筛选，并在错落网格与带光标预览的列表之间切换；每个项目页都有项目信息、导语、视差图片、可拖动图库和通往下一个项目的链接。

文字被切分成经过测量的行并逐行显现；图片自下而上揭开并从轻微放大中落定；每个内部链接都会用一块计数到 100 的浅色面板收起页面，自定义光标显示 [ view project ] 和 [ read ] 标签。网站为纯 HTML、CSS 和 JavaScript，使用 GSAP、ScrollTrigger、Lenis 和 Leaflet 地图；表单仅作演示，不发送任何内容。

这个概念由 10 个已完成的英文页面组成。2026 年 9 月 22 日，我检查了其中在 Chrome 中渲染的 9 个（不含 404）：9 个页面标题全部唯一并声明了语言，布局在 390 px 下无横向滚动，100% 的图片有替代文本，没有失效的内部链接。

Lighthouse 测量了首页。移动端：性能 88、无障碍 95、最佳实践 77、SEO 100，LCP 2.9 秒、CLS 0.008、TBT 0 毫秒。桌面端：性能 99，LCP 0.9 秒，CLS 0.003。由于首屏为全高清视频，移动端首页共 21 个请求、13.4 MB。