UI Web界面设计

原创 2007年10月07日 09:22:00
UI Web界面设计
-北京菜农-

前言

    本文将主要在web(如网站)界面设计上的一些观点和看法做相应阐述。
    先来理解一下什么是UI?UI即User Interface(用户界面)的简称。UI设计则是指对软件的人机交互、操作逻辑、界面美观的整体设计。好的UI设计不仅是让软件变得有个性有品味,还要让软件的操作变得舒适、简单、自由,充分体现软件的定位和特点,使用户(使用者)在使用的时候能得心应手,心情舒适。
    从上面的定义中我们得知UI设计里包含有两大部分,一个是操作逻辑(交互设计)设计,另外是视觉界面(界面设计);UI设计包含用户(User)和界面(Interface)两个层面的含义,在设计的时候二者因素缺一不可;我们必须从用户(软件使用者)和产品两个因素在考虑和设计软件的UI。特别是web产品,web产品与桌面应用程序相比,表现形式更为丰富和复杂;这也为丰富的表现web产品视觉界面提供了可能;

把握Web UI设计
1,    一切从用户需求出发;就是说我们所作的设计必须要站在用户的角度去考虑和得出结论;任何不为用户着想的设计都是失败的设计;
2,    UI功能的简繁视用户需求和产品系统而定;要回避为了实现某些功能而设计某些功能;特别是UE设计过程中更要回避。比如,有时为了体现某个新鲜的交互(它真的是用户所需要的吗?)而写大量的脚本代码,反过来增加了系统开销。
3,    一个UI设计团队包含有用户研究员,视觉界面设计师,和代码程序员 ;他们之间协作的结果就是给用户一个视觉界面良好,交互操作亲和的产品,而他们与用户对UI需求之间不断的交流和实现UI迭代的过程就是User Experience(UE);

UI的视觉设计
    任何产品,人们对其的第一印象往往是通过视觉来传达的(盲人除外);所以视觉传达部分的设计好坏,很可能影响用户对产品的评价;一个好的web产品首先在视觉上是能吸引用户,至少不是让用户觉得难看的;
    由于UI视觉界面设计的重要性,所以绝大部分的web产品UI设计的过程是从产品界面原型开始——然后才是美化——才是代码实现,这个过程由于用户需求不断的变化而不断的更迭;web2.0时代,如Ajax的出现使这样的迭代操作变得不复杂,更易于产品的维护。
    UI视觉界面的设计需要设计师必须具备相应的美术设计基础,特别是版式设计,因为整个过程其实就是一个视觉传达设计过程,它属于美术设计的范畴;
    下面就网站Web UI视觉界面的设计(版式设计)阐述几点个人观点,欢迎拍砖:

待续……

面试UI设计师应该怎样准备作品集?

到一个公司面试,公司都会和你聊。但有没有机会进行下一轮面试和聊天,要看你的UI设计能力。UI设计能力是在这个行业内基本的能力,无论是对主管、高级UI设计师、资深UI设计师,都是必须要考察的能力。对UI...
  • xiaohuihuilei
  • xiaohuihuilei
  • 2018年02月06日 18:10
  • 31

分享100个精美的作品集网站设计案例

一个精美的个人作品集网站是吸引更多客户的最好方式。如果你正在建设个人作品集网站或者想重新设计的话可以参考本文收集的这些示例,相信这些精美的网站作品会带给你灵感。同时,这些网站中汇集了丰富的设计作品、素...
  • semoon1314
  • semoon1314
  • 2012年11月19日 13:44
  • 1708

[转]企业级Web应用用户界面设计杂谈

第一章:UI浅论 问题:什么是UI,什么又是UI设计师? 在我的职业生涯中,听到的最多的字眼就是“美化一下”。可以说,在2004年以前,是很少有人听过UI这个词的。那么,什么是UI呢?可能会有人说“U...
  • KimmKing
  • KimmKing
  • 2008年05月21日 12:05
  • 3035

Android UI用户界面开发辅助工具(值得一试)

 最近试着真实滴折腾了几个简单的Android程序,对Android将程序中的UI界面布局(layout)描述与程序应用逻辑实现代码 (code)严格分开,并分别放在res和src目录中的方法大...
  • chuang123
  • chuang123
  • 2015年07月03日 18:15
  • 8854

UI设计观

发布时间: 2004-10-22» 祝文宾供稿[ 未经书面授权,严禁转载任何内容!][www.DOLCN.com]  (设计管理实战系列之--UI设计)-- 祝文宾前言:我们的今天的社会,从表面上看,...
  • rainbow0229
  • rainbow0229
  • 2005年08月28日 12:21
  • 1073

UI 设计师的盛宴:Web UI 设计资源大系

每个 Web 设计师都在 UI 设计上费尽了心血,即使这样,资源的匮乏,视野的狭窄,也常常让他们的呕心沥血之作并不为人看好,事实上,UI 设计并不需要闭门造车,很多 UI 元素是通用的。本文收集了 2...
  • comsharp
  • comsharp
  • 2010年07月24日 21:48
  • 13913

用户界面设计之关于控制UI界面的简单总结

用户界面设计是Android应用开发的一项重要内容。Android提供了四种控制UI界面的方法,分别为: 1.使用XML布局文件控制UI界面   2.在代码中控制UI界面 3.使用XML和Jav...
  • Z_Gavin
  • Z_Gavin
  • 2016年08月17日 22:31
  • 751

WEB UI设计尺寸规范

对于刚入行的UI设计师,最容易犯的错就是在设计移动APP时,不懂什么尺寸或者用哪种屏幕的尺寸是最适当的?为了解决这个问题,今天我们就简单的为大家整理做UI时最基础的尺寸规范。 现象 ...
  • bjash
  • bjash
  • 2016年08月31日 11:21
  • 2969

ui设计 的一些网站收集

想学习看教程,这些网站给我感觉很不错,全面到位 1. http://www.it.com.cn/edu/artdesign/photoshop/ 平面设计类 PS教程 2. http://pl...
  • xd43100678
  • xd43100678
  • 2012年04月24日 14:30
  • 999

手机APP界面-UI设计教程

装载:http://www.ui63.com/html/uicollege/uisjjc/2015/0623/16875.html 温馨提示:图片质量较高,若加载慢请耐心等候! 来源:ui...
  • yybj
  • yybj
  • 2016年04月26日 13:33
  • 1288
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:UI Web界面设计
举报原因:
原因补充:

(最多只允许输入30个字)