In early 2018, the Uber brand team started a rebranding exercise, exploring a fresh take on what it means to be a global transportation and technology company. A new logo was developed in tandem with a bespoke sans-serif typeface called Uber Move. What followed was a natural progression towards universal symbols of iconography that could scale across all products, services, and surfaces. Here’s a glimpse into the evolution and processes.

在2018年初，Uber品牌团​​队开始了品牌重塑工作，探索了成为全球运输和技术公司意味着什么的崭新面貌。 与定制的无衬线字体(称为Uber Move)同时开发了一个新徽标。 随之而来的是自然发展为通用的图像符号，可以在所有产品，服务和表面上进行扩展。 这是对演变和过程的一瞥。

With typography being one of the most visible parts of our identity, the next step was to figure out how to use it in our Rider and Driver apps. Almost every time we use an icon, it will be accompanied by text, reinforcing each other. It is important that they pair well.

由于排版是我们身份中最显而易见的部分之一，下一步就是弄清楚如何在我们的Rider和Driver应用程序中使用它。 几乎每当我们使用一个图标时，它就会伴随文本，相互补充。 它们配对得很重要。

Side by side, our types and icons reflect our original inspiration from the shape of roadway and transit signs. We developed three sets of weights for them.

同时，我们的类型和图标从道路和公交标志的形状中反映出我们的原始灵感。 我们为他们开发了三组权重。

We iterated these core sets in order to apply to our user interfaces. A design language emerged: Simple. Having just one set would leave little room for interpretation when and where to use what icon. One icon set, for everything. We reduced three icon weights into one.

我们迭代了这些核心集，以便应用于我们的用户界面。 一种设计语言应运而生： 简单 。 仅使用一套图标就几乎没有空间解释何时何地使用什么图标。 一个图标集，适用于所有内容。 我们将三个图标的权重减少为一。

We experimented to determine that the filled version (such as the ones for the Bold weight above) worked best for glanceability. Its visual weight served well as a visual anchor. We also got rid of the Light and Bold weights. The strokes on the Medium weight gave us more pixel wiggle room in small mobile devices.

我们进行了实验，以确定填充版本(例如上面用于粗体显示的版本)最适合浏览情况。 它的视觉重量很好地充当了视觉锚点。 我们还摆脱了轻量和粗体重量。 中等重量的笔触为我们在小型移动设备中提供了更多的像素摆动空间。

简单 (Simple)

Our lines of business require icons for thousands of user scenarios. We have to redesign existing icons and design new ones in a no-nonsense way. Our ride customers and partners would not care whether we just had a rebrand or not, they need a functional user experience to move on with their lives.

我们的业务需要数千个用户方案的图标。 我们必须重新设计现有图标，并以废话的方式设计新图标。 我们的乘车客户和合作伙伴不会在乎我们是否拥有品牌，他们需要功能性的用户体验来继续他们的生活。

To make an icon simple is not by adding details until it is unmistakably a car. An icon canvas is only 24 by 24 pixels. Its small size allows it to fit inside a button or to accompany other information to make them more scannable. Too many shapes and lines will not fit into the canvas. Therefore, every pixel we draw must be intentional and all decorations should be removed.

要使图标简单，就不能添加细节，除非它无疑是一辆汽车。 图标画布只有24 x 24像素。 它的体积小巧，可以放入按钮内或与其他信息一起使用，以使其更易于扫描。 太多的形状和线条无法容纳在画布中。 因此，我们绘制的每个像素都必须是有意的，所有装饰都应删除。

形式跟随功能 (Form follows function)

Our main goal was to serve users regardless of environmental conditions. A person could hail a Uber ride while standing on a dim lit sidewalk. They could also be running down an airport escalator while looking at the screen. Aiming for clarity, we constructed our icons using basic geometry and placing points only on whole-number coordinates to avoid anti-aliasing. They must be sharp and crisp icons.

我们的主要目标是在不受环境影响的情况下为用户提供服务。 站在昏暗的人行道上，一个人可以欢呼优步。 他们还可能在看着屏幕的同时在机场自动扶梯上奔跑。 为了清楚起见，我们使用基本几何形状构建了图标，并仅将其放置在整数坐标上，以避免出现锯齿。 它们必须是清晰的图标。

No users want to learn new shapes and icons if they don’t have to. One icon should allow multiple interpretations, making it possible for other designers to reuse an icon for different purposes.

没有用户愿意学习新的形状和图标。 一个图标应具有多种解释，从而使其他设计人员可以将图标重复用于不同目的。

Only after achieving the icon’s business goal, we refined its shapes to be uniform with the Uber brand. For example, our icons consistently used the 3px stroke to deliver visual weight as a set.

仅在达到图标的业务目标后，我们才将其形状进行改进，使其与Uber品牌保持一致。 例如，我们的图标始终使用3px笔划来传递视觉重量。

We also made a company-wide decision to shape corners and stroke terminals square. This brought our iconography and typography even closer together. We only use rounded corners on larger rounding and avoid softening shapes unless doing so makes the icon more recognizable.

我们还决定在全公司范围内确定角和笔触端子的正方形。 这使我们的肖像和版式更加接近。 我们仅在较大的倒圆角上使用圆角，并避免软化形状，除非这样做会使图标更易于识别。

新图标请求 (New icon request)

Oliver Lukman is the main architect of our icon library. Based in Amsterdam, he works closely with product managers and designers across Uber global offices. His process has two main steps:

奥利弗·卢克曼(Oliver Lukman)是我们图标库的主要架构师。 他位于阿姆斯特丹，与Uber全球办事处的产品经理和设计师紧密合作。 他的过程主要包括两个步骤：

1. Break the object down to real-life parts.将对象分解为真实的部分。
2. Find the most basic geometric shapes to draw those parts.找到最基本的几何形状来绘制这些部分。

Take the Like icon as an example. A thumbed up hand consists of: the palm which can be a rectangle, the thumb which can be a triangle, and the remaining fingers as a trapezoid.

以“赞”图标为例。 竖起大拇指的手包括：可以是矩形的手掌，可以是三角形的拇指，其余的手指为梯形。

Here’s how these parts come together:

这些部分如何组合在一起：

This sounds easier said than done. When a new icon designer, Vietanh Nguyen, attempted to draw a bicycle icon for the micro-mobility business, his design was immediately rejected after turning on the Show Outlines mode (Cmd+Y in Figma and Illustrator).

这听起来说起来容易做起来难。 当新的图标设计师Vietanh Nguyen尝试为微动业务绘制自行车图标时，打开“显示轮廓”模式(Figma和Illustrator中的Cmd + Y)后，他的设计立即被拒绝。

We finalize new icon designs with all the lessons learned above:

我们根据以上所有经验教训完成了新的图标设计：

• The outline must speak for itself. Use the fewest shapes possible.

  大纲必须说明一切。 使用尽可能少的形状。

• The icon must look sharp anywhere. Align vertices and lines on whole-number coordinates within the 24x24 grids.

  该图标在任何地方都必须看起来清晰 。 将顶点和直线在24x24网格内的整数坐标上对齐。

• A customer in hurry with 10% screen brightness can still recognize the icon. Use thick stroke as much as possible.

  屏幕亮度只有10％的客户仍然可以识别该图标 。 尽可能使用粗笔。

Iconography at Uber is constantly evolving. With so much change and cultural considerations in our business and the ride-sharing space, the evolution of our icon catalog will continue to grow with our brand and design systems.

Uber的图像学在不断发展。 在我们的业务和乘车共享空间中发生了如此多的变化和文化考量之后，图标目录的发展将随着我们的品牌和设计系统而继续增长。

Follow us on Uber Design.

关注我们的优步设计 。