<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Cooper Wang Web Design &#187; Work</title>
	<atom:link href="http://kilocooper.com/tag/work/feed/" rel="self" type="application/rss+xml" />
	<link>http://kilocooper.com</link>
	<description>攝影,平面設計,網頁設計,網站建置,blog設計</description>
	<lastBuildDate>Thu, 26 Apr 2012 01:46:44 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.2</generator>
		<item>
		<title>-無敵BESTA 音樂城 / APP 介面設計-</title>
		<link>http://kilocooper.com/2012/02/21/besta/</link>
		<comments>http://kilocooper.com/2012/02/21/besta/#comments</comments>
		<pubDate>Mon, 20 Feb 2012 17:15:56 +0000</pubDate>
		<dc:creator>Kilocooper</dc:creator>
				<category><![CDATA[網頁設計、分享、記錄]]></category>
		<category><![CDATA[APP]]></category>
		<category><![CDATA[BESTA]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[ui]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Work]]></category>
		<category><![CDATA[介面設計]]></category>
		<category><![CDATA[無敵]]></category>
		<category><![CDATA[音樂城]]></category>

		<guid isPermaLink="false">http://kilocooper.com/?p=875</guid>
		<description><![CDATA[哈，無意間看到自己之前做過的版型設計，完全忘記自己有設計過app的介面了 (O_o)??

風格則是綜合了案方要求的豐富感，多彩，讓使用者願意、想要、使用網站的介面，另一方面，也製作了... ]]></description>
			<content:encoded><![CDATA[
<a href="http://kilocooper.com/wp-content/gallery/web-design/besta_png.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/538__658x_besta_png.jpg" alt="BESTA 無敵CD網路音樂城 網站設計" title="BESTA 無敵CD網路音樂城 網站設計" />
</a>

<p>哈，無意間看到自己之前做過的版型設計，完全忘記自己有設計過app的介面了 <img src='http://kilocooper.com/wp-includes/images/smilies/smiles07.gif' alt='(O_o)??' class='wp-smiley' /> </p>
<p>風格則是綜合了案方要求的豐富感，多彩，讓使用者願意、想要、使用網站的介面，另一方面，也製作了電子書的 app 介面樣稿，雖然，這案子到最後沒有下文，但也是個不錯的經驗，話說，那時候要設計這個版型我可想了很久 <img src='http://kilocooper.com/wp-includes/images/smilies/smiles10.gif' alt='( ▔___▔)y-～' class='wp-smiley' /> <span id="more-875"></span></p>

<a href="http://kilocooper.com/wp-content/gallery/web-design/besta_600x720_b.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/537__600x_besta_600x720_b.jpg" alt="ipad設計介面 提案參考" title="ipad設計介面 提案參考" />
</a>

<p>app介面的設計，則延續網站多彩的設計，但是在按鈕的地方則盡量簡化，不干擾使用者的視線</p>
<p>ps.現在看到以前的作品，會覺得還有些細節需要考慮到，在此記錄一下：網頁唱片的小圖可以用cd殼的css png cover，app的部份，文字間距可以再調整，頁面元素也可以在根據app內容做刪減，例如，時間應該不是這個app重要的地方XD~</p>
]]></content:encoded>
			<wfw:commentRss>http://kilocooper.com/2012/02/21/besta/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>-台酒生技 麻油雞麵、花雕雞麵 網站設計-</title>
		<link>http://kilocooper.com/2012/02/09/noodle/</link>
		<comments>http://kilocooper.com/2012/02/09/noodle/#comments</comments>
		<pubDate>Thu, 09 Feb 2012 02:04:30 +0000</pubDate>
		<dc:creator>Kilocooper</dc:creator>
				<category><![CDATA[網頁設計、分享、記錄]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Work]]></category>
		<category><![CDATA[台酒生技]]></category>
		<category><![CDATA[花雕雞麵]]></category>
		<category><![CDATA[麻油雞麵]]></category>

		<guid isPermaLink="false">http://kilocooper.com/?p=860</guid>
		<description><![CDATA[此網站主要為台酒生技的新產品 麻油雞麵/花雕雞麵做官方的宣傳網站，希望營造熱呼呼的感覺～ps.這真的很好吃，大力推薦，可以買來吃吃... ]]></description>
			<content:encoded><![CDATA[
<a href="http://kilocooper.com/wp-content/gallery/web-design/_3.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/534__658x__3.jpg" alt="台酒 麻油雞麵/花雕雞麵" title="台酒 麻油雞麵/花雕雞麵" />
</a>

<p>此網站主要為台酒生技的新產品 麻油雞麵/花雕雞麵做官方的宣傳網站，希望營造熱呼呼的感覺～ps.這真的很好吃，大力推薦，可以買來吃吃看 <img src='http://kilocooper.com/wp-includes/images/smilies/smiles06.gif' alt='╮(╯◇╰)╭' class='wp-smiley' />  ~</p>
<p><span id="more-860"></span></p>

<a href="http://kilocooper.com/wp-content/gallery/web-design/_3_sub1.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/535__658x__3_sub1.jpg" alt="台酒 麻油雞麵/花雕雞麵" title="台酒 麻油雞麵/花雕雞麵" />
</a>

<p>不過，這次的網站在設計上有些缺陷，在此也記錄一下，往後遇到此類問題，要有更好的解法。</p>
<p>缺點：</p>
<p>1.一開始設定的版面內容有限，導致新增內容時頁面呈現不好延長，一旦新增消息資訊過多，會有出現雙捲軸問題。</p>
<p>2.複合指定了Flash、div，以及fancybox的階層關係，讓頁面的延展受限更大。</p>
<p>3.公家機關會一直追加設計需求，頁面元素過多，再加上一開始的頁面設定有限，而有視覺混亂的情形，這點若是沒有頁面固定的限制，則可以避免。</p>
<p><a href="http://biotech.ttl.com.tw/istore_noodles/" target="_blank">-WEBSITE-</a></p>
]]></content:encoded>
			<wfw:commentRss>http://kilocooper.com/2012/02/09/noodle/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>-民國國民曆101 網站設計-</title>
		<link>http://kilocooper.com/2012/02/09/calendar101/</link>
		<comments>http://kilocooper.com/2012/02/09/calendar101/#comments</comments>
		<pubDate>Thu, 09 Feb 2012 01:39:33 +0000</pubDate>
		<dc:creator>Kilocooper</dc:creator>
				<category><![CDATA[網頁設計、分享、記錄]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[Work]]></category>
		<category><![CDATA[中華民國]]></category>
		<category><![CDATA[國民曆101年]]></category>
		<category><![CDATA[網站設計]]></category>

		<guid isPermaLink="false">http://kilocooper.com/?p=856</guid>
		<description><![CDATA[民國國民曆101年版，政府機關的案子，主要以水墨畫方式呈現，歡迎頁面為Flash有多花了點心思設計，但內頁部分的設計就比較一般... ]]></description>
			<content:encoded><![CDATA[
<a href="http://kilocooper.com/wp-content/gallery/web-design/cal_100_01.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/532__658x_cal_100_01.jpg" alt="cal_100_01" title="cal_100_01" />
</a>

<p>民國國民曆101年版，政府機關的案子，主要以水墨畫方式呈現，歡迎頁面為Flash有多花了點心思設計，但內頁部分的設計就比較一般了  <img src='http://kilocooper.com/wp-includes/images/smilies/smiles01.gif' alt='≧◇≦' class='wp-smiley' /> </p>
<p><span id="more-856"></span></p>

<a href="http://kilocooper.com/wp-content/gallery/web-design/cal_100_02.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/533__658x_cal_100_02.jpg" alt="cal_100_02" title="cal_100_02" />
</a>

<p><a href="http://calendar101.moi.gov.tw/" target="_blank">-WEBSITE-</a></p>
]]></content:encoded>
			<wfw:commentRss>http://kilocooper.com/2012/02/09/calendar101/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>-iPARK 公司建案網站 （急速完成）-</title>
		<link>http://kilocooper.com/2011/09/18/ipark-fast/</link>
		<comments>http://kilocooper.com/2011/09/18/ipark-fast/#comments</comments>
		<pubDate>Sun, 18 Sep 2011 07:04:09 +0000</pubDate>
		<dc:creator>Kilocooper</dc:creator>
				<category><![CDATA[網頁設計、分享、記錄]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Work]]></category>

		<guid isPermaLink="false">http://kilocooper.com/?p=823</guid>
		<description><![CDATA[這個網站比較特別的是，需要快速完成(給特定客戶看的)，所以設計頁面一天，後台及前台css架構一天，資料整理上架一天，共三天完成。

頁面中有很多的區塊其實都是用最簡單的方式構成... ]]></description>
			<content:encoded><![CDATA[
<a href="http://kilocooper.com/wp-content/gallery/web-design/ipark.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/524__658x_ipark.jpg" alt="ipark" title="ipark" />
</a>

<p>這個網站比較特別的是，需要快速完成(給特定客戶看的)，所以設計頁面一天，後台及前台css架構一天，資料整理上架一天，共三天完成。</p>
<p>頁面中有很多的區塊其實都是用最簡單的方式構成，哈，也沒有多的時間可以想要怎麼修改啦XD~</p>
<p>總之，也是個很特別的經驗</p>
<p><a href="http://ipark.kc1982.org/" target="_blank">-WEBSITE-</a></p>
]]></content:encoded>
			<wfw:commentRss>http://kilocooper.com/2011/09/18/ipark-fast/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>-檜逸 檜木逸品/精油/高山茶-</title>
		<link>http://kilocooper.com/2011/09/13/hino/</link>
		<comments>http://kilocooper.com/2011/09/13/hino/#comments</comments>
		<pubDate>Tue, 13 Sep 2011 05:55:21 +0000</pubDate>
		<dc:creator>Kilocooper</dc:creator>
				<category><![CDATA[網頁設計、分享、記錄]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Work]]></category>

		<guid isPermaLink="false">http://kilocooper.com/?p=818</guid>
		<description><![CDATA[功能：以Wordpress製作，商品上架功能，繁簡語系切換

設計：樸素中帶著高雅，且有檜木芳香的氛... ]]></description>
			<content:encoded><![CDATA[
<a href="http://kilocooper.com/wp-content/gallery/web-design/hino_01.png" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/520__658x_hino_01.png" alt="hino_01" title="hino_01" />
</a>

<p>功能：以Wordpress製作，商品上架功能，繁簡語系切換</p>
<p>設計：樸素中帶著高雅，且有檜木芳香的氛圍</p>
<p><a href="http://hino.kc1982.org/" target="_blank">-WEBSITE-</a></p>
]]></content:encoded>
			<wfw:commentRss>http://kilocooper.com/2011/09/13/hino/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>-宿寫蘭陽-</title>
		<link>http://kilocooper.com/2011/09/13/i-yiland/</link>
		<comments>http://kilocooper.com/2011/09/13/i-yiland/#comments</comments>
		<pubDate>Tue, 13 Sep 2011 05:47:25 +0000</pubDate>
		<dc:creator>Kilocooper</dc:creator>
				<category><![CDATA[網頁設計、分享、記錄]]></category>
		<category><![CDATA[i-yiland]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Work]]></category>

		<guid isPermaLink="false">http://kilocooper.com/?p=814</guid>
		<description><![CDATA[宿寫蘭陽比較特別的地方是...客戶要求兩層的Flash，所以設計上把歡迎頁面設定為可以四季變換的Flash，搭上輕快的音樂，表現活潑快樂的訊息。首頁的Flash則把重心放在幾個重點店家，或是景... ]]></description>
			<content:encoded><![CDATA[
<a href="http://kilocooper.com/wp-content/gallery/web-design/yiland_01.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/521__658x_yiland_01.jpg" alt="yiland_01" title="yiland_01" />
</a>

<p>宿寫蘭陽比較特別的地方是&#8230;客戶要求兩層的Flash，所以設計上把歡迎頁面設定為可以四季變換的Flash，搭上輕快的音樂，表現活潑快樂的訊息。</p>
<p><span id="more-814"></span>
<a href="http://kilocooper.com/wp-content/gallery/web-design/yiland_02.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/522__658x_yiland_02.jpg" alt="yiland_02" title="yiland_02" />
</a>
</p>
<p>首頁的Flash則把重心放在幾個重點店家，或是景點，讓整體畫面看起來稍微活潑一些。</p>
<p>內頁資訊複雜，且需要帶資料後端，所以還是使用一般頁面製作。</p>
<p><a href="http://www.i-yiland.com.tw" target="_blank">-WEBSITE-</a></p>
]]></content:encoded>
			<wfw:commentRss>http://kilocooper.com/2011/09/13/i-yiland/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>-嵐海LED 版型設計-</title>
		<link>http://kilocooper.com/2010/01/28/lanhai/</link>
		<comments>http://kilocooper.com/2010/01/28/lanhai/#comments</comments>
		<pubDate>Thu, 28 Jan 2010 09:10:04 +0000</pubDate>
		<dc:creator>Kilocooper</dc:creator>
				<category><![CDATA[網頁設計、分享、記錄]]></category>
		<category><![CDATA[LanHai]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Work]]></category>

		<guid isPermaLink="false">http://kilocooper.com/?p=644</guid>
		<description><![CDATA[設計理念：希望表達環保，簡單，有設計感... ]]></description>
			<content:encoded><![CDATA[
<a href="http://kilocooper.com/wp-content/gallery/web-design/lanhai.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/465__658x_lanhai.jpg" alt="lanhai" title="lanhai" />
</a>

<p>設計理念：希望表達環保，簡單，有設計感。</p>
]]></content:encoded>
			<wfw:commentRss>http://kilocooper.com/2010/01/28/lanhai/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>-鴻毅居士 筆墨話開好運來 版型設計-</title>
		<link>http://kilocooper.com/2010/01/28/hongyi/</link>
		<comments>http://kilocooper.com/2010/01/28/hongyi/#comments</comments>
		<pubDate>Thu, 28 Jan 2010 09:05:13 +0000</pubDate>
		<dc:creator>Kilocooper</dc:creator>
				<category><![CDATA[網頁設計、分享、記錄]]></category>
		<category><![CDATA[Chinese Brush Painting]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Work]]></category>

		<guid isPermaLink="false">http://kilocooper.com/?p=640</guid>
		<description><![CDATA[設計要求：版面與書畫融為一體呈現，風格顏色與書畫可配套呈現得宜。
設計構想：歡迎頁面以Flash呈現，構想蝴蝶都誤以為是真花，凸顯其國畫畫工精湛。並符合其要求達到融為一體呈現... ]]></description>
			<content:encoded><![CDATA[<p>
<a href="http://kilocooper.com/wp-content/gallery/web-design/welcome.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/464__658x_welcome.jpg" alt="welcome" title="welcome" />
</a>
<br />
設計要求：版面與書畫融為一體呈現，風格顏色與書畫可配套呈現得宜。<br />
<span id="more-640"></span>
<a href="http://kilocooper.com/wp-content/gallery/web-design/intro.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/463__658x_intro.jpg" alt="intro" title="intro" />
</a>
<br />
設計構想：歡迎頁面以Flash呈現，構想蝴蝶都誤以為是真花，凸顯其國畫畫工精湛。並符合其要求達到融為一體呈現。</p>
<p>ps.辦公室好悶～ <img src='http://kilocooper.com/wp-includes/images/smilies/smiles08.gif' alt='ＺＺＺｚｚｚ' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://kilocooper.com/2010/01/28/hongyi/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>-幼娟手作工房 版型設計-</title>
		<link>http://kilocooper.com/2010/01/14/handmaker/</link>
		<comments>http://kilocooper.com/2010/01/14/handmaker/#comments</comments>
		<pubDate>Wed, 13 Jan 2010 16:47:35 +0000</pubDate>
		<dc:creator>Kilocooper</dc:creator>
				<category><![CDATA[網頁設計、分享、記錄]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Work]]></category>
		<category><![CDATA[yc-workshop]]></category>

		<guid isPermaLink="false">http://kilocooper.com/?p=622</guid>
		<description><![CDATA[設計構想：因為目標客群的不同，而希望表現出現代毛織品時尚的印象。

手法：用一些陰影突出每個區塊不同的層次，導航列則使用黑色強調。Blog樣式，力求資訊的清晰，讓使用者一目瞭然... ]]></description>
			<content:encoded><![CDATA[
<a href="http://kilocooper.com/wp-content/gallery/web-design/handmaker.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/462__658x_handmaker.jpg" alt="handmaker" title="handmaker" />
</a>

<p>替我阿娘的朋友設計的樣版，不過他選擇了另一個~"~，真是心酸啦&#8230;</p>
<p><span id="more-622"></span>設計構想：因為目標客群的不同，而希望表現出現代毛織品時尚的印象。</p>
<p>手法：用一些陰影突出每個區塊不同的層次，導航列則使用黑色強調。Blog樣式，力求資訊的清晰，讓使用者一目瞭然。</p>
]]></content:encoded>
			<wfw:commentRss>http://kilocooper.com/2010/01/14/handmaker/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>-野村建設 網頁設計版型企劃-</title>
		<link>http://kilocooper.com/2010/01/11/nomura/</link>
		<comments>http://kilocooper.com/2010/01/11/nomura/#comments</comments>
		<pubDate>Mon, 11 Jan 2010 14:26:08 +0000</pubDate>
		<dc:creator>Kilocooper</dc:creator>
				<category><![CDATA[網頁設計、分享、記錄]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[nomura]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Work]]></category>

		<guid isPermaLink="false">http://kilocooper.com/?p=614</guid>
		<description><![CDATA[設計概念：使用安藤忠雄擅長的清水模為背景素材，

表達日式風格，並在Flash頁面加入手寫書法加強其感覺。

網站架構：先以一歡迎頁面，整合野村及冠華兩家，使用者可以依需求，選擇... ]]></description>
			<content:encoded><![CDATA[
<a href="http://kilocooper.com/wp-content/gallery/web-design/nomura_all.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/459__658x_nomura_all.jpg" alt="nomura_all" title="nomura_all" />
</a>

<p>↑圖為進入整合首頁版型，為Flash頁面，圖中文字及花紋都會以淡入方式進入場景。</p>
<p>設計概念：使用安藤忠雄擅長的清水模為背景素材，表達客戶希望的日式風格以及精品建築理念，並在Flash頁面加入手寫書法加強感覺。</p>
<p>網站架構：先以一歡迎頁面，整合野村及冠華兩家，使用者可以依需求，選擇進入的網站，爾後在分作兩個不同性質的網站。</p>
<p><span id="more-614"></span>
<a href="http://kilocooper.com/wp-content/gallery/web-design/nomura_all_hover.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/460__658x_nomura_all_hover.jpg" alt="nomura_all_hover" title="nomura_all_hover" />
</a>
</p>
<p>↑圖為滑鼠移到目標上的效果。</p>

<a href="http://kilocooper.com/wp-content/gallery/web-design/nomura-_flash_01.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/457__658x_nomura-_flash_01.jpg" alt="nomura-_flash_01" title="nomura-_flash_01" />
</a>

<p>↑圖為野村Flash歡迎頁面，文字會伴隨著櫻花飄落移動漸入到場景中。</p>

<a href="http://kilocooper.com/wp-content/gallery/web-design/nomura.jpg" title=""  >
	<img class="ngg-singlepic" src="http://kilocooper.com/wp-content/gallery/cache/458__658x_nomura.jpg" alt="nomura" title="nomura" />
</a>

<p>↑圖為進入網站後內頁樣板。<br />
（若為Flash網站，則點選或是滑鼠滑入目標，都會有相對應的動畫效果，Html則無。）</p>
<p>後記：開始要研擬一套合適的提案以及分析客戶需求方式，讓後續修正幅度減少。就從nomura開始吧。(Flash的靜態表示還是有待加強啊~ <img src='http://kilocooper.com/wp-includes/images/smilies/smiles05.gif' alt='／︿＼' class='wp-smiley' />  )</p>
<p>附記：作業中網址<a href="http://relaxhome.kc1982.org/home/">http://relaxhome.kc1982.org/home/</a></p>
]]></content:encoded>
			<wfw:commentRss>http://kilocooper.com/2010/01/11/nomura/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

