UI设计理论知识,UI设计教程,UI设计知识,GUI设计理念,人机交互理论教程

设计一个吸引人的网页主横幅其实可以很简单，我们思考的只是如何分配区域。 在一个简单的网页中，上方的横幅是最重要的视觉元素。在很多网页中，它甚至是唯一的视觉元素。所以它的作用可以说是相当大的。它必须能够与网站的风格配合，并能传达视觉上的信息。...

香港的设计师 ： 香港绝对是个创意宝地，走在大街上，处处可见的小惊喜和小细节，其最大的优势在于国际交汇，它具有广阔 的国际视野和交流平台，享受着如此多的开放的优势，无疑香港是中国现代设计走得最前的城市，无论是建筑设计、工业设计、平面设计、室内设...

【 译者的话 】 在版面设计中，你有很多地方都需要用到图片，但你手上只有一张图片，怎么办？在本文中，我们用两个实例来说明如何解决这个问题，我们只用一张图片，通过分解剪切，就可以将这张图片用在不同的地方，出来的效果非常漂亮。一张图片，其实已经足...

设计师不应该是只会坐在咖啡馆里拿着一个手提电脑或戴着iPOD听着音乐然后看一下有没有异性打量自己的那种装模作样的小资。毛主席教导我们：到群众中去，从群众中来。这同样是一个设计师必须紧记的工作态度。现在很多的设计作品都很漂亮，从设计技巧上来说无...

支付宝lab的意思是支付宝实验室，也就是概念产品聚集地，可以让用户快速试用这些新产品。本次支付宝lab logo设计历时一个星期，视觉设计组成员群策群力，从创意发想，初稿试水，到最后的成稿执行都凝聚着每一个成员的智慧。 以下是创意发想阶段的线描草稿 在...

CDC专属QQ拼音皮肤，一键直达CDC官方博客！ ： 作为QQ拼音的视觉+交互的设计师，功效 的创新对我而言是必不可少的精神食粮。前些时间就针对QQ拼音的皮肤构思了...

信息架构师是一个常常被误解的职称。他们是设计者？开发者？管理者？还是以上全部？我们在本文将探讨信息架构师是做沈恶魔，为什么它和可用性相关，以及在信息架构中需要用到的工具/软件。 我们也会顺便分享一些对于信息架构的初学者来说有用的tweeters（twi...

所谓工欲善其事，必先利其器， 尽管小米加步枪可以也可以打败敌人， 但如果朱棣有了坦克装甲部队，那岂不是更容易平定安南？ 关于原型开发工具，各有哥的使用习惯，有人喜欢axure、photoshop，也有人喜欢手绘，robert还见到过高人直接用excel制作的交互原型...

成为一个顶级设计师的第一准则 限制你的字体 让你成为设计大的七个基本原则之一好~设计大师，或者也太吹牛了吧，但根据下面七个基本原则至少你可以成为一个熟练的设计师。 这将是最短的最详实的系列文章，你看过后就会知道如何成为一名更优秀的设计师。 请记...

目前关于Windows 7各种文章有不少，不过大多是关于用户界面改变的介绍，例如：新的任务栏，开始菜单的改进，更大的预览缩略图等等。Windows 7的新东西还有很多，今天我们来换个话题。 你是否注意到，磁盘碎片整理已经支持多个驱动器并行处理？还有，你知道是...

注：该文发表于《程序员》第10期，有删节。 Tag，直译标签，是一种由用户自定义的、用于描述信息 [1]的关键词。Tagging是用户为信息赋予Tag的行为。Delicious，Flikr等Web2.0网站的发展促进了它的流行，使之成为社会化书签、相册服务、等网站的常见功能。但T...

网站内容的主动组织和展示 1. 按照时间轴组织展示 所谓按时间轴展示内容，即按照内容的产生顺序展示出来，几乎绝大部分网站都会采用这个方式，这是内容组织和展示的一个基础方法，如 -twitter上的updates -日志 -sns上的最近动态 -社区上的24小时的最热话题...

来自Smashing Magzine上的一篇文章，介绍了作为一个Freelancer怎样去甄别和对待不同性格的客户。 时间和精力的关系，再加上东西方文化的差异，我只是把原文按照自己的理解简单翻译了一下大标题（其实个人觉得SM这类的网志很多文章大可不必细读，这些标题党的...

一直以来都想写篇关于音乐与设计关系的文章，免去每次和别人大篇幅讲述应用音乐原理去把控设计的时间。 常有朋友问我，怎么样搭配色彩才好看，怎样培养色彩感？我没有系统学习过色彩学，但对色彩的把握有自己的一套，这要从我的第一份工作说起。 我的第一份...

译者的话： 寡妇、孤儿、捧打鸳鸯，这些场面足以让你有想哭的冲动，但当你在排版设计时，同样会碰到这些问题，甚至可能更槽。虽说今天的页面排版软件可以自动处理很多东西，但这并不意味着你就可以将版面搞得漂亮。在本文中，我们来探讨一下在文字排版中，最...

可以随身携带，是移动设备具备的优势，虽说随身携带跟设计本身并无太多关系，但想想我们的设计又的确是大家随身携带的，心里不禁有点暗自窃喜，同时，也因此对移动设备的产品设计的要求会更高，因为凡是大家随身携带的东东，必然是大家日常所必需、所钟爱、...

...

第一辑：思考前请先思考 在我的上一篇文章中我都一直在讨论如何画一个图标。显然有些朋友感到困惑，为什么我们不是讨论图标里要画什么呢？，所以在我的这篇文章里我们就来讨论这个问题。 图标中应该画什么？我们应该用什么样的引喻？应该去哪里找创意？图标...

人类学是关于人的研究；社会人类学（social anthropology）是研究人类社会的学科。社会人类学还可以理解成文化翻译（the translation culture），即理解陌生人群的那些貌似奇异的风俗。《他者的眼光人类学理论入门》 田野调查被公认为是人类学学科的基本方法...

翻译：UCDChina翻译小组，Roc 设计真正伟大的用户界面没有什么伟大的奥秘可言，做到保持简单易用就可以。 保持简单易用意味着不要让用户分心。恰恰相反，好的UI让用户达成目标。结果如何？你的培训和维护费用降低，并获得更开心、满足和高效率的用户。 当你...

8月书友会主要讨论了信息分类和信息分类的方法,UCD书友会阵营由从事产品（手机，MP4，GPS等）设计和互联网行业的朋友组成，由于信息架构在互联网圈是被讨论得较多的，因此，大部分信息架构的出发点都集中在相关的应用领域。 作为我坚信的跨媒体设计的观点来...

...

别致的深底色设计 深色但带给人的感觉是纵深，权威的，有力的。在使用得当的时候会看起来非常别致优雅。这里有一些使用深底色风格设计的案例和技法。 网站 在背景里使用了古典风格的纹理，创建了优雅的基调。其它另类的特性令人对此设计印象深刻。 这种技法...

深底色风格的页面设计 很受欢迎，它可以创造出别致优雅，极富创造力的效果。 深底色设计适用于许多网站类型，但并非所有。这种风格应该在恰当的条件下使用。 虽然深底色风格可以带来视觉冲击力，但是很多设计师并不知道如何有效地表现他们，取得的效果往往适...

本文介绍的技术很经典，也算是一篇老文章了，相信很多人也都看过，之前神飞有注意到国内有些翻译，但是不全面，这里我就将其完整的翻译了一下。 你想制作漂亮的标题而不用将每个标题都做成图片吗？这里是一个简单的CSS技巧，它将向你展示使用一个png图片制作...

看前一篇文章[]的 介绍，大家应该知道除了极少数的全色盲，其他色盲总是会看到一些颜色的。所以，最大的问题不是色盲用户看不到一些眼色，而是他们看到的颜色与一般人不同。 那么，如果作为一个正常人，如何让自己的设计不会给色盲用户造成麻烦呢？我们需要...

不同人眼中的草莓: 1.普通人 2.红色色盲 3.绿色色盲 4.蓝色色盲 5.全色盲 缤纷多彩的世界，如此吸引人。但是，每个人眼中的世界却可能如此不同。这个世界上有大约8%的男性和0.4%的女性，在识别部分或者全部颜色时有困难。我 们通常笼统地称这种缺陷为色盲(Co...

Article copyright by 版权所有 原作者：；译者：UCD翻译小组，Sophie； 校审：Angela 原文链接： 原文下载： (pdf, 316 KB) 人物角色是虚拟的，也是典型和形象的，它是你的目标用户的一种代表 。它可以提供及时的、易于理解和记忆的用户信息。 人物角色 在...

一篇简短但是蛮有用的文章，对于做触屏界面设计的朋友来说也许有些意义。 一幅画可能包含了千言万语，但是一个用户界面却需要用简洁的语句明确地告诉用户该做什么。因此决定哪些文字应该出现，哪些文字应该是界面设计非常重要的一部分。以下是四个适用于触摸...

广告和设计的趋势 看那些出售广告的网站，特别是依靠广告为主要收入来源的，我们能看到一些趋势： 头部广告 很多网站出售页头广告位，通常是在 logo 的一边，或导航的上面或下面，很多不同类型网站都有这种趋势，而且只要这些广告能给广告客户带来实效，它就...

广告如何影响网站的设计？ 在网站布局上不管设计师多关注广告，它在某种程度上影响着设计。最理想的是，在设计中设计师已经把具体的广告位考虑在内，从而得出网站的布局；在这种情况下广告能在网站上其效果的同时又不会扰乱内容或信息流的顺畅，并给广告一个...

近年来，广告已成为很多网站的主要收入来源。不久前，在线广告往往遭到访客的拒绝，广告客户也不确定它的价值和效力。今天，大多数访客期望在商业网 站上看到广告，广告客户已经认识到各种在线广告的潜在机会。长期以来广告一直是印刷出版物的一部分，如杂志...

原文是一篇来自Smashing Magazine的优秀文章，详细叙述了8个可以提高电子商务网站转换率的方法（当然也适用于其他产品介绍类的网站）。基本上都是从网站设计的角度上分析了一些取得用户信任、改善整体品牌形象、提高用户体验的方法，很有启发意义。我按照自...

...

译者的话 ：作为一家教育机构，没有什么比利用学生与黑板的元素来设计网页横幅更适合了。黑板加上一些手写字体， 便形成了一个简单但却极具吸引力的视觉焦点。本文通过一个实例来探讨设计一个黑板样式的网页横幅所涉及的各种挑战，也让我们再一次感受学校的...

UX Booth的 Redd Horrocks说，Dont Make Me Think除了是一本用户体验入门佳作，还可以被从业者拿来当做一剂思维清新剂。他总结了书中得出的十条金科玉律，正好趁此机会记录下来，回顾一下这些简单明晰的道理，让最近混沌的大脑清醒清醒。 1. 可用性是什么？...

六。 Tab的创建教程（前端方面的） 有很多教程能告诉你在页面上如何建立和实现一个Tab，下面，你可以通过一些顶尖教程来了解更多关于创建Tab的技巧。 《如何创建Tab》 通过阅读这篇初级教程，你可以了解如何通过使用 JS 框架Prototype创建一个简单的Tab元素...

二 。Tab的可用性原则及优化方法 这一章节 我们将讨论一些关于Tab的可用性设计原则，以及如何使这种交互元素变得更友好和有效。 选中的标签应该高亮显示。 选中状态的标签应该设计得显眼，让用户容易区分当前显示的内容区是对应哪个标签。通用做法是 为未选...

其实这个系列还没写完，我看到已经被转载了。下次应该写个未完待续。 15. 忽略空白图片（Ignoring spacer images） 一定记得给图片加上alt属性，哪怕它为空。其原因是如果不写alt，有些阅读器会直接把它的文件名或URL读出来。 这让我想起小时候读过，说在发...

继续这个读书笔记吧。 9. 定义键盘快捷键（Defining keyboard shortcuts） 意思就是定义accesskey属性。这个好说。有个关键是如何在浏览器里使用。IE里是alt+，并且只是将焦点移过去，要点击需要再按 enter；Firefox是shift+alt+，按下之后直接触发点击事件...