网站设计与手机应用设计的区别.docxVIP

网站设计与手机应用设计的区别 　　与其他领域的设计师相比，网页设计师需要与掌握这些技术的人充分合作。手机应用设计作为第三方智能手机应用程序的图形用户界面设计和交互设计，以移动互联网为平台，逐渐把用户带入一个习惯使手机客户端上网的时期。在应用设计中美需要由功能来传递，每个界面元素都必须专注于当下用户所需。目前，各种手机应用层出不穷，其数目可称之为铺天盖地。在appstore或是其他平台上，手机应用被大致分为几大类：系统工具、影音娱乐、网页浏览、办公阅读、社交通信、生活百科、购物、游戏等。网站设计与手机应用设计的区别：　　1.用户体验的不同　　（1）媒介的特性区别　　传统的网站都是通过计算机终端浏览，而手机应用则是通过智能手机终端平台使用和操作。操作的媒介具有不同的特性及用户使用状态。相比较而言，手机更灵活，可以随身携带，用户在行走中就可以完成操作，也就是说人们只用一只手操作应用，只用一部分注意力在你精雕细琢的界面上，也正因为如此，这与作为设计师的你看到的应用完全不同。　　（2）鼠标点击与触摸屏幕　　当用户使用计算机上网时，利用鼠标对界面进行操作：单击，双击，右键，滚轮。用户操作的热区（可点击）通常在网页的中上部。用鼠标操作的精确性强，很小的按钮也不会产生误点。用户在使用手机应用时，通常是用拇指操作，只有三分之一的屏幕是真正容易触及的，也就是拇指能够到达的区域（单手操作的前提下）。为了获得人机工程学上舒适的体验，设计师应将主点击目标放置在方便拇指点击的热区中。所以这就是为什么工具栏和标签栏一般都放在屏幕的底边，而在传统的计算机界面上，都习惯将菜单放在屏幕或窗口的顶部。但是由于我们有限的拇指热区，主点击目标落到了手机屏幕的底部。该如何组织好点击目标的视觉层次是设计师要考虑的因素。常用的按钮还有导航可以放在屏幕的左边，不常用的按钮还有会改变数据的点击目标可以安全地塞到右上方去。例如“删除”、排列列表项目的“编辑”按钮一般都是放在右上角，这样就能减少误点。　　（3）物理隐喻　　用户在使用智能手机的触屏时会发现其显而易见的物理隐喻：滑动屏幕、点击按钮、轻抚数字轮盘、拖曳地图、拇指食指随意放大缩小图片。用户可以轻松地操作这些交互，因为它们和真实世界中的物体运作一模一样。这得益于手机自带的传感设备：重力感应器、加速度传感器、方向感应器、方位传感器、三轴陀螺仪、距离传感器、光线传感器、气压和温度传感器、紫外线传感器等。设计师可以利用这些物理特性创造出更有趣的交互体验。而这些是传统计算机屏幕无法拥有的感应系统。　　（4）手机应用的优势　　网站的附属应用相较于传统网站有以下几个优势：①高效—移动场景中，最重要的用户需求之一是使用高效。优秀的网站会重新设计应用来提升站点相应部分的体验。淘宝综合类电商网站，设计出了具有特色的手机平台的应用，相较于使用Safari浏览器直接打开的淘宝网站，淘宝的应用界面更为简洁，用一个个图标代表淘宝网首页最主要的功能，将次要的功能信息隐藏或省略，便于手机用户查找使用。②更为生动优美的交互动态效果—基于智能手机平台的网站应用，可以利用手机提供的富有动感的控件更为生动地展示内容。虽通过Web技术可以模拟出接近的效果但无法模拟出手机逼真的物理动态效果。③暂存功能—部分的手机应用较于对应的站点的一个优势在于应用可以预存内容，以备离线阅读。例如，互动分享和个性化定制的阅读类的应用zaker就提供在线状态时下载所有最新的资讯、微博、博客、报纸、杂志、图片、rss、googlereader等众多内容并按照用户个人意愿选择版面区块的内容组成，离线后下载的文章可以在网络盲区中阅读。　　2.界面设计的区别　　（1）界面布局的不同　　传统的网络平台是以计算机为传播媒介，网页的尺寸受屏幕显示的大小的制约，常见的尺寸为1000像素（屏宽）×768像素（屏长），网页的屏长根据内容及功能决定，常见的有两屏三屏等。手机应用设计的界面尺寸和手机显示屏的尺寸息息相关，比如iphone3G尺寸为320×480像素，iphone4尺寸为960×640像素。从上述比较看出，网页的尺寸要远大于手机应用的尺寸，蜗居在巴掌大的屏幕里，每一块地方都是“寸土寸金”。网页设计的界面布局主要由广告区、导航区、页面内容区这几部分构成。导航区通常分布于界面的顶部或左侧，这样的安排是要保证在第一屏时能够完整地看到导航的每个分栏。广告区通常位于导航区附近，占领页面的核心阵地。网页的界面布局总体上分为：“国”字型、拐角型、标题正文型、左右框架型、上下框架型、综合框架型等。选择什么样的布局要根据页面需要包含的内容和功能进行合理设计。手机应用的界面布局和网站既有区别又有联系。在界面布局上基于手机屏幕的特性要将重要的信息放在顶部，将重要的操作放在底部。常见的手机应用