王朝网络
分享
 
 
 

360极速浏览器品牌设计分享

王朝学院·作者佚名  2016-08-09  
宽屏版  字体: |||超大  

项目背景

自 2010年9月15日360极速浏览器发布以来,默认界面一直沿用Chrome的外观设计。随着360极速浏览器的发展以及品牌化建立的需求,360UXC与产品团队进行了深度的合作,以优化用户体验与提升视觉品质为目标参与到极速浏览器6.0版本的整体形象设计中,设计了全新的浏览器界面和官方网站,为360极速浏览器的品牌化建立打下了坚实的基础(chrome.360.cn)。

设计准备

我们为建立品牌化视觉设计进行了多种有意义的尝试,设计前期与产品部门进行了深度的沟通交流,了解产品的人群定位,发展方向,用户研究进行了核心360极速浏览器用户调研,为下一步设计做好充分的准备。之后组织设计师,进行Brainstorming,分析现在的设计流行趋势,包括相关竞品优缺点分析等工作。

首先我们从整体的设计趋势出发,研究总结Windows xp风格过渡到Windows 8的Metro风格变化过程,发现整体的界面质感慢慢趋向于平面化,这为后期设计带来了理论性依据。

从界面的侧面图来看,渐变厚度的过渡,让视线更多的关注于信息内容本身。所以在设计过程中,我们并不是一味的追求metro视觉效果,同时要考虑 Windows xp和windows 7的用户,所以从另一个角度思考这样的设计是把关注点放到信息内容本身,而非界面元素上。同时我们分析了相关行业竞品,通过比较分析确定了极速浏览器的视觉风格定位。

设计目标

这次极速浏览器产品界面改版整体视觉风格的关键词可以定义为:轻量化,品牌化,快速。轻量化-体现极速浏览器更轻量,功能更精简;品牌化-凸显建立极速品牌化特征;快速-简化信息呈现的层次,优化操作与内容区域。

极速浏览器界面设计

我们在视觉设计上进行了很多尝试,整体框架用极简的线条拼接而成,去掉多余干扰的视觉表现元素。全新的设计,给用户耳目一新的感觉。

Tab色彩选择,我们进行了很多配色和形式的尝试。

网站缩略图的定制化

把大部分常用网站做成定制化图形放到界面,在第一时间让用户对网页内容感觉直观,同时达到界面与内容可视化的统一,更整体。

控件化输出,精细到每一处设计细节

在图标设计中, 应该保证其轮廓清晰,图形应采用抗锯齿角度进行设计;尽量填满整个画布,但要避免出现装饰性视觉元素影响图标的识别性。简洁的界面往往更需要细节的深入刻画,这样界面才能简约而不简单。

官网首页设计

1、界面布局及信息:

简化界面布局,精炼界面元素和信息,在保证浏览者对于页面以及产品有足够的认知的情况下,使界面做得尽量简洁,从而传达出更轻盈的视觉感受;

2、色调:

简约而通透的高明度页面。白色,因其明度最高,无色相,明亮干净、畅快、朴素,永恒无暇,在自然界象徵着极致的纯净与贞洁。轻快的白色可以给人很好的轻快速度感,整洁、大空白的同时让用户保持欢快的情感进行浏览。所以整体界面基调明度较高。

3、背景选图:

明亮大窗的房间一角,阳光静静的泻进来,打造你所熟悉并喜欢的环境,舒适、安静、勿打扰的环境谁不愿意多停留一些时间呢,同时打造画面的空间感,前景物体清晰可辨,背景虚化,画面形成纵深感,层次分明主题突出,使画面在高亮基调下层次更加丰富。

二级页

秉承首页的简约,轻薄,现代风格,重内容轻质感,通过文字信息大小、颜色和间距使内容产生自发的性质的分离和形式感,明亮的白色无边框背景,使页面更加通透。实验室界面使用两个概念性的配图,介绍html5和双核浏览器实验室,白的背景,简单的布局继续保持整站简约、轻薄、明快的气质。

设计细节-字体

在原有字体结构基础上将笔画重新整合归纳,简化横、竖,强调钩、捺,融入简洁利落的现代审美意趣,使字体端秀舒展、清新挺拔,对汉字结构的认知与现代字体设计之间的关系。设计成个性强,兼具现代感的新字体,能加入自我的思维与创新,即传统又时尚。结构宽博严谨,笔画设计灵动自然。

设计细节-按钮

首页网站banner营造的是一种自然的环境,真实且贴近用户,“免费下载”作为官网的重要功能点,受到自然光环境的影响,投影映射到桌面,设计成整个场景中的一个元素,放在桌面上的一件物品,与整个场景浑然一体。采用统一光源,逆光效果使主体更加突出、灵动。

配图从视觉的形象阐释说明html5和双核实验室的概念

总结

UXC 在整个项目设计过程中产品团队,用户研究密切合作,定义极速浏览器设计方向,整个过程可以总结为三大部分:1,设计方案由产品即时给出反馈,2,建立反馈流程了解用户的想法,3,按照预期标准按时输出。最终上线得到用户的广泛认可,同时极速浏览器获得了公司的项目奖,UXC团队在以后的工作中会再接再厉,设计出更好的作品,因为,浏览器主要以可用性为主,如果在使用中遇到什么问题或者有好的想法也欢迎一起讨论交流:)

极速浏览器官网:http://chrome.360.cn/

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
>>返回首页<<
推荐阅读
 
 
频道精选
静静地坐在废墟上,四周的荒凉一望无际,忽然觉得,凄凉也很美
© 2005- 王朝网络 版权所有