腾讯云开发者社区-腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

腾讯社交用户体验设计

专栏作者

797

文章

766376

阅读量

141

订阅数

设计匠人 | 一个人完成的3D动画片

linux css 图像处理

腾讯ISUX isux.tencent.com 社交用户体验设计 QQ和PUPU的第二集动画《Begin the Adventure》已发布，这一集讲的是Space QQ 和PUPU去太空寻找最美声音之前的故事。 The second episode of QQ & PUPU animation “Begin the Adventure” has been released. This episode contains the fun story of SpaceQQ and PUPU b

2020-03-24

8060

QQ & PUPU 动画设定

腾讯ISUX isux.tencent.com 社交用户体验设计 01 概述 | Overview SpaceQQ 和 PUPU 是在QQ20周年一起亮相的，我们计划做一个简短的动画剧集向用户展示他们的关系与故事。动画被做成20秒左右以适应手机等智能设备，我们试着将暗指了角色特征的有趣故事包含在这短短的时间里。 SpaceQQ and PUPU appeared together through the QQ 20th anniversary event. We planned a shor

2020-02-12

9900

3D企鹅萌弹表情包发布！

图像处理 css express

腾讯ISUX isux.tencent.com 社交用户体验设计如今，移动端通讯软件已成为我们日常生活沟通的主要工具，用户往往通过表情包有效而亲切地向对方传递感受、表达感情。表情包的人物特质往往自然而然就会被看作是使用者特征的一种表达。我们的设计团队希望通过PUPU企鹅表情包的形式，向用户传达PUPU有趣而友好的性格特质。 As mobile messenger has become a main communication tool in our daily life, online

2019-06-28

6440

欧漫风诠释YCG品牌故事

腾讯ISUX isux.tencent.com 社交用户体验设计（YCG品牌宣传片） There are many talented artists how are making creative stuff but they lack the self-confidence to share their work with others. Many of the artists are mostly dedicated to their work and they don't have th

2019-05-16

4460

PUPU奇幻之旅 - 品牌视频设定

微信 css tcp/ip

腾讯ISUX isux.tencent.com 社交用户体验设计 01 Project Overview 看过Pupu的人可能会怀有跟“这个可爱的角色是从哪里来的？”相似的一些问题。对这些问题，我们想通过制作一个解释Pupu开头的简短动画来说明。因此，这部动画重点是说明Pupu的背景故事和细节特征。另外，在制作该视频的过程中，为了使故事更加有趣，出现了Pupu craft或ufo等新概念。这段视频将成为下一集Pupu小插曲的指导方针。 People who has seen Pup

2019-05-16

9830

情感化IP体验设计

图像处理 css

腾讯ISUX isux.tencent.com 社交用户体验设计 01_Character Promotion ABCmouse 是一款源于美国的儿童英语启蒙在线教育 App，全美知名，深受爸妈与小朋友们的喜爱。为配合中国市场运营，我们进行了品牌重塑，并在 App 中采用了更生动的 ABC Mouse 3D 角色。3 到 8 岁小孩是 App的目标用户群，所以在设计过程中特别将造型简化，眼嘴鼻的比例也进行了细微调整，将可爱感发挥到了极致。 ABCmouse is an English edu

2019-01-24

1K0

玩转HTML5移动页面（动效篇）- 腾讯ISUX

svg css http html5 html

作为一名前端，在拿到设计稿时你有两种选择： 1.快速输出静态页面 2.加上高级大气上档次狂拽炫酷屌炸天的动画让页面动起来作为一个有志向的前端，当然是选2啦！可是需求时间又很短很短，怎么办呢？这次就来谈谈一些动画设计的小技巧，能在你时间不多又没有动画想法的时候瞬间让页面增色不少。同时也会谈及移动端H5页面的优化细节与关键点，因此本文章将分为动效篇和优化篇。 ====前方高能==== （1） CSS3时序错开渐显动画这是一种比较常用的动画，它的优点是节奏感强，做法就是先让每个元素隐藏，然后当页面呈现后

2018-06-29

2.6K0

经验分享：多屏复杂动画CSS技巧三则 - 腾讯ISUX

当下CSS3应用已经相当广泛，其中重要成员之一就是CSS3动画。并且，随着CSS动画的逐渐深入与普及，更复杂与细腻的动画场景也如雨后春笋般破土而出。例如上个月做的「企业QQ-新年祝福」活动：感谢sh

2018-06-29

1.6K0

移动H5前端性能优化指南 - 腾讯ISUX

css javascript 渲染 html5 缓存

移动H5前端性能优化指南概述 1. PC优化手段在Mobile侧同样适用 2. 在Mobile侧我们提出三秒种渲染完成首屏指标 3. 基于第二点，首屏加载3秒完成或使用Loading 4. 基于联通3G网络平均338KB/s(2.71Mb/s)，所以首屏资源不应超过1014KB 5. Mobile侧因手机配置原因，除加载外渲染速度也是优化重点 6. 基于第五点，要合理处理代码减少渲染损耗 7. 基于第二、第五点，所有影响首屏加载和渲染的代码应在处理逻辑中后置 8. 加载完成后用户交互使用时也需注意性能

2018-06-29

2.1K0

设计师的春天：中文WebFont解决方案Font-Spider(字蛛) - 腾讯ISUX

css 开源 html

我们在日常需求中，经常会碰到视觉设计师对某个中文字体效果非常坚持的情况，因为页面是否高大上，字体选择是很重要的一个因素，选择合适的字体可以让页面更优雅。面对这种问题，我们通常以下方式来进行设计还原：使用图片背景还原设计，即使用 photoshop 将文本图层单独导出成网页背景图片。产生的问题 1.制作与维护成本很高。切图繁琐、高清屏适配繁琐、合并雪碧图更繁琐，后期修改更加繁琐。 2.用户体验差。导致网页不支持选中、复制、搜索、翻译、矢量缩放，也会影响视障用户使用读屏器操作网页。 3.带来更多带宽消耗。导

2018-06-29

1.7K0

玩转HTML5移动页面（优化篇）- 腾讯ISUX

css 微信搜索引擎

承接上文《玩转HTML5移动页面（动效篇）》，上次说的是让页面动起来的一些小技巧。而页面动起来的根基是功能可用的页面，因此有必要分享一些优化细节的技巧和方向，熟悉掌握一些方法论还是会对页面开发大大提高效率的，并且也能防止疏忽缺漏。 ====前方高能==== （1）动画雪碧图涉及的动画十分多，用的元素也十分多，请务必使用雪碧图（Sprite）！网上的工具有一些可以帮助你生成雪碧图的工具，例如CssGaga，GoPng等等，自动化构建工具Grunt和Gulp也提供了相应插件。特别地，如果单张

2018-06-29

1K0

面向设计的半封装web组件开发 - 腾讯ISUX

api javascript html html5 css

前言本文内容可谓是对大脑认知的一场洗礼。我们平常提到组件，就会想到重用，各个项目都能使用。而本文的组件，对于某具体项目而言是组件，但是，对于其他项目，就是个半封装的半吊子组件。面向设计、面向项目的web组件开发，就是本文要探讨的主旨。一、人与组件目前这个阶段，我们所使用的web组件都是人所编写的，因此，人这个个体在赋予组件生命的时候就扮演了至关重要的角色。人的技能背景，个人喜好，甚至世界观都可以从组件中得到体现。但人无完人，因此要想诞生一款完美的组件，需要上下游很多优秀的同事，把自己最棒的世界融入

2018-06-29

8490

动效设计原理:从卡通动画到UI动效 - 腾讯ISUX

概要 UI是基于静态页面来设计的，页面之间通过跳转切换。在设计过程中，设计师很重视单页的视觉效果，却经常忽略了对界面跳转的处理。这些未经处理的跳转由于没有提供足够的预期，所以用户在使用时经常会觉得困惑。与此相反，在卡通领域，由于使用了足够的动画效果，用户可以非常容易理解某个动作，即使夸张的动作也没问题。尽管UI设计和卡通动效之间存在差异：卡通更侧重于娱乐，而用户界面却是严谨的互动式工具。但是我们还是可以借鉴卡通动效的优点，从情感和认知层面上将两者的优势相结合。 Keywords UI、动画效果、卡通

2018-06-29

1.7K0

带你轻松打开SVG动画的大门 - 腾讯ISUX

初学SVG的时候，感觉那一坨一坨的代码难读难懂，现在回过头仔细想想，是因为那时候看文档缺少一些具体的实例，导致学习起来很枯燥。如今SVG已经在前端各个领域都有所作为，无论是项目里的应用还是demo都所

2018-06-29

3960

响应式Web设计:布局 - 腾讯ISUX

http https css 网络安全

写在前面去年上半年，我开始着手推动项目中响应式设计的落地。以官网优化需求为契机，主动去做了响应式的页面设计，也说服了产品、设计和开发的相关同事一起把它上线落实，但不幸的是，由于各种方面的原因，比如，生搬硬套的PC模块，无差异化的设计使得移动端阅读不佳，导航兼容性有限等等原因，上线几个月后又悄然下线。我不禁反思，项目中是否应该推行响应式？今年年初重新启动了全站响应式项目，从产品、交互、视觉到开发，各个角色全方面参与了响应式项目，最终门户的页面实现全面响应式。在项目过程中有技术沉淀，也有不少的思考，也就有了以

2018-06-29

6200

没有更多了

社区活动

腾讯技术创作狂欢月

“码”上创作 21 天，分 10000 元奖品池！

Python精品学习库

代码在线跑，知识轻松学

博客搬家 | 分享价值百万资源包

自行/邀约他人一键搬运博客，速成社区影响力并领取好礼

技术创作特训营·精选知识专栏

往期视频·千货材料·成员作品最新动态