数字无限论

——————————

为什么要做品牌升级？

“效率一直是公共舆论中的一个重要话题：在古希腊人眼中，它是政治和社会运转的方式；工业革命早期，亚当·斯密将其视作提升生产力的强劲动力。”时至今日，它被奉为公共生活的首要目标，效率升级实质是广义世界里生产力的一次革新。

科技和物联网以看不见的方式正重塑这个世界，从生活到工作，科技把每一张有形的办公桌移到了云端，让每一场可能发生的对话跨过了坐标的限制。技术开放地定义着我们所理解的现实工作环境，腾讯文档以对效率协作世界新的理解重新归来。

我们希望“让协作更高效，让创作更轻松。” 站在新旧交替的路口，是时候以全新的设计语言，让工具退去冷冰的外壳，走进与智能隔空对话的新世界。

产品感知关键词：

Phase 1

——————————

Concept 品牌理念

我们把腾讯文档的品牌因子比做是架落与两岸的桥，从时间和空间的角度，连接现在与未来。在这里，代表效率协作先进生产力创造的新世界，转承着庞大信息流的无限可能性。希望在这里发生的每一次虚拟与现实间的交流都是如此贴近你。

数字之美

在此，我们赋予这个新世界以“数字”之名为前缀：

在数的数字（number）里，从有限0到无限∞；在物的数字（digital）里，从有形到无形。

就像霍金所说，宇宙最根本的东西首先是空间，其次是物质，再次是时间。因为物质的存在和运动必须是在空间里进行。而没有物质，谈论时间是没有意义的。

而在这个广阔的效率世界里，由无形的空间结构支持，答应着无声的时钟….

关键词的联想：

连结、握手、相遇、构建、乐高、晶体、方块、魔术、火花、梦想、成就、有序、几何、空间、数字、代码、窗口

从联想中提炼具有关键的隐喻和形式：

把关键性的隐喻抽象出来，找到表现形式，使其更简洁纯粹，更容易被组合

品牌关键词

秩序是一切天体、物质、时间、生命、形态和形式秩序状态运行的最基本法则。

万物有序，虽然呈现的现象千变万化，但褪去复杂的外表，内在规律却是不变的。以更规整和原始的抽象基础形为所有应用元素的开端，以秩序作为布局的基本准则。

正如我们腾讯文档一直在思考的，寻找秩序中的效率，再从效率中找到变化的规律。

早在上世纪，透明性和通透感就追随着设计的平面到立面。从沃德装饰语言的中立性到密斯凡德罗建造的清晰，以形式的通透对内容的冗杂，以材质的纯粹对结构的多样。

在这里，我们用“轻和透”来体现技术带来的未来感，在画面中叙述的更多是余白空间所带来的无边想象力。

“光从来都是为了它所照亮的事物存在而不是为了它本身。”

流质的光影和颜色是整体设计中氛围的基调，用颜色之间缓慢的渐变预演空间中正在发生或者即将发生的故事。

我们用了色盘中相对沉静的极光色系（蓝紫绿），拓宽空间的边界感。

与正在交融和变化的颜色中间态，一同隐喻了智能和科技作用下的每一次协作和创作的真实实现。

Phase 2

——————————

DNA cube 演化

Metaphor Box 协作盒子，我们用一个变化的立方隐喻一个协作空间站。在这里有可能发生的是各种各样的碰撞。思想的火花，创作的灵感，执行的高效。这里有属于一个也有属于一群人的精彩。

Phase 3

——————————

Application 应用设计

最终我们将腾讯文档的Logo图形化，赋予Metaphor Box协作空间的概念。利用有序的几何线条为空间背景构图。在原本的智慧的品牌蓝基础上，添加了一点灵动偏暖的渐变色，为整体画面增添生命力及亲和力。最终完善后应用到官网、官网登录页、闪屏页、空页面的场景。

闪屏

在闪屏的延展中，我们基于大的品牌理念延展出两个不一样的方向。

A.以腾讯文档logo的形状为视觉元素载体空间，向里呈现一个轻盈有机的未来世界。

B. 以腾讯文档产品“协作盒子”的概念，立体的展现一个代表科技为基底，多方协同运转的动力世界。

最终，我们选择了整体画面更为清晰，主体更为清透明确的主图形。

调整细节后应用到闪屏

官网

官网首页Banner是最直接、最具感染力的视觉传达路径，我们需要让用户在进入docs.qq.com即刻形成品牌印象，通过Slogan传达腾讯文档的产品价值，同时在Slogan的字段上添加了正在编辑态的光标元素，体现文档高效的协作能力，最终以响应式的方式适配到移动端。

在官网的其他页面，我们将品牌语言进一步落地。

空页面

在腾讯文档空状态的设计中，我们以几何的ip形象为页面穿插一个个不一样的故事性叙白。传递腾讯文档平易近人的智能语调。

在画面的整体构成中，我们增加了一些轻透的质感元素，结合几何形的整体图形语言，让画面轻盈也丰富。

——————————

写在最后

古尔德在《奇妙的生命》一书中写道：“有些人觉得（人类是唯一智慧生命的）前景令人沮丧，我却总为之感到振奋。我将它当成是一个源泉，它带来了自由，也带来了道德上的责任。”效率的背后不止是关于工作方式的改变，仍然需要不负所望：构建责任。

我们在逐步进化腾讯文档的整体视觉语言系统。后续我们将推出下篇，向大家展示腾讯文档品牌在UI语言和其他品牌延展中的更多设计。

在这个快时代，精耕出自己的风格，打造更舒适的用户体验，敬请期待……

感谢阅读，以上内容由腾讯ISUX团队参与设计，版权归SUPERFICTION、腾讯ISUX分别所有,转载请注明出处，违者必究，谢谢您的合作。注明出处格式：

文章来自公众号:

腾讯ISUX

(https://isux.tencent.com/articles/qq-sf）

作为拥有大量用户的聊天工具，QQ早就对群进行了分类，以满足用户不同的垂直聊天场景。目前QQ已经针对家校、游戏、粉丝群尝试过垂直场景设计。而疫情突然来袭，使线上学习的需求空前迫切，QQ群作业火速更新和完善多项功能，以满足线下作业改为线上批改的垂直场景，下面让我们一起走进QQ群作业的设计故事吧。

2020年疫情来袭，为了抗击疫情，春节后全国尝试执行了在线办公和教学，其中首次使用网络直播授课的老师们，由于对直播软件不熟悉，被逼出一个个欢乐的网课囧况段子。

在每次网课结束后，老师们还有一大难题，就是要为同学们布置和批改作业，纸质的作业本突然间搬到屏幕上，为老师批改作业带来了新的挑战。

QQ群作业功能虽然在这之前已上线有一段时间，但主要用于布置作业与线上题库，没有针对纸质作业的批改。由于学生们的作业需要改到线上提交与批改，QQ的群作业功能在疫情期间快马加鞭更新，为作业的提交与批改提供专业护航。

作业线上提交与线下的差异

线下布置和批改作业是很成熟的流程，该流程符合师生们在校期间的时间安排。

老师在课堂结束时布置作业，由学生记录并课后独立完成，第二天统一提交作业本。老师批改和统计作业后，将作业本返还给学生。学生查看作业的批改结果，根据老评语进行改正或重做，与下一次的作业一起再提交给老师批改。

线上作业不是统一的交作业时间，学生完成后即可随时提交，老师会不定时的接收到学生提交的作业。学生也可以随时查看老师对作业的批改结果，可随时将改正或重做再次提交给老师批改，无需累计等下一次作业一并提交。

老师需要高效，学生需要激励

由于线上作业可随时提交，并且在家办公与日常使用手机的特殊背景，老师的批改作业时间将会被碎片化，增加老师们的批改负担。使用手机或电脑批改作业，无论是翻阅还是涂改都远不如纸面灵活，这是老师们线上批改作业最大的痛点。

另一方面学生与老师的当面互动少了，学生们完成作业后获得老师反馈也被空间相隔，成就感被大打折扣。

了解到老师们与学生们这些诉求，QQ群作业为老师们提供尽可能便捷的批改体验，并在情感化和激励上做尝试，挖掘老师能给予学生鼓励和互动的机会点，让同学们在完成作业后能额外收获到惊喜与鼓励。

▎图片红笔批改

学生完成作业的方式不变，作业薄、习题册、打印卷等完成纸面作业，通过拍照上传到QQ来提交作业。因此老师在照片上进行直接批改，是最直观的批改与标注方式。

QQ火速上线图片红笔批改功能，使用手指或鼠标即可在图片上勾画，QQ也提供文字标注，老师可以在需要的地方标注描述。

功能上线前老师们使用第三方工具进行批改，需将图片一张张存本地、批改图片并保存、选择已批改的图片上传到QQ或发给相应的学生。

上线后，老师可一键进入图片批改流程，同时多张图片支持连续切换，每张经过批改的图片都会自动上传到QQ作业的评语区，大大缩短了老师们连续查阅和批改作业的流程。

▎打分印章

批改纸质作业时，老师在作业的结尾可直接写出鲜明的得分，但线上作业批改时，打分没有确切的位置，可以标注在图片里，也可以填写在评语正文里。面对老师的困惑，我们寻求适合老师的打分方式，给老师明确的打分指引。

老师们的打分方式主要有：分数、ABC、优良中、小红花等，我们从最快速输入成本的角度，采用直接点选的体验方式，让老师可以一步选择相应的分值。

现实中一些有爱的老师，除了打分还会手画小表情或者盖印章示鼓励，我们将这种线下传统结合到QQ的作业打分设计上。

我们将得分设计为印章的样式，划分ABCD四段满足大多数的打分场景，且便于统计。无论学生提交的是什么形式的作业，得分印章都可以鲜明的显示在作业页面上。

每个分值的印章都附带：完美/优秀/很棒/加油文案，A+的印章采用有别于其它等级的花边，强化最高得分的特殊性，给予学生肯定与激励。

▎模范作业

在校园时，老师有时会在课堂上向同学们展示书写认真、工整、正确的作业，也有的学校会定期组织优秀作业的展示活动，为同学们树立学习的榜样。

QQ新增模范作业功能，当该作业得分A+或A时，老师可以便捷的选择将作业设为模范作业，酌情分享给班里的同学们看，树立榜样并鼓励学生。

在视觉表现上也是尝试过一些与学习相关的元素来代表模范作业，最后选择点赞的手势作为模范作业的主元素，突出同学们之前相互学习，相互鼓励的正能量学习氛围。

▎作业统计

批改作业后，老师们需要对同学们的作业进行等级，以记录同学们的平时分。而线上批改作业本身具有数据统计的优势，QQ推出作业统计功能。

根据访谈，每周一升旗礼后通常是班会，班主任会回顾班内上一周的情况。QQ以每周作为默认统计周期，贴近班主任一周回顾的习惯。

老师也可以调整统计的时间段，以获取所需的统计结果。更详细的作业得分评语统计，老师可导出详情到腾讯文档查看。

统计学生一周内作业得分的排行榜，向老师展示学生作业排名及变化情况，排行榜可酌情分享到班级群里，增加老师鼓励学生的机会。

▎群内互动标识

QQ的互动标识在学生群体很有人气，为此我们新增与提交作业相关的互动标识，增强家校群的特色，鼓励同学们认真完成作业，提高交作业的积极性。

互动标识目前有两种，一种是一周内获得模范作业超过3次成为初级模范，连续两周获得模范作业超过3次成为中级模范，连续三周获得模范作业超过3次成为高级模范，视觉展示备选元素有奖杯、奖牌、星星、小红花等；另外一种是每项作业提交时间较早的3名同学会被授予标识，备选元素有旋风、闪电、火箭、铃铛。同时也调研了一些家校群里的老师和学生，大家比较认可和喜欢是奖杯和闪电的元素，在此基础上，我们进行了视觉优化优秀作业标识用奖杯金银铜的质感来表示3个等级，交作业最快用钢笔头+闪电组合的方式来展示。

▎持续护航

当线下作业突然间搬到线上批改时，QQ作业面临着许多挑战，首先是功能重点变化急需补齐，其次是老师们对线上工具的使用操作很不熟悉，会提出一些出乎我们意料之外的需求。因此除了重点功能的紧急更新，QQ也不短倾听老师们的反馈，不断完善各种逻辑与体验细节。本次技术采用web实现，功能可直接上线，老师们和同学们无需更新版本，即可直接体验作业最新的功能，QQ作业默默的做了大量密集更新。

一些展望

借助这次作业的更新，我们感受到了QQ作为互联网服务中的一员，承载着老师和同学们的喜怒哀乐。QQ在设计时，努力放大积极正面的能量，用热情的颜色与拟物线下的鼓励元素，让作业做到不仅仅是布置与批改，更是能建立老师与学生们之间互动的桥梁。

除了作业，QQ这次也火速更新网课直播，在线课堂，作业引入题库等，为老师和同学们提供更丰富的教学内容。也有推出学习模式，自习室群课堂，在特殊时期为学习场景降噪，给同学们提供一个更纯净的学习气氛。

随着线下复课逐步恢复，QQ群作业渐渐退出一线舞台，家校群的热闹程度也恢复到了一年前。而QQ的垂类设计不会仅止步于此，QQ未来将继续尝试在不同的垂类场景做探索与挖掘，为用户提供更轻松、健康的社交平台。

感谢阅读，以上内容由腾讯ISUX团队参与设计，版权归SUPERFICTION、腾讯ISUX分别所有,转载请注明出处，违者必究，谢谢您的合作。注明出处格式：

文章来自公众号:

腾讯ISUX

(https://isux.tencent.com/articles/qq-sf）

——————————

1. About collaboration toy 关于联名玩具

Who is RYAN? 谁是 RYAN

Ryan是Kakao Friends的代表角色，看起来面无表情（表情没有变化过），其实关爱他人，个性很温暖，在Kakao Friends中担任着顾问的角色，并且实际上他是一只复杂的没有毛的狮子。凭借独特的魅力，Ryan一经发布就收获了势不可挡的人气，并在短时间内成为韩国最火的IP角色。

Ryan is a representative character of Kakao Friends. Ryan looks impassive without facial expression (his face has ‘never’ changed), but he has a warm personality that cares for others. And he holds a position of adviser among Kakao Friends characters. Actually, he is a lion, but has a complex about having no mane. With Ryan’s unique charm, Ryan gained overwhelming popularity as soon as it was released, and became the Korea’s top character in a short period of time.

Why Ryan? 为什么是Rayan?

由于QQ和 Kakao Friends都有很多IP角色，项目早期，我们想设计大量的角色，然而为了给公众留下更强烈的印象，最后还是决定设计最具代表性的。我们选择QQ代表腾讯，KaKao则选择Ryan.Ryan被塑造为KakaoFriends品牌的代表性人物，多次曝光于Kakao的营销、宣传推广以及活动中。在所有方面，没有其他角色能比Ryan更能代表Kakao Friends，这就是我们在这次项目中选择Ryan的原因。

In the early stages of the project, we considered to introduce a large number of characters from both companies since each company had a lot of character IPs. However, it was finally decided to include just one representative character in each company to imprint a stronger image to the public. We chose QQ for representing Tencent, and Kakao has picked Ryan. Ryan was specially created as a representative character of Kakao Friends brand that he has been exposed numerous times as a main character in Kakao Friends’ marketing, promotions, and campaigns. In all aspects, there is no other character than Ryan who best represents Kakao friends. That is the main reason why Ryan was selected as a main character for Kakao on this collaboration.

——————————

2. Design process 设计过程

Character analysis 角色分析

在QQ x Ryan限量版玩具的制作中，我们首先分析了两个角色的外形。QQ和Ryan在某些点上看起来很相似 （头部大到可以形成1:1的身体），但细节却大不相同，QQ身体笨重，四肢活动范围小，Ryan身体修长，可以自由活动。因为两者的身形是如此不同，为了使其看起来是和谐的，我们必须特别注意他们姿势和构造。

For the production of QQ & Ryan limited toy, we first analyzed the appearance of the two characters. QQ and Ryan look similar in some points(the head is large enough to form a 1:1 body ratio, but the details are quite different. QQ’s body is bulky and the range of motion of the limbs is small, while Ryan’s body is relatively slender and the limbs can move freely. Because the shape of the body is so different, it was necessary to pay special attention to the posture and composition of the characters in order to place the two characters in harmony.

Idea sketch 草图构思

设计联名玩具时，我们着重于两个不同角色之间的互动。一开始，我们尝试用抱着或者其他随意的姿势来表达他们之间的亲密关系。然而，由于玩具面向的是年轻一代，我们想到一个主意，让两个角色在一起分享共同的兴趣。基于最近流行的“hip-hop”概念，我们画了很多创意草图，另外，我们使用连帽衫来让他们更有酷感和更加地别致。

We focused on the interaction between these two different characters while designing this collaboration toy. At first, we tried the poses such as hugging each other or doing something casual together to express the intimacy between the two characters. However, since we focused on targeting the younger generation for the toy, we came up with an idea of two characters sharing the same interest together. We’ve tried more idea sketches based on the ‘hip-hop’ concept which is a main trend thesedays. In addition, we focused on making the toy cool and chic, applying the stylish hoodies for their clothes.

Material test 材料测试

材料考虑阶段，我们测试了特殊的材料。限量版玩具的性质，材料的质量和独特性也很重要。因此，我们试着尝试（1）用金属、木材、纺织品等各种材料制作；（2）在玩具表面绘制大理石、迷彩图案、插图和书法等艺术元素。

In the course of considering the toy’s material, ways of applying special materials to the toy were also tested. Due to the nature of the limited edition toy, the quality and uniqueness of the material are also important. Therefore, we tried to test the idea of (1) making figures with various materials such as metal, wood, and textiles & (2) painting artworks such as marble, camouflage pattern, illustrations, and calligraphy on the toy’s surface.

Final concept最终概念

动作上，我们采用的方案是两个角色手拿气球贴着脸的姿势。将用白色材料制作的角色身体涂上真正的颜色后，我们调整详细的比例和姿势，使之与两个角色更加匹配。服装上，兜帽Ryan在过去曾大受欢迎，我们让两个角色穿上统一风格的兜帽，从而使其看起来更加地和谐。最后的方案中，我们把姿势改变为两个角色背对而立的方向。因为两者是以笔挺的姿势靠在一起，为了能够很好地站立，保持适当的重心也很重要。由于必须要在不违反角色性格准则的前提下协调设计风格，我们继续寻求两家公司有关玩具设计的建议，并调整细节。

As a pose, a draft in which two characters sat with balloons holding each other’s faces was adopted. The character’s body, which was planned to be made with white material, was painted with real colors. Then its detailed proportions and poses were adjusted to match the guides of the two characters. As for the costume, Hood Ryan has been a huge hit in the past, so we made two characters wear the same style hood to make the them look more harmonious. At final, the pose was changed to the direction in which the two characters stood back to each other. It was also important to hold the proper center of weight so that the figures could stand well because two characters leaned against each other in a stiff posture. Had to harmonize the design styles of them without violating their character guidelines. Therefore, we continued to seek advice from both companies about the toy design and adjusted the details.

巧合的是，两个角色都以黑色和黄色作为主要颜色。所以我们决定用Ryan的黄色和QQ的黑色来做一个简单而具有象征性的颜色组合。

Coincidentally, both characters use black and yellow as their main colors. So we decided to use Ryan’s yellow and QQ’s black to make a simple and symbolic color combination.

Movable balloons 可动气球

基于3D建模，我们制作了一个玩具原型来测试真实的产品。由于气球的尺寸很大，很难用细线支撑气球的重量；另外为了让用户可以自由展示和把玩他们的玩具，我们想让气球可以移动，而不是固定在角色的手上。

Based on the 3D modeling, we produced a prototype toy to test the real product. Since the size of the balloons were large, there was a difficulty in supporting the weight of the balloons with a thin wire. In addition, we thought of an idea to make the balloons movable to let customers freely display the toys as they like and play with it rather than make them fixed on the characters’ hands.

所以我们把气球从角色中分离，单独搭建一个可以支撑气球的支架。现在，用户可以得到四件玩具：两个气球，两个角色，他们可以自由组合，自由安排。

So, we separated the balloons from the characters and made individual stands which can support the balloons. Now, users can get four pieces of toys including two balloons and two characters which can be freely arranged.

——————————

3. Final product 最终产品

3D wireframe 3D线框

Details 细节

遵循Ryan的品牌基调，玩具整体被设计得简洁而流畅。除了那些重要的细节外，我们没有添加很多的配件或装饰品，因为我们想让玩具表面尽可能地保持干净。

The limited toy was designed to be concise and sleek in overall following the brand tone of Ryan. We wanted to keep the overall surfaces of toy as clean as possible so we didn’t add a lot of accessories or ornaments except for those few important details. Instead, we focused on showing the charm of each characters and concept of this collaboration.

Final rendering 最终渲染

这是QQ x Ryan限量版玩具的最终设计，提高了衣服的质量，添加了诸如logo之类的细节。特别是，我们花了许多精力来设计符合他们姿势的体型。

This is the final design of QQ & Ryan limited toy. The quality of clothes was improved, and details such as logo tags were added to complete the final version. In particular, we put a lot of effort on designing the natural body shape following to their posture.

QQ x Ryan限量版玩具是腾讯和Kakao首次象征性的合作，他们的故事会在接下来的盲盒和表情包项目中继续，本限量款潮玩下半年会发布，大家敬请期待，同时在QQ潮玩展-QTX上会有样品实物提前展示！

QQ & Ryan limited edition toy is the first symbolic collaboration between Tencent and Kakao. Their stories will continue in the upcoming collaboration projects of blind box and online stickers. Please look forward to it!

——————————

3.QQ x Kakao 个性化装扮

这次的项目合作也采用同样的方式，基于QQ与Kakao共享的品牌价值观和生活态度，让Kakao friends走上QQ的舞台，用户可以在个性化商城和表情包商城中找到他们，更直接快速地感受到Kakao friends 系列IP的趣味性和品质感。

Based on the brand values and life attitudes shared by QQ and Kakao, this project cooperation takes Kakao Friends to the QQ stage. Users can find them in personalized mall and emoji mall, and feel the interest and quality brought by Kakao Friends IP series directly.

KAKAO FRIENDS的家族成员有八位，分别是励志温馨治愈系的雄狮RYAN、率真可爱的桃子APEACH、穿上兔子外套的黄萝卜泡菜MUZI、背景神秘的鳄鱼CON、性格内向处事谨慎的小鸭子TUBE、傲娇的时尚达人猫咪NEO、富人家的都市狗FRODO以及热爱嘻哈的自由灵魂鼹鼠JAY—G。他们通过不同的角色表现了许多有趣的故事，用可爱治愈的外表形象和个性化的角色故事为消费者带来欢乐。

There are eight members of the KAKAO FRIENDS family, they are :

Ryan, the inspirational and Healing Lion;

Apeach, the ingenuous and adorable peach;

Muzi, the turnip pickle in a rabbit suit;

Con, the Crocodile;

TUBE, the introverted and cautious duckling;

NEO, the Pussycat of fashion;

Frodo, the city dog of the rich; and

Jay, the Free Spirit, hip hop loving mole.

They show many interesting stories through different characters and bring joy to consumers with cute, healing looks and personalized character stories.

QQ 个性化装扮 | 主题

QQ 个性化装扮 | 表情

QQ 个性化装扮 | 头像、挂件

QQ 个性化装扮 | 名片、背景

QQ个性化商城IP 站已经上线Kakao Friends 个性化装扮，喜欢的粉丝们去商城赶紧装扮起来，这个假期用可爱为你放电。

感谢阅读，以上内容由腾讯ISUX团队参与设计，版权归SUPERFICTION、腾讯ISUX分别所有,转载请注明出处，违者必究，谢谢您的合作。注明出处格式：

文章来自公众号:

腾讯ISUX

(https://isux.tencent.com/articles/qq-sf）