EasyV用戶必須了解的實操方法論|模板復用五步法
本文根據(jù)@元寶 在模板復用訓練課程上的分享整理而成。
從我們模板復用課程上線到現(xiàn)在,每一期我們都在反復強調(diào):如何讓「所有的」EasyV用戶都能搭建制作出「可以落地交付」的可視化大屏是我們課程制作的初衷,跳出「大屏搭建 = 大屏設計」的思維困境。所以我們前兩期內(nèi)容都是圍繞「基礎」進行,就算你不懂設計、不了解模板,通過基礎篇的學習之后都能「像可視化設計師一樣」輕松「搭建」大屏,想要模板套得好,基礎肯定不能少!

EasyV數(shù)字孿生的個人空間-EasyV數(shù)字孿生個人主頁-嗶哩嗶哩視頻
具備基礎知識之后,我們也正式開始我們套用模板做大屏的基礎應用部分:如何使用模板制作大屏。
在這里我將套用模板到完成搭建的過程提煉為五步:
1. 搜:認識和使用素材廣場2. 選:如何選擇適合自己的模板3. ?。喝绾稳∮眯枰哪0濉⒃?. 改:如何修改模板中的內(nèi)容、數(shù)據(jù)、交互,變成自己需要的5. 增:提供的模板沒有涵蓋自己需要的內(nèi)容,如何增加內(nèi)容又不破壞原本美觀度?
接下來我就詳細來看下五步法是如何應用到大屏搭建的工作流中的,并重點介紹關鍵步驟。
一、搜:認識和使用素材廣場
這個問題我們在基礎篇中和大家詳細講解過,素材廣場就是易知微的可視化設計師們?yōu)榇蠹掖罱ǖ摹复笮涂梢暬夭膸臁梗?/strong>每一個模板都可以分子化甚至原子化的拆分作為設計元素。在這里,不僅僅可以通過豐富的模板樣式作為基礎設計參考,同時可以根據(jù)行業(yè)、場景、色系、功能模塊搜索你需要的素材內(nèi)容進行收藏、創(chuàng)建。

二、選:如何選擇適合自己的模板
關于合適
「如何選擇適合自己的模板」這一話題乍一看非常的寬泛,一千個人就有一千種「合適」的定義,所以在這里我們先需要對于「合適的模板」進行一個規(guī)范的劃分:內(nèi)容的契合和風格的契合。
在實際搭建的過程中,內(nèi)容契合度最大程度體現(xiàn)在主視覺的契合上??梢暬笃恋闹饕曈X作為最快速、最直接傳遞大屏內(nèi)容和設計語言的方式,通常劃分為「地圖類主視覺」和「業(yè)務定制化類主視覺」和兩種。
因此今天我們挑選「內(nèi)容契合的模板」時,需要根據(jù)實際需求針對性選擇「地圖契合」或「業(yè)務定制化場景契合」的模板素材作為原始參考。


在風格契合的模板選擇上,我們更著眼于顏色和風格關鍵詞上(聽起來有些抽象)。顏色風格的挑選上我們主要會兼顧品牌色與場景/業(yè)務主題色兩方面的呈現(xiàn),在這里我們也會通過強調(diào)「場景+顏色」的概念,提升大屏內(nèi)容理念感,比如:科技藍、熱血紅、書卷白...
針對風格關鍵詞上,其實大家已經(jīng)能夠在日常需求溝通時有明顯感知,比如:我希望大屏具備「科技感」、我認為這個場景更適合「國風」元素、這里我們需要大屏設計「簡約大氣」...

通過以上兩種方式有條理的拆解出「合適」的定義,我們在挑選模板時將更加有目的性,同時在大屏理念傳達上有據(jù)可依,用更加具象化關鍵詞進行闡述。
關于選擇
這里我們通過一個象限圖來幫大家理解一下模板的挑選。那在考慮內(nèi)容和風格兩方面情況下,排除完美情況(風格內(nèi)容全都符合我的需求)和完蛋情況(風格內(nèi)容全都不沾邊),我們常常會面臨兩個難題:
這個模板就是我要做的業(yè)務場景,但是風格上完全“與我無瓜”
這個模板符合我顏色和風格的定位,但是和我的業(yè)務結合不起來

人生就是這樣充滿二選一,所以針對兩大難題,我們也需要選擇更好解決的模式。
我們分情況來看,如果你選擇契合內(nèi)容需要改造樣式,將會面臨:擬定新的風格、修改全部組件風格、調(diào)整設計元素...工程量堪比破爛二手房打掉新裝修,甚至還需要兼顧設計能力。
但是如果你選擇一個風格符合需求的大屏,你只需要兩步:拿著需求改內(nèi)容(文字、數(shù)據(jù))、修改主視覺的樣式。減少步驟的同時大幅縮短時間,只需要在這個還不錯的二手房里添置一些適合的家具。
三、?。喝绾稳∮眯枰哪0?、元素
那么我們挑選好模板、元素之后,就可以取用對應的模板及元素來進行搭建。
在素材廣場中選擇需要的模板,光標停留在該模板處,彈出“預覽模板”和“創(chuàng)建項目”兩個選項,點擊“創(chuàng)建項目”,即可完成創(chuàng)建大屏。
這一步需要你擁有熟練使用平臺的能力(也不是三言兩語能夠講清楚的),你可以通過幫助文檔快速練習操作,也可以在課程基礎篇跟著回放熟悉流程。

四、改:如何修改模板為自己所用
聊到修改模板,我們從整體(尺寸)到局部(內(nèi)容、數(shù)據(jù)、交互、樣式)入手和大家分享。
關于修改尺寸
在整體修改上,我們重點是在于「修改大屏的尺寸」,需要將模板尺寸修改為實際交付時的尺寸及分辨率,詳細的修改應用可以參考之前的分享:如何確定可視化應用分辨率 - EasyV正式產(chǎn)品文檔,這里我們額外需要補充兩大注意事項:
比例等于物理尺寸,保證全屏鋪滿不變形
分辨率需要盡量保持清晰,上限為顯卡最大支持,超過 8K 有風險
關于改內(nèi)容、數(shù)據(jù)、交互
這部分的修改每個小點都能作為單獨一節(jié)課來分享,所以在這里我不會詳細展開去說,而是會提供方法參考來去輔助大家學習,掌握基礎操作。
首先需要充分利用好我們的幫助文檔,了解工作臺及編輯界面,其次是通過我們官方的視頻教程深入體會。(文檔鏈接:https://easyv.cloud/help/docs/ltvzmr.html)
V學院|千呼萬喚的 EasyV2023 新版教程及使用技巧來啦|基礎培訓篇_嗶哩嗶哩_bilibili
V學院|千呼萬喚的 EasyV2023 新版教程及使用技巧來啦|進階教程篇_嗶哩嗶哩_bilibili
低代碼快速搭建可視化大屏教程|EasyV平臺使用教程|小白基礎入門輕松上手|快速還原搭建可視化應用_嗶哩嗶哩_bilibili
在掌握基礎操作之后,你還需要額外注意以下幾個關鍵方面:
找得到哪里改
動態(tài)面板
子組件
配置項
改數(shù)據(jù)
數(shù)據(jù)格式不要錯
改地圖省份
利用好 EasyMap
改交互邏輯
看文檔、典型案例拆解課
關于修改樣式細節(jié)
修改樣式細節(jié)會涉及非常多內(nèi)容模塊,那這里我們找了三個常見的關于樣式調(diào)整的問題來幫助大家理解和規(guī)避?
Q1-換了模板里的地圖省份,如何制作地圖頂面貼圖?
A1-上周才講過!V學院|如何設計制作QGIS寫實地圖?保姆級教程來啦!_嗶哩嗶哩_bilibili,后面還會專門出一個教程。
Q2-我想統(tǒng)一相似組件的樣式風格,有沒有便捷的方法?
A2-直接通過樣式復制功能,選擇好你的目標樣式進行“格式刷”
Q3-怎么能夠修改的和原始模板一樣美觀好看?
A3-美觀度是非常抽象的概念,所以我們需要在制作大屏的全流程的各方面去遵循「四大設計原則」
千萬別改
我們上架的官網(wǎng)模板都會遵循「四大設計原則」進行設計,包含了原本良好的布局對比、親密性關系等,因此我們在修改模板時需要盡可能的去遵守面積比例關系以及組件元素間距規(guī)律。
同時我們在修改時也需要考慮到由于數(shù)據(jù)、內(nèi)容的調(diào)整帶來的樣式變化,提前確定好參考線,建立明確的內(nèi)容邊界,減少內(nèi)容修改帶來的負面影響。
五、增:如何增加內(nèi)容又不破壞原本美觀度
當我們修改好基本內(nèi)容后,總是會發(fā)現(xiàn)部分模塊在原有模板中缺少內(nèi)容載體,需要額外增加元素進行補充,這時候新元素放到哪里、放成什么樣、怎么融入原有內(nèi)容等問題就暴露出來。
數(shù)量增加
舉個來說,圖中模板我需要在對應模塊增加對應的指標數(shù)據(jù),那么我該怎么做?首先從簡單的入手,左側三個指標變?yōu)樗膫€,我只需要調(diào)整兩兩間的間距,擠一擠輕松放下第四個指標。但是右側的模塊本身間距不大,且都是雙數(shù)布局,這個時候該怎么辦?

那這里我會建議你打開素材廣場,找到含有類似模塊的模板,參考其處理方式,根據(jù)自己數(shù)據(jù)的實際情況進行對應的調(diào)整修改,在保證整潔、平衡感的大前提下調(diào)整樣式,必要時也可以通過「動態(tài)」的方式處理展現(xiàn)問題。




種類增加
種類的增加具體是指需要本身模板之外的組件模塊。那當你遇到這種情況會怎么做呢?通常大家會找到對應組件,新建組件從零開始重新配置,這時候你是不是會發(fā)現(xiàn),自己新建的內(nèi)容仿佛大屏局外人,默認樣式配色和意向模板不搭,最終效果比較簡單,甚至“簡陋”。

這個時候我更建議你找到素材廣場中用到此類模塊的模板,從中把它“拆出來”,根據(jù)意向模板的顏色類型進行簡單的修改,既能兼容意向模板風格,還能夠滿足使用需求。
總結
做設計絕不是一蹴而就的,需要長期的耕耘才能磨練出一個較高的審美水平和設計能力。通過復用大屏的形式,彌補了短時間無法提升的能力。即使不是專業(yè)設計師,也能站在“巨人”的肩膀上,產(chǎn)出高水準的可視化大屏。
更多模板試用學習技巧&低代碼數(shù)字平臺免費試用:https://easyv.cloud/?t=bilibili