jiuheruixin.com 官网方向 · 2026-10-05

四个方向，
都是真页面。

每个方向都是能直接打开、能切换 EN / 繁 的首页，用的是你自己的作品：LAZY CAT COFFEE、LazyCat Display、OK to Print、Layout Dice、芠硕标志和名承短片。桌面和手机都可以看，页面底部的黑色小条可以在 A B C D 之间切换。

A九宮 Grid

把习字帖的九宫格当成整套网站系统。红色格线、米字格里描红写出"九合瑞欣"，鼠标移到哪格，哪格变大。

家族
Index 型，设计师眼中的设计公司
参考
Order、OK-RM、Porto Rocha、Pentagram
字体
Host Grotesk + IBM Plex Mono；中文昭源宋體
色彩
纸白、墨黑、朱红格线
招牌
描红写字、会呼吸的九宫格、作品索引跟随预览图
打开方案 A →
方案 A 桌面首屏方案 A 手机首屏

B留白 Quiet

日本、台湾设计公司式的克制：一句衬线大字，作品统一尺寸，每个板块左侧竖排一列繁体字，作为中英双语的签名。

家族
以一句话立论的顾问型设计公司
参考
good design company、Takram、Kontrapunkt、叁語設計
字体
Newsreader（全站一套）；中文昭源宋體
色彩
暖白和墨色，颜色只来自作品
招牌
竖排中文标签随滚动停留，图片缓慢浮现
打开方案 B →
方案 B 桌面首屏方案 B 手机首屏

C色場 Colour

"瑞欣"的喜气。四色方块拼出公司名，鼠标移上去翻牌翻出作品；每个作品一整屏色卡，往下滚时像翻页一样叠上来。

家族
作品与自家产品并列的创作型工作室
参考
Collins、Mucho、Spin、Dinamo、Studio Feixen
字体
Mona Sans 可变宽度；中文昭源黑體
色彩
朱橙、奶油、钴蓝、明黄、墨黑
招牌
翻牌、色卡翻页、随滚动伸缩字宽的大字
打开方案 C →
方案 C 桌面首屏方案 C 手机首屏

D夜 Night

暗场里排着九宫格作品，鼠标是一块印刷用的玻璃放大镜：经过哪里就放大、折射、点亮哪件作品，并标出项目名。

家族
沉浸式工艺层，叠在作品档案之上
参考
Koto、Toby Ng、BLOW、Lusion、Studio Dumbar
字体
Geist + Geist Mono；中文昭源黑體
色彩
近黑、暖白，作品是唯一的光
招牌
WebGL 液态玻璃放大镜（不支持时自动退回静态）、LAZY CAT 影片
打开方案 D →
方案 D 桌面首屏方案 D 手机首屏

调研要点

  1. 字体就是品牌。核对过字体的 21 家里，Koto、Wolff Olins、Kontrapunkt、Instrument 等 7 家用自有字体，没有一家用 Inter、Poppins、Montserrat。四个方案都只用一套主字体。
  2. 黑白加一个强调色。Collins、Koto、Manual、Further 都是近黑、近白加一个亮色，其中三家是橙色。
  3. 首屏是一句话、作品本身或自家字体，不用图库图或设备样机。
  4. 动效只做一个招牌。Pentagram 主样式表里没有动画；每家只在一处下功夫，还要照顾低端手机和"减少动态效果"设置。
  5. 自家产品单独标出来。Order 的字体铺、Kontrapunkt 的 Type 都有独立入口；插件不和客户作品混在一起不加标注。
  6. 语言用网址结构区分，不用国旗。正式版建议 /en/ 和 /zh-hk/ 两套网址。
  7. 中文用香港字形和香港书面语。字体用开源的昭源黑體、昭源宋體（Chiron HK），用词如"品牌形象""電郵""私隱政策"，导航用港澳台通用词。

截图了 32 家设计公司官网，核对了 21 家的 CSS 字体

正式上线前需要你确认

  1. 香港公司的注册名称（英文、中文，含 Limited / 有限公司）。香港公司条例要求公司网站写明注册名称。现在页面里先写的是 Jiuhe Ruixin / 九合瑞欣。
  2. 联络方式：对外邮箱（页面里 hello@jiuheruixin.com 是占位，还没开通）、+852 电话或 WhatsApp、香港地址；要不要给台湾放 LINE、给澳门放微信。
  3. 作品清单：芠硕标志和名承短片要不要放进香港站；还有没有其他可以公开的项目。
  4. OK to Print 是否已在 Figma Community 上架，页面里的链接是按插件 ID 写的。
  5. 私隱政策：上线时一起加（香港 PDPO 要求有收集个人资料的说明）。