欢迎访问小程序员!

随着互联网的发展,网页设计变得越来越复杂,如今设计的外观和感觉实现网站功能说使用的开发技术一样重要。互联网的功能远远不只是基本的信息共享,现在人们对网站的期望是远远大于几年前的。 如今,HTML5 & CSS3 技术的发展,众多强大的新特性和功能带给网页设计领域新的挑战和机遇。同时,网页设计领域也在发生巨大的变化,例如之前流行的扁平化设计伴随着 iOS 7 的发布被带到了新的高度,更多的人了解了这种前卫的设计理念。 当设计师们还在讨论这种设计的时候,扁平化的设计又有了最新趋势——长阴影设计(Lo ....

Web设计给了你展示自我创新才能的平台,同时也要求你特别关注其中的诸多琐碎细节。优秀的Web设计师需要从设计前辈那里获得设计灵感,寻求他们给的建议,并反复推敲,以及付出诸多努力。职业博客作者Rajni Setia认为,成功的设计师还必须了解Web设计中需要避免的错误,从而在激烈的竞争中生存下来。有些错误如不及时纠正,将有损网站的可用性。那这些错误是什么呢?Rajni Setia进行了总结,并在下文一一列出。 你需要避免的Web设计错误 1.丑陋没趣味的界面 无论你天生具有多少创新力,事实是, ....

“别再拖拽拉扯那个浏览器了,你快把它弄坏了!”这样的话你听过多少次了?好吧,可能不是特别多,但如果你在开发响应式设计的网站,你就知道这意味着什么了:每一次编辑DOM和CSS之后,你都要拽着浏览器的边缘拉拉扯扯,来测试你的编辑结果以及检查是否有什么东西故障了。 CSS 就是被这样玩烂了!! 归根结底,大部分的努力都是为了适应不同设备的屏幕尺寸。 如果你给公司做开发,公司可能会给出各种各样的设备来测试。在我自己工作的地方,我们就用到了iPad,iPod和其他一两个平板电脑,笔记本或者台式机。如果没那 ....

Web 设计师必须了解各种各样的 Web 设计风格,这才能让他或者她在设计领域里有立足之地。 本文向你推荐 10 个附带源码的 Web 设计教程,希望对你有所帮助: Adding Alarms to the Digital Clock Creating a Mobile Event Calendar With DHTMLX Create a Drop down Menu with Search Box in CSS3 and HTML How to Make a Light Text ....

想要从一名设计初学者转变成一个专业人士并不像听起来那么简单。但这也并不意味着这是一条无法逾越的鸿沟。这就需要你合理利用时间并掌握坚实的技能。有些人很幸运,在通过不懈努力后成为专业的设计师,也有些人并不能一帆风顺。那么这是否意味着他们无法成为良好的设计师呢?当然这还得视情况而定。有一点不可否认的是,只有肯花大量时间来学习设计技能并具备创作技巧、独特的见解才是通往伟大设计师的必经之路。 原文作者Rajni Setia总结了六大实用技巧以及建议,以帮助大家从伟大的设计师身上学习他们的独到之处。不管你是一名 ....

1.一切源于欲望 1.1 欲望?需求! 欲望!何为欲望?心理学上对欲望的解释是由人的本性产生的想达到某种目的的要求。在这个定义里有两个关键词:本性、目的。它指出了欲望的源头,是由人的本性产生的,是一种本能,人人皆有。同时也指出了欲望的产生原因,是为了达到某种目的。 举个例子,吃饭,这是一项最基本的生理欲望,每个人为了生存必须要吃饭。要吃饭,就得先把饭做出来。我们有微波炉,电饭锅等等很多可选择的工具来帮我们做饭,甚至,做特殊的食物有专用的工具提供给我们,比如面包机。再者,如果你不想做饭,连出门都 ....

交互设计如今已是一个十分常见的问题,但许多设计者和开发者仍不知道它的具体意义。今天,我们将从不同于以往的方面:我们将会深入讲解能使你的网站拥有良好交互性的用户界面和设计原则。 首先,何为IxD 交互设计(即IxD)是一块发展迅速的新领域,大致出现于10-15年之前,源于一些体现设计问题的研究,后来被专业设计者鉴别和接受。 交互设计促进人与环境的交流,这里我们指的是人和网站的交流,交互设计师只要考虑用户和电脑的交互,毋须像UX设计者那样思考软件或系统所有涉及用户的方面。你也许在不同大学里听说过人 ....

以下这些和PC端的产品体验相关性比较大,移动端的会少一些。现在虽然移动端是主战场了,但瘦死的骆驼比马大,PC端还是很有用户基础的,还是要考虑PC端的产品体验,毕竟PC端也可以为移动端提供一个很好的补充。 1、超长的页面加载时间 如果页面加载时间超过30秒,很难有用户会喜欢你的网站。当然30秒已经是比较夸张了,现在一般的电商网站,都要求在3秒之内加载出来。移动端的要求就更高了,一般要求无等待间隔的加载,即毫秒级的加载速度,实在比较慢的,都有过渡性的加载中提示。 2、无限制的使用flash及图片 ....

随着互联网的发展,Web页面在我们的生活中已经是无处不在,如何利用视觉艺术为你的Web产品增彩,也成了产品设计者逐步完善的一门课程。 一个完整的Web页面是需要点线面的合理结合,每一个页面都是一个神奇的空间,同时他的深度,广度和作者赋予的元素美感决定了这个页面的可观赏性。 好的创作依附与好的灵感。灵感是一个很微妙的东西,它是指不用平常的感觉器官而能使精神互相交通,亦称远隔知觉。或指无意识中突然兴起的神妙能力。或指作家因情绪或景物所引起的创作情状。 如果你在创作的时候没有灵感,不防停下苦思冥想 ....

Png是图像文件存储格式,在网页设计中已经不是一个陌生的名词,在前端开发中经常使用到它,如常用CSS 雪碧图。而Png的使用不仅仅如此,Png有多少种格式,有哪些特点,PC端中常用的Png格式是哪些,手机端最合适的Png格式是什么呢?如果你对这些问题有疑问,那么很开心的告诉你,这里有你需要的答案。 PNG的格式和透明度 这个Fireworks会比较清楚,打开Fireworkd优化面板,可以清楚看到png有3种不同深度的格式:png8、png24、png32。 其中,在优化面板选择png8,可发 ....

本文来自uxmag.com,作者提出产品设计不仅要“看上去不错”,也要“用起来感觉很好”。这就需要从深层次去分析人的内在直觉与本能特点,在闭环体验中寻找机会激发用户内在动力,给予正面丰富的反馈,从而提升用户的满意度。 文中的一些观点很有启发性,例如:无限的关注微体验,这种关注可以细致到去探究一次点击、一次拖拽的过程中究竟发生了什么,这些细节中往往就存在着创造惊喜的机会,如path精妙的弹出式导航设计,对这种微体验的打磨常常会被设计师忽略。文中还提到了在页面设计中引入Z轴,以及响应式设计不仅仅需要适配 ....

上网在线阅读,是大多人获取信息的重要途径。用户会在网上阅读到大量的新闻及各类文章,特别是网络小说,这些页面展示的主体就是通篇大段的文字。对于这种看似简单的文字堆砌的页面,有没有人抱怨过:“这样的页面还需要出效果图啊?”作为网页设计师的你是怎样处理这样的界面的? 是习惯性的使用宋体字或者微软雅黑? 是直接设为12px或者14px的字号? 你有想过为什么要使用这种字体、字号吗? 你有考虑过文字排布与阅读效率的关系吗? 你的页面背景会影响到用户的浏览舒适度吗? 让我们从以下5个元素具体 ....

吸引用户来浏览你的网站本身就很困难,因为网络上存在着大量的站点。让用户在你的网站有足够的停留时间是网站运营的另外一个问题。保持你的网站对用户有吸引力是关键所在。只要你的网站具有吸引力,那么形象塑造、销售促进、建立影响力这些方面困难都不大。 这里有例举了一些原因,用户为什么抛弃你的网站的原因。每个网站都是不同的,或多或少都有自己的问题,有优点,也有缺点。因此用户选择不浏览的原因也不尽相同,在这些原因的后面,我们也给出了一些应对的建议。 1. 读取缓慢 用户不想浏览你网站的首要因素就是读条缓慢, ....

扁平化设计或者说扁平化的UI风格,是今年最受关注的一个web和平面设计的发展趋势。而经常被拿来与扁平化做比较的是拟物化设计,两者的设计原则和设计风格完全相反。 设计师们或许会有疑惑,这究竟是一种能持续下去的设计趋势呢?还是只能是风行一时,昙花一现。暂且不谈未来和不管这些反对的声音,大多数设计师还是很想在自己的工作中尝试使用这一设计趋势。在这里,我们将深入了解什么是扁平化风格,追踪扁平化设计的历史根源,并介绍如何开始我们的扁平化设计。 在开始之前我必须给读者们一个提醒或者说警告:扁平化设计,可以用 ....

优异的使用者介面(user interface,UI)让使用者用得顺心,从而提高转换率(conversion rate),换言之,好的UI在使用与销售层面上形成双赢。UI设计师Jakub Linowski列出16点改善UI的诀窍1,而这份清单仍在继续累积,有兴趣的读者可以订阅他的电子报,随时获得最新的UI秘诀。 单栏型式优于多栏 单栏型式让你更能掌握自己的内容,从顶部到底部一气呵成,用故事引导读者,最终是要诱引他们「采取行动」(call to action,下称CTA,意指下载或消费等目的);而 ....

身为一名用户体验专业人士,我有职责将它发扬光大。我尝试各种能够推广它的方法——我写书,写文章,世界各地演讲, 甚至为一些公司提供内部培训或者和一些客户合作项目。 要是我只能记住一件事我希望是用户体验的本质,设计师们和企业需要把了解甚至理解用户体验的本质当做一种专业精神,一个目标甚至说是理想。 这些我花了13年的时间去践行。 当时写这个的时候是2012年,我得承认这些影响了我投身互联网行业的每一年,下面我就列出这13条有关用户体验、设计及设计者的价值的信条和大家分享。 信条1 企业与个人的每一次 ....

平面设计和网页设计是两个截然不同的领域,这两个领域有不同的设计需求、设计实践和设计方法。 例如,在网页设计中更常使用基于像素或栅格的文件格式,诸如JPG、GIF或PNG。相反,在平面设计领域像logo这样的图形可能会用到不同尺寸,因此使用最多的格式则是EPS和AI这样的矢量格式。然而,用于网页的矢量格式,如SVG或HTML5 Canvas则不能广泛应用,也不会被所有浏览器所支持。 另外,用于web端的图形有基于它们自身的相关处理方式。其中一条便是你要时刻注意文件的大小,因为你需要使你的网页加载越 ....

今天在整理文档时候找到了一份关于表单设计的分享,里面有关于「表单5大元素」「情感」「设计」的分享,里面表单的例子是去年的,可能有些网站已经重新设计过,不过不影响阅读文档。 点击下载: 「表单那些事」 点击下载: 「表单那些事」 ....

类似微软 Metro UI 界面的扁平化设计是平面设计领域的新趋势,它去除了传统的阴影,纹理和渐变模式的界面,崇尚纯色,简洁的布局和清晰的排版。越来越多的人喜欢这种简约、大方和充满现代气息的设计。 下面我为大家收集了20套精美的扁平化设计素材和资料,相信你会喜欢。 24 Flat Icons Freen Flat UI Kit PSD Flat UI Kit Flat Radial Graph PSD Flat UI Free Colorful Icons UI Kit ....

作为用研,我们经常在可用性测试时听到用户说:“啊?我没注意啊!” 一个操作后,页面弹出一个对话框告知用户操作成功,反馈够明显了吧?用户说:“啊?怎么没反应?” 一个为了用户操作便捷而设计的常用操作入口,简约的视觉与背景区别开来。可用户还是一次次冗余操作,问及则说:“啊?我没注意到啊!原来这个可以直接写说说的?!” 一个新功能上线,网站主页导航上新增了一个模块,改版够大了吧?用户说:“啊?我没看出有什么变化啊。” 每次听到这样的话,设计师们就会抓狂:到底为什么啊?设计得这么明显,为什么用户 ....