FOR MORE INTERNATIONAL DESIGN IDEAS AND EDGE - CUTTING VISIONS
PLEASE CONTACT ME WITH

Graduation design - Information architecture & User interfaceThis is my graduation design in 2010, which has won the second prize. It is also the starting point for me to contact with Internet, and a dream come out consequently, which is aim to change the current status of internet industry by the real designing philosophy, brand concept and experience I have learned.

I have keen to browse designing information from foreign websites all the time before pay attention to website design. Actually, the whole page of foreign website always gives us a fresh feeling, moreover, the information arranged orderly and regions divided obviously, so that I can find my content after a glance. I will never get lost by any other colors, designing forms or layout when I click into the subpages. All the information I needed will show to my eyes as what I expected. What’s important, there is some unexpected related information share to me. The entire site gives me an expression that the website has abundant content and hierarchical information but we will not loss the way and can find the information there easily.

Conversely, Chinese website often gives us another kind of feeling. When you click into a big size website, defense words and glittering advertising pictures will come into your eyes in the first time, you have to squint and try best to find the regional division. Sometimes you may feel completely overwhelmed when an advertising page was entered into suddenly. In that case, you have to try to visit those websites, and often get lost when click into the content page, because there is no visual memory clues aside. Finally, only little information can be accumulated by spending so much time.

The reason is, several kinds of problems have not been solved indeed in designing, such as, lacking of an overall visual system and style positioning, confuse classification of page information, unreasonable distribution of content and function hierarchical, which lead to a huge information carrying pressure to single page and all information with different hierarchical gathered together and interrupt each other. Moreover, pictures are set individually without considering overall visual guide, all the accesses are designed without taking account of users’ expectation, and unexpected links occur frequently.

How to resolve the above problems? I have tried to optimize the basic product information structure and solve the hierarchical issues through visual design.

First, achieve a reasonable distribution and hierarchical arrangement of all the content in website according to proper information structuring process and establish a clear and effective information hierarchical in order to provide convenient channels for user to find their information, moreover, visual designer can solve the problems through designing and develop the entire interface design which is accordance with information structure. Second, highlight uniqueness and functionality, which can help visitors to finish their query conveniently.

In additional, arrange information hierarchical structure and clear the relationship between functional and content areas. Then put forward problems of information structure and visual design which existed in single page and the whole structure of website and solve them through the knowledge I have learned.

Finally, I chose Taobao for this experimental trial, because it is a big website that collected variety of functions of C2C electronic business, news, information and social interaction, which including many products in different areas and different functional hierarchical. Then I have conduct an actual operation test for each hierarchical, analyze the stereo hierarchical structure, content and functional area distribution, user experience design, visual design and user’s predictability test, find out problems and solve them accordingly.

This subject reposition and design the establishment and optimizing model of the whole large size internet. With a more scientific approach of processing information, information from this kind of website designed under such mechanism can serve users from stereo to plane, and users can not only find their necessary information easily and conveniently, but also can find some valuable information unexpectedly. What’s more, each website will has its own style and service characteristics, although it has not been recognized in China but has an important significance for the future development of website.

这是我2010年的毕业设计,获得二等奖。也是我接触互联网的起点。梦想也是在这时第一次与我邂逅,就是把我学到真正的设计理念,品牌概念以及体验感受带入到互联网行业,来改变现有的状况。

在我没有关注网站设计之前,我一直热衷于上国外的网站来浏览设计信息。每每使用国外网站时第一感觉整个页面很清新,信息排列整齐有序,区域划分明显。我在扫过一眼后就明白哪些区域有我要找的内容,当点击进去次级页面旁边的一切色彩、设计形态、板式安排都不会让我觉得迷路。我要的信息和我预期的差不多尽显在我的眼前,而且旁边确有意想不到的相关信息分享与我,整个站点给我的感觉是网站的内容和层级信息量雄厚丰富,但你却可以在这里轻松的找到自己需要的信息,而不会迷路。

国内的网站却是另一种感受。当你点开一家比较大型的网站首先映入眼帘的就是密密麻麻的文字和“光彩耀人”的广告图片,你必须眯着眼睛才可找到他们之间的区域划分。点击进入之后有时忽然进入一个广告页面让你不知所措。你只能保有尝试的心态去浏览网站,当进入内容页时却有种迷失的感觉。旁边的一切都没有这个网站的任何视觉上的记忆线索。你花了半天的心思却只找到了少量的信息。

原因是设计没有真正的解决问题,没有一个整体的视觉系统,与风格定位。

页面信息分类混杂,内容层级和功能层级没有合理的划分,层级关系缺乏规划这样就使得单个页面的承载信息压力大,所有不同层级主次的信息全部挤在一起,互相干扰。图片各自为政不考虑整体的视觉导向。每个入口都没有考虑用户预期,经常有“意想不到的”连接结果产生。

怎样解决以上的问题?我尝试优化最基础的产品信息架构,然后在用视觉设计去解决信息架构的层级问题。通过合理的信息构架过程可以把整个网站中的内容进行合理的区域划分和层级安排。建立起清晰有效的信息层级,这样才能为用户提供更方便的查找信息的渠道,视觉设计师才能够通过设计来解决问题,建立与信息构架相吻合的整体界面设计。突出网站的独特性和功能性,可以让浏览者更加方便的在网站中完成自己的查询任务。

整理信息层级结构、明确功能区域、内容区域关系的安排。从整个网站的结构到单个页面的呈现提出其中存在的信息架构问题以及视觉设计问题,然后用所学到的知识进行解决。

这个实验型的改版我选择了淘宝。因为淘宝是集合C2C电子商务、资讯信息、社交互动等众多网站功能的大型网站,其中包括了很多不同区域的产品和不同等级的功能层级。对网站的每个层级进行实际的操作体验测试,分析网站的立体层级架构、内容与功能区域的划分页面前端的用户体验设计、视觉设计、用户可预知性测试然后发现问题并解决问题。

这门学科对整个大型互联网的建设与优化模式进行了重新的定位和设计。一种更加科学的处理信息的方式,这样的机制设计出来的网站可以使得网站中的信息从立体到平面为用户寻求信息而服务,用户可以在网站上方便快捷的寻找到自己需要的信息。并且可以发现一些意想不到的宝贵信息。可以使得每个网站都有自己风格特设与服务特色,虽然没有被国内承认但却对于未来网站的发展有重大的意义。

关最终的呈现方式。是以实际体验为基础,通过截图纪录的方式来提出发现的问题,在尝试结合网站现有的内容模块进行信息构架的重组与优化。纪录成为一本120多页的书。

IA & UI