Web App 設計版面+切版
P
O
R
T
F
O
L
I
O
作 品 集
網頁視覺設計+切版
網頁視覺設計+切版
使用載體 : iPad平板 ( 1024*768 ) / 使用CSS逐格動畫
【轉蛋抽獎互動網頁實際上線後遇到的狀況與改良】
(A) 動畫秒數太長 : 當要抽獎的人很多時，動畫秒數太長會造成排隊等待的現象，所以後續如果是有許多人數要抽獎時，秒數都縮短。
(B) 會有同1人要點擊轉蛋抽出多個獎項的時候，例如消費滿N元可抽一次獎，有人大手筆消費，於是可抽10次，這時候客人按10次抽獎會很消耗時間，所以製作「新增+」按鈕放在畫面角落，讓工作人員可以設定抽獎數量。
(C) 製作圖片模板與設計教學，讓客戶端設計師可依照活動主視覺自行設計轉蛋抽獎視覺。
(D) 後台上傳獎項數量可使用.txt記事本上傳，先在.txt記事本輸入內容，
格式如:
1,冰淇淋折價券(獎項名),300(數量)
2,鳳梨酥乙盒,50
3,XX飲品第2件半價,100
卡牌抽獎
公司有在做活動抽獎互動網頁，所以空閒時會想一些簡單互動的抽獎玩法，提供給客戶更多選擇，於是想到發牌效果，讓人抽其中一張牌來看是否有中獎。使用css動畫屬性來製作發牌動畫。
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+經銷商頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
網頁設計主視覺+切版(首頁+產品頁)
