Goodideas Studio — 好想挑戰賽 Day 1(心得分享)
前言:
因為本周我們好想工作室舉辦了臨時類似小型黑客松活動,三個 Camp ( iOS、Android、Web ),每組會由三個 camp 的人所組成進行挑戰賽,在這週兩天進行了兩次的挑戰賽。
- 第一天挑戰賽:
【 今日臨時挑戰賽 — 抽卡動畫 】
請根據上面的影片分別在 Web / iOS / Android 三個平台上模仿做一個。每一個 team 的第一位擔任隊長。隊長要負責分工,確保三個平台的應用都能順利完成,並完成驗收條件。
驗收:
- 模仿完整度(要用你們的觀察力去看有哪些效果要做)
事前準備:
第一天我是擔任隊長的身份,也是第一次擔任隊長的身份,所以可能必須要觀察大家進度到哪邊,因為我們挑戰賽是以隊伍內的各個 Camp 能夠完成一個專案為主,所以必須隨時隨時觀察隊員的進度是否正常、或者是需求是否正確。
一開始就跟組員們看著需求影片查看,看可能需要從素材網站抓取什麼素材下來,就請 Web 的組員將素材擷取下來給隊伍使用,之後就看著影片需求開始實作各個 Camp 的專案。
實作開始:
因為我們這組只有我是 iOS Camp 的,所以除了要當擔任隊長職務,同時也必須產出我的成品。打算開始實作之後,就開始規劃該使用什麼元件來時做抽卡畫面中滾動抽獎的效果或是需求中的特效效果。
- 抽卡動畫
而我就想到可以使用 Scroll View 來進行滾動的效果,我打算在 Scroll View 中 add 進許多的 ImageView ,就可以想像一條很長的圖片在 Scroll View 裡面滾動,之後再把 Scroll View 的 clipsToBounds 設置為 true,這樣超出 ScrollView 的範圍就會被裁切掉,會有一種類似遮罩的效果。
之後可以透過設置 Timer 讓我 ScrollView 持續做出滑動到下一張圖片的動作,重複執行動作直到滾到到最後一張,我們的 Timer 就停止。
- 特效動畫
- 煙霧特效
當時看到這張圖,原本以為後面的特效可能需要個別切開成 30 張圖片重複輪播,或是讓他變成一張 Git 檔讓我們夠直接使用,但這邊我就是一個「 硬幹 」流派,心中就有一個想法「 假設今天就只能給我這個圖,那我還是要想辦法實現效果! 」,抱持著這個決心,我就直接上了。
其實實現方式不難,只是可能有些人沒發現,這張特效圖其實我們可以把他分成 30 等份來看,我們只要像上面的抽卡動畫實現方法一樣,設定ㄧ等分的圖片遮罩,然後 30 等分的圖片在裡面持續位移,每次位移一等分,如此這般重複執行,雖然比較複雜,但也就等同於我們前面兩種方式的動畫效果。
2. 閃光特效
其實閃光特效其實很簡單,我這邊就只是用原生的 UIView.animate 來處理我們該張閃光的圖片或者可以用一張白色背景代替,使它的透明度進行變化,製造出類似閃光的特效。
賽後講評檢討
其實結束之後,其實我們大家都有很多地方可以檢討,像是我覺得第一天的挑戰的「 需求 」就是最大的檢討點,因為需求就是模仿它「 動畫效果 」的完整度,所以我們應該仔細觀察動畫的詳細進行過程。
需求面
例如:「 動畫什麼時候會觸發閃光效果? 」「 結束後角色背後是否有煙霧特效? 」「 抽卡煙霧特效什麼時候消失? 」,因為我們要模仿這些效果,所以必須清楚理解動畫是怎麼進行,以及他的先後順序。
所以當時實作的時候有些人正當在思考:「這些角色是不是要隨機?」「 動畫什麼時候要觸發開始?」「 是不是要重複開始? 」的時候,其實就已經開始離題了,所以假如是為隊長的身份就應該將他們拉回我們「 需求 」的主軸。
這也是最後賽後檢討大多數人發生最多問題的地方,可能有人滾動方向不同,角色與遮罩跑版,抽卡結束煙霧消失等等。所以下次如果還有此系列活動,一定需要跟組員一起討論、一起觀察有什麼細節地方需要我們去處理的,一起列出一個清單慢慢實現。
真的體會到魔鬼藏在細節中啊!!
溝通面
因為我們這組的組員為一個 iOS(我)、一個 Android 和兩個 Web 成員,所以我一開始預設兩位 Web 的成員能夠互相交流,畢竟兩位成員只需要一起產出一個作品,而剩下的我以及 Android 的成員,雖然學的不是相同的,但是因為畢竟都是 APP 所以我可以跟他溝通我是使用什麼元件實現效果,說不定在 Android 也有相似元件可以實現相同效果。
但是後來也發現,其實大家可以一起觀看需求,不論是哪個 Camp 出身的,告訴大家自己想要使用什麼方式實現,而不是使用什麼特殊的元件。其實說不定會提出有些人沒想過的作法,但是容易實現。如此這樣互相交流,說不定會有更好的想法產生。
自我檢討
雖然這次是以隊長的身份參賽,但感覺大家一開始溝通結束之後就很少再進行討論了,變成各自開始處理各自的專案,我只是負責觀察大家的進度能不能趕上我們驗收時間,當覺得有人偏離需求就要提醒他需求中可能不需要這個功能,畢竟驗收是以完整度為主。
最大的點還是沒有「 釐清需求 」,一開始看需求的時候太草率結束了,導致我們可能少抓了一些素材,導致最後效果可能跟需求對不上,或是最後驗收有些人才發現少做效果了什麼或是時間軸沒有算好,導致動畫出現問題。
最後我們專案只有 Android 的部分 Fail,雖然知道可能還比較初學階段也沒有碰過動畫效果製作,但我持續跟它溝通可能可以使用什麼方法實現,讓他找方法自己實作這些效果,或者是自己上網查詢。雖然到最後失敗了,但我想收穫應該也很多( 應該吧! )。但假如是下一輪的挑戰可能就必須好好要求要以「 完賽 」為主了。
附上比賽作品連結: