该技能旨在帮助用户绘制多邻国(Duolingo)风格的原创角色。所有规则均来自多邻国公开品牌指南(“形状语言”,design.duolingo.com/illustration)或对该指南中发布的矢量绘图进行的测量(原始数据见 reference/measurements.md)。
用途
该技能用于指导绘制具有多邻国扁平插画风格的原创人物和角色,适用于插画、UI 设计、品牌相关创作等场景。用户需要创建新角色时,可遵循这些规则确保风格一致。注意:不得复制多邻国自有角色(如 Duo、Lily、Zari、Bea、Vikram 等)或其标志,这些是商标。
主要能力
技能提供了详细的绘制规范,涵盖以下方面:
- 框架:所有角色在统一框架中绘制,头部宽度为 100 单位,中心为 (0,0),y 轴向下。所有数值均基于此单位,比例可适应任何尺寸。
- 形状语言:仅使用三种形状——圆角矩形(最常用)、圆形和圆角三角形。每个角都是圆角,无尖角形状。胶囊形是完全圆角的矩形。使用最少形状讲述故事,每个形状都重要。通过大小形状并置创造节奏。无轮廓线,仅用纯色分隔部分。每种颜色最多一个明度阶梯,无渐变和纹理。不使用透明度模拟深色。扁平透视:地面阴影是药丸形,不是椭圆形。颜色少,避免灰色,使用冷色调粉彩替代。
- 比例:头部为高胶囊形或墓碑形,宽 100,高 115 至 125。脖子为圆角矩形,宽约头部宽度的 1/3(约 28)。躯干(半身像)为墓碑形,宽 144,顶部在 y 68。短全身躯干为圆角方形或圆形,宽约 1.45 倍头宽。手臂为胶囊形,厚度 36 至 40。手为圆形,直径约头宽一半(半径 25)。手指为胶囊形,宽度为手直径的 1/3(16)。
- 手臂:手臂是厚胶囊形,从肩到腕厚度一致,宽度约等于脖子。肩部连接点始终隐藏在躯干后。手臂可伸直或有一个弯折(两个胶囊共用一个圆形肘部)。避免连续曲线(“香蕉”臂)和单独的肘部或肩部球体。当上臂和前臂可见时,长度应相近。肘部应打破轮廓线以显示弯曲。下垂手臂几乎垂直向下,外展 9 至 15 度,手在臀部高度。
- 手和手指:手为圆形,直径约头宽一半(1.3 倍手臂厚度)。穿袖手臂先画手再画袖子覆盖。手指为胶囊形,宽度为手直径 1/3,最多四个指头(含拇指)。不同手势使用不同最小结构:拳头只需圆形;点赞为拳头加拇指胶囊;指点为拳头加食指胶囊;挥手或张开手为四个短胶囊扇形展开;平摊手掌为薄水平药丸形。避免“叉子”手指(三根细平行手指加拇指)。
- 同色重叠和阴影:袖子与躯干同色时融合,无轮廓和额外阴影。手落在可读位置:脸上、轮廓边缘、物体上或空中。手遮脸时使用皮肤深一阶阴影。同色部分在后可深一阶。持物时按袖子、物体、手的顺序绘制。持边缘时手放在边缘后,只露上半部分。
- 面部:眼睛为白色竖立药丸形(完全圆角矩形),约 30x40,中心间距约 39,位于头部中间稍上(y 约 -8)。瞳孔为深色药丸形(13x20),位于眼睛上半部,不加眉毛。情绪通过切割眼白和瞳孔大小表达。鼻子为眼睛之间的一两个圆角矩形,用“特征”色(更深更饱和的肤色)。嘴巴是最不几何的形状,通常偏向一侧,可打破面部轮廓。表情包括微笑、大笑、张嘴、咬牙等。 extras 包括泪滴、眼袋、面部毛发(鼻子与皮肤同色)。
- 头部和头发:头发简单,一两个大形状。耳朵上方必须有头发或鬓角。提供两种发型配方:波波头为头部后一个墓碑形加前额直刘海,同色;卷发为几个不同大小圆形(节奏)覆盖在短发基座上。耳朵可选,眼睛高度的小圆形。角色间变化头宽高、眼睛风格、鼻子和头发,但结构不变。
- 姿势:讲述故事,增加个性。避免静态无表情角色。剪影测试:填充单色后手势仍可读。大小测试:在最终显示尺寸(如 60px 高)检查手、肘和表情是否可读。偏好可读的手部位置。测试过的姿势包括:手扶额头(叹气)、双臂上举 V 形(欢呼)、点赞、自我拥抱(悲伤寒冷)、手撑太阳穴肘放桌上(压力)、双手持手机、手机贴耳另一手持咖啡、盘腿手放膝盖(平静)、躺在床上持毯子。浮动装饰(心形、音符、水滴)在服务插图时可少量使用。
- 图层顺序(从后到前):后发、在躯干后的手臂(肩隐藏)、脖子、躯干/领子/图案、头部/面部/前发/配饰、手要覆盖的物体(如贴耳手机)、前臂袖子(与躯干融合)、手持物体(如杯子)、抓握的手(在最上)、手前的物体(如双手持手机)。
- 颜色:提供官方调色板(名称和十六进制值),包括中性色、红色、黄色和橙色、绿色、蓝色、粉色和紫色。每个角色有皮肤、皮肤阴影(深一阶,用于手遮脸、眼袋)、特征色(更深更饱和,用于鼻子、闭眼、闭嘴)、头发、衣服及一个衣服阴影。提供示例皮肤三色组(浅色、暖色)。面部颜色:眼白 #FFFFFF,瞳孔 #3C3C3C,张嘴 #B03A3A,舌头 #F15A5A。柔和“之前”版本:将每种颜色按明度映射到冷色调粉彩渐变(从 #4A4680 深到 #DEDAFF 浅),绝不使用灰色。保持眼白和牙齿白色。衣服比皮肤深约一阶。
- 工作流程:阅读请求(角色身份、情绪、出现位置和尺寸、输出格式);选择部件(头形、眼睛风格、鼻子、头发、衣服、调色板);在 100 单位框架中按比例表构建,需要代码时从 reference/kit.mjs 开始;姿势(选择手势,放置肩部、肘部、手中心,保持臂段长度相近);面部(设置表情);渲染并检查(对照数值、运行检查清单、在最终显示尺寸查看);修复可读性差的部分(先改姿势再增加形状)。
- 检查清单:在展示前检查以下项:仅使用圆角矩形、圆形和圆角三角形;无轮廓、渐变或透明度阴影;手臂厚度约等于脖子宽度(100 宽头约 38);肩部无球体露出;每个手臂伸直或有一个弯折,臂段长度相近,前臂交叉身体时肘部打破轮廓;手为圆形,直径约头宽一半,手指仅在需要时出现(胶囊形,宽为手 1/3,最多 4 个指头);躯干有圆肩(半身像顶部为半圆);眼睛为白色药丸形,瞳孔在上半部,无眉毛,闭眼使用深肤色;最多一个明度阶梯,同色袖子与躯干融合,手遮脸深一阶;头发一两个形状,覆盖耳朵上方;在最终尺寸可读,剪影可读姿势。
- 常见错误和修复:列出已犯错误及修复方法,例如细棍手臂(手臂应为脖子粗细)、肩部球体(肩部更低更内)、珠子手(手直径应为头宽一半)、叉子手指(用圆形,手指仅在需要时出现且为厚胶囊)、麻袋身体(使用墓碑形躯干)、胸前双色棍(融合袖子,让肘部和手表达姿势)、“手放胸前”读作散点(手落在轮廓边缘或脸上)、“鳍”伸出(上臂靠近身体,肘部为侧面短凸起)、脸颊肿胀(手放太阳穴或清晰手势)、杯子被手臂遮挡(按袖子、物体、手顺序绘制)、下巴下两个球(手放边缘后只露上半)、柔和版本中手消失(衣服深一阶)、吉祥物漂浮头旁(站在角色旁边地面上)。
使用方式
用户可根据上述规则手动绘制,或参考提供的代码工具。reference/measurements.md 包含从指南绘图中获取的原始数值以及每个数值的来源绘图。reference/kit.mjs 是一个无依赖的 JavaScript 工具包(Node 18+),可绘制两个示例角色的九种姿势,遵循上述所有规则。每个函数返回纯形状数据。使用方式需根据实际代码实现。
适用场景
适用于需要多邻国扁平插画风格的原创角色设计,如教育应用、游戏、品牌宣传、UI 插画等。特别适合需要保持角色一致性和可读性的场景,尤其是小尺寸显示。
限制
禁止复制多邻国自有角色和标志。所有规则基于公开品牌指南,不得编造未提供的功能、收费、平台或效果。缺失事实暂未提供。代码工具的使用细节需参考实际文件。