首页

灵感创意!13例漂亮的设计机构网站

蓝蓝设计的小编

如果你正在给自己的网站寻找灵感,来看看这些设计机构网站是一个好的选择。为了今天的灵感分享我们搜集了一些令人兴奋的设计机构网站,希望大家可以从他们身上学到一些东西。
在大家浏览这些页面的时候,可以重点关注一下各个机构/设计师是通过什么方式来把自己的设计风格带到页面中的。

pixies-agency

畅游VC-优设截图

stereocreative


畅游VC-优设截图

parall

15个拥有完美色彩搭配的网页设计欣赏

蓝蓝设计的小编

使用不同的2个或3个色系,进行相互搭配,从而产生不同的设计效果,或冲突或和谐。这是一种前卫又时尚的网页色彩流行趋势,收集了15个相关的作品,分享给优设的童鞋们 : )

如果您想尽快学会配色请移步这篇人气超高的文章:设计师的配色理论:你真懂颜色了吗?

 

Uidigital

 

Decode

 

让访客快乐起来!20例幽默的网页设计

蓝蓝设计的小编

Inspiration: When Humor Meets Flat Design

“人生太孤单,要找个有趣的人一起过”——王小波

相信大家肯定都喜欢幽默风趣的设计。
当流行的扁平化设计遇到幽默元素,会摩擦住怎样的火花呢?

幽默的魅力是无穷尽的,它即能够让用户感到有趣,又能够迅速的吸引用户的注意。
如果想为网站添加幽默元素,可以有很多种方式,例如:

  • 搞笑的错误页面(Team Treehouse)
  • 搞笑的Logo(Pixo Creative)
  • 卡通式的布局
  • 搞怪的背景图像
  • 可爱的图片
  • 让人爆笑的视觉元素

一旦你做到了有趣,用户自然就会对你的网站侧目。
我们一起来看看下面这些吸引眼球的幽默案例吧!

相关推荐:
《激活你的设计创意!不容错过的55个创意惊人的网站》
《想设计自己的网站?先来看这15个优秀设计师的酷站》

经验分享:响应式排版中的基础知识

蓝蓝设计的小编

经验分享:响应式排版中的基础知识

Arrietty:当我们建立网站的时候,我们一般从定义正文开始。正文的定义显示了你的主栏有多宽,其它几栏的大小就随它自己内容定义了。直到最近,各种屏幕分辨率或多或少是同质化的。如今,我们要处理各种屏幕尺寸和分辨率。这让处理变得更复杂。

在重整旗鼓的热情中,我写了一篇关于响应式排版的博客,这篇文章主要专注于我们最近的实验:响应式字体。如果不知道IA的历史,你可能会错过我们新启动的网站中的响应式排版和设计的一些关键点。我决定从头做起,一步一步解释响应式排版,而不是整理所有文章。以下是第一步。

经验分享:响应式排版中的基础知识

为了防止给每个可能的屏幕尺寸做不同的层级设计,很多网页设计师会采用响应式网站的概念。一言以蔽之,这是一种网页布局会自动适应屏幕尺寸的概念。有很多种方法可以定义这种概念。我喜欢用这种方法:

适应性布局:按步骤调整布局适应有限数量的屏幕尺寸。流体性布局:不断地调整布局以适应每一种可能的宽度。两种方式都有优势和劣势,我们相信布局适应于很少的合理变化位置是我们要采用的方法,因为可读性比布局宽度随时和窗口一样宽来得重要。这是不是一个复杂的问题它本身就值得商榷,但是最优的可读性需要在文字尺寸上一定数量的控制(栏宽),就此看来,流体式布局会产生更多问题。

网页:滚动视差设计指南

蓝蓝设计的小编

滚动视差设计指南

@腾讯ecd 星旧:作为未来网页设计的热点趋势之一的“滚动视差”在近年来被越来越多网站所采用,特殊新颖的展示模式也让许多用户眼前一亮。网络上也如雨后春笋一般出 现了很多像《30个让人兴奋的视差滚动网站》、《60个视差滚动网站赏析》……等一系列的视差滚动的文章,不过赏析的居多,真正指导设计师如何去设计,如 何去实现的实用型文章却很少。于是萌发了自己写一篇的想法,与感兴趣的人共同交流下滚动视察设计时的一些心得。

什么是滚动视差
视差滚动(Parallax Scrolling)是指让多层背景以不同的速度移动,形成立体的运动效果,带来非常出色的视觉体验。

视差效果,原本是一个天文学术语,当我们观察星空时,离我们远的星星移动速度较慢,离我们近的星星移动速度则较快。当我们坐在车上向车窗外 看时,也会有这样的感觉,远处的群山似乎没有在动,而近处的稻田却在飞速掠过。许多游戏中都使用视差效果来增加场景的立体感。说的简单点就是网页内的元素 在滚动屏幕时发生的位置的变化,然而各个不同的元素位置变化的速度不同,导致网页内的元素有层次错落的错觉,这和我们人体的眼球效果很像。我看到多家产品 商用视差滚动效果来展示产品,从不同的空间角度和用户体验,起到了非常不错的效果。

看似复杂其实这个早就不是什么新鲜事儿,这种设计思路早在80年代的小霸王学习机上就见过。

1

在这个画面里通过人物马里奥、前景、背景着三个部分的移动速率的不同来实现立体效果。类比网页也是如此。一个滚动视察的网站至少会有以下几层 :背景层,内容层,贴图层。

8个在网页设计中即将被淘汰的趋势

蓝蓝设计的小编

时代一直在变,一个又一个的创新让我们感到惊讶万分。网页设计的趋势如同流星,光芒耀眼,但来得快、去得也快。虽然跟风很不好,显得毫无设计主见,但很多设计潮流确实值得追随。就像当下响应式设计、扁平化设计、以及滚动视差等。

可是呢,还有很多极为”糟粕”的设计趋势,本文一一列举,请君对号入座。

相关推荐:
《年终特典!当下最热门的网页设计趋势总结》
《网页:滚动视差设计指南》

1. 除了电话线时代的老顽固,现在已经没人喜欢页面跳转了

webdesign-annoying-trends

“下一页”、”下一张”,明明一页就能展现的内容,非要跳转20多次才能看全,你把用户当傻子?操作繁琐、浪费时间、效率低下,没人喜欢页面跳转过于频繁的网页。

2. 十面埋伏的广告

webdesign-annoying-trends

确实有很多网站的维持依赖广告收入,但是广告的位置一定要合理,不要妨碍用户浏览信息,用户体验永远位于广告之上。没有用户访问量,也就没人找你打广告。

导航设计趋势!关于图标式导航的改进

蓝蓝设计的小编

不知不觉的,很多网页设计中采用了图标式导航(Navigation)——一般使用三道杠作为图标,用以导航。
这种导航的好处是节省空间,让界面更简洁。

图标式导航的案例

这是YouTube 图标式导航(移动版):

为导航瘦身!关于图标式导航的改进

这是Squarespace的图标式导航:


为导航瘦身!关于图标式导航的改进

AWARD的图标式导航不拘一格:

来试试响应式设计!25例优秀的响应式网页设计赏析

蓝蓝设计的小编

通过我们长期对设计类网站的发掘,总结出了一个现象,那就是很多关于响应式设计的文章只给出了桌面版的网页设计,却没有提供移动版网页设计的对比,这在我们看来,多少显得有点不够专业。

于是,我们在这里收集整理了25例优秀的响应式网页设计,均有桌面版和移动版的对比。在方便您阅读这篇文章的同时,您不妨也思考一下灵活性这个主题。
对了,如果您还不够了解响应式设计,请至我们这篇文章《经验分享:响应式排版中的基础知识》回顾学习。

 

Whisperism

Responsive Websites

 

World Wildlife

Responsive Websites

 

Naspa

Responsive Websites

超赞!精致典雅引人注目的黑色系网站设计

蓝蓝设计的小编

Hotel Bourg Tibourg

有同学喜欢玩黑白配,但是却一直不得要领,总设计不出让人眼前一亮的佳作出来?今天就让我们来这些优秀案例里找原因。

深色的背景看起来具有神秘感,能提供前景元素、背景元素的高度对比。有了黑色的铺垫渲染,任何一个色彩都可以轻易在它之上焕发光彩。
那么怎么才能更好的在网页设计中运用深色背景呢?想要成为一名”高级黑”设计师吗?先来欣赏本文的绝赞范例吧。

The Blue Cube

外观整洁干练,对照鲜明。黑色背景凸显了白色文本。

The Blue Cube

 

灵感创意!15个整洁的小型网页设计

蓝蓝设计的小编

作为一名网页设计师,有时会使用很多不是必需的元素或者大量的复杂色调来使页面脱颖而出。这样做往往会使页面看起来太过花哨和分散用户的注意力,无法突出页面的内容。大多时候你会发现使用简单的设计方法就会达到很好地效果。因此,今天我们收集了15个新鲜的用简约风格设计的页面来启发大家的灵感。

相关推荐:
《11个超炫的视差滚动网站欣赏(附神器推荐)》

《awwwards上推荐的20个拥有创意布局的网站》

Arko

畅游VC-优设截图

Orchard Keepers

畅游VC-优设截图

日历

链接

个人资料

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

存档