首页

2013年10大网页设计趋势

蓝蓝设计的小编

2013年10大网页设计趋势
TNW发布了2013年10大网页设计趋势:

1、响应式布局盛行,即一个网站适配多种屏幕;
2、重视字体的选择,使用Web字体;
3、更少的使用Flash,使用其他任何可能替代的技术;
4、苹果iOS的拟物化设计将不再时髦;
5、使用巨大的背景图构造大气的视觉效果;
6、产品和个人介绍页面留出更多空白;
7、更多的社交网络分享入口;
8、浅色、冷色调重新成为主流;
9、移动App将取代一部分移动网页流量;
10、内容依旧为王;

好了,该到我们年终展望新年的时刻了。2012年我们看到一些新的设计趋势在Web设计领域,特别是响应式页面设计。那么跟随我们的脚步,来预测一下2013年的设计趋势吧!

1、响应式网页设计越来越被重视

响应式网页设计

响应式网页设计已经不是什么新鲜名词了,但我们为什么还有说它呢?简单地说:响应式设计的方法会更多且制定相应的标准。2012年通过断点的响应式 设计类适合不同的屏幕,当新的设备比如iPad mini冲击足够大的市场的时候,这种方式将得到改变,断点可能被替换成其他实现方式。

我们认为更多的网站设计将专注于最初的页面设计以响应式,而非单独制定不同设备的模式。这种响应式设计忘记尺寸以便支持多种设备,我们将看到更丰富的页面设计适应不同节点的设备。

21个美丽优雅的联系页面欣赏

蓝蓝设计的小编

本周我们向您推荐这21个时尚新潮的网站设计,它们都有非常好看的联系页面。
或许很多人觉得联系页面并不重要,但是在国外,设计师和企业团队是非常注重这个页面的设计和信息展现的,有一个明确的方式让人们获得与你联系的信息是非常重要的。
设计一个好的联系页能让你与客户更好的沟通。从咖啡馆及餐馆的页面到设计工作室的页面,我们将展示几种不同的联系页。
这些设计简洁、轻便、图文并茂并丰富多彩。现在就来感受这些优雅的页面吧:)

相关文章推荐:
一组漂亮的婚礼相关网站设计欣赏
35个超赞的iOS App网站欣赏
70个全球最华丽的互动型单页网站欣赏

Supereight Studio

21个美丽优雅的联系页面欣赏

从用户出发:移动设计原则小结

蓝蓝设计的小编

从用户出发:移动设计原则小结

蓝蓝设计:本文作者总结了十四条关于移动端产品设计的原则,其提倡的核心原则就是从用户出发,充分考虑用户的使用体验。

一、充分考虑用户的使用习惯

比如大多数人拿手机的时候是双手握还是单手握,单手握的时候是右手操作还是左手操作,操作的时候用哪个手指就能进行操作。考虑到用户的使用习惯有助于在设计时避开手指的触碰盲区。

二、充分考虑用户的使用场景和干扰源

用户使用产品是在什么时间,什么地点,什么环境下使用?譬如,用户经常在嘈杂的环境中使用自己的产品,这时候的干扰源就是噪音,产品设计时应避免使用语音技术;用户经常在拥挤的环境中使用产品,则产品设计时应避免用户过多地进行输入操作;用户经常在地铁等网络环境不好的场所使用产品,产品就应该自动保存用户的信息,防止信息的丢失。

三、尽量减少产品层级

在移动设备上,过多的层级会使用户失去耐心而放弃对产品的使用。如果产品层级确实过深,考虑用一下几种方法扁平化你的层级结构:使用选项卡(tabs)结合分类和内容的展示;允许穿越层级操作,比如允许用户在第一层级对第二层级的内容进行直接操作(新浪微博信息列表页的长按)。

从用户出发 —— 移动设计原则小结

 

界面设计中需要注意的小细节

蓝蓝设计的小编

界面设计中的小细节

界面设计包括哪些细节、如何深入?
我们常说“细节决定成败”,有些界面会让人觉得不精致,缺细节,而这些细节又包括哪些呢?如何去深入呢?

不妨来看本文作者,百度用户界面设计师@JJ-Ying 为您娓娓道来:

  • 界面元素的对齐,我见过很多同学对齐是永远靠眼睛的。确实在布局的时候经常需要做到视觉上的对齐,而不是机械的对齐,但这不是界面元素可以随意摆放的借口,该对齐的内容需要对齐,有时候只是举手之劳,养成好习惯很重要,有点强迫症也不是坏事情。
  • 像素,虽然现在的分辨率越来越高,但是很多图标、按钮的边缘还是最好都检查一遍保证垂直和水平边缘不会被虚化。
  • 界面光源的一致性,一致性是个很大的课题,应该能写一篇论文那么长,细节方面的一致性应该包括界面元素、文字阴影、图标等的光源。假设深色的标题文字用了向下的淡色投影表现内凹效果,那正文就应该避免用深色的文字向上投深色的阴影
  • 图标面积的一致性,这也是一个一直难以避免的问题,而且有很多主观成分,最好的方法是设计的时候放到实际屏幕上以较远的距离查看,是不是有哪些会特别轻或特别重,然后再去调整尺寸
  • 文案,虽然这不是直接的界面设计元素,但是严谨、完整的文案也是给所有设计加分的。常见的问题有中文错别字、英文该大写的没大写、拼写错误等等
  • 别直接使用 Windows 自带宋体 / 黑体里的英文!!!这个不解释
  • 谨慎地使用高饱和度颜色、大差别渐变,我们 GUI 设计师总喜欢把自己当做艺术家,即使 GUI 真算艺术那也是限制最大的一门艺术(天朝的电影、电视剧不算。。。),大家大部分情况下遇到的设计场景没有非常大的颜色空间去发挥,所以一些醒目出跳的颜 色和渐变使用起来要比较小心,否则很容易产生“俗气”的感觉

那些迷人的按钮设计

蓝蓝设计的小编

按钮是网页设计最重要的组成元素之一,是用户和网站进行交互的重要桥梁。要设计出优秀的按钮设计是一件非常困难的事情,因为设计师们需要从整体设计的角度考虑按钮设计成什么样的风格才能和页面的其它部分很好的融合,同时按钮的设计要操持风格的一致性。下面和大家分享网页设计中15个迷人的按钮设计案例,一起欣赏。

Radio fm buttons

Iphone Camera App Ui

BT UI Facelift

交互设计师必藏:50个线框图套件和在线设计工具

蓝蓝设计的小编

当开始进行新项目时,一般都会起步于线框图。本文收集了大量的线框图设计工具和套件。
交互设计师必备哦!

推荐阅读:
《推荐!交互细节中的那些变形金刚》 
《iOS用户体验设计:如何构建交互模式》 
《20个专为无线端设计提供灵感的资源站》

在线设计模板

Wirefy

以内容优先为原则的线框图在线设计工具。允许你运用标准元素设计出响应式线框图。

Wirefy in 50 Free Wireframe Kits and Web Apps

Lumzy

网页设计和界面设计的原型设计工具。

Lumzy in 50 Free Wireframe Kits and Web Apps

Mockup Builder

谁说设计师不会写代码?超简单Photoshop脚本语言介绍

蓝蓝设计的小编

自动化对每个设计师的工作来说是很有用的。它可以在重复的任务上节省宝贵的时间,还能够帮我们更快捷、更容易的解决一系列问题。

你可以使用photoshop的动作来使工作流程自动化,这是很流行的,大多数人都知道并且已经在使用的方法。今天,我们将介绍给你一种高级的自动化技巧:脚本语言。所有的这一切仅仅需要你有一点点关于JavaScript的基本知识,这对于我们中的一些网页设计师往往都是具备的。

我很多年前就知道Photoshop的脚本语言,但是我几个月前才开始决定研究它。我忽视了它是因为我认为那是聪明的具有数学思维能力的程序员的领域。但是我错了,今天我将要来告诉大家,尽管它需要一些基本的程序技巧,脚本语言并不是那么难掌握。

但是,一开始,我们得回答以下这几个明显的问题:

为什么我们需要脚本语言?

为什么我们在Photoshop已经有了很棒的动作之后还要需要学习脚本语言?答案是交互性!当你使用动作时,你不能真正的控制它在不同情况下的表现,就像录像带不停的一遍又一遍的播放而没有任何改变。

00

一个脚本语言更灵活,它表现形式的改变取决于你输入的参数或者是应用程序的内容。听起来很有用?不是么?

要求

你不需要是一个会写脚本语言的高级的程序员。我就仅仅是一个平面设计师,就像你们大多数人一样。但是你需要对JavaScript至少有一个基本的了解,以及一些属性和方法的经验去领悟这篇文章的大部分内容。

01

如果你对JavaScript一点都不了解,别害怕!有很多地方你可以了解程序的一些基本知识。例如:Codecademy,有很棒的完整的交互式课程。

翻滚吧网页:30个漂亮视差滚动网站赏析

蓝蓝设计的小编

大概一年前,我们还在预测视差滚动能否成为趋势,现在,视差滚动网站已经纷繁多样了,到处都有它的影子,除了新奇的体验,网站的纵深感也令人置身其中。在5月份的时候,优设推荐了一篇视差滚动指南,当下是让它真正大展身手的时候了,对这个技术感兴趣的同学移步:《滚动视差设计指南》阅读学习,同时诚挚推荐这《11个超炫的视差滚动网站》,先感受一下它的魅力何在。

今天推荐的视差滚动网站有点特别,是纵横向兼有的,还包括了flickr、tumblr、bahance等知名网站,希望你能在这里找到灵感,创建一个自己的视差滚动网站 : )

Fendi Life

Fendi Life

Twibfy


Twibfy

The Girl Effect

新鲜热辣:48枚扁平化图标免费下载

蓝蓝设计的小编

今天蓝蓝设计跟您分享一组免费的扁平化图标,共有48个,包含了办公,社交和旅行三种风格,由Vecteezy设计。老规矩,读完readme后使用更放心哦!

微盘下载

WDD_IconsPreview

原文链接:webdesignerdepot

30个高端大气的电影宣传网站欣赏

蓝蓝设计的小编

得力于互联网的进步,电影宣传网站也成为提升电影格调的重要方面,还记得《少年派的奇幻漂流》官方网站就令人赞不绝口,甚至有人因此选择进电影院观看。现在,有很多设计师也在为电影宣传作努力,在国内,这是一个新兴的宣传方式,设计师必须在网站中平衡好视觉表现和信息传递,对经验不足的设计师来说,可能还没有头绪,那么这里有30个热门电影(饥饿游戏、了不起的盖茨比、金刚狼2等)的优秀宣传范例,你可以学习借鉴一下  : )

说到电影,推荐这10部:《设计师应该看的10部电影》,找电影资源可以到这儿:《90%的人都不知道的电影资源下载站》,大多数是高清版唷。

The Hunger Games

The Hunger Games

The Heat


The Heat

We’re The Millers

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档