天天新動態：這真是我們最近做的最有意思的項目了！

很多人會把工作當作任務，然后把自己私下做的練習才當作進步！其實這樣是非常不明智的，很有可能最后什么都沒做好！

其實我一直秉承一個理念，就是自己個人的進步一定要與平時做的項目綁定在一起，這樣就可以一舉多得，自己進步了，項目做好了，客戶變多了....我從出來組建團隊之后，也是讓我們所有成員和項目一起進步，比如我們嘗試的像素風格人物：

差異化的ui視覺風格：

(資料圖片僅供參考)

再比如一些差異化的3d小場景：

這些都是之前沒有嘗試過了！最近，我們工作室又和項目一起成長了，第一次第一次用網頁結合3d以及3d動效，和大家來簡單分享一下吧！

項目背景我們做的是一個網頁項目，主要是給用戶來進行抽獎的，首頁上會有一個抽獎機，類似于雙色球一樣的東西，基于這樣的一個背景，我們開始進行了創意的構想。

創意來源

我們順著項目背景開始構思抽獎機的樣子，嘗試了非常多的方案，我們可以看下草圖：

其實有很多我們比較鐘意的，但是后來和需求方碰想法的時候，他們是想稍微簡單一點，不要太卡通可愛！

為什么呢？原因就是這個網頁是用戶會經常進來使用的，如果我們做的太復雜或者太卡通，可能第一次進來感覺還可以，但是長時間的使用，可能會有一點審美疲勞，所以還是希望能夠稍微簡潔一點！于是我們最后就把所有多余的元素都去掉了，后面大家可以看到，我們先繼續往下看！

風格設定

其實最開始的時候，客戶預想的是插畫風格：

但是我們覺得不太行，為什么呢，因為客戶想讓抽獎的用戶有點真實感，沉浸在抽獎的感覺當中，那如何才能讓場景更加真實呢？無非就是從二位的插畫風格，變成三維的立體風格。于是，和客戶商議，卻終確定了我們想走的方向，我想這也算是設計的一種驅動力吧！只要有理有據，客戶是一定會支持的！于是我們最終做出來的首頁靜態效果是這樣的：

用一個相對真實的抽獎機和網頁進行融合，這真的算是我們的一次突破了！

關于顏色

其實關于顏色這一塊，最開始并不是純紅色的，我們做了一些更好看的顏色，比如紅藍漸變這些，我們可以看下最開始的球體質感和彈窗樣式：

都是采用的藍紅對比，單從色相上來講，其實還是比較好看的，但為什么有變回了那么正的紅色呢？還是那個關鍵詞——真實感，因為本身一些抽獎、彩票、雙色球之類的：

基本都是紅色的，為了讓用戶更有真實感，于是我們就把顏色變回了簡單的正紅色，才有了后面的這個配色：

看久了之后，發現也還是耐看的！關于動效

為了更好的吸引用戶，我們還做了3d動效，用戶一進到網頁，就可以看到球體在玻璃缸內轉動，效果如下：

用到了動力學、風、剛體等知識點，雖然知識點不多，但我們也是花了一些時間去研究的！在動效實現的時候，還是比較麻煩的，需要和開發進行配合，進行非常多的動效切圖，不然如果動效時間過長，gif圖的大小就太大了，一般我們會把每一個gif圖大小控制在2m以內，這樣才會不影響加載。還記得當時切了非常多的動效切片，比如球體的循壞動畫：

球體掉落的動畫：

球體停止轉動的動畫：

把這些全部都給開發后，開發再進行二次拼接，最后實現出理想的效果。體驗方面

在體驗方面也會有一些小小的思考，都是相對比較細節的地方，比如，最開始我們的按鈕是放在抽獎機上面的：

但后來發現按鈕放在機子上還是有點小，不方便點擊，所以就把按鈕放在了抽獎機下面，更方便點擊：

再比如，對于倒計時這一塊，最開始只是一串數字：

后來為了讓用戶更加有倒計時的緊迫感，我們把它設計成了更像倒計時的樣式：

讓用戶體驗感更好一些。對于體驗，我認為可大可小，大一點的就是整體的交互方式、視覺風格等等，而小一點就是這些非常細節的地方，不論是大是小，我們設計師都可以用心的去感受去設計，讓我們的價值和用戶的爽感一起成長起來！總結好啦，以上就是這個項目的一些總結感想了，還有一些頁面、彈窗的延展，等后面項目展示的時候在和大家分享吧！

就像開頭說的那樣，接項目不是關鍵，關鍵是我們自身能夠跟著項目一起成長多少，這才是我們需要重點關注的！加油啊，兄弟們！

如果以上賬號，你都關注了，那應該是每天哐哐長心了！

關鍵詞： 于是我們 我們可以看 視覺風格