腾讯WSD融合的设计.docx
- 文档编号:20463593
- 上传时间:2023-04-25
- 格式:DOCX
- 页数:14
- 大小:1.33MB
腾讯WSD融合的设计.docx
《腾讯WSD融合的设计.docx》由会员分享,可在线阅读,更多相关《腾讯WSD融合的设计.docx(14页珍藏版)》请在冰豆网上搜索。
腾讯WSD融合的设计
【腾讯WSD】融合的设计–QQ浏览器(android)设计分享
【腾讯WSD】融合的设计–QQ浏览器(android)设计分享
每一次全新版本的设计都伴随着挑战与激情,它们化成对产品不断精细打磨的动力。
在经过反复的推敲和锤炼后,孕育出了QQ浏览器的全新版本。
这个版本优化了交互结构,新增应用+以及边栏小工具。
当然,UI的变化是一目了然的。
早在去年年底,我们就投入到QQ浏览器的新版设计中。
现回过头来看,整个的设计都贯穿了融的设计理念。
“融”的设计理念
融,有融入、融合之意。
就如同光线、水珠、环境的包融。
打破惯有的格局,追求一种更和谐平衡的关系。
并尝试摒弃工具式应用带给人的死气,呆板的形象。
融,同时也包含了简洁,优雅、流畅的特点。
让用户获得更好的沉浸式体验。
并确定以简约、清新、开阔、沉浸式为主的设计关键词。
设计目标的融合
这次新版本的视觉设计风格主要从三个方面综合考虑
增强品牌形象
自从QQ 浏览器更换 logo 及 slogan 后,品牌的统一度得到更大的提升,发展方向也更加明确,这次新版本的设计需要在此基础之上进一步增强QQ浏览器品牌形象。
把握设计趋势
无论是 WindowsPhone7 那种极度平面化的设计,还是 Android4.0 明快的线型设计, 都反映出移动设计不断的向简洁,轻快方向行进的趋势。
因此,我们的新版设计是需要符合这种设计趋势的。
紧扣浏览体验
浏览器是用户获取信息的一道重要窗口。
其核心诉求还是方便快捷的为用户提供各方面的内容。
打造内容提供平台,创造沉浸式阅读体验,是浏览器设计的重要任务。
设计表现的融合
色彩质感
从QQ浏览器的新品牌颜色、云的概念以及浏览器闪屏,我们想到了蓝天白云,天地交融,一览众山小的场景。
这正是融的设计理念所想传达出来的开阔豁达的感觉。
因此,经典蓝白加上平滑渐变,扁平质感,作为了QQ浏览器的首要选择。
层次结构
我们尝试打破头部区标题栏与内容区传统有形的界限。
而是采用有机自然的方式将两者融和过渡,既保证了头部区功能的有效表达,又在视觉上有使两者浑然一体。
底部工具栏也采用相同的处理,和内容区有平滑的连接。
整个设计就在视觉上最大程度的增大了内容区,突出内容,进一步创造沉浸式的阅读体验。
由浏览器闪屏到起始页的演变,保持了品牌的延伸,也承载了融的设计理念。
简洁一致的设计
我们对其它页面也进行了层级结构优化。
在不同的页面创造统一的视觉体验,简化冗余信息的同时,将页面以更轻盈,简洁的方式呈现。
体验功能的融合
一图一世界,轻量的皮肤设置功能
在新版的设计中,我们加入了换肤功能,并采用的是最轻量级的换肤。
结合融的设计理念,所有控件都注重“黑白灰”的设计,因此界面保持了很高的包容度。
这样,仅仅是简单更换一张图片,就可以使界面视觉效果有所不同。
页面元素高宽容度的设计既能与背景融为一体,又保持了内容信息的可读性。
这种换肤方式提高了产品的差异化又满足了用户彰显个性的需求,并且相比传统的换肤方式,可以有效降低设计出图数量。
结合场景的设计
当用户进入到夜间模式时,整个背景将变换成夜晚的星空,将情景融入页面的设计,营造整体的氛围。
让用户体会到产品的情感和人性化的关怀,并创造沉浸式的使用体验。
(后续版本实现)
隐藏着的低调,侧边栏的设计
浏览器的功能越来越强大,如何有效的安排信息的排布,区分主次功能层级,将很大程度影响产品的使用体验。
新版本中,我们从新对菜单项进行了功能归类,由以前的三屏简化成一屏。
当用户呼出菜单时,可以一目了然那些主要且常用的功能。
将增强阅读型的功能整合进入侧边小工具栏,用户可随时通过右上角的按钮或者页面外滑动呼出。
这样既保持了菜单项的简洁,又对功能信息项做了区分。
细节的融合
图标的重绘
之前版本的图标更多的采用面形的设计。
加上它本身的质感,多多少少还是会显得厚重。
在新版中,我们将所有图标都采用线形重新绘制,中性配色,保持高包容度。
更好的融合新版简约清新的观感。
版本发布后,新的 UI 设计也获得用户的肯定和赞许。
这只是我们向前迈进的又一步,整套设计还有一些新的特性和变化会陆续在后面的版本中实现^_^。
当然,目前版本还存在着许多的不足。
真心期待大家的反馈和建议。
你们的支持,是我们前进的最大动力,让我们一起把浏览器的体验做得更好。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 腾讯 WSD 融合 设计