yicon 图标字体平台可以容纳的图标数量是有限的,总共 6400 个编码,因此建议在使用过程中,请注意以下几个问题:
- 尽可能对图标进行复用,上传时避免上传重复的图标,大库管理员或超级管理员在审核图标时,对于重复的图标可以审核不通过。
- 上传的图标需要大库管理员或超级管理员审核通过后才能使用。
- 上传的图标审核通过后,不能删除,但是支持图标上传者、大库管理员和超级管理员进行替换。
- 上传图标时请上传 svg 格式文件,需要遵守一定规则,具体规则参见图标制作说明
- 图标大库只有超级管理员有权限新建,且新建后不可删除、不能修改大库名字,但支持修改大库管理员。
- 每个用户可以创建自己的项目(成为项目负责人),项目负责人可以管理项目和项目成员,配置上传 source 路径,也可以将项目负责人权限移交给项目成员。
- 用户可以从任意大库中通过小车添加图标到项目中,小车中的图标可以保存到一个新项目,也可以保存到已有项目。
使用攻略
工程师
- 点击导航上的登录按钮,进行登录
- 点击某个大库 A,进入图标库 A,根据需要挑选需要的图标
- 将鼠标指针移动到对应图标上,在浮层上点击左上角的小车图标,将该图标加入到导航上的小车中,可以选择多个图标,也可以跨图标库进行选择添加
- 图标挑选完成后,点击导航上的小车,可以查看已选的图标(移动到具体图标上,点击其右上角的 X,可以从小车中删去该图标)
- 移动到“保存为项目”按钮上,点击“保存为项目”,输入项目名;或点击“保存到已有项目”,选择具体项目名,点击确认,成功创建一个图标,并自动跳转到“我的图标项目”
- 点击“下载全部图标”按钮唤起一个弹窗,点击“生成版本并下载”按钮下载该项目对应的字体文件
- 解压 zip 压缩包,即可使用其中的字体文件
设计师
- 点击导航上的登录按钮,进行登录
- 点击导航右侧上的上传按钮,跳转到上传页面
- 将设计制作好的 svg 图标拖到上传区域;或点击页面中部的“上传按钮”,选择文件进行上传
- 页面跳转到工作台进行图标设置,选择图标风格、上传的大库等,点击“确认并完成上传”
- 图标上传完成,等待大库管理员或超级管理员审核通过
- 审核通过后,上传的图标将会展示对应的大库中,以供其他用户选择使用
权限说明
未登录用户
用户在未登录状态下可以下载图标,查看平台图标使用统计信息,但是无法上传图标、编辑标签和创建项目。
登录用户
成功登录平台的用户的权限分为 3 级:普通用户、大库管理员(以下简称库管)和超级管理员(以下简称超管):
- 普通用户:上传、下载和编辑图标,创建项目等。
- 库管:在普通用户的基础上,还可以针对对应大库进行替换图标、修改图标名称、查看日志、审核图标等。
- 超管:在库管基础上,有所有大库和项目的权限,支持新建大库、修改库管,修改项目负责人,增删超管,管理系统占用编码(问题编码)等。
项目相关
项目负责人和项目成员实际与上文提到的无直接关联,因此将在项目中再来介绍。
图标库
图标库主要用于对上传的图标进行分类管理,大库包含首页图标展示,以及进入大库后字体上传、下载和编辑等功能。
- 所有用户均可对大库进行图标上传下载、添加图标到项目中,能够在界面中对图标增删标签等图标基本信息的编辑;图标上传者可以对自己上传的图标进行替换,等待库管审核通过后生效。
- 库管可以直接进行图标替换。
- 超管在“权限管理”进行大库新建,库管变更等。
项目及管理
项目管理是链接图标制作和使用的桥梁,设计者制作的图标通过这一过程被开发者筛选整理,最终生成一份可用字体。在整个项目管理的过程中,一般是设计者或前端开发的负责人创建一个对应的项目,然后添加项目成员,让大家均可维护该项目。当项目图标添加完成之后,就可以生成一份字体,发布到线上供项目使用。以下将重点对该项功能进行介绍:
项目成员
- 项目负责人:一般是项目创建者,拥有管理整个项目的权限,包括编辑项目、删除项目、管理项目成员、配置 source 路径和调整基线等,同时负责人需要对整个项目负责;任何用户都可以创建项目,成为项目负责人。
- 普通成员:下载图标,同步 source,查看日志,历史版本和项目变更等。
项目新建
项目新建:项目主要可以通过两个入口进行新建,通过小车将小车中的图标保存为一个新项目,或者通过图标项目的左侧栏的新建项目入口创建一个空项目。
项目拷贝:点击“图标项目”页的“拷贝项目”按钮,将一个已有项目进行拷贝,自动将所有图标添加到一个新项目中。
项目使用
- 下载全部图标:将项目中的所有图标生成字体文件,下载到本地的是 zip 压缩文件,文件名为
project-项目名-版本.zip
,例如project-demo-0.1.0.zip
,里面包含四份不同格式的字体文件(.ttf、.svg、.eot 和 .woff)和一份 html 说明文件;在实际项目中根据需要使用这些字体文件。
- 同步 source:根据配置好的上传 source 路径,直接将图标字体文件上传到 source 上,上传成功后弹窗提示字体文件路径,点击复制后直接在代码中使用,跳过了下载解压字体文件,再上传到 source 服务的流程。
查看项目日志:查看当前项目的一系列变动,包括添加删除图标、升级图标项目版本、成员变动、公开项目审核等信息。
历史版本和版本对比:查看当前项目的历史版本,比较不同版本间图标变化情况。
项目变更查看:对比当前项目工作区的图标与已生成的最高版本的图标进行对比,如果两者之间存在图标增加、删除或替换,图标编码被标记为系统占用等情况时,在左侧导航栏的项目名称右侧会有状态变更条数通知,在项目工作区对有变更的图标进行特殊标记。
项目管理
- 编辑项目:修改项目名称和项目负责人。
- 删除项目:删除项目,该操作不可恢复,请谨慎操作。
- 管理项目成员:添加或删除项目成员。
- 配置 source 路径:指定图标字体上传路径,第一次进行“同步 source”操作前需要先配置该项。
- 调整基线:勾选调整基线后,图标将向下偏移,更适合跟中英文字体对齐。
- 申请公开项目:项目负责人提交申请项目为公开项目,超管审核通过后,该项目将会在公开项目页面进行展示,一般被多个业务线共同使用、被经常查阅的图标项目,可以申请成为公开项目。
图标
图标上传
可以通过顶部导航上传入口或具体大库中的“上传新图标”入口进行上传。
图标调整
直接上传阿里字体平台上的图标到 yicon 上,会显示异常、同时生成的字体文件也会无法正常使用,所以在上传过程中,需要手动调整,适配 yicon 平台
图标下载
支持下载 svg 和 png 两种格式的图标。
图标替换
在大库中,超管、库管或图标上传者可以对原有图标进行替换,超管、库管替换直接生效,非超管、库管的图标上传者替换时需要超管、库管审核通过后方能生效。图标替换不会对图标码值进行修改,但是可以修改名称、标签等。因此这里对已上线图标的替换要进行严格的把关,必须保证图标含义不变,仅为微量调整。
图标编辑
编辑图标的名称和标签
图标审核
超管、库管对用户上传或替换的图标进行审核。
图标统计
统计当前平台已使用的编码和对应的图标。
图标制作说明
根据样式规范制作图标,上传到平台才能够正常显示和使用,图标制作者创作前请先阅读。
权限与编码管理
权限管理
- 大库权限设置:新建大库,修改大库管理员。
- 项目权限设置:新建项目,修改
- 超管增删管理
编码管理
- 系统占用编码:超管可以手动添加问题编码,也可以从 yicon-problem-code 同步,指定编码被系统占用后,如果该编码已被分配给图标,则该图标在大库中被删除,同时系统默认上传一个对应的图标到该大库,上传的图标除编码重新分配外,其他均和被删除的图标保持一致,同时如果对应该编码的图标在项目中被使用,则会在项目中标记为“系统占用”,用户需要手动删除该图标,并添加对应上传的新图标。如果编码未被分配,则后续上传新图标时,该编码将不会被进行分配,自动跳过。
其他
搜索
支持通过图标名称、标签和编码进行图标搜索,在使用编码搜索时请输入完整编码,例如 
。
消息
查看与自身相关的消息,包括图标审核结果,大库、项目变更等消息。
版本说明
图标项目引入了版本这一概念,能够更好地管理项目,详细了解到项目的变更情况:在使用过程中,当项目新增、删除或替换图标时,无论下载还是同步 source 前必须先升级项目版本,根据变更情况,可通过小版本迭代
、较少变化
和重大变更
等三种方式进行图标项目版本升级。