menu

Photoshop 笔刷资源

虽然不搞PS和网页设计很久了,不过过往几年的各种有关PS的积累却还是在那里慢慢生锈。既然以后估计不会在用到,那么共享出来给有用的人最好不过了。本文主要是一些链接,关于PS的各种笔刷——在网页设计里,我觉得笔刷的重要程度仅次于灰度、渐变和阴影,不论是用以表现纹理,还是做必要的修饰,甚至仅仅只是浅到看不清的底纹,即使是细微之处都让设计看起来更浑然一体。

当然笔刷虽然强大,但实际上,可能平时收藏了很多,到时候基本自己也忘记自己有些什么,也就更加谈不上去用了。所以有一个分门别类的网站就显得更加重要。下面列举的这些网站是我以前经常查看的,其中任何一个的资源量都足够一个设计师长时间使用。很多笔刷都异常绚丽,有时候不仅仅是拿来用——比如拿来找些灵感也相当给力。

因为罗列资源网站并截图的做法在国外的文章里特别常见,为此我也特意模仿了那种截图的处理风格,并做了一个Action加快处理速度。很久不用PS的缘故所以还颇费了一些周折:-)

Read more... »

网页色彩记论

作为一个专业前端谈及网页设计的颜色似乎有些跑调,不过在没有成为一个前端之前毕竟也曾是个苦憋的菜鸟级设计师,所以对色彩多少也有些自己的看法。其实不论是大学期间所见所学的还是工作之后看到的各种文章里描述的色彩理论,最后只能沉淀成一种似有非无的东西。比如前些日子看的 Color Theory 101The Psychology of Color,现在在脑子里只有非常模糊的印象。设计者最后仍然还是照着自己的方式创造着美,和一些独有的郁闷:)

网页设计,很大程度上就是布局和层次,前者用空间衡量,后者用光影表现。任何美的技术都有相通之处,所以色彩有的时候并不是必须的东西,黑白和灰度足以表现空间和层次。这之后才是色彩,一种我们与生俱来的分辨方式和暗示。而我写这篇文章的目的,并不是想讲述太多众所周知的理论,既然是记论,其实主要作用就是记录一些色值,这个页面最后会变成我的类似工具参考的页面一样。

Read more... »

30多个高明的Logo

Diamond Bookstore

其实自己现在和设计基本沾不上边,所以自己的阅读器里关于设计的网站其实非常少。webdesignerdepot.com上常常会出现些精妙的设计的罗列,很多时候我都很想翻译和转载,不过为了不让自己博客被太多莫名其妙的转载搅乱,所以还是要好好选择一下内容,并且翻译和以及个人理解都要做到位才行。比如这次看到的30+ Great Logos with Smart Concepts里的几个Loge确实是精妙之极。

/* ———-译文分割线———- */

几个月前,我们发表了一篇集合 “暗藏玄机的高明Logo” (Smart Logos with Hidden Symbolism),收到了很好的反响。(译注:这篇文章被国内第一时间转载,我记得还转到了cnbeta上)

今天,我们展示另一个不错的非常高明Logo的集合,并且这次,他们的意义更加显而易见。

这里精选的logo使用由字体和插图组成的交错的图形来构建公司的名称。

通常,当你仔细看一下这些logo,然后说:“Wow,多么的聪明!”

和往常一样,我们希望你在下面的评论区反馈,同时,如果你知道一些和这些类似的logo,我们非常欢迎你在下面的评论区增加它们的链接。

Read more... »

新的wordpress主题

自从尝试做了swordis主题之后,对wordpress的主题也有所认识。于是决定做一个自己的主题。并且这次和上次不同,是很认真地要做完的。名字还没有想好,但是目标很明确:

  • 没有图片的纯CSS主题。意味着线条和空间是首要设计元素。
  • 必须过XHTML1.1以及CSS3验证。CSS3阴影和变换等,由于有前缀,所以即使使用也会暂时注释掉。
  • 通过主题单元测试( Theme Unit Test )。这是一组严酷的内容兼容性检测。
  • 流体布局。右边栏,因为我调查下来,比起侧边栏在左面,似乎更多人习惯在右面。
  • 弹性em值。
  • 兼容所有主流浏览器,包括IE6在内。
  • 以及良好的可访问性和自适应性。

这些天从睁开眼睛开始我就在思考怎么把这个新的主题写好。主要考虑的是线条和颜色的虚实,实际上和篆刻类似,如何把自己其他方面的知识应用进去,就是这次的主要问题。

最大的挑战应该还是来自IE6的,因为这次不能写违规的hack,也不能用IE的私有属性。其实早该如此,IE6虽然仍旧苟延残喘,但是终究会被历史的洪流冲走的,我坚信这IE8成为下一个IE6的时代的来临。

前端工作类似一道工艺,相同的设计,工艺不同,价值也会天差地远

上次试作的主题,设计用了半天,HTML化也是半天,总共才一天时间,加上才第一次做主题,自然漏洞百出。虽然大的问题暂时也没有,但是代码级别差距很大。这次截然不同,纯CSS,没有设计直接写,但是style.css我已经写了2天有余,到现在也仅仅只是有一个框架。期间数易其稿,多次改动整个布局。

现在就是主题单元测试的内容,相当周到。有多层次的页面,有混合布局、超长、超短、甚至是无标题或者无内容的文章,也有超多分类、标签的极限测试,还有何种视频嵌入,总之是应有尽有。

Read more... »

WordPress主题swordis

终于下决心挤个时间出来做个wordpress主题。但是即使做出来估计自己也不会用的囧,因为我是bito主题的铁杆fans!

用了半天时间出了个PSD设计稿,又用了半天时间HTML化。还好设计的时候就着眼于简单,所以虽然搞了一天有些头晕,但还算比较快。基于wp的default,总的来说除了comment以外的CSS都重写了。

当然,因为刚刚写好的关系,背景图还么有整合,CSS也没有优化,并且还有众多的bug。不过没关系,作为自己第一个wp主题,慢慢琢磨就行了~

已知的问题有:

  • 虽然一开始写完测试环境是通过HTML5验证的,不过自己博客上的文章一加上就超多error。
  • 只用IE6和chrome开发的,所以其他浏览器情况完全未知,尽管我都尽可能的按标准来。
  • 颜色问题还值得推敲,排版也有很多要微调下。
  • 还有好几个小图标在绘制中,所以标签、分类、评论前面现在都还是空的。
  • 功能还不全,比如搜索、RSS,还没来得及赶上去。

现在先拿出来用几天,过些时候总结出一堆问题后就可以着手改进。目标版本0.5,基本实现功能完整~

美工生活的终结

有多久没有用过Photoshop了呢?一年,或许更久。然后我又开始回顾些过往的幼稚的记录,怀念些过往的莫名的热情,觉得那时自己的生活状态真是不错啊,呵呵。

感觉现在的人多少都会些PS,就好像是个男的都就会装电脑一样。技术变得普遍和廉价,老一辈牛人辈出的时代就这样过去了,就像经典论坛里的PS区,如今只剩下死气沉沉的过往的为数众多的参考资料,以及不时出现的新人的常见问题。贴数寥寥,好大一半还是挖坟贴…

翻遍了电脑,却居然只有一张切楼的图。原来自己把绝大部分的图像处理时间花在了恶搞同学那了:) 。回过头再来看看这张自己切的图,问题还真不少。首先是透视有点问题,那是因为移动的时候没有做透视形变。然后天空换掉了,大楼上的倒影却没有跟上。最后,虽然考虑到了手的反射,但是角度却有点问题。总的来说,虽然把自己的手给整进去了,一年多前的思考,还是不够周全。

Read more... »

化石鱼 金属效果和材质

原文由Adam Smith发表于advanced photoshop magazine,可以在这本杂志的第33期的第33页找到英文的原版。由于在这类文章里比起学习技术,更多的还是在学习思路,加之原文的冗长,所以和那篇切楼一样,我仍然只是写我理解的主要思路。原文标题《metal effects and textures》,即金属效果和材质。

此文我翻译后最早发布在这里
最终效果图:

Read more... »

切割大楼

有时也会翻译一些PS的非常赞的教材,但因为忙可能只是复述了大体的思路。切割大楼这篇文章是我早期翻译的可操作性很强的文章。现在也把这篇文章搬回博客。

原文出自Paul Hollingworth发表于第28期的《Advanced Photoshop-the magazine for Adobe Photoshop professionals》的同名文章。Advanced Photoshop是一本很不错的杂志(虽然现在这本杂志好像没以前好看了),现在也还可以从VeryCD上断断续续地下载到。虽然我很喜欢原文翻译,但是这篇原文实在太冗长了。最后只是复述了整个过程。

最终效果图:

Read more... »

50个经典再设计

最早在wefunction上看到的,自己翻译后,发到经典论坛上,现在就搬回自己的博客吧,再不搬回来就过时了~^_^。

01. AT&T Inc.
这是一个的微妙升级却造成了巨大差异的完美的例子。

Read more... »

FW字体修改

几乎从来不用fireworks,因为ps用久了太顺手。但是FW的一些功能还是很方便和实用,非常吸引人。比如字体的修改,在比如切图也比ps更加方便。
以前在参考了这里后,我也尝试着修改出自己想要的那种风格,刚毅而古板。

Read more... »