网页设计
国外创意的会议和活动类网页设计欣赏
这篇文章的作者是是EventCreate的联合创始人和网页设计师MARK BUSHY，他对于活动类网站有着多年的设计经验和独到的想法。我特别喜欢设计活动类网站。这类网站通常有着明显的时效性，存在的时间一般不会太长，而网站在界面上不会使用复杂的UI设计。但是与此同时，这类网站非常适合探索新的导航模式、不一样的布局以及有趣的动效和全新的技术。它们并不复杂，但是有着全然不同的可能性;看起来简单，然而常常拿来做新技术和新思路的载体。接下来所推荐的10个活动网站都是此中翘楚，它们创意爆棚，设计精美，还适时的将新的技术同设计融为一体~EPICURRENCE这是一个长达四天的设计师和开发者聚会，地点在美国犹他州摩押地，这个活动是邀请制的，整个页面的设计相当的帅气，布局也相当富有创意。为了整体的体验，设计师针对注册页面进行了专门的优化，让人不会觉得突兀和单调。SONNY’S SMOKIN’ SHOWDOWN虽然这个烧烤锦标赛看起来并不是什么“高科技”的赛事，但是它们的网站出乎意料地设计得相当高科技。你可以借助网站立体化地探索整个比赛的现场，虽然每个不同的部分都有相应的文字说明，但是你几乎不需要看这些说明就能看明白。GLOBAL WAVE CONFERENCE
Photoshop网页设计：设计超酷的游戏网站首页
最终效果1、找素材。2、根据视觉参考的大乱斗是一个由中心向四周散发的画面，所以场景选择的也都是对称发散图形。3、为了保证画面平衡，四周人设动作造型基本保持对称是一个比较稳妥的方法，所以选择了这3个人设出于他们的动作考虑。左侧用了女枪和浣熊2个角色是因为她们比较瘦小，为了和右侧男骑士壮汉保持一个画面平衡。4、定光源(光源分为2种：一、暖光源 二、冷光源)。
制作大气的网页设计主页的Photoshop网页设计教程
制作网页之前，需要对网站的内容有一定的了解；然后搜集相关的素材，并找一些参考案例；再自己构思出页面的结构图；最后给每一部分增加内容，做到细节和整体都融合。最终效果1、在我们打开PSD网格模板创作前, 我们首先需要先构造一下想象中的结构. 从上面的这张图，你可以看出来：因为在一个排版中又有排版，所以这是一个有点复杂的结构。2、构造了结构之后我们继续. 打开16栏式的PSD模板文件. 打开 “图像 >画布大小” . 把画布的宽度设置为 1200px 高度设置为 1700px .把背景色设置为 #ffffff 既白色。3、用长方形工具在顶部画一个宽100%高大概80px的长方形. 用颜色： #dddddd 填充它。4、在长方形那层上面创建一个新层. 按住CRTL键鼠标点击长方形层. 长方形就被选中了，然后把目标移至刚建的新层上. 选择半径 600px 的软笔刷（如图）, 把其颜色设置为白色, 然后就像图片所示那样在选框上边缘点几下。通过这个技巧你画出了一个微妙的照亮效果。你现在可以把这两层联合起来了。
讲解网页的首屏标准你了解多少？
首屏的英文是above the fold，fold有折叠之意，above the fold是指在折叠之后能看到的，为什么首屏的英文翻译会跟折叠有关系呢，原因很简单，因为这个概念最早用于出版领域，可以简单的理解为“头版”因为报纸的运输和分发过程是折叠起来的，所以报纸的折叠后暴露在读者面前的那一部分内容就显得尤其重要，读者会根据头版的内容决定是否购买。因此处于头版的内容意味着一个，编辑认为它们是最重要的，头版的内容也决定了出版物的立场和定位。所以“above the fold”也用来表示所有优先显示或或优先级最高的内容。“above the fold(头版)”的概念延伸到互联网领域。用来指代web网页中不用滚动屏幕看到的信息。与出版业的“头版”不同的是互联网的首屏区域是动态的，由于互联网用户复杂的屏幕分辨率环境，导致他们看到的首屏内容有很大差距。很多店铺设计就是因为对首屏的忽视导致很严重的体验问题。天猫&淘宝的首屏那么我们店铺的买家看到的首屏是什么样的呢?首先看以下天猫和淘宝的买家用户的屏幕分辨率占比情况：下图是最近的淘宝网用户屏幕分辨率占比情况的分布图。
解析画线框图容易忽略的几件事
通过工作中的观察与总结，我发现不少新人交互设计师以及产品人员，在画线框图时都会忽略一些重要内容，导致和视觉设计师的沟通成本增高、返工增多、工作效率下降、设计质量下降等重要问题。为了解决这些问题，一方面需要加强沟通，另一方面还需要多站在视觉的角度考虑线框图的设计，使大家的配合更默契。那么具体怎样做呢?以下就是我工作中积累的一些心得，希望对大家有所帮助。一、通过明暗对比表达以前，我是这样画线框图的，这样能非常清晰的展示各模块元素之间的布局关系。然后我会告诉视觉，这些模块或元素之间的优先级关系是怎样的。但头疼的是，当界面元素很复杂的时候，视觉就难以一一记住了，这个时候就需要反复的沟通，视觉在这个过程中也非常的痛苦，经常是改的头都大了但还是有错误。现在，我这样画线框图：加入了明暗对比之后，界面元素的重要级关系更直观，我们不再需要跑过去跟视觉说：这N个模块中这个最重要，那个其次…… 视觉的工作效率也大大的提高了。但需要注意的是：深色并不意味着比浅色更重要，要看色块之间的对比关系。比如下图：
详细解析网页设计什么是好的用户体验
极客公园：打从苹果公司在全球范围内取得成功后，“用户体验”这个观念也随之鸡犬升天了宛若一条真理般。一夜之间“用户体验”变成了一个人尽皆知的词，不光互联网这帮人随口挂在嘴边，甚至就连我党这么超脱于时代的行政官员都知道要每天大手一挥“我们要注意用户体验”以便彰显出自己的绝对正确和高深莫测。这本是 好事，只是我严重怀疑，这个国家上上下下很可能没几个人搞懂了或者能静下心来去想搞懂什么叫用户体验?因为根据我的观察，近代以来的国人素来没什么的兴趣 去思辨概念，不管是舶来的，还是祖传的，他们都只是非常功利的拿过来披在身上，专长于断章取义，曲解概念。然后大旗一扯，代表用户，达成自己的体验。“用户体验”在中国的遭遇其实也就和像“民主”“宪法”“共产主义”这些类似的舶来概念一样，虽然没几个人真的明白它的实际内涵，但是确实有超高的 使用率和普及率，基本命运都是被当标题口号天天念叨而已。大佬们有多读过点书的，但水平最多也就能把它总结到“换位思考屁股决定脑袋”、“你要端正为用户 服务的态度”、“注意细节”这样一些其实和用户体验本身没啥关系换个主题也一样有效的结论上去。对于更多的人来说，反正按字面意思理解，这是一句看起来完 美无缺，绝对正确的话。毕竟谁都可以是用户，至于体验如何反正都是藏在人心里，任你科技再发达，你也无从考证我心之所想。即使有人说出来了也无法印证是否 是其真实的反映。真要逼急了大不了就互相扯皮：“子非鱼，焉知鱼之乐;子非我焉知我不知鱼之乐;子亦非我焉知我不知你不知鱼之乐…”想要弄清楚什么是好的用户体验，我们就不能把对“用户体验”的思考停留在政治正确和心灵鸡汤的程度。无庸置疑的是它确实是苹果问鼎的关键因素，对这 个概念的理解和解读的程度会直接影响你的企业甚至整个民族的企业在现在和未来商战中的战斗力指数。就像“民主”一样，它的背后隐藏了大量的思想是我们尚未 解读，尚未意识到的。我们需要不断的去推敲“用户体验”的实际内涵，而不是停留在文字层面!我们需要面对自己的内心真正的对自己谦虚一次，把自己归零。把 它拉回到它最初的原点，忘掉所有他人构建出的认知，重新去寻找线索。简单粗暴的回顾下“用户体验”这个概念诞生的过程：“白话说是因为早期互联网很多工程师按照自己的逻辑习惯做出来的软件普通人用不了，而用户拍屁股 换服务的机会成本太低，所以用户体验的重要性逐渐在这个行业形成了共识。”但其实我们再宽泛一点看的话，用户体验并不是互联网的专利，也不是互联网之后才 产生的。放宽点看的话，我们可以将其理解成：人类交易产生的时候，某些产品或者服务的用户体验就产生了，它贯穿于人类商业社会形成的始末。这么看的话用户 体验其实可以被解读为——人对其需求满足过程产生的价值判断。这里提到需求就不得不和马斯洛的需求理论划清一下界限，马斯洛是对人的需求做了一个先后逻辑分类，并不涉及需求价值判断。而我这要探讨的是人对其各 个层面的需求满足程度作出价值判断时的方式和渠道，这个过程没有马斯洛需求里潜在的先生存后价值实现的先后顺序，只是单纯的探讨人是如何对一切产品或者服 务是如何进行体验的过程。我大致将之分成两个纬度：第一，人作为生物人对产品体验的价值判断;第二，人作为自然人对于产品体验的价值判断。这两个纬度是在 产品中互相渗透存在的，并不存在先后顺序。人的大部分体验判断也都是这两个立场定位的基础上作出的。用户体验的第一维度：生物人的感知体验第一个维度我称之为用户作为生物人的感知体验，我把它起名为用户无脑体验。这是最为重要，且当前被中国商家最为忽视的用户体验。我们人类存活在这个世界已经有几万年了，在我们没将自己起名字为“人”区别于其它物种之前，我们和其它物种一样透过我们的感知器官对外界直接作出感 知回应。比如，我们能作出关于两千种苹果里作出那种最好吃的选择，这种对产品的体验回馈直接导致了绝大部分苹果种类被淘汰的命运。时至今日，我们绝大部分 的产品体验评判也依旧不是用我们成为“人”之后的思维逻辑判断的，不只是苹果，我们绝大部分对世界作出的反映行为决断都不需要经过大脑思辨而作出判断。以 至于不经过大脑思辨而作出的价值判和行为判断要远远多于思辨判断!因此商家们，你们可以想象我们在面临对一个产品的用户体验作出是否购买的决断时，这种用 户无脑的感知体验判断在用户的购买决断中判断的份量有多大，你们以为人是用逻辑思考来作出购买决断的，其实不然，它对购买的影响力远远的超过了人类的逻辑 思考对购买所带来的影响。这种能力在人处于幼儿状态的时候是巅峰状态，之后随着进入人类社会化程度的深入而逐步失去。保持这种生物感知力的唯一方法是艺术熏陶。有趣的是最忽 略这种用户体验的人恰恰就是国内的天天将之挂嘴边的用户体验的相关人员(包括这些大佬们)最大的软肋，他们的社会化世俗化程度都普遍很高，他们脑子里积攒 的最多经验和感悟都是和这社会游戏规则相关的。有幸经历或者接触过艺术教育的也普遍悲剧，他们学的绘画，音乐等等都与艺术无关，纯属技术范畴。当然这里要 往下说下去又是一个很大的话题，这里暂时不表了。这种生物感知能力的缺陷会如何影响我们对产品设计的判断呢?
网页设计流程中常见问题分析及建议
从和客户沟通了解客户需求到画出草图进行构思和创意，直至打开photoshop完成整个的设计，每一个网页设计师都在每一个新的设计项目中不断重复这个过程。整个看上去规范而流程化的工作方式似乎按部就班就能够顺利拿到让大家都满意的结果，但其实在每一个步骤中都存在难度，某一个方面没有做好，可能就会影响到最终设计稿的质量。因此在这篇文章中我就来结合自己的设计体会谈谈这其中存在的常见问题，以及我们应该如何有意识的避免或者解决它们。这篇文章中的内容我已经在SDC的网页设计讲座中和大家谈到，这次算是对整个讲座内容的总结和归纳，如果大家需要查看讲座当天的文字记录，欢迎加飞鱼的声纳的QQ群：233898966。关于网页设计中的问题，我总结了个人认为常见的六个，下面一一道来。问题一 、和客户沟通的不够充分，导致设计方向出现偏差。这个问题是在设计流程中出现最多，也最容易导致客户和设计师产生矛盾的问题。最终的结果是客户觉得怎么修改设计都不能让自己满意，而设计师却不胜其烦，认为客户太难说话，原因其实就出在双方的沟通上。作为客户来说，很多时候他们对于期望的设计产品脑子里往往只有模糊的概念，只能交代给设计师一个过于粗略的设计方向，甚至有些客户提出”先做一稿出来我再看”的要求。遇到这种情况，设计师要清楚客户自己的设计需求是不明晰的，而作为设计师来说，这时就需要积极地引导客户，使他们明晰设计需求，从而避免由于双方未在设计目标和期许上达成一致，造成设计方向上出现偏差，而导致设计中大范围、不断的修改设计稿，甚至一遍一遍的推倒重来的结果。要使双方对最终的设计都满意，就需要尽可能详细的沟通，客户和设计师之间理解程度越高，最后达成的一致性也越高，这两者是呈正相关的关系。要做到这一点，我个人的方法是在沟通的环节设计系统的调查问卷让客户作答，以帮助客户梳理、明晰设计需求。下面是我经常使用的调查问卷内容，其中需要客户作答7个问题，这些问题基本可以帮助客户和设计师明确设计方向，你也可以依据在和客户沟通中的具体情况修改或者完善这些问题。1、当访问者访问你的网站的时候，你希望它们做什么?(比如购买某种产品、服务，或者展示企业的形象等)2、网站的主体用户是哪部分人群?(白领年轻女性、有某方面需求的老年人等)3、网站的整体风格是什么?当访问者进入你的网站，你希望他们有什么感觉?不希望他们有什么感觉?4、举几个你喜欢的网站，并说明原因;例举几个你讨厌的网站，也说明原因。(请将网站链接或者截图粘贴在下方)
网页图片整理术之CSS Sprite的应用
CSS Sprite 是一种图片的处理方式，它允许网页设计师将很多张图片合并在同一张图档中，然后根据 CSS 档中的文字描述将图档分区块加载，是现在很常见的网页图片处理方式。例如网页上一个的按钮的三种变化效果的图片，将其顺序摆放在同一个图档中使用：而这张是 Facebook 页面上所使用的小图标图档，像是大家最常看到的 Like 图标其实也只是从这张图片里面取出一小部分加以显示而已。诸如以上，几乎现在的网站都会透过使用 CSS Sprite 来将网页作优化，比起传统的切割图片方式，使用 CSS Sprite 有着以下的优点：方便整理、命名：由于将图片合并了、图档的数量减少了，整理起来更为方便，同一个按钮不同状态的图片也不需要一个个切割出来并个别命名。修改以及调整更为快速：由于每个按钮都在同一张图档中，设计师在事后修改细节时就可以在同一个档案中工作，再也不用辛苦的切割图档。档案体积减小：虽然影响不大，但将图档合并可以有效的减少档案的体积。
详细解析网页设计活动页面的网站设计案例
对于许多组织来说，留下各种不同的活动或展览，包括节日或会议，来的时候，简单的传单，论坛和传统的横幅广告停止有效工作。无论事件变得广为流行，它提供更多的信息，不仅仅是一个简单的简要说明，还是组织者要使其更加现代化，利用当代各种手段，例如允许使用网上登记或销售数字门票。最终会出现扩大的必要性。在这种情况下，创始人往往诉诸创建活动的网站，因为它很长一段时间一直是伟大的和成熟的仪器。精心组织和精心设计的网站快速，轻松地告知一个大的目标受众即将举行的活动，让在旅途中的门票预定和购买，熟悉历史，吸引更多的视频和图像报告，给被提及的机会，毕竟，不会让你忘记。此外，网上存在的全部价值，有助于建立你，你作为一个品牌，是真正重要的那些人有长期计划的组织和活动。而现在，你可以检查出那些人已经把其品牌建设的关心。我们惊人的展示，揭示事件为导向的网站设计的多样性。我希望你不仅会获得灵感，但也找到的东西，让你扩展你的知识和拓宽你的经验。活动网站范例2013阿迪奖有一个优雅的执行垃圾风格柔和色调辅以庞大的大胆的版式和老式的插图。释放你的心灵，使用融合了纸元素暂停字符串，充满活力的调色板和脂肪型的，为了使3维开朗的欢迎页面看看。新西兰啤酒节有一个可爱的自然风格的外观，辅以白单色图形和纯版式。
详细解析网页设计用户体验设计的五个原则
“设计，必须是充满诗意的。”带过五年多的用户体验设计团队，从几个人到二十几个人。以前自己也做过技术，发现工程师和设计师其实是有很多相近的地方的，那就是都有追求。带领团队，并不是管好人就行了(所谓的行政管理)，更是要实现业务的成功，给团队定目标，定追求，然后与大家一起想办法达成。这五个设计原则就是在团队日益变大，项目越来越多，团队输出的质量参差不齐，团队成员也反馈疲于交付已经没有了设计师感觉的情况下总结的。试图给团队定个设计的调调，给团队一个精气神。主要参考的是Dieter Rams的《好设计的十条原则》，苹果iOS的设计指南，当然，也有Google的十大设计原则，因为Rams的是工业设计原则，iOS的是一个操作系统平台的原则，Google的则是一个公司的设计哲学，如果照搬过来恐怕难服众(其实更重要的是都太多了，因为无论哪个都超过了7+-2个的记忆极限)，所以我就尝试集大家之所长，给自己的团队找到一些原则，在此也分享给大家。在开始介绍这五个设计原则之前，我们应该反思一下什么是不好的设计?你觉得设计不应该是怎样的?现在，到处充斥着直接抄袭而没有认真理解人家设计原因的设计，充斥着难以让人使用美其名曰高科技的设计，充斥着连基本的美学原理都违背了的设计，充斥着差不多可以了的设计，充斥着无法展现品牌，无差异性的设计…我想，有追求的设计师都应该会对这些现象说“不”，那么，什么样的设计应该是我们所追求的呢?1、有用的一个产品创造出来，一定首先是有用的，能够满足人们需要的，能够解决用户问题的，这不仅仅限于功能性的需求和问题，还应该包括人们心理，情感以及对美的需求。要做到这一点，首先就要理解用户的需求，这是非常艰难的一步，但是是想要做出好产品必须经历的。了解用户的需求决不仅仅是到大街上到处问人你需要什么，你觉得这样的产品如何…而是一个研究，思考，原型的过程，需要深入问题，了解趋势，判断人们的动机和价值观，挖掘出潜在的需求。往往一个好的产品出来之前，人们并没有想到还可以有这样的产品。这就是设计的乐趣：)2、革新的