Subcategories

• 音MAD大赏

  好康的音mad,一起共赏

  8
  Topics
  22
  Posts

  

  每年元旦的惯例合作，质量还是非常高的，目前b站为审核投了静画版 !(<iframe src="//player.bilibili.com/player.html?aid=81549336&cid=139543908&page=1" scrolling=“no” border=“0” frameborder=“no” framespacing=“0” allowfullscreen=“true”> </iframe>) 如有需要下载原版的链接如下 链接：https://pan.baidu.com/s/14hKA2QaRqCr40HcEzYyCMQ 提取码：seea
• 音MAD素材

  突然心血来潮...

  9
  Topics
  45
  Posts

  

  我低估了标题的难度。 b站图标很早就用了网页字体，把网页字体下载来转换成ttf，解决——但， 前阵子都准备好了，但今天留个心眼检查了下发现b站又改版了，更新了更多的网页字体，名称还都是“iconfont”（同名字体同时挂网页，调用会撞车）我发现这些“iconfont”还各不相同，让我撤回研究下怎么办。 解决。 ‍我没在作品里求三连的习惯，是因为我的自我定位是原料供应厂（“武器商”，给视频作者供应图素材），做的视频一般是“用我画的素材可以duang~出这个效果！”的宣传（虽然没几人用……） 对求三连没啥意见，但不能忍的是有些人做的高清视频，求三连图却是模糊的截屏：b站图标用的网页字体，是矢量，易转为清晰大图——也许是不知道或不会用？ 那这就是我“武器商”的工作了。 请转发，让模糊三连的视频制作者看到。 顺带一提b站某些数字字体是“Material Design Icons”，免费的。 而某些中文字体是“锐字逼格青春粗黑体简”，有版权不可分享，但b站居然把整个中文字体（六千多字）挂上网页了，REEJI-BigYoung-BoldGB2.0.woff2，不难找。……不过找到也没法用于商业作品。 下载与更新 （b站经常会改版，我会不定期检查b站更新到这里） 现在b站网页一共挂了1个“bilifont”，1个“vanfont”（嗯？），4个不同的“iconfont”，考虑字体调用关系，我只合并同名的。 合并难点是某些同一图标字码点不同，我看见b站也确实是同时加载，搞不懂b站怎么解决撞车问题，或者是直接抛弃这些字码点？ 按字体里记录的创建时间（修改时间一般不实）判断，b站是在某个时段几乎抛弃了2017-12-27创建的iconfont，在2018年后进行了分批修改，所以我放弃17年以前的图标，将18年之后每批图标合并为一个字体。 检查发现b站也是用 fontello.com 创建的图标字体，Generated by svg2ttf from Fontello project. “iconfont”其实是默认名称，会与其他网站“iconfont”撞车，所以改名为“bilicon”。 bilifont.ttf 疑似2019-11-5创建。 包含图标见本文底部。 vanfont.ttf 疑似2019-10-18创建。 锯齿只是预览，字体仍然是矢量的。 bilicon.ttf 2018创建的多个“bilifont”合并。 其中U+E6F3-E6F6、U+E722是b站2018年到现在删除不用的5个图标。 如何使用 这些图标对应字符都位于私用区，所以需要字体软件帮忙，如果你没有字体管理软件，那么我有个推荐：字体预览和预载软件NexusFont，以及对该软件汉化和美化 你可以打开该软件的“字符映射”然后双击所需字符来选择复制。当然，别忘了设定为字体，不然显示为空白或者别的。
• 音MAD技术学院

  我做鬼畜音mad,好吗?

  8
  Topics
  38
  Posts

  

  修改与自制字体：更好地显示时间/比分 - 哔哩专栏 的字体下载部分。 我修改了一些时间专用字体。有些是商业字体不能分享，因此下面发布的都是开源或免费字体。 先提一下，对CSS而言，所有字体都分类为五种通用字族：serif、sans-serif、cursive、fantasy、monospace。我顺利凑齐了这五种如下。 AliSans 免费的无衬线（sans-serif）比例字体。此即阿里巴巴英文标志字体。压缩包里有两个字体，常规和Italic版，如图。 原是包含各种字重的字族，我仅仅改了其中两个（Regular、Italic） 数字在小字号下显示不错，没特点不显眼恰好是优点，可替换网页播放器的时间字体。 具体用法和编辑了哪些我都附在压缩包内文档里。AlibabaSans版权申明比较怪，所以改了名称。 AliSans-Time.zip • ver.1 Iosevka 开源的无衬线等宽（monospace）编程字体。压缩包里有两个字体，常规和salt版，如图。 salt／Stylistic Alternates／轮替风格，由Adobe登记，不是盐。 原是包含各种字重、斜体、Slab衬线、变体的字族，我仅仅改了其中一个（Regular），如果有人需要我可以将其他也改了。 具体用法和编辑了哪些（比如为什么1个Regular变成2个）我都附在压缩包内文档里。 Iosevka-Time-2.zip • ver.2 2019-12-14 版本2：将全角冒号挪移到比号。 Libertine 开源的衬线（serif）比例+救世数字字体——与上面基本相反。该字体最常见的用途是维基百科标志。压缩包里有两个字体，常规和smcp版，如图。 smcp／Small Caps／小型大写字母，推荐阅读 从设计的角度谈谈 iPhone 命名为什么用了 Small Caps - 少数派 的评论。 原是包含各种字重、斜体、变体的字族，我仅仅改了其中一个（Regular），如果有人需要我可以将其他也改了。 具体用法和编辑了哪些（比如为什么1个Regular变……）我都附在压缩包内文档里。我甚至重写了OT脚本。 Libertine-Time.zip • ver.1 Montserrat 开源的无衬线比例字体。很适合搭配雅黑，巨大奶子网（mega․nz）默认字体，饼维基待用字体。压缩包里有两个字体，常规和Alternates版，如图。 原是包含各种字重、斜体……的字族，我仅仅改了其中两个（Regular、Alternates Regular），如果有人需要我可以将其他也改了。 具体用法和编辑了哪些我都附在压缩包内文档里。我应该还会做个搭配雅黑粗体的粗体罢。 MontserratTime.zip • ver.2 2019-12-20 版本2：将字体名改为MontserratTime以避免冲突，追加一对粗体，针对搭配雅黑又扩展了一对字体，现在可以当作软件默认字体了（需按文档修改注册表让中文显示为雅黑） Segment Digit 以开放字体许可证（OFL）发布的装饰（fantasy）字体。这是我做的第一个彩色字体，如图。压缩包里有两个字体，彩色和普通（mono）版。 原是BabelStone发布的统一码13.0符号字体，我注意到其中液晶数字不错，提出并扩展为一个正式字体。而彩色五角星也是我自绘的。 为了匹配液晶风格无视英文缺乏可识别性，与上面字体不同，不可能用于默认字体正是装饰字体的特点：专门美术用途。 同时包含了一些其他字体缺乏的符号，如电源启动符号、半星评级符号、六种知识共享（Creative Commons）许可协议符号、算筹和画正字符号……具体用法和编辑了哪些我都附在压缩包内文档里。按OFL申明起了自己的名称。 字体显示彩色需要视窗版本高于8.1为了可能不支持的苹果系统用户单独做了mono版，虽然没有彩色但至少可以用。 SegmentDigit.zip • ver.1 Unifont𛋬𛃶 覆盖统一码BMP区域所有码位的开源像素字体，拯救叉烧包字符的最后希望（Unifont is only suitable as a font of last resort.）虽然有65536个字符但字体体积不大。顺带一提另一字体Unifont Upper还在试图覆盖统一码SMP区域，不过缺西夏文。 虽然看上去丑了些，但不需修改，本身默认按时间显示的。 发行说明：Unifont - Summary [Savannah] - gnu.org 一般统一码更新后该字体就会更新。 GNU Unifont Glyphs - Unifoundry Walt Disney 对个人使用免费的书法（cursive）字体。这（不）是迪士尼英文标志字体。压缩包里只有一个字体，如图。 原是2001年的老字体，虽有不规矩的地方，但我改动很少。如图小字，不必怀疑该字体免费的真实性。 发布这个与近期大连城市徽标获奖作品疑抄袭迪士尼_澎湃新闻没有任何关系。具体用法和编辑了哪些我都附在压缩包内文档里。 WaltDisney-Time.zip • ver.1 字体名改为DaLian。本字体并非彩色字体。可惜按叶根友字体版权不能嵌入字符“大连”，否则更完美了。 发现[_]其实没做，自己改画了个笔画贴近的。补画了个风格相似的[º]并挪移了一些符号。增加一个隐藏字符[.notdef]。 DaLian.zip • ver.2 Ubuntu、Fira、Zilla-Slab、Roboto、OpenSans、…… 让我考虑考虑。 … 【哔哩专栏备份】 是否有人在看视频、做视频时遇到下图上边这样的问题？ 背景色块显示该字符占据的宽度 如果你感觉到奇怪，是否希望改成上图下边的形式？ 那么概括下这几个月来的发现。 截自我的trello，我几个月前就想解决这问题了 数字 实际上数字和茴香豆差不多，有4种写法（没算上斜杠〇） CSS Fonts Module Level 3 # 6.7. Numerical formatting: the font-variant-numeric property（英文） OT字体功能 # 数字样式 | 微软文档（微软机翻） 茴字写法，字体都是Libertine 有两种样式<numeric-figure-values>：李宁（lnum）和 旧式（onum）写法肯定有差异， 有两种间距<numeric-spacing-values>：比例（pnum）和 表格（tnum）写法可能有差异， 2样式和2间距可以乘出4种写法； 还有一种特殊写法：斜杠零（zero） 上文括号里的缩写是OpenType（以下简称OT）的feature tags。一些优良的OT字体会同时包含4\5种数字但默认只显示1种，需要手动在软件OT特性开关里调用其他未映射的几种。 Feature tags - Typography | 微软文档（目前是英文）功能标签？特征类型？我不懂翻译。 lnum／lining-nums／标准数字 阿拉伯数字本来高度一致的写法。 onum／oldstyle-nums／旧式数字 把阿拉伯数字当作高低参差的小写拉丁字母来书写。可以想象哈利波特那味儿。 左李宁右救世，字体都是Biolinum pnum／proportional-nums／比例数字 每个数字占据宽度不同，就像手写的间距。 tnum／tabular-nums／表格数字 每个数字占据宽度相等以便垂直对齐，方便财务比较。有时1字会加上脚部写法撑胖。等宽字体必定表格数字不含比例数，反之不然。 微软提供的范图，左比例右表格，字体都是Miramonte zero／slashed-zero／斜杠零 零+斜杠以强调字母O不是数字0，通常用于财务和编程。编程字体默认是表格数+斜杠零。 W3C提供的斜杠零范图 显然时间字体两种样式和斜杠零都无所谓，但间距只能选表格，否则用作计时整段数字就会抖来抖去。 冒号 可能看完上文的人会选择等宽字体，但只是等宽还不行（有些等宽字体出于编程用途区分字符会故意做得不好看，何况冒号也没必要与数字等宽） 冒号一般放置在基线上，与小写对齐，所以就不能同时与数字（常与大写差不多高）垂直居中对齐。时间、比分等需要整体垂直居中，由于没有专门的居中冒号，过去排版者会特意手调。 虽然没居中冒号，但有居中星号：[∗]U+2217算术星号，与[*]默认星号不同在于与数字对齐。 找到一个[∶]U+2236比号“RATIO”。相当于居中冒号，就是左右间距可能太宽了，显示比分倒没问题。 这属于排版技术，所以可由字体解决。比较先进的OT字体如苹果表（Apple Watch）启用的字体旧金山（SanFrancisco），可以就上下文判断是否数字自动替换成居中冒号。我做个例图演示下。 此为旧金山粗体，看上去仿佛冒号被拉上去了 这个具体用到的是OT高级排版功能：calt／Contextual Alternates／上下文语境替代 calt是由Adobe登记的feature tag。顺带一提OT字体格式由Microsoft和Adobe共同开发。 试着反编译旧金山字体这段calt脚本，发现也很简单： group @0_9 [zero one two three four five six seven eight nine] {} /*注：穷举一遍数字，组团。*/ lookup SingleSubstitution {   sub colon -> colon.1; ……   } /*注：「colon.1」是个未映射的大写对齐冒号。*/ lookup ChainingContext {   subtable "table1 {     context (@0_9) colon (@0_9);     sub 0 SingleSubstitution;   } /*注：只要上下文出现「@0_9 冒号 @0_9」这种组合就按SingleSubstitution替换冒号。*/ 也就是任意字体加个colon.1和这个脚本就解决哩—— 并不。虽然苹果的系统肯定支持，但许多老软件，尤其非专业排版软件支持有限或不支持OT高级排版。没办法，只能固定成ttf字体，即直接用colon.1代替colon放弃与小写对齐（旧式数字可以例外，因为我觉得相当于英文小写） 实际上我制作了些专门用于显示时间的字体。没有OT特性的。 下载 |-向上看。-| 运用 安装字体后做视频（比如给音乐MV加个进度条）直接调用就可以。 对一般人也有用。假设你有装Stylus之类调整网页外观的用户样式管理器，可以加一条样式将播放器的时间字体修改了，如： @-moz-document domain("bilibili.com") { span[name="time_textarea"] {font-family:"【字体名】"} } /*b站*/ @-moz-document domain("xiami.com") { .handle {font-family:"【字体名】"} } /*虾米*/ 等等。 如果上文有问题或遗漏请评论告诉我
• DJ神社屋
  3
  Topics
  6
  Posts

  

  @KeKaoJun 嗯？（威压