资讯频道 → 非技术
阅读更多

4顶
0踩

非技术

转载新闻 Google新logo是如何缩减13000字节的

2015-09-08 16:28 by 副主编 mengyidan1988 评论(0) 有6412人浏览
谷歌
原文链接：Quora 译者：杰微刊—程慧

编者按：
有人在Quora上提问：Google的新logo是如何做到只有305字节的？旧logo的大小有14000字节之多。来自多伦多的UI设计师Ilya Yakubovich的回答1万+的投票。以下是杰微刊对其回答的完整译文。

之前的logo采用的是较为复杂的serif（衬线）字体，它只能通过贝塞尔曲线来构建。这样的话总共会有100个锚点，结果产生的就是一个6KB（6380字节）的文件。而压缩之后能达到2KB（2145字节）。



新logo是一个简化的版本，也就是说，几乎可以完全通过圆形和矩形来构建（小写字母g除外）。



整个logo包含：

① 10个圆形（大写G和小写g分别有两个圆，两个o分别有两个圆，字母e有两个圆）

② 5个矩形（大写字母G有两个矩形，小写l有1个矩形，小写e有2个矩形）

③ 1个由7个锚点构成的形状（小写g由上往下写的部分）

虽然Google尚未发布新版本的305字节的logo，也不太可能在网上出现，但是我相信他们的logo会如预期一般，降至305字节。

为了验证这一点，我采用SVG格式试着创建了第一个字母G，结果产生的是一个302字节的文件（未压缩），压缩之后是195字节。

下面是整个未压缩版的绘图过程，包括两个圆形和两个矩形： 
<svgxmlns="http://www.w3.org/2000/svg">
<circle r="100" cy="100" cx="100" fill="#4885ed"/>
<circle r="70" cy="100" cx="100" fill="#ffffff"/>
<rect transform="rotate(-40 166,67)" height="78" width="99" y="27" x="117" fill="#ffffff"/>
<rect height="30" width="88" y="87" x="111" fill="#4885ed"/>
</svg>

这样就产生了下面右边的图形：



另外有一位用户指出，还有一种途径可以创建出新的logo，它是采用笔画（stroke）的方式来完成，而非填充（fill）的方式。这也是之前的老logo没法实现的，这种方法甚至可以带来更小的文件。整个logo的代码共290字节： 
<svgxmlns="SVG namespace" width="600" height="250">
<g stroke-width="16" fill="none">
  <path d="M173 102a51 51 0 1 1-13-30m20 37h-53" stroke="#4a87ee"/>
  <circle cx="227" cy="128" r="32" stroke="#d83038"/>
  <circle cx="313" cy="128" r="32" stroke="#f4c022"/>
  <path d="M401 160a31 31 0 1 1 0-61m-4 0a24 29 0 1 1 0 61m26-67v79m-1-12a20 20 0 1 1-52 17" stroke="#4a87ee"/>
  <path stroke="#4ab95a" d="M449 51v115"/>
  <path d="M529 118a30 30 0 1 0-2 24m5-32l-62 28" stroke="#d83038"/>
</g>
</svg>

通过这种方法，整个logo用两个圆圈（两个o）和四条路径（G, g, l和e）就可以绘制完成。



  • 大小: 35.6 KB
  • 大小: 45.7 KB
  • 大小: 21.1 KB
  • 大小: 41 KB
来自: 杰微刊
4
顶
0
踩
评论 共 0 条 请登录后发表评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 怎样利用财务工具进行税务管理.pptx

    怎样利用财务工具进行税务管理.pptx

  • 敏捷开发FDD过程

    FDD过程 阶段一：开发一个总体模型  本阶段一个最基本的项目范围内的活动，就是在一个有经验的对象建模人员即主架构师的指导下，业务人员和开发小组成员一起工作。  业务专家们完成一个贯穿整个系统及其内外...

  • 图书馆职业有怎样的发展前景.pptx

    图书馆职业有怎样的发展前景.pptx

  • 软件文档编写向导

    在程序员的日常工作中，除了编写代码之外，还免不了需要编写各种技术文档。一个编写良好的技术文档在项目中能够很好地建立沟通与协作，起到很积极的作用。因此，编写技术文档也就成为了程序员技能提升的很重要的一面...

  • 【Docker】一条龙文档

    用 shell的命令即可 EXPOSE 当前容器对外暴露出的端口 WORKDIR 指定在创建容器后，终端默认登陆的目录，一个落脚点 USER 指定该镜像以什么样的用户去执行，如果都不指定，默认是root ENV 用来在构建镜像过程中设置...

  • 学习笔记：MyBtaisPlus学习文档

    README 大体上是照抄了视频里面的学习文档的。 对文档中一些过于冗杂的部分做了删减，并加入了自己在运行代码时遇到的问题以及解决方法，对于部分细节上的操作增加了解析。 对于之前我学过的，但是忘了的，个人有所...

  • 敏捷开发--特性驱动开发(FDD)

    什么是Feature: The unit of development and thus an increment in an FDD project - a feature - is tiny; … Features (tiny, granular pieces of client-valued function) are being completed every week ...

  • 软件工程需求分析文档模板

    需求分析类文档模板编者说明： 许多有经验的开发团队在开始需求调查的时候，总会将“软件客户需求权利书”和“软件客户需求义务书”提交给客户，让客户明确其权利与义务，将会对需求调研、分析的工作带来意想不到的...

  • ffmpeg翻译文档

    所有的数值选项，如果没有特殊定义，则需要一个接受一个字符串代表一个数作为输入，这可能跟着一个单位量词首字母，例如 "k" , "m" 或 "G" 如果 i 是附加到SI单位的首字母，完整的字母将被解释为一个2的幂数单位...

  • 特性驱动开发(FDD)

    什么是Feature: The unit of development and thus an increment in an FDD project - a feature - is tiny; … Features (tiny, granular pieces of client-valued function) are being completed every wee

  • 祭出你看过最良心的文档吧！

    这时候一份良心的文档就非常重要了。题主查看Google文档的时候，注意到底部有标明作者，也会默默为她点赞。咱们阿里云也有很多良心的文档。题主也很想知道默默细心为阿里云一众新手写文档的小哥是谁...

  • 需求分析类文档模板

    需求分析类文档模板编者说明： 许多有经验的开发团队在开始需求调查的时候，总会将“软件客户需求权利书”和“软件客户需求义务书”提交给客户，让客户明确其权利与义务，将会对需求调研、分析的工作带来意想不到的...

  • SASS官方文档

    使用 Sass 已经有几个月的时间了，翻来覆去还是在用几个简单的功能，下决心好好学习一下，所以翻译了官方文档。翻译的过程也是学习与积累的过程，深入理解了几个复杂功能，同时也补充了一些基础知识。只是官方文档写...

  • 关于用例须要多少文档以及业务用例等等

    敏捷中的文档该写多少合适，一直是永恒的话题，每一个用例故事的设计简要卡片，用例图，序列图，类图，数据字典，简要原型图，算法补充说明，应该是必要的吧，大家能够继续探讨 @袁斌_AgileDo @竹十一 @敏捷广州...

  • 【中级软考】什么是“敏捷过程的开发方法（敏捷方法agile）“（极限编程XP、特征驱动开发FDD、并列争球法Scrum、水晶法Crystal、开放源码法、自适应软件开发 ASD方法）

    十二个最佳实践2 特征驱动开发1．FDD 角色定义2．核心过程3．最佳实践3 Scrum1．Scrum 的五个活动2．Scrum 的 5 大价值观4 水晶方法5 其他敏捷方法开放式源码ASD 方法 敏捷方法 2001 年 2 月，在美国的犹他州，17 位...

  • 需求文档模板

    他们都是在什么样的工作环境中使用系统的 ] 3.5 项目相关人员的简要说明 [以下表的形式,将各类项目相关人员的基本情况进行说明, 以帮助开发团队更好地了解他们的情况.为每一类人员生成一张表格.] 代表 [列出该类...

  • MATLAB实现参数化重采样时频变换(PRTF)用于振动与声音信号故障诊断

    内容概要：本文详细介绍了参数化重采样时频变换（PRTF）在振动与声音信号故障诊断中的应用。首先通过仿真信号展示PRTF的基本原理，即通过非线性时间轴映射提高时频分辨率，特别是在处理非平稳信号时的优势。接着讨论了PRTF的具体实现步骤，包括重采样、时频分析、坐标系转换等关键技术点。文中还提供了多个实际案例，如齿轮箱故障诊断、压缩机阀片断裂检测、蝙蝠回声定位信号处理等，展示了PRTF在不同应用场景中的灵活性和有效性。此外，文章分享了一些实用经验和技巧，如窗函数选择、抗混叠滤波、多尺度融合等，帮助读者更好地理解和应用PRTF。 适合人群：具备一定MATLAB编程基础和技术背景的信号处理工程师、研究人员。 使用场景及目标：适用于处理非平稳信号，尤其是振动和声音信号的故障诊断。目标是提高时频分辨率，清晰呈现故障特征，从而快速准确定位故障源。同时，也为研究者提供了一种新的信号处理工具，拓展了传统时频分析方法的应用范围。 其他说明：PRTF虽然强大，但在某些情况下并非最佳选择，如处理稳态信号或需要极高频率分辨率的任务。因此，使用者应根据具体情况选择合适的工具。此外，由于PRTF计算量较大，实时性要求较高的场景需考虑硬件加速或其他优化手段。

  • 毕设课设-基于MATLAB的汽车出入库识别系统.zip

    基于MATLAB的汽车出入库识别系统是一份适用于毕业设计或课程设计的项目，它主要围绕车辆进出仓库的自动识别技术开发。该系统充分利用MATLAB这一强大的数学计算和图形处理软件，实现了汽车识别的核心功能。 项目主要包括以下几个关键部分： 1. **图像采集与预处理**：通过摄像头或传感器捕捉汽车的实时图像，对图像进行预处理，如灰度化、边缘检测或特征提取，提高后续识别的精度。 2. **目标检测与识别**：利用MATLAB的机器视觉工具箱，可能采用了模板匹配、特征点匹配（如SIFT、SURF或HOG）、或者现代的深度学习技术（如卷积神经网络CNN），来识别出汽车的特征。 3. **车牌识别**：针对汽车的车牌进行识别，这通常涉及到字符分割、识别和验证，可能结合了OCR（Optical Character Recognition）技术。 4. **数据分析与管理系统**：收集并分析出入库数据，用于优化仓库管理策略，如实时流量监控、车辆调度等。 5. **文档与代码完整性**：项目不仅提供了完整的工作流程和算法实现，还包含了详尽的README.md文档，以便使用者了解项目的结构和使用方法，以及注意事项。 这个系统的优势在于将理论知识应用到实际场景中，既锻炼了学生的编程能力，也展示了MATLAB在计算机视觉领域的实用性。通过下载和交流，有助于参与者提升自己的技术能力，并推动自动化仓储系统的研发和优化。

  • (源码)基于51单片机的密码锁控制器.zip

    # 基于51单片机的密码锁控制器 ## 项目简介 本项目是一个基于51单片机的密码锁控制器，通过结合LCD显示器和键盘，实现了一个简单的密码输入与验证系统。该系统可以用于需要密码保护的应用场景，如门禁系统、保险箱等。用户可以通过键盘输入密码，系统会根据输入的密码进行验证，并通过LED灯显示验证结果。 ## 项目的主要特性和功能 1. LCD显示功能使用LCD显示器实时显示密码输入的相关信息。 2. 密码设置与修改用户可以设置和修改一个4位数字（09）的密码。 3. 超级用户密码系统内置一个超级用户密码“1234”，用于特殊权限操作。 4. 密码验证反馈密码输入正确时，系统会亮绿灯密码输入错误时，系统会亮红灯。 ## 安装使用步骤 ### 前提条件 假设用户已经下载了本项目的源码文件，并具备基本的单片机开发环境（如Keil等）。 ### 步骤 1. 解压源码文件将下载的源码文件解压到本地目录。

  • (源码)基于Python和强化学习算法的智能体训练系统.zip

    # 基于Python和强化学习算法的智能体训练系统 ## 项目简介 本项目是一个基于Python和强化学习算法的智能体训练系统，旨在通过深度学习和策略优化技术，训练智能体在复杂环境中进行决策和行动。项目结合了多种强化学习算法，如TRPO（Trust Region Policy Optimization），并使用了如Pommerman这样的复杂环境进行训练和评估。 ## 项目的主要特性和功能 强化学习算法包括TRPO在内的多种强化学习算法，适用于连续动作空间的强化学习任务。 环境模拟使用Pommerman环境进行智能体的训练和评估，环境包含复杂的棋盘布局和动态变化的炸弹、火焰等元素。 预训练与微调支持预训练模型的加载和微调，加速训练过程。 多模型评估支持多个模型的同时评估，比较不同模型在相同环境下的表现。 状态抽象与特征提取通过状态抽象和特征提取，优化智能体的决策过程。

Global site tag (gtag.js) - Google Analytics