logo-generator

🎯 数据驱动的Logo放置与品牌实现

网站Logo位置优化与品牌实现指南,基于89%品牌记忆率数据,提供顶部左侧放置、链接规范、无障碍访问等最佳实践,适配AI/SaaS产品的行业设计趋势。

收藏
3.8k
安装
978
版本
1.0.0
CLS 安全扫描中
预计需要 3 分钟...

使用说明

核心功能

logo-generator 是一套面向网站开发者的Logo放置与品牌实现技能,聚焦导航效率与品牌记忆两大目标。

显著优点

1. 数据驱动的位置决策
技能引用用户行为研究数据:顶部左侧放置的品牌记忆率达89%,显著高于右侧(21%),且用户从中央Logo返回主页的失败率高6倍。这为设计决策提供了量化依据。

2. 全链路实施规范
覆盖从品牌指南读取(自动检测 .claude/project-context.md.cursor/project-context.md)、HTML实现(SVG格式、alt文本规范、首页链接)、到多平台适配(375px/768px/1024px断点测试)的完整工作流。

3. AI/SaaS垂直领域专精
针对AI产品设计趋势提供行业图谱:六边形(技术平台)、旋转符号(生成式AI)、极简机器人(助手类)、表情符号(消费级),并配套定位策略(B2B专业可信 vs B2C友好亲和)、色彩方案(科技蓝、蓝紫渐变)及商标排查清单。

4. 无障碍合规内置
强制要求44x44px触摸目标、可见焦点状态、描述性alt文本(公司名而非"logo"),直接对应WCAG标准。

潜在局限

  • 品牌依赖性:最优输出依赖外部品牌指南文件,若无预存上下文,需手动输入视觉规范
  • AI设计建议非强制:趋势表格为参考性质,不保证设计独特性
  • 未覆盖动态Logo:未提及SVG动画、响应式Logo(随滚动变化)等进阶实现

适用人群

  • 前端开发者:实施响应式Header与Footer
  • UX/UI设计师:验证Logo放置决策
  • AI/SaaS创业者:快速获取行业设计共识,避免"看起来像ChatGPT"的同质化
  • 无障碍工程师:核对Logo实现合规性

常规风险

  • 链接行为冲突:若Logo未链接至首页或SPA路由处理不当,易引发用户困惑
  • 移动端可读性:小尺寸Logo变体缺失可能导致16px以下模糊
  • 商标侵权:AI趋势建议中的"六边形"等符号已密集注册,需独立排查

logo-generator 内容

手动下载zip · 2.8 kB
SKILL.mdtext/markdown
请选择文件