当前位置:主页 > 平面设计

最新发布

详细解析网页设计瀑布流布局的开发实践
详细解析网页设计瀑布流布局的开发实践

瀑布流的布局方式展现的内容通常是扁平化、琐碎的东西。首先吸引人的应该是图片,并且图片是那种参差不齐的,如果瀑布流中文字过多,会给人很杂乱的感觉,所以瀑布流更适合单纯的图片浏览。前不久公司上线的项目–360图片搜索的美女秀场频道,就用到了瀑布流的布局方式,这种纯粹的看美女图片的页面用瀑布流还是挺合适的。以前并未开发过瀑布流布局的网站,第一个想到的实现方式就是多列浮动,从表面上看这种方式要简单。传统的定位布局方式但是,目前主流的瀑布流布局都是采用定位的方式,对每个单元格计算定位值,如下图:定位的方式实现起来其实也简单,在窗口 resize 时,也可以方便的对单元格进行重新计算排序。但是计算的频率比较高,如果要做无限的加载数据,以及 resize 时的自适应排列,那么性能就是一个必须要重视的问题。如果没有任何优化手段,成百上千个单元格本身就很耗资源,resize 时再全部重新计算一遍,可以想象浏览器在这个时候一定很吃力,必然会有浏览器假死的情况。多列浮动的布局方式

21 次浏览
详细解析网页设计 如何准确看清用户需求?
详细解析网页设计 如何准确看清用户需求?

如何准确看清用户需求?市场营销,就是“通过改变影响用户产品购买决策的各种因素,实现争夺用户或激发用户消费的目的”,对产品运营人员来说,无非是解决“吸引新用户、掠夺竞品用户、留住现有用户、促使用户购买、促使用户购买更多”等实际问题,于是,产品运营人员需要去不断了解用户需求,改善市场策略,而市场调研是了解用户需求最常用的方法。产品运营希望我们能告诉他们“怎么做?为什么?”产品运营人员需要的数据往往是很直接的,需要我们告诉他“为了抓住用户,该怎么做?”,而市场研究挖掘用户需求的方法很多,面对一堆数据结果,产品运营人员常摸不着头脑,不知道怎么去做。看一个挖掘用户团购需求的实际案例:用直接询问、结果推导两种不同方法挖掘用户需求,结果存在一定差异。直接询问时,商品折扣、品质、售后服务是用户最主要的考虑因素;实际选择时,这三个因素的重要性却明显下降,反而,网站知名度、用户口碑、周围朋友都在上面买等因素影响更大,作为产品运营人员,这些数据到底该怎么用?哪些因素对“争夺用户、实现利润”有明显作用? “商品折扣、品质、售后服务”是核心因素吗?反观其他非互联网行业产品,也经常会出现这种情况。如:询问用户选择某类产品的考虑因素时,质量、价格往往是不可避免的高需求因素,而在实际选择中,渠道、促销、口碑却又成了影响用户选择的关键,为什么会出现这种现象呢?原因是多方面的:1、用户陈述的因素,各品牌差异小(如:各品牌价格差异不大),实际购买时,起不到影响作用;2、某些产品,用户冲动购买偏好强;

25 次浏览
致那些终将流行的响应式网页设计心得
致那些终将流行的响应式网页设计心得

如今,web应用已经深入到我们生活的方方面面了。而你知道吗?72%的用户们都希望他们访问的网站不仅在台式机或笔记本上有赏心悦目的界面,同时也能适应移动设备的屏幕。为此,身为设计师和工程师的我们必须紧抓这个潮流,走在前沿。达尔文教给世人最精准的四个字就是:适者生存。而响应式设计,凭借着其灵活可变的特性以及一些其他因素,必定会被越来越多的设计师青睐,成为未来web开发的一大主流设计模式。Ethan Marcotte,致力于推广响应式设计的先驱者,指出响应式设计基本上包括三大元素:流体网格,自适应的媒体以及CSS3媒体查询。简言之,响应式设计是一种自适应的设计模式,能灵活地应对不同显示设备的分辨率大小,像台式机,笔记本电脑,手机,平板电脑,平板手机,电子书等。然而实现响应式设计并不是一件简单的事。Web设计师和工程师们常常面临着网站性能(主要是加载速度),广告,导航等多方面的挑战。不过这些挑战是设计过程中无可避免的一部分,也必将令响应式设计真正地变得赏心悦目和持久稳定。可以看到的是,许多网站都已纷纷投向了响应式设计的怀抱。下面我们不妨看看一些将响应式设计实际融入到网页中的优秀作品吧。ReadlistsInboundThe Boston Globe

17 次浏览
详细解析如何打造网页的形式感技巧
详细解析如何打造网页的形式感技巧

作为自然界视觉的三种基础形态,它们分别由直线、折线、弧线组成。我们来看看它们各自的几何形态的情感:方:整齐、稳定、干净、锐利。缺点:生硬、呆板圆:可爱、灵动三角:动感、尖锐、不平衡其中方向因为其整洁、易识别、重构性好的特点在网页设计中应用比较广泛,但与此同时也容易让人审美疲劳形成画面生硬的印象,所以在非门户或大型资料站等页面时可以采用圆、三角这两个元素进行调和。如:活动专题页、内容不多的小型资料页。增强视觉上的灵动和刺激可以让页面快速抓住玩家的眼睛,达到专题快速传播的效果。

20 次浏览
20大国外优秀网页设计的数据可视化工具点评
20大国外优秀网页设计的数据可视化工具点评

数据可视化在当前是一个热门话题,旨在借助于图形化手段,清晰有效地传达与沟通信息。但是,这并不就意味着,数据可视化就一定因为要实现其功能用途而令人感到枯燥乏味,或者是为了看上去绚丽多彩而显得极端复杂。为了有效地传达思想概念,美学形式与功能需要齐头并进,通过直观地传达关键的方面与特征,从而实现对于相当稀疏而又复杂的数据集的深入洞察。然而,设计人员往往并不能很好地把握设计与功能之间的平衡,从而创造出华而不实的数据可视化形式,无法达到其主要目的,也就是传达与沟通信息。如今学习应用数据可视化的渠道有很多,你可以跟踪一些专家博客,但更重要的一点是实践/实操,你必须对目前可用的数据可视化工具有个大致了解。以下是Netmagzine列举的二十大数据可视化工具,无论你是准备制作简单的图表还是复杂的图谱或者信息图,这些工具都能满足你的需要。更加美妙的是,这些工具大多免费。第一部分:入门级工具1.ExcelExcel的图形化功能并不强大,但Excel是分析数据的理想工具,上图是Excel生成的热力地图作为一个入门级工具,Excel是快速分析数据的理想工具,也能创建供内部使用的数据图,但是Excel在颜色、线条和样式上可选择的范围有限,这也意味着用Excel很难制作出能符合专业出版物和网站需要的数据图。但是作为一个高效的内部沟通工具,Excel应当是你百宝箱中必备的工具之一。2.CSV/JSON

3 次浏览
网页设计趋势之来尝鲜多边形风格设计吧
网页设计趋势之来尝鲜多边形风格设计吧

我们介绍过2013年的网页设计趋势有扁平化设计(Flat Design)、条纹式网页设计等等,其中Flat Design最为流行,不过最近,设计达人又发现了新的设计趋势——多边形风格,什么是多边形风格呢?其实它有点像白纸风格一样,如果不懂,下面我们为大家介绍一个制作多边形图像的网页工具。工具由somestuff提供,我直接分享至微盘:微盘下载使用方法很简单,下载后用支持html5的浏览器打开,拖动一张图片到”Drop your bitmap here”区域,如下图:拖进去后,你可以随意单击鼠标来制作多边形,也可以点击Randomly来快速生成,还有一个好处就是能生成SVG图片,这样能可以在AI在随意修改了。生成SVG方法:点击 Export ,然后在 this link 右击另存为,保存的时候记得添加”.svg”后缀哦!全屏网页设计最近不也很流行吗?所以设计达人网尝试使用这个工具来制作一个背景。原图:(图片来源未知,很多年前收藏的,有版权问题请告知我)

24 次浏览
网页设计中透明效果的使用技巧心得
网页设计中透明效果的使用技巧心得

运用好透明效果是提高网页设计水准的重要方法之一。如同使用其他方法一样,设计师们有很多种手段将透明效果运用到网页中,今天这篇文章就来好好和您分享一下关于“透明”的实用小技巧哟。在网页设计中使用透明效果是件既美观又冒险的事儿。透明效果的使用是把色块,文本或图像“变薄”或者降低饱和度,使颜色变浅透明,这样下个图层的内容就能穿透显示出来。这种方法如果用好了,效果将会特别棒——能突出显示文本或者在图像的特定区域形成焦点。但设计者在运用透明效果时要特别小心,因为这么做可能会影响页面的可读性。要是框和文本的透明度不对,更可能会影响到整体的设计。下文是一些注意事项以及巧妙运用透明效果的成功案例。用“透明效果”来制造对比使用透明效果最大的优点是可以形成对比。设计者可以在图像上打造出一个色块或文本的焦点,增添屏幕的色彩维度。透明效果还能使文本从不抢眼的背景上跳脱出来。在运用透明效果时尤其要考虑对比度。只有图像和文本都具备可视性时,透明效果才算成功。所以采用透明效果时,别忘了问问自己:这会使文本/图像更容易理解么?不要遮盖图片的关键部分透明效果不能遮盖传递信息的背景或图片。当决定采用透明效果为框架时,要想想会不会少了什么。

16 次浏览
16个网页设计师应该知道的UI优化秘诀
16个网页设计师应该知道的UI优化秘诀

优异的用户界面可以让用户用得顺心,从而提高转化率(conversion rate),换言之,好的 UI 在使用与销售层面上形成双赢。本文整理了16点优化用户界面的方法,希望对大家有所帮助。本文原作者加拿大UI设计师Jakub Linowski 译文出处: Inside单栏型式优于多栏单栏型式让你更能掌握自己的内容,从顶部到底部一气呵成,用故事引导读者,最终是要诱引他们「采取行动」(call to action,下称CTA,意指下载或消费等目的);而多栏反而可能导致读者分心。不要劈头销售产品「略施小惠」给使用者,贩卖的意图不要设计得太明显。小小的优惠或礼物,对未来的销售会带来大大的帮助。统一相似的功能,避免支离破碎的UI浏览网站时,我们很常看到琳琅满目的元素或特色,但它们的功能毫无二致,而相似的选项太多,只会提高让使用者无所适从。倘若发现自己的网站内有以不同 型式重复相同功能的状况,不妨考虑重新设计UI,把类似功能整合起来。譬如图中「Customer Service(客服)」、「Contact Us(联系我们)」其实是一样的意思,应当保留一个选项就好。

16 次浏览
6个网页设计师必须知道的小技巧
6个网页设计师必须知道的小技巧

平面设计和网页设计是两个截然不同的领域,这两个领域有不同的设计需求、设计实践和设计方法。例如,在网页设计中更常使用基于像素或栅格的文件格式,诸如JPG、GIF或PNG。相反,在平面设计领域像logo这样的图形可能会用到不同尺寸,因此使用最多的格式则是EPS和AI这样的矢量格式。然而,用于网页的矢量格式,如SVG或HTML5 Canvas则不能广泛应用,也不会被所有浏览器所支持。另外,用于web端的图形有基于它们自身的相关处理方式。其中一条便是你要时刻注意文件的大小,因为你需要使你的网页加载越快越好。作为一名网页设计师,你应当尽量减少HTTP对图像的请求次数——无论通过减少图片的使用数量还是将它们整合成CSS sprite——以及确保你选择了正确的图像格式,使其在图像大小和质量间得以平衡。photoshop是平面设计师和网页设计师使用的行业标准工具。以下是你在创建web端使用图像时的一些简单的小技巧。1. 将图片保存成Web所用格式在网页设计中,你必须确保你的图像大小越小越好。当然,当你想要图片完好显示时可以抛弃这条原则。在Photoshop中创建图像的完美方法便是平衡质量与文件大小。网页设计师经常犯的一个错误便是使用“另存为”命令,而不是使用“存储为Web所用格式”。“存储为Web所用格式”可以将图像保存成基于网页设计优化过的格式,包括图像质量、图像分辨率、浏览器兼容性和文件大小。

19 次浏览
猜想未来的网页界面设计长什么样
猜想未来的网页界面设计长什么样

近期引发最多讨论的界面设计无疑是iOS7新UI变化,但对iOS7的设计我在这先不做评论。而是想跟大家讨论界面设计趋势,引导设计走势的因素是什么?有句老话:“以史为鉴,可以知兴替”尽管人机交互界面发展时间不久,但从西方艺术发展史中能依然能给予我们启发。19世纪前艺术是为权力贵族与宗教服务,其宣扬的是宗教信仰与权力。那时期,以巴洛克,洛可可为代表的作品中,奢侈华丽绚烂的装饰特征深得权贵喜爱。无论宗教建筑,室内装潢家具,还是贵族妇女的摆群,甚至小到留空雕花瓷器茶杯,这些无都是文艺复兴思想的体现。19世纪后随着工业革命运动的爆发,自动机械开始代替传统手操作。同时随着对机械语言的理解加深,思想家逐步意识到工业设计应该服务于大量生产,为大多数人生产实用美观的物品,而不是为少数富有的特权阶层生产奢侈品。

17 次浏览
共计26043条记录 上一页 1.. 2328 2329 2330 2331 2332 2333 2334 ..2605 下一页