{
  "id": "corporate-memphis",
  "type": "styles",
  "status": "published",
  "name": {
    "zh": "企业孟菲斯",
    "en": "Corporate Memphis"
  },
  "aliases": [
    "企业孟菲斯",
    "大厂插画风",
    "蓝色小人插画",
    "长手长脚扁平小人",
    "科技公司插画风",
    "Alegria",
    "Big Tech illustration",
    "flat blob people"
  ],
  "category": [
    "Style",
    "Visual Language"
  ],
  "description": {
    "zh": "用扁平抽象人形与受限纯色表示「友好大厂」的插画视觉语言：小头长肢、无面部细节、 紫黄桃等有限色板，圆润色块构图。生产成本低、人人可画，也因此高度同质。",
    "en": "Flat abstract human figures and a limited solid palette as the friendly big-tech illustration look: small heads, exaggerated limbs, no facial detail, purple-yellow-peach blocks in rounded compositions. Cheap to mass-produce — and therefore highly homogenous."
  },
  "use_when": [
    {
      "zh": "SaaS、工具类产品的空状态、引导页、营销插画，需要无攻击性的友好感",
      "en": "SaaS empty states, onboarding and marketing spots that need non-threatening friendliness"
    },
    {
      "zh": "多人多地协作维护插画系统，要求画风可复制",
      "en": "Illustration systems produced by many hands that must stay consistent"
    },
    {
      "zh": "要传达包容、协作、普惠的抽象价值观",
      "en": "Abstract values of inclusion, collaboration and access"
    }
  ],
  "avoid_when": [
    {
      "zh": "品牌需要独特记忆点，同质化插画会让产品淹没在大厂语汇里",
      "en": "Brands that need distinction — this look drowns you in big-tech sameness"
    },
    {
      "zh": "高端、奢侈、手作、严肃议题，扁平小人撑不起重量",
      "en": "Premium, craft or serious subjects that flat figures cannot carry"
    },
    {
      "zh": "用插画传达具体产品功能，抽象人形说不清细节",
      "en": "Explaining concrete product mechanics — abstract figures cannot"
    }
  ],
  "tags": [
    "illustration",
    "flat",
    "corporate",
    "big-tech",
    "figures"
  ],
  "variants": [
    {
      "id": "people",
      "name": {
        "zh": "经典人形",
        "en": "Memphis people"
      },
      "note": {
        "zh": "小头长肢扁平小人，动作夸张，常配紫黄桃",
        "en": "Small-headed long-limbed figures in exaggerated poses"
      }
    },
    {
      "id": "abstract",
      "name": {
        "zh": "抽象色块",
        "en": "Abstract shapes"
      },
      "note": {
        "zh": "无人物，只用圆角矩形、圆点与弧线色块",
        "en": "No figures — rounded rectangles, dots and arcs only"
      }
    },
    {
      "id": "gradient-flat",
      "name": {
        "zh": "渐变扁平",
        "en": "Gradient flat"
      },
      "note": {
        "zh": "扁平形体加双色渐变，比纯色多一层柔光",
        "en": "Flat shapes washed with two-stop gradients"
      }
    }
  ],
  "applicable_components": [
    "card",
    "avatar",
    "button",
    "badge"
  ],
  "applicable_pages": [
    "landing-page",
    "signup"
  ],
  "related": [
    {
      "id": "flat-design",
      "relation": "similar_to"
    },
    {
      "id": "memphis",
      "relation": "alternative_to"
    },
    {
      "id": "organic",
      "relation": "alternative_to"
    },
    {
      "id": "empty-state",
      "relation": "used_with"
    },
    {
      "id": "onboarding-tour",
      "relation": "used_with"
    },
    {
      "id": "card",
      "relation": "affects"
    }
  ],
  "confusable": [
    {
      "id": "memphis",
      "note": {
        "zh": "企业孟菲斯是 2017 后的扁平人形插画；孟菲斯是 1980s 米兰的波点波浪撞色家具语汇。",
        "en": "Corporate Memphis is post-2017 flat figure illustration; Memphis is the 1980s Milano dots-and-squiggles movement."
      }
    }
  ],
  "demo": {
    "component": "corporate-memphis",
    "modes": [
      "default",
      "dark",
      "variants"
    ]
  },
  "playground": {
    "task": {
      "zh": "免费试用进入协作工作区；原首屏日历可操作上一月、下一月和日期，支持跨年切月与选日，初始固定为 2024-01-17。原「任务 5」「笔记 12」入口分别打开真实的 5 项初始任务与 12 条可读取笔记。填写任务和负责人创建所选日期的任务，完成/取消完成同步待办计数、进度及所选日期摘要；新增、读取、删除笔记同步首屏笔记总数。内部重置或刷新均恢复 2024-01-17、5 项待办与 12 条笔记；产品、客户、价格、招聘、登录各有内容，无真实账号或团队邀请。",
      "en": "Try it free opens the collaboration workspace. Operate the original hero calendar’s previous/next month and date controls, including year boundaries and date selection; the fixed initial date is 2024-01-17. The original Tasks 5 and Notes 12 entries open five actual seeded tasks and twelve readable notes. Create an owner-assigned task for the selected date; complete/uncomplete tasks to update pending counts, progress and the selected-date summary. Add, read and delete notes with synchronized hero note totals. In-page reset or reload restores 2024-01-17, five pending tasks and twelve notes. Product, Customers, Pricing, Careers and Log in reveal content without real accounts or team invitations."
    },
    "checks": [
      {
        "zh": "逐一操作 alegria 原导航和主 CTA，检查对应内容与返回路径，不只是点击提示。",
        "en": "Use alegria’s original navigation and primary CTAs; inspect content and return paths, not just click notices."
      },
      {
        "zh": "操作原首屏日历跨年切月与选日；从「任务 5」「笔记 12」读取初始内容，新增/完成任务及新增/读取/删除笔记，核对待办数、进度、所选日摘要与笔记总数联动。",
        "en": "Use the original hero calendar across year boundaries and select a date; open Tasks 5 and Notes 12 to read seeded content, add/complete tasks and add/read/delete notes, checking pending counts, progress, date summary and note totals together."
      },
      {
        "zh": "用键盘和 390px / 320px 检查重排、焦点与校验；分别执行内部重置和整页重载，确认恢复 2024-01-17、5 项待办与 12 条笔记，且不持久保存操作。",
        "en": "Check reflow, focus and validation with keyboard and 390px / 320px viewports; test in-page reset and document reload separately, confirming restoration of 2024-01-17, five pending tasks and twelve notes without persistent state."
      }
    ]
  },
  "sources": [
    {
      "name": "Wikipedia — Corporate Memphis",
      "url": "https://en.wikipedia.org/wiki/Corporate_Memphis"
    },
    {
      "name": "Wikipedia — Flat design",
      "url": "https://en.wikipedia.org/wiki/Flat_design"
    }
  ],
  "implementation": {
    "css": [
      "border-radius: 999px",
      "background: #7B61FF",
      "clip-path: ellipse()",
      "fill (SVG)",
      "no box-shadow"
    ],
    "notes": {
      "zh": "插画用 SVG 或纯色块拼装：头是正圆，躯干圆角矩形，四肢是加粗圆头线条（stroke-linecap: round）。 色板锁 3～5 色，肤色用蓝 紫 绿等非写实色表示包容。禁止描边渐变阴影，全部纯色平涂。 UI 部件同源：大圆角胶囊按钮、无边框卡片、留白充足。深色模式换深底但保留同一组高饱和色。",
      "en": "Build illustrations from SVG or solid blocks: circle heads, rounded-rectangle torsos, limbs as thick round-cap strokes. Lock the palette to 3–5 colors; skin is blue, purple or green for abstract inclusivity. No outlines, gradients or shadows — flat fills only. UI follows the same source: pill buttons, borderless cards, airy padding. Dark mode swaps the ground but keeps the same saturated set."
    }
  },
  "prompts": {
    "basic": {
      "zh": "用企业孟菲斯风格（Corporate Memphis）设计界面：扁平抽象小人、长手长肢、紫黄桃有限色板、圆润色块。",
      "en": "Design an interface in Corporate Memphis style: flat abstract figures with exaggerated limbs, a limited purple-yellow-peach palette and rounded solid shapes."
    },
    "design": {
      "zh": "企业孟菲斯设计规范：主紫 #7B61FF、辅黄 #FAD141、桃粉 #F48196、点缀青 #14C88C，肤色用 #86CCCA 类非写实色； 插画纯平涂无描边无阴影；标题几何无衬线（Poppins / Nunito 类），中粗即可不要压迫感； 按钮全胶囊，卡片无边框靠底色分区；大留白、插画占 hero 40%～60%； 深色模式深紫黑底，色块饱和度保持。",
      "en": "\"Corporate Memphis spec: primary purple #7B61FF, yellow #FAD141, peach #F48196, teal accent #14C88C, non-realistic skin like #86CCCA; illustrations strictly flat with no strokes or shadows; geometric sans (Poppins/Nunito family) at medium weight; full-pill buttons and borderless cards separated by fill; airy whitespace with illustration taking 40–60% of the hero; dark mode on deep purple-black with saturation kept.\""
    },
    "implementation": {
      "zh": "用当前风格完成 alegria 同品牌完整页面，从原首屏延续到内容、具体操作结果和返回路径，而非孤立控件或局部 demo。保留品牌、首屏文案、素材、构图、tokens 与全部 variants。以当前 YAML preview 为品牌、原导航与 CTA 的事实来源，不替换成通用营销模板。\n\n保留 alegria 原 .gs-tasko-grid 四列：介绍/头像、真实日历及任务入口、绿色专注统计、笔记与励志卡；不是另造占 hero 40%–60% 的人物插画。页底为 #FFF8F0，紫色 #7B61FF 操作、白卡与 #E8DFF5 细边、24px token 圆角，字体沿用 Poppins/Nunito 系统回退栈；保留统计卡与励志卡原有渐变。日历采用固定六周格和紫色选中日，1020px 以下按已有容器规则两列、600px 以下单列。工作台继续真实任务/笔记列表，不用抽象人物替换它们。\n\n复用当前 preview.tokens：背景 #FFF8F0；前景 #2B2140；强调 #7B61FF / #FFFFFF；卡面 #FFFFFF；边框 #E8DFF5；圆角 24px；字体 Poppins, Nunito, Helvetica Neue, PingFang SC, sans-serif；卡影 none。\n\ndark 与 variants 复用 generic-style-pages.css 已有工作区选择器，不据通用历史变体重画首屏；保留 renderer 内各视觉面板的局部高光、渐变和投影。\n\n免费试用进入协作工作区；原首屏日历可操作上一月、下一月和日期，支持跨年切月与选日，初始固定为 2024-01-17。原「任务 5」「笔记 12」入口分别打开真实的 5 项初始任务与 12 条可读取笔记。填写任务和负责人创建所选日期的任务，完成/取消完成同步待办计数、进度及所选日期摘要；新增、读取、删除笔记同步首屏笔记总数。内部重置或刷新均恢复 2024-01-17、5 项待办与 12 条笔记；产品、客户、价格、招聘、登录各有内容，无真实账号或团队邀请。\n\n静态封面、详情演示与 /style-scenes/corporate-memphis/（英文 /en/style-scenes/corporate-memphis/）共用 renderer；静态封面不嵌套真实按钮，详情在独立文档中启用同款页面的语义控件与品牌内容延续。原导航和 CTA 必须到达对应内容或工作流，不用占位链接、仅变颜色或一句 toast 代替结果。\n\n操作状态仅存在当前页面内存；刷新、工具栏重载/重置与模式切换均恢复初始状态，不使用 localStorage 或 sessionStorage。页内清空/重置用于撤销本次操作，不暗示跨页或持久保存。\n\n提供返回、取消或清空/重置路径，说明仅当前页内存的状态边界；不伪装真实支付、邮件、登录、AI 或云同步。桌面、390px、320px 按内容换行重排，保留可读字号和触控目标，不整体缩小桌面页。控件有可访问名称、键盘操作、可见焦点；弹层支持关闭和焦点返回，表单校验与结果可被辅助技术读到；尊重 prefers-reduced-motion。",
      "en": "Build a complete alegria page in this style, extending the original hero into content, concrete operations and return paths rather than isolated controls or a partial demo. Preserve brand, hero copy, assets, composition, tokens and all variants. The current YAML preview is authoritative for the brand, original navigation and CTAs; never substitute a generic marketing template.\n\nPreserve alegria’s original .gs-tasko-grid: intro/avatars, real calendar/task entry, green focus statistics, and notes/motivation, not a replacement figure illustration occupying 40–60% of the hero. Keep #FFF8F0, #7B61FF actions, white cards, #E8DFF5 rims, the 24px token radius and Poppins/Nunito fallback stack; retain the existing stats/motivation gradients. The calendar uses a fixed six-week grid and violet selected day; existing container rules pair columns below 1020px and stack below 600px. Continue real task/note lists rather than substituting abstract figures.\n\nReuse current preview.tokens: background #FFF8F0; foreground #2B2140; accent #7B61FF / #FFFFFF; card #FFFFFF; border #E8DFF5; radius 24px; font Poppins, Nunito, Helvetica Neue, PingFang SC, sans-serif; card shadow none.\n\nUse generic-style-pages.css’s existing workspace dark/variants selectors rather than redrawing the hero from generic historical variants; retain each rendered visual panel’s local highlights, gradients and shadows.\n\nTry it free opens the collaboration workspace. Operate the original hero calendar’s previous/next month and date controls, including year boundaries and date selection; the fixed initial date is 2024-01-17. The original Tasks 5 and Notes 12 entries open five actual seeded tasks and twelve readable notes. Create an owner-assigned task for the selected date; complete/uncomplete tasks to update pending counts, progress and the selected-date summary. Add, read and delete notes with synchronized hero note totals. In-page reset or reload restores 2024-01-17, five pending tasks and twelve notes. Product, Customers, Pricing, Careers and Log in reveal content without real accounts or team invitations.\n\nShare one renderer between static covers, the detail experience and /style-scenes/corporate-memphis/ (English /en/style-scenes/corporate-memphis/). Static covers contain no nested live buttons; the detail experience enables the same page’s semantic controls and brand continuation in an independent document. Original navigation and CTAs reach actual content or workflows, not placeholder links, color-only changes or one-line toasts.\n\nInteraction state lives only in this page’s memory. Reload, toolbar reset and mode changes restore initial state; do not use localStorage or sessionStorage. In-page clear/reset undoes this visit’s operations without implying cross-page or persistent saves.\n\nProvide return, cancel or clear/reset paths and disclose the page-memory state boundary; never fake real payments, email, login, AI or cloud sync. Reflow desktop, 390px and 320px layouts with readable text and usable targets rather than shrinking the desktop page. Give controls accessible names, keyboard access and visible focus; overlays close and return focus, validation/results are announced; respect prefers-reduced-motion."
    },
    "agent": {
      "zh": "用当前风格完成 alegria 同品牌完整页面，从原首屏延续到内容、具体操作结果和返回路径，而非孤立控件或局部 demo。保留品牌、首屏文案、素材、构图、tokens 与全部 variants。以当前 YAML preview 为品牌、原导航与 CTA 的事实来源，不替换成通用营销模板。\n\n保留 alegria 原 .gs-tasko-grid 四列：介绍/头像、真实日历及任务入口、绿色专注统计、笔记与励志卡；不是另造占 hero 40%–60% 的人物插画。页底为 #FFF8F0，紫色 #7B61FF 操作、白卡与 #E8DFF5 细边、24px token 圆角，字体沿用 Poppins/Nunito 系统回退栈；保留统计卡与励志卡原有渐变。日历采用固定六周格和紫色选中日，1020px 以下按已有容器规则两列、600px 以下单列。工作台继续真实任务/笔记列表，不用抽象人物替换它们。\n\n复用当前 preview.tokens：背景 #FFF8F0；前景 #2B2140；强调 #7B61FF / #FFFFFF；卡面 #FFFFFF；边框 #E8DFF5；圆角 24px；字体 Poppins, Nunito, Helvetica Neue, PingFang SC, sans-serif；卡影 none。\n\ndark 与 variants 复用 generic-style-pages.css 已有工作区选择器，不据通用历史变体重画首屏；保留 renderer 内各视觉面板的局部高光、渐变和投影。\n\n完整页面操作：\n免费试用进入协作工作区；原首屏日历可操作上一月、下一月和日期，支持跨年切月与选日，初始固定为 2024-01-17。原「任务 5」「笔记 12」入口分别打开真实的 5 项初始任务与 12 条可读取笔记。填写任务和负责人创建所选日期的任务，完成/取消完成同步待办计数、进度及所选日期摘要；新增、读取、删除笔记同步首屏笔记总数。内部重置或刷新均恢复 2024-01-17、5 项待办与 12 条笔记；产品、客户、价格、招聘、登录各有内容，无真实账号或团队邀请。\n\n静态封面、详情演示与 /style-scenes/corporate-memphis/（英文 /en/style-scenes/corporate-memphis/）共用 renderer；静态封面不嵌套真实按钮，详情在独立文档中启用同款页面的语义控件与品牌内容延续。原导航和 CTA 必须到达对应内容或工作流，不用占位链接、仅变颜色或一句 toast 代替结果。\n\n操作状态仅存在当前页面内存；刷新、工具栏重载/重置与模式切换均恢复初始状态，不使用 localStorage 或 sessionStorage。页内清空/重置用于撤销本次操作，不暗示跨页或持久保存。\n\n提供返回、取消或清空/重置路径，说明仅当前页内存的状态边界；不伪装真实支付、邮件、登录、AI 或云同步。桌面、390px、320px 按内容换行重排，保留可读字号和触控目标，不整体缩小桌面页。控件有可访问名称、键盘操作、可见焦点；弹层支持关闭和焦点返回，表单校验与结果可被辅助技术读到；尊重 prefers-reduced-motion。\n\n不新增依赖。检查中英文、原导航与 CTA、具体结果、返回/重置和窄屏重排；报告实际运行的检查与待验项，不将实现要求写成已通过结论。",
      "en": "Build a complete alegria page in this style, extending the original hero into content, concrete operations and return paths rather than isolated controls or a partial demo. Preserve brand, hero copy, assets, composition, tokens and all variants. The current YAML preview is authoritative for the brand, original navigation and CTAs; never substitute a generic marketing template.\n\nPreserve alegria’s original .gs-tasko-grid: intro/avatars, real calendar/task entry, green focus statistics, and notes/motivation, not a replacement figure illustration occupying 40–60% of the hero. Keep #FFF8F0, #7B61FF actions, white cards, #E8DFF5 rims, the 24px token radius and Poppins/Nunito fallback stack; retain the existing stats/motivation gradients. The calendar uses a fixed six-week grid and violet selected day; existing container rules pair columns below 1020px and stack below 600px. Continue real task/note lists rather than substituting abstract figures.\n\nReuse current preview.tokens: background #FFF8F0; foreground #2B2140; accent #7B61FF / #FFFFFF; card #FFFFFF; border #E8DFF5; radius 24px; font Poppins, Nunito, Helvetica Neue, PingFang SC, sans-serif; card shadow none.\n\nUse generic-style-pages.css’s existing workspace dark/variants selectors rather than redrawing the hero from generic historical variants; retain each rendered visual panel’s local highlights, gradients and shadows.\n\nFull-page operations:\nTry it free opens the collaboration workspace. Operate the original hero calendar’s previous/next month and date controls, including year boundaries and date selection; the fixed initial date is 2024-01-17. The original Tasks 5 and Notes 12 entries open five actual seeded tasks and twelve readable notes. Create an owner-assigned task for the selected date; complete/uncomplete tasks to update pending counts, progress and the selected-date summary. Add, read and delete notes with synchronized hero note totals. In-page reset or reload restores 2024-01-17, five pending tasks and twelve notes. Product, Customers, Pricing, Careers and Log in reveal content without real accounts or team invitations.\n\nShare one renderer between static covers, the detail experience and /style-scenes/corporate-memphis/ (English /en/style-scenes/corporate-memphis/). Static covers contain no nested live buttons; the detail experience enables the same page’s semantic controls and brand continuation in an independent document. Original navigation and CTAs reach actual content or workflows, not placeholder links, color-only changes or one-line toasts.\n\nInteraction state lives only in this page’s memory. Reload, toolbar reset and mode changes restore initial state; do not use localStorage or sessionStorage. In-page clear/reset undoes this visit’s operations without implying cross-page or persistent saves.\n\nProvide return, cancel or clear/reset paths and disclose the page-memory state boundary; never fake real payments, email, login, AI or cloud sync. Reflow desktop, 390px and 320px layouts with readable text and usable targets rather than shrinking the desktop page. Give controls accessible names, keyboard access and visible focus; overlays close and return focus, validation/results are announced; respect prefers-reduced-motion.\n\nAdd no dependencies. Check both languages, original navigation/CTAs, concrete results, return/reset and narrow reflow; report checks actually run and pending items, never requirements as passed results."
    }
  },
  "style_spec": {
    "typography": {
      "zh": "几何无衬线中粗字，宽松行距",
      "en": "Geometric sans at medium weight, airy leading"
    },
    "color": {
      "zh": "紫 #7B61FF × 黄 #FAD141 × 桃 #F48196，肤色非写实",
      "en": "Purple #7B61FF, yellow #FAD141, peach #F48196, non-realistic skin"
    },
    "border": {
      "zh": "无描边，色块直接相接",
      "en": "No outlines — fills meet directly"
    },
    "shadow": {
      "zh": "无阴影，纯平涂",
      "en": "No shadows, flat fills only"
    },
    "spacing": {
      "zh": "大留白，插画与文案左右分栏",
      "en": "Airy padding, illustration and copy in split columns"
    },
    "motion": {
      "zh": "150–200ms 的平涂色切换，无位移",
      "en": "150–200ms flat fill colour swaps, no movement"
    },
    "states": {
      "zh": "hover 换用相邻色块；focus 用紫色 2px 可见外框；active 换深色平涂；disabled 降不透明；error 用桃粉平涂",
      "en": "Hover switches to an adjacent fill; focus shows a visible 2px violet frame; active uses a darker flat fill; disabled reduces opacity; error uses a peach fill"
    }
  },
  "preview": {
    "order": 21,
    "keywords": {
      "zh": "扁平小人 · 友好 · 大厂感",
      "en": "FLAT & FRIENDLY"
    },
    "url": "alegria.works",
    "scene": "tasko",
    "brand": "alegria",
    "nav": [
      {
        "zh": "产品",
        "en": "Product"
      },
      {
        "zh": "客户",
        "en": "Customers"
      },
      {
        "zh": "价格",
        "en": "Pricing"
      },
      {
        "zh": "招聘",
        "en": "Careers"
      }
    ],
    "heroTitle": {
      "zh": "一起把事情",
      "en": "Let's make things"
    },
    "heroTitle2": {
      "zh": "做简单",
      "en": "simpler together"
    },
    "heroSub": {
      "zh": "友好、包容、人人可用的协作空间。",
      "en": "A friendly, inclusive workspace for everyone."
    },
    "cta": {
      "zh": "免费试用 →",
      "en": "Try it free →"
    },
    "heroCaption": {
      "zh": "LONG LIMBS. SHORT STANDUPS.",
      "en": "LONG LIMBS. SHORT STANDUPS."
    },
    "features": [
      {
        "t": {
          "zh": "扁平人形",
          "en": "Flat figures"
        },
        "s": {
          "zh": "长手长脚",
          "en": "Long arms and legs"
        }
      },
      {
        "t": {
          "zh": "有限色板",
          "en": "Limited palette"
        },
        "s": {
          "zh": "紫黄桃三色",
          "en": "Purple, yellow and peach"
        }
      },
      {
        "t": {
          "zh": "圆润构图",
          "en": "Rounded composition"
        },
        "s": {
          "zh": "胶囊与色块",
          "en": "Pills and color blocks"
        }
      }
    ],
    "panel": "shapes",
    "tokens": {
      "bg": "#FFF8F0",
      "fg": "#2B2140",
      "sub": "#7A6B8C",
      "accent": "#7B61FF",
      "accentFg": "#FFFFFF",
      "card": "#FFFFFF",
      "cardBorder": "#E8DFF5",
      "radius": "24px",
      "font": "Poppins, Nunito, Helvetica Neue, PingFang SC, sans-serif",
      "heroSize": "24px",
      "triCards": [
        "#7B61FF",
        "#FAD141",
        "#F48196"
      ]
    }
  }
}