设计资源

超赞!25例交互体验极佳的网页设计

蓝蓝

25 Modern Web / Interactive Websites Design Examples

本文介绍的案例均使用了的HTML/CSS 以及 JS 技术,从视差滚动到响应式设计,实现了良好的交互性,为用户提供更好的浏览体验。我们来快速阅览一下吧。

推荐阅读:
《网页设计新趋势!25例出众的响应式导航设计》
《让网站更生动!那些在网页中完美运用视频元素的案例》
《不要落伍!来和小伙伴一起学习响应式网页设计》

 

Melbourne Remote Control Tourist

的远程旅游体验,这个概念不错吧!

Melbourne Remote Control Tourist

Melbourne Remote Control Tourist

23个最具影响力的网页设计博客

蓝蓝

花了大量时间在网上搜集行业里高质量网页设计的博客,不过话说回来,高质量可信的资源确实挺稀缺的。

 

CSS-Tricks

CSS-Tricks是Chris Coyier公众博客,专门讲一些有关CSS的话题。不过近几年来,CSS-Tricks有了下面一些扩展:

Chris和Dave Rupert一起创造了ShopTalk 播客,在里面可以讨论所以有关网页设计和开发的事情。
Chris 出过几本书,做了一个 Lynda.com的Wordpress主题课程,并且他还创建了一个The Lodge的课程教人们学习如何制作一个颇具现代感的网站。
超多很酷的项目,像 CodePen,HTML-Ipsum, Quotes on Design 。Chris真是个超有想法的人。

csstricks-web-design-blog-top-blogs-follow

CSS-Tricks 是 Chris Coyier 2007年建立的,总部在美国怀俄明州的密尔沃基,至今网站月页面访问量达270万。

网站亮点(这个网站的独特之处是什么?):

名人效应——Chris Coyier 是这么网站的精神领袖,他的个人风格贯穿于项目始终,是众多设计师的楷模。向他学习,同他一同去冒险吧!

关注App设计!20个漂亮的扁平风格移动端界面

蓝蓝

现在扁平化风格在网页设计方面已经有许多优秀的范例了,比如这22个超赞的扁平化设计经典案例就有很多我们可以借鉴学习的地方。但是移动端的界面设计扁平化风格较少,所以今天从BehanceDribbble收集的这一组移动端的扁平化设计就该好好看看咯,学习一下它们优秀的细节和配色吧 : )

如果你对扁平化风格的网站更有兴趣,那么推荐阅读:
一组赋予你扁平化配色灵感的网页设计
怒赞!2013扁平化设计终极指南
专属扁平化设计的PS色板(配色库)

 

uiGo Colors – iOS Flat UI Bundle

 

怒赞!50套万里挑一的设计师专属精华资源包

蓝蓝

我们一起来看一下吧,本文收集了50款专属设计师的精华资源包,分别有图标、主题、UI套件、插件、网页模版、字体等等,一网打尽、一应俱全,万里挑一!实属优设哥献给您的千金难换的干货哟!

10月收尾,11月马上来临,到了该总结经验整理思路的时候了。各位设计师对本月工作满意吗?嗯,没关系,不管好还是坏,11月份,我们重整旗鼓,继续前进。

大家都知道,如果有素材和工具的支持,工作起来得心应手,赶紧来挑选适合你的神兵利器吧:)

Flatic

大型UI套件,涵盖百余种UI元素。

Flatic User Interface

Gamecenter Pack

12月典藏!50个超赞的免费设计师工具资源下载

蓝蓝

互联网最伟大的精神在于分享,我们喜欢探索、喜欢发现,务求将最好的资源呈递给所有设计爱好者。
相信这里面你大多数都还没见过呢!
50个免费资源:包括了图标、字体、PSD、矢量图、图案、UI套件、调试工具等等。
琳琅满目!乱花渐欲迷人眼,请您精挑细选,选择最合适自己的素材,让你的设计项目变得更漂亮、更专业。

OOcharts

remarkable-freebies-and-tools-01

11月份免费新鲜的27款UI组件下载

蓝蓝

设计师们还没更新模板吗?这是优设10月份搜寻的UI模板,总共有27款,大多数为扁平化设计,都是免费且的,希望这些收集能给你正在进行的项目一点帮助 : )

同样精心收集,希望对你有帮助 : )
52款新鲜免费的优质界面PSD下载
50个超赞的免费设计师工具资源下载

Apple Product Line Wire Frame PSD by Rubayath

Apple Product Line Wire Frame PSD by Rubayath in 27 Fresh UI Kits for October 2013

 

Chrome UI Kit v.2 by Todd Hamilton

Chrome UI Kit v.2 by Todd Hamilton in 27 Fresh UI Kits for October 2013

超实用!Photoshop亮度调节脚本

蓝蓝

我们在设计的时候,往往会微调一下颜色的明暗度,又或者去一些在线配色工具网站上准确调节明亮度,但这样是比较麻烦的,这里设计达人网找到一个非常好用的Photoshop亮度调节脚本,使用的时候只需要按下Photoshop快捷键就能调整颜色的明与暗,节省了很多设计时间。

darken-and-lighten-color-ps-script

 

如何使用亮度调节脚本

首先在Photoshop工具栏的前景色面板上选择需要的颜色,然后运行对应脚本来实现颜色的明暗变化。

color-shot

8个获取手机应用程序设计灵感的网站

蓝蓝

曾经,CSS 画廊非常流行,网页设计师们会定期访问这些网站获取灵感。现在仍然可以方便迅速找到令人兴奋的东西(例如 Dribbble 和 Behance 对设计有很大的帮助)。

对于移动应用程序设计,存在类似的画廊,我相信他们会更加有用。这是因为如果不安装移动应用程序,灵感更难获得,也更需要时间和努力。这12个画廊有很多漂亮的应用程序用户界面,并进行了很好的分类。赶紧收藏吧!

优设好文:
强烈推荐!你应该到这里寻找网页设计灵感

Creattica – Mobile Interface

Creattica 是一个灵感画廊,展示最好的网站设计,标志设计,平面设计,摄影,作品。

Creattica - Mobile Interface

Lovely UI

收集各种移动界面元素,启动画面,按钮,导航,通知等等各种组件的设计。

lovely_ui

你的App该变身了!iOS7设计指南

蓝蓝

@ 十萬個為什麼 :苹果的新iOS我们已经上手好几周了,准备好为它而设计吗?

如果你已经有一个运行于此平台的App,你可能打算为新iOS而设计,或者在旧版上做一些必要调整,不论哪种,你都希望为新界面而设计,确保你的App与用户在苹果设备上的体验相吻合。
那么如何做到这点?

扁平,更加扁平

ios7

苹果的iOS7秉承着扁平的设计理念,尽管它不是完全的扁平化,那么就秉着”较扁平”来规划设计你APP或移动站点。

所有的那些曾经辉煌的拟物化风格图标与效果,一去不复返了。如今的潮流是单色块、多色文字和大量留白,

苹果为iOS7制订的设计准则鼓励简洁设计与易用性。但是设计准则并没有着重介绍我们即将讨论的关于扁平化设计的规范。我们能在这些新设计的APP(包括苹果自身样式)中看出一些与扁平设计特征相违背的东西,

比如说颜色,iOS7包含了相当一部分柔和色调和半透明效果。扁平设计通常使用明亮、高对比度的颜色。
你所见到的按键和按钮也没有设计成扁平样式。例如键盘,每个字母都包含在一个带阴影效果的按钮中。这些微妙的效果是新界面的显著特征。

重视字体

一组惊艳的后台管理界面设计欣赏

蓝蓝

蓝蓝设计其实在最早做设计的时候,就是设计银行的客户关系管理系统以及电商网站的后台管理界面

做那种界面的时候,和设计网页的感觉不一样。因为得考虑的不只是美观,更多应该在操作体验及视觉舒适度上下足功夫。

这种界面会成为管理员长时间驻留的地方,会有很多数据表格。如果我们的配色太鲜艳或者太暗沉,都会让使用者遭受眼球上的磨难。

而且一些按钮和操作焦点没有做好区分和规范,那都会是致命的。

关于界面中的交互,这里蓝蓝设计送上前辈们留下的一句金句,非常经典,也很好记:

1、操作前可以预知;
2、操作中有反馈;
3、操作后可撤销;

不管怎么样,这三句话,你可以牢牢记住。这是只可意会不可言传的。等到你钻研达到一定程度了,自然就会明白咯。

而视觉方面的注意事项,其实大家都知道,依然是不要超过三个颜色。这点大家虽然都知道,可是在实际设计的过程中,会不知不觉的用多一些颜色出来,而且还潜意识说服自己:“这个加上也不错,干脆就用上吧。”整套设计稿出来,全局观察的时候,结果就有些混乱,干扰到数据的主视觉区域了。

好吧!今天就为大家带来speckyboy上收集整理的一些dribbble上的精华作品。我相信,这些作品惊艳到你甚至临摹不过来,不信可以试试哟:)

Device Dashboard

mobile ipad device admin dashboard photo

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档