跳到主要內容

發表文章

目前顯示的是 8月, 2010的文章

用jQuery做的滿版slideshow

話說某天大老闆靈機一動說想要首頁如同samsXng的滿版slideshow效果, 該公司是用FLASH開發, 在AS下f command 或是在 embed 屬性中加入   allowFullScreen="true" , 簡單的就是在html width屬性設定100% 為了顧及公司在Alexa的排名與SEO, 盡量避免使用FLASH作為首頁, 所以必須要用jQuery技術, 在最短的時間內要做出來, Fullscreen的滿版程式難度不高, 可以參考的plugin有 Supersized , 很有名的galleriffic也寫了一個Fullscreen的slideshow但目前不公開語法也不賣錢, 不知道是啥原因, 我該如何寫出這個高級班的效果, 讓我苦惱了幾天。 最後還是要感謝jQuery官網的API文件, 所有的問題回歸原點才會有正確的邏輯思維, 最後我參考了lof的免費資源, 順利的完成滿版slideshow, 但是還不夠完整, 因為無法做到每張圖片的preload, 這樣會拖垮網站速度, 希望有空可以修改, 寫成更完整的plugin. Demo: http://cindy8.myweb.hinet.net/demo_full/index3.html  因為hinet堪入了廣告會造成些許不正常, 圖片為MSI版權所有

好用的LAVALAMP MENU

現在用jQuery 也可以設計出Lavalamp Menu, Lava lamp的中文是 熔岩燈,應該滿難會意的, 簡單的說就是動態的滑動Menu的背景, 可以製造炫光效果或是其他的動態效果 5kb 的plugin和簡單的語法, 如下: 參考原文: http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/ 我運用了Lavalamp的效果並且做了些修正加入Drop Menu的效果, 變成更加完美又易於使用的選單: My Demo Site here: http://cindy8.myweb.hinet.net/demo_lava/lavalamp.html (Please don't copy , it's MSI project now.請勿拷貝因為這是給公司的提案):

3年前做的電子商城周年慶活動, 一個人企劃,設計,寫FLASH AS, 還兼抽獎, 我是神~

這個遊戲雖然簡單, 但是點出了公司當時的主要產品, 而且都有防呆機制, 就是要讓消費者玩得開心, 註冊的很高興! http://cindy8.myweb.hinet.net/demo_anni/

具有軟體風格的網頁介面

從手機與作業系統的操作介面, 經常可見玻璃風格, 放在網路介面上也是相當適合, 近期設計的作品如下: http://www.msi.com/index.php?func=compare

最近設計的一組icon..太有APPLE風格被打槍了

設計除毛網站

前陣子在友人的拜託下, 設計了一個除毛網站, 很微型的網站, 卻擁有創業夫妻的夢想, 他們對自創的品牌很有想法, 構思的藍圖在我巧手下完成, 對方感激不已, 讓我非常有成就感, 很驕傲自己是個網頁設計師, 真希望這樣的經驗也可以複製在工作上。 http://www.wingsfly.com.tw

DIY賀卡活動

這個活動可說是我一肩挑起, 從企劃發想, 流程規畫, 頁面設計與執行, 過程很辛苦, 卻收穫很多, 重點是學會如何要贈品, 雖然是公司的活動, 但是贈品還是需要有單位願意投資, 企劃案該如何說服對方是很重要的關鍵, 尤其這是個品牌曝光的活動, 如何將產品點出來, 會造成哪些效益, 是很重要的課題, 竭盡心力做的活動, 果然有個好成績。 活動首頁DEMO: http://cindy8.myweb.hinet.net/demo_05xmas/ecard_main.htm

FLASH賓果遊戲機

因應新年活動, 設計了一個網站可以玩賓果機, 拉中同樣的產品形成一條線就有機會參加抽獎, 不過因應企畫的要求,這台賓果機的命中率很高,閉著眼睛都可以成功, 正所謂志在參加不在得獎。 *負責工作: 設計、切版、CSS、FLASH GAME 編寫 活動首頁:cindy8.myweb.hinet.net/demo_08newyear/index.html 遊戲頁:cindy8.myweb.hinet.net/demo_08newyear/game.html

09年設計退件作品

09年做了幾個官方網站的改版提案, 不過都被退件, 在這裡與大家分享, 個人覺得怎麼看都比現在的官網好看, 不過設計的工作難度就是在如何猜到老闆的想法, 以及如何呈現大家的想法達成共識。

電子報設計

今年KPI數字上最漂亮的應該是電子報的「開啟率」&「點閱率」有大幅度的成長, 數字當然是個機密, 只能透漏比一般標準高。 原來的電子報版面如下方右側圖片, 一個大主圖佔了視野最好的位置, 在多的新產品也只能打一樣, 吸引到的是小眾, 往往賺了開啟率卻輸了點閱率, 所以我做了新的設計如下方左側圖片, 主圖的設計手法稱為 cover flow,  雖是靜態的效果也很好, user第一眼看到的訊息不僅僅是單一產品, 也有企業的品牌榮耀或是活動, 減低了商業味道, 介面顯的更加友善 新版 *三張主圖 *兩個新產品 *兩張活動圖片 *更多圖片更少文字 舊版