全国免费咨询热线:400-611-9921
 
移动网站设计的视觉体验

2015-09-11

884

各式或华丽,或炫目,或让人迷惑,或让人叹服的Web Design已经愉悦我们很长很长的日子了。 可是,当有一天我们发现了一个新事物——用手机上网,在手机上看网页,我们看到了一种不一样Web,这种网页大家通常叫他们Wap页面,这种页面形式用简洁的视觉效果,清晰的页面架构和小分量的页面体积第一次满足了我们手机上网的需求。

各式或华丽,或炫目,或让人迷惑,或让人叹服的Web Design已经愉悦我们很长很长的日子了。 可是,当有一天我们发现了一个新事物——用手机上网,在手机上看网页,我们看到了一种不一样Web,这种网页大家通常叫他们Wap页面,这种页面形式用简洁的视觉效果,清晰的页面架构和小分量的页面体积第一次满足了我们手机上网的需求。


移动网站设计的视觉体验,互联网的一些事

 

  但到了人类历史的某一天,铺天盖地的Iphone 某某 和Android谁谁都出现了,硕大的屏幕尺寸,华丽的界面展现,用手指头去完成各式的操作,手机的的历史使命再也不是打电话发短信,人们大呼“我们要上网!”我们需要给予用户手机上网合理的体验,丰富的内容和交互。又由于Html5的“说是快,那是及”的出现,时势造英雄Mobile Web 华丽登场了。


移动网站设计的视觉体验,互联网的一些事

 

  (一) 我是一种延续——Mobile Web承接Web的视觉体验

  以www.deviantart.com为例,她已经是无数设计师生活的一部分,在个人电脑上我们拥有她,在手机上我们也需要她。


移动网站设计的视觉体验,互联网的一些事

 

  Mobile Web的任务很重要的就是要满足用户们从个人电脑到手机的延续,用户在个人电脑上看,在手机上也看,对于像”www.deviantart.com”这样的有很久时间积累的产品,她的视觉风格在用户的脑子里早已形成了一个具象的画面,在移动设备上我们的”m. deviantart.com”同样需要延续这样的品牌视觉风格。


移动网站设计的视觉体验,互联网的一些事

 

  从例子里我们看到好的品牌视觉延续,帮助用户在使用移动设备访问该网站时立刻建立起亲切的视觉初体验和品牌认知。更重要的是,好的视觉设计的延续可以很好的帮助用户在使用Mobile Web时快速的定位自己在个人电脑上使用Web产品时已经熟悉的各种功能,使得用户在Mobile Web上快速上手完成自己的交互需求。

  (二)我是一种重生——Mobile Web视觉设计的创新

  作为Mobile Web的舞台,Iphone 某某 和Android谁谁都有着各自,各式各样的“规章制度”,而且各自特立独行,我行我素。Mobile Web的舞蹈要与他们浑然天成,就需求穿上他们提供的舞衣才能与君共舞。


移动网站设计的视觉体验,互联网的一些事

 

  www.yahoo.com 的页面效果 与m.yahoo.com的页面效果


移动网站设计的视觉体验,互联网的一些事

 

  www.baidu.com的页面效果与m.baidu.com的页面效果

  一个优秀的Mobile Web设计在延续了自身品牌的一致性后,与移动设备本身的品牌视觉特性相结合是成功的重要因素之一。一致性能帮助用户得到与设备本身和谐的流畅体验。

  在上图中我们分别看到门户产品yahoo和搜索引擎产品baidu分别在个人电脑端和移动设备端的Web与Mobile Web的视觉呈现有很大的差异。一个优秀的Mobile Web设计在延续了自身品牌的一致性后,与移动设备本身的品牌视觉特性相结合是成功的重要因素之一。一致性能帮助用户得到与设备本身和谐的流畅体验。


移动网站设计的视觉体验,互联网的一些事

 

  www.naver.com的页面效果与m.naver.com的页面效果


移动网站设计的视觉体验,互联网的一些事

 

  m.naver.com的众多带有移动终端特点的视觉设计

  在naver的Mobile Web视觉设计中使用了大量移动终端本身的视觉特点,如产品的链接采用app icon的方式,各级页面中导航的设计等等。

  我们可以发现好的品牌再设计,也会给品牌本身带来更多的视觉展现的可能,也迎来了味道更纯正的Mobile Web,真的为Mobile 而设计——“为了用户感受的一致而不一致的去做设计”。

  (三)我是Mobile Web——新的物种

  曾经我是 Web的一个化身,但我在Mobile 的星球生活,我开始变化,我有了自己更多的特性,有一天我终于意识到我成为一种新的物种。


移动网站设计的视觉体验,互联网的一些事

 

  www.baidu.com 的首页与m.baidu.com的首页

  用户在使用个人电脑上网与使用移动设备上网时的需求,因为使用场景,使用时间 ,使用群体等等的不同,以及移动设备本身的反推可能有着越来越大的差异。所以我们看到在个人电脑端的baidu首页没有“小说”链接,但在移动终端的baidu首页上拥有独立的“小说”频道。


移动网站设计的视觉体验,互联网的一些事

 

  Baidu小说频道

  这样的差异衍生出一批批Mobile Web自有产品,这样的产品为满足用户在移动设备上的强需求而设计,这样的设计不再有过去为人们所熟悉的个人电脑Web设计的影子,成为真正的Mobile Web。


移动网站设计的视觉体验,互联网的一些事

 

  www.google.com.hk的首页与m.google.com.hk首页


移动网站设计的视觉体验,互联网的一些事

 

  Google移动端周边搜索

  (四)我是云端的App—— Mobile Web App视觉设计

  随着网络的不断发展,Mobile Web又迎来了Mobile Web App,不需要下载,将我添加到桌面,就成了一个App应用。


移动网站设计的视觉体验,互联网的一些事

 

  Naver Mobile Web App

  Mobile Web 的视觉设计进入到全面的客户端化视觉设计, Mobile Web 与Mobile Web App的视觉设计真是老虎老鼠傻傻分不清楚。


关注我们:在查找公众号中搜索:zomsky1688,或者扫描下方二维码快速关注。
广州市纵天信息科技有限公司公众号
关键词:纵天科技,广州网站制作公司,广州网站建设,广州网站设计,网站建设,手机网站开发
热门标签
营销型网站建设柏洪集团网站集团网站建设新元素网站教育网站德胜教育集团德国商会网站建设德国商会品牌网站建设福美控股赛立信网站建设智能家居网站运动网站建设贸易网站建设玩具网站建设化工网站建设日化网站建设家电网站建设音响网站建设物流网站建设旅游网站建设网站建酒店网站建母婴网站建设珠宝网站建设钟表网站建设培训网站建设教育网站建设建材网站建设装饰网站建设机械网站建设美妆网站建设展览网站建设皮具网站建设五金网站建设仪器网站建设照明网站建设水电网站建设咨询网站建设法律网站建设家具网站建设家居网站建设服装网站建设服务网站建设食品网站建设金融网站建设餐饮网站建设环保网站建设政府网站建设科技网站建设地产网站建设医药网站建设数码网站建设营销型网站广州网站制作广州网站建设公司建网站广州网站设计公司建站优必思官网英文版网站定制网站广州网站建设中服装网站设计服装网站制作防火板网站大数据网站科技网站制作三盟科技物联网网站人工智能网站防火板网站制作家居网站制作枕头网站电器网站制作电器网站家具网站家居网站斯帝罗兰网站建设公司​手机网站建设响应式网站企业官方网站网站策划官网改版企业网站建设网站制作网站设计建站公司网站建设公司企业网站网站建设费用网站建设广州企业网站建设企业建站官网建设公司网站制作拉链官网广州建站广州网站建设纵天科技
立即致电纵天品牌顾问:
400-611-9921
联系我们:

地址1:广州市天河区珠江新城邦华环球广场16F

地址2:杭州市滨江区滨安路1190号智汇中心B308

业务 QQ: 3561401262

E-mail: sales@zomsky.com

电话咨询 在线咨询 QQ咨询 官方微信
官方微信
TOP

立即与纵天项目顾问通话

400-611-9921

您也可以咨询我们的在线客服或预约资深顾问

信息保护中,请放心填写
关闭