资源描述
单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,视觉规划及一期提案,百度,知道,用户体验部,石爽,目录,产品视觉现状,评析,视觉发展,趋势,及,规范,化道路,知道产品视觉细分,思路草案,一期,提案,说明,1,百度知道产品视觉现状,评析,A.,色彩体系,web,各元素色彩使用,色彩情感上,不统一:冷暖混搭,产品取向不明确。,色彩在信息分层显示,上有优化的空间。,品牌色彩,没有过于隐晦。,B.,图标体系,未统一色彩范围。,制作方法不一致,无法延展,升级。,图标的使用不规范,造成页面点元素过多,页面繁星点缀。(例如知识掌门人),C.,样式体系,对已经形成的统一的样式库进行规范整理。,从产品角度,规范和升级样式体系。,D.,排版体系,对各种信息总结归纳排版规范,对应到页面的样式中去,方便修正与升级。,从产品角度,规范和升级排版样式。,E.,专题体系,没有很好的体现用户浏览心理。,没有形成品牌化的视觉风格,栏目模板有待统一规范(可扩展易更新)。,2,百度知道视觉发展趋势,规范化升级道路,A.Web,产品视觉趋势,规范化,迭代的视觉升级,增强品牌对用户的影响,视觉为品牌服务,视觉为引导信息服务,视觉为功能服务,B.,知道产品的操作方式,第一步,色彩,体系,图标,体系,样式,体系,排版,体系,专题,体系,产品现状,B.,知,道,道,产,产,品,品,的,的,操,操,作,作,方,方,式,式,第,一,一,步,步,色,彩,彩,体,系,系,图,标,标,体,系,系,样,式,式,体,系,系,排,版,版,体,系,系,专,题,题,体,系,系,分,步,步,进,进,行,行,个,个,体,体,系,系,的,的,视,视,觉,觉,优,优,化,化,(,(,基,基,于,于,现,现,有,有,的,的,设,设,计,计,),),统,一,一,可,可,操,操,作,作,可,可,延,延,展,展,可,可,升,升,级,级,输,出,出,优,优,化,化,设,设,计,计,稿,稿,和,和,细,细,分,分,规,规,范,范,(,(,不,不,是,是,改,改,版,版,),),B.,知,道,道,产,产,品,品,的,的,操,操,作,作,方,方,式,式,第,一,一,步,步,第,二,二,步,步,色,彩,彩,体,系,系,图,标,标,体,系,系,样,式,式,体,系,系,排,版,版,体,系,系,专,题,题,体,系,系,第,三,三,步,步,第,四,四,步,步,分,版,版,本,本,阶,阶,段,段,升,升,级,级,视,视,觉,觉,系,系,统,统,为,为,产,产,品,品,创,创,新,新,提,提,供,供,可,可,能,能,3,百,度,度,知,知,道,道,视,觉,觉,细,细,分,分,思,思,路,路,草,草,案,案,色,彩,彩,体,系,系,图,标,标,体,系,系,样,式,式,体,系,系,排,版,版,体,系,系,专,题,题,体,系,系,一,、,、,图,图,标,标,体,体,系,系,图,标,标,体,体,系,系,的,的,第,第,一,一,步,步,,,,,是,是,基,基,于,于,先,先,在,在,的,的,图,图,标,标,,,,,进,进,行,行,微,微,调,调,,,,,使,使,之,之,统,统,一,一,规,规,范,范,。,。,最,终,终,效,效,果,果,,,,,将,将,是,是,无,无,形,形,中,中,的,的,一,一,种,种,设,设,计,计,升,升,级,级,,,,,不,不,会,会,带,带,来,来,突,突,变,变,效,效,果,果,。,。,A.,知,道,道,图,图,标,标,分,分,类,类,栏目符,号,号,点缀提,示,示,荣誉等,级,级,系统功,能,能,B.,设计尝,试,试,尝试图,标,标来自,:,:,知道首,页,页,问题页,面,面,B.,知道图,标,标,尝试图,标,标来自,:,:,1.,保留旧,版,版的符,号,号和基,本,本的色,彩,彩体系,。,。,2.,统一图,标,标尺寸,、,、色彩,体,体系、,符,符号体,系,系、设,计,计制作,方,方法。,C.,设计说,明,明,1.,规范取,色,色范围,:,:图标,色,色彩的,统,统一,,为,为设计,成,成套的,图,图标提,供,供视觉,前,前提。,2.,色彩选,择,择取向,暖色,包括蓝,色,色和绿,色,色在内,的,的冷色,系,系色彩,,,,在应,用,用的时,候,候都会,适,适当增,加,加暖色,倾,倾向,,创,创造愉,悦,悦的氛,围,围。,C.,设计说,明,明,2.,细化设,计,计方案,,,,明确,图,图标的,UI,取向,1,),45,度高光,,,,呈现,柔,柔和的,凸,凸起,2,)统一,内,内发光,3,)反白,符,符号,4,)统一,图,图标的,大,大小(,针,针对不,同,同类别,的,的图标,进,进行大,小,小规范,统,统一),5,)增加,阴,阴影效,果,果,创,造,造页面,层,层次。,旧,新,C.,设计说,明,明,2.,细化设,计,计方案,,,,明确,图,图标的,UI,取向,1,)柔和,造,造型处,理,理,升,级,级图标,亲,亲和力,,,,更有,利,利于图,标,标融入,界,界面设,计,计,创造亲,和,和的表,现,现力。,旧,新,按照上,面,面的思,路,路和方,法,法,,在项目,确,确定后,,,,可以,更,更完整,的,的实施,,,,,设计方,案,案可以,继,继续优,化,化和筛,选,选。,二、知,道,道掌门,人,人,页面特,点,点:繁,星,星点缀,。,。,通过优,化,化,解决信,息,息传递,混,混乱的,局,局面。,创造愉,悦,悦宽松,的,的浏览,空,空间。,旧,1.,淡化了,右,右侧的,交,交互兴,趣,趣,让,该,该模块,失,失去了,头,头条的,功,功能。,1.,绿色取,色,色与图,标,标改版,的,的取色,趋,趋势一,致,致,取暖。,2.,交互更,明,明确,,激,激活用,户,户对信,息,息的切,换,换浏览,。,。,新,1.,突出栏,目,目,,而非单,个,个标注,。,。,2.,突出知,识,识信息,,,,淡化,框,框框线,线,线。,1.,色彩取,向,向偏暖,,,,让阅,读,读更加,轻,轻松愉,悦,悦。,2.,信息更,清,清晰突,显,显,让,信,信息有,层,层次的,进,进入视,线,线。,知道掌,门,门人模,板,板,;,知道掌,门,门人模,板,板旧,新,知道掌,门,门人模,板,板旧,新,知道掌,门,门人模,板,板旧,新,1.,基于原,有,有的设,计,计,信,息,息元素,位,位置不,变,变,只,对,对模板,的,的背景,颜,颜色、,文,文字色,彩,彩,、图标,和,和段落,行,行间距,进,进行优,化,化,旨,在,在创造,透,透气舒,适,适的阅,读,读空间,。,。,最终去,掉,掉框线,,,,放松,视,视觉浏,览,览,谢谢观,看,看,百度,UE,
展开阅读全文