创意味儿十足的web布局及交互设计


  富有灵感和创意的设计与一般设计的区别在于,它不那么容易被想到和实现,一旦它被实现,一个非常有趣并且迷人的网站就诞生了。

  网站几乎每天都能见到,但是不是每一个网站你都会说“真希望我也能想到过!”

  设计者们正在做的是一项伟大的工作,那就是提出且合并各种高水平设计的网站,这些网站都是最新颖的原创作品,同时还保持了很高的可用性。不规则的颜色、形状,及其导航就可以生成最有趣、最吸引人的网站。当然,能想到这个点子是很难的,实现起来也有一定的困难。

  但 是说不准哪天你做的东西能引起一个新的流行趋势,产生很大的点击率,或者以你无法想象的一种方式来“工作”。对于设计者和开发者而言,最重要的是要记住 web设计无论看起来多么牛,必须高效可用。通过在设计过程中结合创造性的思维和对关键特性的仔细分析,伟大的和最新的网站概念将会不断的涌现。

  跳出固有思维模


  第一个问题是“为什么?”

  为什么我们在制作网站草图的时候总是画矩形框?

  为什么“一直”是那几种特定的颜色或字体?

  为什么所用的照片都是完美的4×6屏幕高宽比?

  第二个问题是我们怎样做到不同?

  越来越多的网站用兴趣和创造性的布局来回答上面第二个问题,从使用圆形到使用吸引人的照片和颜色,似乎没有起到显著的作用来创建新的导航和滚动方式。

  怎样对待基本概念?

  当形成打破常规的新概念时重要的是记住基本概念。无论一个网站看起来多么酷,它必须具有可读性和可用性,否则人们不会前往该网站并进行内容交互。

  在设计的阶段,要记得不断思考你的用户和他们的想法及他们怎么使用网站。如果是高级用户的话,那么在导航和滚动特性上只要存在一点不方便使用的地方,都会使他们印象深刻。但是如果用户是计算机初学者,你就应该坚持普通的导航工具。

  你的访问者为了一个原因来到你的网站。当他们到达该网站时这个原因需要加强。确保你的设计能提供给用户所需要的所有准确信息、娱乐、电子商务等等。

  不要做的过多!意思是,针对一个有兴趣的方向一直做下去,但是不要尝试太多的东西。记住,如果有太多的东西出现在你的网站上,那么用户是不会停留住多久的。找到一个兴趣和唯一的方式来和他们互动。

  五个站点聚集在一起

  那么什么使他们聚集在一起?创造性、可读性和可用性。我们见过一些网站做的东西很新、超乎想象并且非常棒。


  lowdi 在做一个伟大的工作,他们用常态之外的形状来创造视觉上的兴趣点。不仅每个盒子都有圆角(或反向圆角),被着色的框架类似于该公司正在出售的产品的形状。 即使你没有在屏幕上看到Lowdi的盒子,你已经记住了它。随着滚动,这个盒子(这是一个扬声器系统)使用一系列弹出的气泡与你“对话”。这种概念非常有 趣、新鲜并超级迷人。


  Steve Vorass 利用“隐藏导航”展示了他的各种项目。投资组合类型的网站使用一种在屏幕顶端的简单的“工作、概要、联系”导航,同时图像也是导航工具。每张不同类型的图 像将带你到不同的项目。更重要的是,当你的鼠标悬停在图片上时,他们会提醒你点击后将带你到哪里。网站的整体设计有一种简单的外观和意想不到的像墙一样的 动画效果。


  Caava Design 引人注目的地方在于图像选择和有趣的形状,但是更具有创意的是滚动。整个网站建立在时间轴上。每个图像“气泡”带你到另一个信息级别。使它特别的是你根本不需要看懂时间轴就能导航和明白这个网站。它是一个功能非常强大的组织。


  Joint的网站向我们展示了标签本身就是一个具有创造性的设计业务。每个页面给你用来导航的可点击的选择。这个方案很简单,仅用灰色和白色(除了友情链接会包括彩色照片)但悬停效果和可读性是很奇妙的。它会让你想一直点击下去来看看到底这个网站是什么样子。


  Ballantyne 使用很棒的图片组合、有趣的形状和非常酷的滚动效果让你着迷。时装零售商的网站上展示了一个很棒的产品选择页面,同时提供有趣的公司和产品信息。每个滚动 轴通过上下按钮移动三个图片面板来显示新图片。滚动效果在几个屏幕间持续,你会不由自主地想看看接下来会发生什么。另外,酷酷的斜边使滚动的效果变的更加 无缝和有趣。

  结束语:

  很多年来,设计师们从来不说“没有原创的想法。或者我认为那种想法疯了”。每天,新的技术和新的设备都在改变着我们对web设计和设计流程的想法。我们应 该让头脑风暴走出你的舒适区,然后再把你所获得的想法拉回现实,确保它包含所有的特性, 再将这些特性变的更加实用。

  记住,一些“疯狂的”点子可能会失败,但是这没关系。分析并学习它,然后进入下一个点子。

  via gbtags

  来源:创意味儿十足的web布局及交互设计

时间: 2024-10-03 11:12:37

创意味儿十足的web布局及交互设计的相关文章

网站设计之创意十足的web布局及交互设计

富有灵感和创意的设计与一般设计的区别在于,它不那么容易被想到和实现,一旦它被实现,一个非常有趣并且迷人的网站就诞生了. 网站几乎每天都能见到,但是不是每一个网站你都会说"真希望我也能想到过!" 设计者们正在做的是一项伟大的工作,那就是提出且合并各种高水平设计的网站,这些网站都是最新颖的原创作品,同时还保持了很高的可用性.不规则的颜色.形状,及其导航就可以生成最有趣.最吸引人的网站.当然,能想到这个点子是很难的,实现起来也有一定的困难. 但是说不准哪天你做的东西能引起一个新的流行趋势,产

手机Web App的交互设计

  HTML5为提高手机网页的体验提供了诸多的可能性,交互效果越来越接近原生App,故而成为Web App,有望将APP功能引向浏览器,让移动平台的竞争由系统平台转向了浏览器之间. Web App比起原生App和wap有着自身的优缺点,先简单了解下其特点,掌握设计趋势,也便于以后在设计中应用. 离线存储 离线存储的意思是第一次访问是下载网页,以后在无网络的情况下也可以使用.一个离线应用程序就是一个URL列表–HTML,CSS,JavaScript,图片,或者其他类型的资源.访问时探测到服务器列表

web设计和设计流程 有趣的web交互设计

文章描述:创意十足的web布局及交互设计. 富有灵感和创意的设计与一般设计的区别在于,它不那么容易被想到和实现,一旦它被实现,一个非常有趣并且迷人的网站就诞生了. 网站几乎每天都能见到,但是不是每一个网站你都会说"真希望我也能想到过!" 设计者们正在做的是一项伟大的工作,那就是提出且合并各种高水平设计的网站,这些网站都是最新颖的原创作品,同时还保持了很高的可用性.不规则的颜色.形状,及其导航就可以生成最有趣.最吸引人的网站.当然,能想到这个点子是很难的,实现起来也有一定的困难. 但是说

谈一谈WEB的交互设计和界面布局

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 互联网正在改变世界,由于其具有传播信息容量大.形态多样.迅速方便.全球覆盖.自由和交互的特点,已经发展成为新的传播媒体.从认知科学的角度来讲,互联网是一种新的认知结构,通过它个体与社会相互作用,使得知识延伸.正如Fillmore所说:"超文本的介入使得不仅仅是阅读甚至包括学习和生活方式都发生了巨大的变化."互联网成为各种学

web排版艺术与交互设计

  前言: 如今的web真的是太难做了,上篇我就提到过,web-er要懂得也是太多,何其多何其多啊. 正文: 需要掌握的工具很多,photoshop,fireworks以及相关设计辅助软件,需要懂得如何去布局排版,色彩以及字体美化,有时候必要的时候还需要懂得如何把一个PSD与PNG图片进行转换,个人认为,用户体验就是从试用的体验和视觉上的体验上开始的. UE交互设计: 我们一直在做网页,在做设计,而我们最终也是给别人用看给别人用,所以可以归类到"人机"交互上去,而人机交换体现是就是一个

交互设计中响应式Web设计的优势和设计流程

在设计中经常遇到这几个问题: 1.想要网站兼容手机.平板电脑.pc,就得为不同的设备定制不同的版本. 2.想要网站的某些页面在宽屏显示器下一行显示更多的内容,又得为宽屏定制一个版本. 3.很多人并不是在全屏的情况下浏览我们的页面,如果让页面随着浏览器宽度改变而相应的调整会不会比较好? 有没有办法能有效解决这些问题呢? 响应式Web设计(Responsive Web design)的理念是页面的设计与开发应当根据设备环境(屏幕尺寸.屏幕定向.系统平台等)以及用户行为(改变窗口大小等)进行相应的响应

交互设计用户研究:Web交互设计优化

文章描述:Web交互设计优化的简易check list. "优化已有产品的体验",这是用户体验相关岗位职责中常见的描述.我们的产品常常是在快速的迭代过程中不断完善的,就像孩子生下来需要养育才能长大一样,优化已有功能/产品,和设计新功能/产品同样重要,不可偏废. 但是,相比实现新功能,已有功能的优化总是显得没有那么紧迫而且很零散,导致了迭代优化的计划总是被归入"重要不紧急"甚至是"不重要不紧急"的象限,变成了东一棒子西一榔锤的买卖.我们可以通过可用

交互设计体验:WEB设计和拍电影

我觉得WEB设计和拍电影很像,交互设计师好比是编剧,视觉设计师则是导演,因为WEB交互设计就是WEB产品原型设计,他有个基本与根本的原则-易用性(易用性或可用性,以下统一用"易用性"概括),让产品更好用. 我是一个电影爱好者,一直关注中国电影.近几年,张艺谋拍了<英雄><十面埋伏><黄金甲>,冯小刚拍了<天下无贼><手机><非诚勿扰>,陈凯歌则拍了<无极><梅兰芳>,这些电影声势浩大,大牌大

web交互设计方法:页面表达常用方式

<页面表达常用方式>是整个"web交互设计方法"中的一部分: 设计师在设计页面时,应该在页面上建立许多视觉层次,引导用户的视觉焦点.把用户的注意力吸引到最重要的元素上,然后才把视线引导到其他重要程度次要的信息上.这样便于用户快捷迅速地找到自己所需,更好的完成阅读.浏览任务.这里介绍几种页面表达的常用方式. 一.页面的浏览顺序 对用户扫描页面的时候进行视线跟踪,这叫做"视觉流".好的设计能够让人们按照顺畅的次序沿着它向前流动.人们一般的习惯是从左到右.从上