解析韩国NAVER网站用户体验设计

2016-02-17 02:00 6 1 收藏

今天图老师小编给大家精心推荐个解析韩国NAVER网站用户体验设计教程,一起来看看过程究竟如何进行吧!喜欢还请点个赞哦~

【 tulaoshi.com - 平面设计 】

NAVER(네이버)是NHN公司下韩国著名门户/搜索引擎网站,其Logo为一顶草帽,于1999年6月正式投入使用。

解析韩国NAVER网站用户体验设计,PS教程,图老师教程网

http://shopping.naver.com/ 在前不久对页面整体进行了改版,改版后的页面较之以前的更加整洁,增加了层次感,张驰有度,将页面整体的品质感也做大的提升,从本期开始,我们将对韩国网站的一些细节进行部分研究和学习,也做为和大家的一个讨论,希望能够一起从网站本身的视觉细节上多做研究,在设计时,能让页面更有节奏感

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/pmsj/)

第一期 栅格

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/pmsj/)

我们先来看一下shopping.naver的首页

解析韩国NAVER网站用户体验设计,PS教程,图老师教程网

从上面可以看出来,naver是按照一个固定的栅格来进行扩展的,那么他的区块为多大呢?

对各个区块进行测量:

解析韩国NAVER网站用户体验设计,PS教程,图老师教程网

从上面测量出来的区块大小来看,他都是按照一个210x290为标准的栅格块来对各个版块进行区分

解析韩国NAVER网站用户体验设计,PS教程,图老师教程网

分为块状结构后,不仅使整个页面的区块更加明显,内容更有条理和清晰外,同时还平衡了每块内容区的比重,无论在哪一屏,都拥有了强烈的一致性,同时,还有一个非常明显的好处 ,那就是

我们来看一下小的分辨率下页面的布局吧

解析韩国NAVER网站用户体验设计,PS教程,图老师教程网

是不是,感觉非常灵活和自然,无论是在哪种屏幕分辨率下,他都进行了自然的重组和排序,而且对于内容上也没有丝毫的影响,不必考虑太多对于响应式实现的过多准备,表现非常棒!!

看完了shopping.naver的栅格,想必大家现在第一反应就是想到了我们一淘的网站,目前一淘网站特别是首页,的确是没有应于任何栅格,只做了一些基准的对齐和小范围的栅格。通过对shopping.naver的栅格分析,我对一淘的网站栅格也做了shopping.naver同样的标准化栅格实验。

按照目前宽度为990的话,通过计算,会发现,190也同样是一个神奇的数字,在990下,我们以naver宽度比例来假定一淘网站的栅格比例

以190x270为一个基本栅格单元格

解析韩国NAVER网站用户体验设计,PS教程,图老师教程网

我们先按照shopping.naver的版式,以990的宽度对etao.com进行栅格划分

解析韩国NAVER网站用户体验设计,PS教程,图老师教程网

可以看到,我们的网站也可以像naver一样进行完美栅格划分

那么

是不是同样的说,我们也可以像naver一样对版块进行流畅移动,处理不同屏幕分辨率下网站的显示结构

ok,本篇只是对栅格进行了一个从naver结构中的平移,源文件存放于etaouxetaoued j_君沫个人分享韩国网站细节化体验栅格篇,如果有任何想法,大家可以一起讨论

下一篇,字体细节化,随后发出

来源:http://www.tulaoshi.com/n/20160217/1577449.html

延伸阅读
有一段时间没分享一点儿东西了,记得上次与大家分享过情感化设计中的手绘应用表现。今个再次煽情一下,与大家分享一点关于色彩情感的那些事儿,可能前部分的色彩介绍大家有了解过。但任何事情有因有果,所以还是先让大家了解下关于色彩的组成和色彩的情感等,再来简单说说在我们生活中和界面设计中的运用所带来的感受,以及人们对色彩的喜好偏...
随着互联网产业的飞速发展和电子产业的飞速发展,人们的社交似乎离不开网络,这就应运了SNS的飞速发展。 从打开QQ空间关注朋友们的动态,最近心情如何;到去人人网上找到久不联系同窗故友;上班闲着去开心上偷偷菜发发扰骚;休息时去白社会听听歌、看看报、做做测试、试试手气、算算运气。 今天让我们以QQ空间为导引,共同探讨中国SNS的用户体验...
工具型网站的特点剖析 工具型网站万变而不离其宗地围绕两个关键词在展开属于它们各自的情节,那便是:功能与数据。所以谈至"体验",其实设计目标也就更加清晰和明确 1.在保证功能流程顺利走完的基础上,让用户的感觉更加舒适; 2.在面对大量数据时,让用户轻松找到自己所需要的而不被满屏幕的字符折腾地焦躁不安。 工具型产品普遍...
设计,必须是充满诗意的。 带过五年多的用户体验设计团队,从几个人到二十几个人。以前自己也做过技术,发现工程师和设计师其实是有很多相近的地方的,那就是都有追求。 带领团队,并不是管好人就行了(所谓的行政管理),更是要实现业务的成功,给团队定目标,定追求,然后与大家一起想办法达成。这五个设计原则就是在团队日益变大,项目越来...
学校可以为你传授很多知识,但是有些职业学校教不来,产品经理、用户体验设计师、交互设计师、程序员鼓励师这样的职业都在此列。这样的职业通常都有几个显著的特性,使得他们很难成为高校课堂上稳定输出的课程:交叉学科,大跨度的知识体系,快速发展进化,需要持续不断地自主学习。难道不是么?去年的UI设计的用户体验设计需求和今年的不一样...

经验教程

934

收藏

95
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部