Lab of Chowky » effect http://lab.chowky.com 分享ＩＴ技術 Sun, 01 Jan 2012 06:13:57 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 [Flex] Flex Pixel Bender http://lab.chowky.com/2010/04/flex-flex-pixel-bender/?utm_source=rss&utm_medium=rss&utm_campaign=flex-flex-pixel-bender http://lab.chowky.com/2010/04/flex-flex-pixel-bender/#comments Thu, 15 Apr 2010 07:53:18 +0000 Chowky http://lab.chowky.com/?p=2001 Flex 4 是可以利用pixel bender 來做新的effect 了。

這位作者就做了這個effect 來demo 一下pixel bender 的能力。

比起flash 本身有的filter （blur filter, glow filter, shadow filter…)，這個當然會有很多新的玩法…. 記下來，可能遲一點會幫到你。

Source: http://www.artima.com/articles/bend_your_pixels.html

Share

]]> http://lab.chowky.com/2010/04/flex-flex-pixel-bender/feed/ 0 [jQuery] 折角/捲曲效果，peeling effect http://lab.chowky.com/2009/05/jquery-%e6%8a%98%e8%a7%92%e6%8d%b2%e6%9b%b2%e6%95%88%e6%9e%9c%ef%bc%8cpeeling-effect/?utm_source=rss&utm_medium=rss&utm_campaign=jquery-%25e6%258a%2598%25e8%25a7%2592%25e6%258d%25b2%25e6%259b%25b2%25e6%2595%2588%25e6%259e%259c%25ef%25bc%258cpeeling-effect http://lab.chowky.com/2009/05/jquery-%e6%8a%98%e8%a7%92%e6%8d%b2%e6%9b%b2%e6%95%88%e6%9e%9c%ef%bc%8cpeeling-effect/#comments Wed, 13 May 2009 17:35:41 +0000 Chowky http://lab.chowky.com/?p=462 chowky 認為這個效果可塑性非常大，用途很廣泛，而且是利用jquery造出來的~

效果不錯。

sample1

sample2

Demo: http://www.sohtanaka.com/web-design/examples/peeling-effect/

Source:http://www.sohtanaka.com/web-design/simple-page-peel-effect-with-jquery-css/

License: MIT

另外還有一個類似的，效果上的分別是要自己用mouse drag來掀起。

正常的，當然是用click to open。之不過，有很多時候玩玩亦無妨。

peeloff

Demo: http://www.elliottkember.com/sexy_curls.html

License: MIT

Share

]]> http://lab.chowky.com/2009/05/jquery-%e6%8a%98%e8%a7%92%e6%8d%b2%e6%9b%b2%e6%95%88%e6%9e%9c%ef%bc%8cpeeling-effect/feed/ 0 [jQuery] Fancy Thumbnail Hover Effect http://lab.chowky.com/2009/04/jquery-fancy-thumbnail-hover-effect/?utm_source=rss&utm_medium=rss&utm_campaign=jquery-fancy-thumbnail-hover-effect http://lab.chowky.com/2009/04/jquery-fancy-thumbnail-hover-effect/#comments Fri, 24 Apr 2009 14:53:47 +0000 Chowky http://lab.chowky.com/?p=225 chowky 向來覺得interface design 一定要容易令user 跟到，simple is enough，而jquery 有很多不過user community 所設計的不過effect，這就是一個很好的例子，簡單，直接。
簡單的一個hover effect，放大，使user 容易跟到。這就做到剛剛好，足夠就可以了，不用太多。
jquery_thumbnail

License: License Free
Source: http://www.sohtanaka.com/web-design/fancy-thumbnail-hover-effect-w-jquery/
Demo: http://www.sohtanaka.com/web-design/examples/image-zoom/

Share

]]> http://lab.chowky.com/2009/04/jquery-fancy-thumbnail-hover-effect/feed/ 0 Flex介面effect，Flex Interface Guide (FIG): The Callout component http://lab.chowky.com/2009/04/flex%e4%bb%8b%e9%9d%a2effect%ef%bc%8cflex-interface-guide-fig-the-callout-component/?utm_source=rss&utm_medium=rss&utm_campaign=flex%25e4%25bb%258b%25e9%259d%25a2effect%25ef%25bc%258cflex-interface-guide-fig-the-callout-component http://lab.chowky.com/2009/04/flex%e4%bb%8b%e9%9d%a2effect%ef%bc%8cflex-interface-guide-fig-the-callout-component/#comments Tue, 21 Apr 2009 17:43:34 +0000 Chowky http://lab.chowky.com/?p=159 Source: http://www.adobe.com/devnet/flex/samples/fig_callout/]]> 這一個sample 很適合用於地區上的座標/記號，因為這個是用了custom icon 作為記號的，所以加左map 上作記號要最好的~

chowky 認為這個ui 真的不錯，把它改為tooltip 都可以，呢個ui 幾簡單直接，沒有太多花巧的元素，只要改一改css就可以了，chowky個人喜愛簡單直接的ui，太花巧反而user experience 會更差。

有時間再看看code ，先看效果吧!

Get Adobe Flash player

Source: http://www.adobe.com/devnet/flex/samples/fig_callout/

Share

]]> http://lab.chowky.com/2009/04/flex%e4%bb%8b%e9%9d%a2effect%ef%bc%8cflex-interface-guide-fig-the-callout-component/feed/ 0