阿里新開發了一款神器犸良!零基礎也能輕松做酷炫動效 - 優設網 - UISDC

阿里新開發了一款神器犸良!零基礎也能輕松做酷炫動效

2019/07/08 96768評論 73

阿里作為中國互聯網企業的標桿,不僅一直在為廣大人民群眾提供快捷便利的服務。也不斷引領行業,在各個專業領域,給專業人員提供了優質的工具與服務。對設計師而言,無論是每年一度的 UCAN大會,還是 Kitchen、語雀、Ant Design 等設計開發工具,都給廣大設計師帶來很大的便利。

而最近,阿里又推出了一款基于 Lottie 的動效設計平臺 ── 犸良。能夠快速生成設計師想要的動態效果,并交付給開發,極大地提高了設計效率和設計還原度。

犸良是什么?

它是一個積累了很多通用動效素材的平臺,讓不會動效的同學們也能基于動效庫和素材庫快速生成一個通用動效創意,你只需要簡單地編輯圖片、顏色或者文字即可。同時平臺集成了以 Lottie 為代表的動效技術,讓曾經令人苦惱的安裝包大小和性能問題一并解決。

△ 官網:https://design.alipay.com/emotion

犸良的應用場景

犸良支持全平臺 iOS、Android、H5、小程序。無論是營銷展位、活動頁面、空狀態還是產品icon。犸良編輯器對接投放平臺,一站式完成動效創意制作和投放。

豐富的動效素材能夠滿足多種場景需要。

犸良怎么用?

方式一:基于模版直接制作(適用于設計師進行動態banner制作)

  1. 選擇模版
  2. 從動畫倉庫選擇動畫進行當前動畫的替換
  3. 通過替換圖片或修改顏色來自定義動畫
  4. 自定義模板文字內容
  5. 選擇模板背景圖片
  6. 完成編輯選擇是否帶背景(banner模版默認帶背景)
  7. 導出成功下載 json

方式二:自定義畫布制作(適用于設計師進行模板覆蓋不到的動效應用場景)

使用犸良一分鐘做出來的效果,大家感受下:

體驗感受

綜合體驗了一下犸良,相對于鹿班人工智能隨意擼圖。犸良其實是一款基于人工的動效模板網站。所有的動態效果都是設計師提前做好的?;?Lottie 的特性,將可編輯的屬性進行??榛?。

說到這里有些設計師可能有疑問了,Lottie 究竟是什么?在優設已經有相關文章介紹的比較全面了,這里就不贅述了,閱讀鏈接://www.utsvcz.com.cn/tag/lottie/。

簡言之 Lottie 就是一個快速將 AE 中設計的動效快速調出,并且開發可以直接調用的動效庫。

Lottie 的原理是將矢量圖形和動態效果通過代碼實現,復雜的圖形導出圖片資源。最終生成 json 文件+圖片資源。犸良所做的就是,將 json 里的顏色屬性提取出來,用戶可以從外部修改。同樣只需要替換圖片資源,就可以讓用戶自己設計的圖形根據 json 寫好的運動方式來展示。如果你把一只移動的豬替換成貓了,那么你看到的效果就是一只移動的貓。

而它的文字編輯功能,我覺得就比較神奇了。因為 Lottie 貌似不能從外部修改字體,應該是阿里自己寫的。如果有知道的同學也歡迎解惑。因為我們在實際工作中經常遇到這樣的問題,就是如果動效包含文本了,需要適配國際化,就沒法從外部修改語言。如果能解決這個問題,將會減少很多麻煩。

從現有的素材來看,其主要應用場景還是電商和運營方面。相信未來會增加更多的素材和應用場景。希望以后能夠開放出讓設計師可以將自己做的動效分享出來供大家使用,或者提供優質付費內容也是不錯的選擇。

就個人的工作經驗來看,Lottie 還是有豐富的應用場景的。比如可以做動態圖標、動態閃屏頁、表情貼紙、直播禮物、空白頁、動態banner……

其實 Lottie 官方社區也有很多的動效資源,都是來自全世界的設計師上傳的,大家可以去下載參考,如果要商用,可能需要聯系作者。

△ 附上鏈接:https://lottiefiles.com/popular

本文資料,很多都是來自語雀的分享。再次感謝相關人員的辛勤付出。大家可以在此處查看犸良的完整介紹:https://www.yuque.com/dapolloali/news/ui43vg。

再次附上官網:https://design.alipay.com/emotion

因為犸良是基于 Lottie 的工具,所以有相關基礎的設計師很容易上手?;共渙私獾耐б部梢栽詬鞔笊杓仆舅閹韉?。

歡迎關注作者的微信公眾號:「懿凡設計」

非特殊說明,本文版權歸原作者所有,轉載請注明出處
本文地址://www.utsvcz.com.cn/alibaba-emotion

發表評論 加載中....

評論加載中....

uisdc

評論區都快餓癟了,看看我期盼的小眼神...

sketch 界面設計 版式設計 排版布局 職場 優設專訪 設計師干貨 優設大課堂 設計達人 配色 web前端開發 視覺設計 素材下載 AI教程 設計理論 設計流程 神器下載 字體下載 設計師專訪 psd下載 設計規范 海報設計 設計趨勢 用戶體驗設計 動效設計 平面設計 logo設計 圖標設計 ICON 產品設計 神器推薦 App設計 字體設計 職場規劃 酷站推薦 交互設計 ui設計 優秀網頁設計 設計師職場 ps技巧 酷站 用戶體驗 PS教程 網頁設計 經驗分享

您還沒有登錄

優設啟用更安全省心的 微信掃碼登錄

微信掃碼

300萬設計師聚集地!優設網是極具人氣的設計師平臺
2012年成立至今,一直專注于設計師的學習成長交流

把好文章收藏到微信

打開微信,掃碼分享
學設計 優設網 在這里