從2017年11月開始，我們開始規劃和開發全新的來畫Pro，在12月23日的短視頻峰會上推出了預覽版供參會者體驗，得到了很高的評價和關註度。吸取反饋建議後，終於在2018年1月11日正式推出了全新版本的 UWP App，定名為“來畫視頻”。（根據微軟應用商店的命名規則，大家可以繼續搜索“來畫Pro”）

全新版本的 UWP 來畫視頻，適配了來畫平臺的手繪視頻模板，對創作工具做了全新的改版。

適配來畫平臺手繪視頻模板

來畫成立兩年多的時間裏，一直在積累手繪視頻模板，目前來畫平臺的模板有上千個，覆蓋了各種風格和用途。利用模板，用戶可以很方便的創作手繪視頻，應用到很多的場景。而創作的過程，只需要基於模板，簡單的做編輯、添加和替換就可以了。所以從來畫Pro 發布之初，適配平臺模板一直都是用戶呼聲很高的需求。但是由於來畫平臺和 UWP 創作工具的功能和形式差異，這一需求一直到這個版本才得到實現。在來畫平臺、UWP 和 Mobile App 模板可以互通後，用戶對於模板的使用就變得更加靈活，模板的使用度也會變高，對於模板設計師來講，不只可以用平臺來創作模板，使用功能更強大的 UWP App 和更靈活的 Mobile App 都是很好的選擇。

先來看看目前 UWP 來畫視頻中模板的展現方式：

在首頁展示模板縮略圖列表，選擇模板後，進入模板詳情頁面，展示模板的基礎信息、生成視頻和相關類型的推薦模板。點擊“立即下載”按鈕後，開始下載模板信息和文件。

平臺的模板存儲形式為一個 json 配置文件，存儲了模板名、模板尺寸、時長、分組信息、素材信息、音樂信息等字段，每個涉及到文件的字段，都是一個 URL。所以 UWP 在下載模板時做的工作，就是下載這個配置文件，解析文件裏所有的 URL，下載對應資源並存儲到某個固定文件夾下。把位置信息、動畫信息等轉換成 UWP 創作工具可以使用的格式，完成後用戶就可以在創作工具中使用這個模板了。

全新的創作工具

1. 工具分組

這是新版的創作工具界面，相比於舊版的界面，最大的變化就是“分組”。原有的視頻創作方式，是以素材為單位，添加若幹素材後，順序播放。這種方式遇到的一個難題，就是當素材數量過多，比如超過60-80個時，素材間的覆蓋就會變得嚴重，想選中和編輯素材就變得比較困難。另外對於很多手繪視頻創作者來說，心裏對於視頻會有分鏡頭的概念，一個視頻由幾個分鏡頭組成，而每個分鏡頭又由多個素材的動畫組成。這樣就有了新版的工具分組。

通過分組的創作工具，用戶在每個分鏡頭中只需要加入少量的素材，就可以完成一個分鏡頭動畫。而通過添加多個分組，讓多個分鏡頭組成一個手繪視頻。每個分鏡頭可以單獨進行動畫設置、預覽和素材調整等操作。再配合我們上一篇（UWP 手繪視頻創作工具技術分享系列 - 有 AI 的手繪視頻）提到的來畫和科大訊飛的智能配音，用戶可以針對每個分鏡頭，選擇不同的聲音進行配音，並在每個分鏡頭間根據轉場動畫時長來做配音停頓，這樣配音的同步變得更加簡單，而且每個視頻中可以出現多種聲音，更加靈活。

在技術實現方面，原有引擎中以 Sprite item 為操作單位，而分組後，加入了 Group 這一層的操作，Group 和 Sprite 間有從屬關系，Group 有自己的索引、動畫設置和畫布位置、縮放等信息。Group 間沒有過多的關聯，所以 Group 可以隨意的拖拽順序，添加和刪除。

可能你也註意到了，新版的工具界面重新定義了 Title Bar。我們認為系統默認的 Title Bar 我們的利用度較低，為了更大限度的擴大用戶的可操作區域，讓整個工具更有浸入感，我們把原來右側的元素類型菜單，放到了 Title Bar 上。如果大家對這個實現感興趣，可以參考：Windows Dev Center - Title bar customization，也歡迎和我們交流。

2. 全新的繪畫功能

在分組功能之外，我們也順應 Windows 10 的更新方向，不斷的拓展繪畫功能。

原有版本我們更多的是直接使用了系統的 InkToolbar，包括畫筆選擇，畫筆顏色和粗細等的操作。而新版本我們重新定義了繪畫菜單。

如上圖左上角的圓形菜單，最外層是常用的推薦顏色和推薦的畫筆粗細，裏層是不同的畫筆、橡皮、調色板和畫筆粗細。其中推薦顏色控件，是一個自定義的圓形列表控件。

選擇調色板後，出現如下的界面，以 RGB、HSB 數值選擇，和顏色選擇的角度，去設置畫筆的顏色。

3. 全新的圖片編輯功能

過去我們也講過，SVG 相比於 PNG，在手繪視頻中的表現形式更豐富，因為 SVG 有路徑信息，而 PNG 沒有。所以我們在新版的開發過程中，也在不斷考慮 PNG 更多的展現方式。

如上面的圖片編輯界面，我們對於圖片，做了濾鏡、編輯、描圖和調整的功能。下面四張圖依次展示了這四個功能點。

其中濾鏡、編輯和調整功能都很常規，主要說一下描圖功能。

描圖功能的目的，是讓用戶對於 PNG 做自定義的描繪操作，從而生成一張 SVG，這張 SVG 的底圖是這張 PNG，而路徑（也就是視頻中的繪畫過程）是用戶自己描繪的線條。繪畫過程，是一個底圖根據路徑被不斷展示出來的形式。如下圖所示，對比上面的描圖界面，這張 PNG 生成的 SVG，描繪過程是用戶描圖的路徑。通常用戶想做這個操作，需要先在 PS 裏對圖片做編輯操作，然後倒入到 AI 中，描繪路徑後保存為 SVG 文件，再導入到來畫視頻中。而現在在來畫視頻中就可以完整整個的操作過程。

好了，全新的 UWP 來畫視頻就介紹到這裏，歡迎大家在 Microsoft Store 搜索“來畫”下載使用，如果大家對 UWP 中的技術實現感興趣，歡迎和我們交流，謝謝！

UWP 手繪視頻創作工具技術分享系列 - 全新的 UWP 來畫視頻