TomoTools iconTomoTools
  • 首页
  • 工具
  • 攻略
  • 关于
  • 联系
TomoTools iconTomoTools
TomoTools iconTomoTools

为 Tomodachi Life 玩家准备的温柔型同人工具站。

非官方同人项目,与 Nintendo 无关联,也未获其认可。

浏览
  • 首页
  • 工具
  • 攻略
热门
  • Compatibility Tester
  • Food & Gift Tracker
  • Personality Quiz
关于
  • 关于 TomoTools
  • 设计笔记
  • 联系
法律
  • Cookie 政策
  • 隐私政策
  • 服务条款
© 2026 TomoTools. 保留所有权利。
设计笔记

Island Breeze:把 TomoTools 的视觉规则讲清楚。

Island Breeze 把 TomoTools 的视觉规则整理成一页可阅读的专题,解释它如何处理柔和、节奏与“像玩具一样的质感”。

方向

要平静,不要冷冰冰

整站尽量避开传统 SaaS 的硬边节奏,转向更圆润的块面、更轻的深度和更松的留白。

表面层级

用层次,不用硬边框

区块主要依靠色调层级和轻微抬升来区分,而不是到处画 1px 线。

字体

带一点编辑感的轻松排版

全站使用 Plus Jakarta Sans,并通过更明确的层级和更紧的展示标题字距保持高级感。

核心原则

  • 优先用 surface 层级制造边界感,而不是可见的硬性轮廓。
  • 在添加装饰前,先增加圆角和留白。
  • 每个主要页面至少保留一块足够透气、略带不对称的区域。
  • 按钮要有柔软、像实体玩具一样的触感,同时保持明确的焦点反馈。

避免什么

  • 不要用厚重黑影或硬分割线去制造结构。
  • 不要因为“放得下”就把内容全塞进同一个面板。
  • 不要为了柔和感牺牲无障碍、对比度和键盘可访问性。

一份设计说明,已经变成真正的网站

Island Breeze 的意义在于把这套系统说清楚:它看起来柔和,但并不是没有规则。