這真是我們最近做的最有意思的項目了！

很多人會把工作當(dāng)作任務(wù)，然后把自己私下做的練習(xí)才當(dāng)作進(jìn)步！其實這樣是非常不明智的，很有可能最后什么都沒做好！

其實我一直秉承一個理念，就是自己個人的進(jìn)步一定要與平時做的項目綁定在一起，這樣就可以一舉多得，自己進(jìn)步了，項目做好了，客戶變多了....

我從出來組建團(tuán)隊之后，也是讓我們所有成員和項目一起進(jìn)步，比如我們嘗試的像素風(fēng)格人物：

差異化的ui視覺風(fēng)格：

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

這些都是之前沒有嘗試過了！

最近，我們工作室又和項目一起成長了，第一次第一次用網(wǎng)頁結(jié)合3d以及3d動效，和大家來簡單分享一下吧！

 項目背景 

我們做的是一個網(wǎng)頁項目，主要是給用戶來進(jìn)行抽獎的，首頁上會有一個抽獎機(jī)，類似于雙色球一樣的東西，基于這樣的一個背景，我們開始進(jìn)行了創(chuàng)意的構(gòu)想。

創(chuàng)意來源 

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

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

為什么呢？

原因就是這個網(wǎng)頁是用戶會經(jīng)常進(jìn)來使用的，如果我們做的太復(fù)雜或者太卡通，可能第一次進(jìn)來感覺還可以，但是長時間的使用，可能會有一點審美疲勞，所以還是希望能夠稍微簡潔一點！

于是我們最后就把所有多余的元素都去掉了，后面大家可以看到，我們先繼續(xù)往下看！

風(fēng)格設(shè)定

其實最開始的時候，客戶預(yù)想的是插畫風(fēng)格：

但是我們覺得不太行，為什么呢，因為客戶想讓抽獎的用戶有點真實感，沉浸在抽獎的感覺當(dāng)中，那如何才能讓場景更加真實呢？無非就是從二位的插畫風(fēng)格，變成三維的立體風(fēng)格。

于是，和客戶商議，卻終確定了我們想走的方向，我想這也算是設(shè)計的一種驅(qū)動力吧！只要有理有據(jù)，客戶是一定會支持的！

于是我們最終做出來的首頁靜態(tài)效果是這樣的：

用一個相對真實的抽獎機(jī)和網(wǎng)頁進(jìn)行融合，這真的算是我們的一次突破了！

關(guān)于顏色

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

都是采用的藍(lán)紅對比，單從色相上來講，其實還是比較好看的，但為什么有變回了那么正的紅色呢？

還是那個關(guān)鍵詞——真實感，因為本身一些抽獎、彩票、雙色球之類的：

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

看久了之后，發(fā)現(xiàn)也還是耐看的！

關(guān)于動效

為了更好的吸引用戶，我們還做了3d動效，用戶一進(jìn)到網(wǎng)頁，就可以看到球體在玻璃缸內(nèi)轉(zhuǎn)動，效果如下：

用到了動力學(xué)、風(fēng)、剛體等知識點，雖然知識點不多，但我們也是花了一些時間去研究的！

在動效實現(xiàn)的時候，還是比較麻煩的，需要和開發(fā)進(jìn)行配合，進(jìn)行非常多的動效切圖，不然如果動效時間過長，gif圖的大小就太大了，一般我們會把每一個gif圖大小控制在2m以內(nèi)，這樣才會不影響加載。

還記得當(dāng)時切了非常多的動效切片，比如球體的循壞動畫：

球體掉落的動畫：

球體停止轉(zhuǎn)動的動畫：

把這些全部都給開發(fā)后，開發(fā)再進(jìn)行二次拼接，最后實現(xiàn)出理想的效果。

體驗方面

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

但后來發(fā)現(xiàn)按鈕放在機(jī)子上還是有點小，不方便點擊，所以就把按鈕放在了抽獎機(jī)下面，更方便點擊：

再比如，對于倒計時這一塊，最開始只是一串?dāng)?shù)字：

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

讓用戶體驗感更好一些。

對于體驗，我認(rèn)為可大可小，大一點的就是整體的交互方式、視覺風(fēng)格等等，而小一點就是這些非常細(xì)節(jié)的地方，不論是大是小，我們設(shè)計師都可以用心的去感受去設(shè)計，讓我們的價值和用戶的爽感一起成長起來！


總結(jié)

好啦，以上就是這個項目的一些總結(jié)感想了，還有一些頁面、彈窗的延展，等后面項目展示的時候在和大家分享吧！

就像開頭說的那樣，接項目不是關(guān)鍵，關(guān)鍵是我們自身能夠跟著項目一起成長多少，這才是我們需要重點關(guān)注的！

加油啊，兄弟們！

如果以上賬號，你都關(guān)注了，那應(yīng)該是每天哐哐長心了！