<address id="ttjl9"></address>

      <noframes id="ttjl9"><address id="ttjl9"><nobr id="ttjl9"></nobr></address>
      <form id="ttjl9"></form>
        <em id="ttjl9"><span id="ttjl9"></span></em>
        <address id="ttjl9"></address>

          <noframes id="ttjl9"><form id="ttjl9"></form>

          設計工具的后起之秀——AffinityDesigner功能提煉

          2022-6-20    純純

          一、基礎操作


          1.焦點顯示

          按住option單擊圖層縮略圖,視圖上會只顯示該圖層內容(暫時性隱藏其他圖層,進行其他操作依然會顯現出來)

          2.蒙版(同PS剪切蒙版)

          在AD中同樣也是有蒙版功能的。例如下圖,這三個字實在是太霸氣了,我們想變慫一點,那該怎么辦呢?在右側圖層面板中,按住矩形層縮略圖,拖入文字層的縮略圖與圖層名稱之間(也可以看作是縮略圖層),即可完成蒙版操作。

          但是要想調整文字大小,但是依然只顯示矩形所在區域范圍的內容呢?那么我們需要勾選上方工具欄中的【鎖定子項(lock children)】按鈕,在進行調整就OK了。


          3.歷史記錄(history)※

          1)定位滑塊

          歷史記錄工具包含一個定位滑塊(position),拖動滑塊,可快速撤銷與復原,效率很高。同時也可以點擊列表的特定步驟,點擊后就會回到該步驟操作。

          2)歷史分支

          在文件菜單欄中有個【隨文檔保存歷史記錄(save history with document)】,勾選后,保存的文件將保留歷史記錄。當你在歷史記錄中選中曾經的特定操作的情況下,進行一步新操作,則歷史記錄會產生一個小分支符號,分支符號代表不同的未來。例如我新建一個黃色矩形,然后將顏色調整為藍綠色漸變。然后通過點擊歷史記錄,回到新建黃色矩形的步驟,然后把顏色改成藍紫色漸變,這樣在填充步驟就會出現分支符號,通過點擊分支可快速切換至藍綠色漸變,可用于嘗試性創作,并通過同時存在的兩種結局來進行對比。


          4.快速副本(power duplicate)

          復制粘貼和復制圖層操作與PS完全一致,不同的是power duplicate部分。首先,我們在畫布上繪制一個矩形,然后按command J復制出一個矩形副本,將矩形副本移動到矩形的左邊,然后縮放它,操作完成后按command J,在矩形副本的左邊就會出現一個比矩形副本更小的矩形副本2副本2矩形副本的距離與矩形副本矩形的距離相同。好,我們回到第一步,繪制一個矩形。然后按住command 拖動矩形,則會出現矩形副本,然后移動矩形副本后,按command J,同樣可以達到上面的效果,我們把這個操作叫做power duplicate,也就是快速副本。PS也有同樣的功能,但是操作邏輯有些許不同,AD的更為清晰一點。


          5.圖層與像素圖層

          1)圖層概念

          在AD中,有兩個圖層的概念,一個叫做圖層(就是普通圖層,可以包括像素圖層和矢量圖形圖層),另一個叫做像素圖層。如果選中圖層的狀態下添加像素圖層,則該像素圖層會默認放置在該圖層下,普通圖層與組的概念類似。如果選中畫板層的情況下添加像素圖層,則像素圖層自動創建在畫板層,與其他圖層同級。

          2)三大角色模塊(personas)

          在AD中有矢量部分、像素部分、導出部分的區別。不同部分的工具區是不一樣的。在矢量部分下,包括拖動矩形與鋼筆繪制形狀,所創建的都是矢量圖層;像素部分創建出來的都是像素圖層,這兩者是不一樣的,同時也是AD與AI的重要區別之一。


          二、高級操作


          1.等距視圖※

          1)內置網格

          與AI需要自己手動繪制等距視圖網格線不同,在AD中內置了一套優秀的網格系統,可以幫助我們快速的搭建出2.5D插畫需要的網格線,并且支持角度變換。在調節角度時可以預覽網格線的具體效果,就這一點就足以讓2.5D插畫作者扔掉AI轉投AD。

          2)等軸測工具(isometric)

          isometric工具可以幫助我們快速繪制等距視圖插畫。我們可以想象一下在AI中,好不容易利用旋轉復制人肉做出了參考線,還需要用鋼筆工具去點擊參考線的交點來繪制插畫的一個個立體塊面。在AD中這項繁復的工作將不復存在。通過等軸測工具,我們將告別手動對齊這種令人頭大的工作。

          等軸測工具功能由兩部分構成,上方的三個立方體表示參考線當前描述的是哪個平面,并且可以通過這三個立方體來快速切換當前平面(current plane)。

          在下方平面編輯選項部分,有這樣幾個功能項。

          • 在平面中編輯(重點):在該選項選中的狀態下,我們通過圖形繪制工具在畫布上直接就能拖動出符合參考線角度的圖形,特別是在繪制圓形時簡直不要太方便。

          • 適應平面(重點):在畫布中我們通過矩形工具繪制了一個正常的矩形,橫平豎直那種,然后點擊【適應平面(Fit to plane)】,只聽得啪的一聲,矩形就被啪到參考線上了,變成等軸視圖的一個部分。

          • 在平面中翻轉/旋轉:這個沒什么說的,就是普通的翻轉旋轉操作,變成了等距視圖的翻轉旋轉操作。


          2.資產(assets)

          相當于UI組件庫,Sketch與XD都有同樣的功能。


          3.符號(symbols)

          視圖(view)-studio-符號(symbols),將圖形拖進去,就形成了symbols。

          如果想要單獨修改某一個符號,則需要點擊符號面板右上方的【同步(sync)】來取消全局修改,然后單獨修改某一個符號。修改后,該符號將脫離符號控制,不受符號修改影響。


          三、設計幫助


          1.曲線吸附(curve snapping)

          選擇節點工具[A],去調整一條曲線的錨點,可以通過上方面板中的吸附(snapping)來選擇各種吸附方式。


          2.參考線管理器(guides)

          視圖-參考線管理器,可打開參考線面板,已存在的參考線都會在上面顯示,同時可以點擊參考線的數值來修改參考線的具體位置。

          因為需要時間消化的原因,我會將文章分為幾部分整理,在此階段如果有朋友感興趣可以去Affinity官網下載試用,同時結合本文上方的鏈接(官網的教學視頻被異次元封印了)可以更好地了解AD。再次提一下,一定要看官方教學視頻,不要想憑借著自己PS、AI的基礎去直接上手,AD真的不一樣。

          AffinityDesigner(下文都用AD表示)是Affinity系列中偏向于矢量繪制與界面設計功能的工具,其并沒有能夠準確對標的競品,如果非要對標的話,可能就是Adobe Illustrator和Sketch了。Affinity系列中的另外兩款作品Affinity Photo(偏向圖像處理,對標Adobe Photoshop)與Affinity Publisher(印刷排版,對標Adobe InDesign)也是非常有潛力的作品,不過目前這兩款還沒有辦法完全替代掉Adobe家族的作品。

          但是AD,我覺得是可以完全有實力跟Adobe Illustrator一較高下。在用過Sketch之前,我從未感覺用PS做UI有多低效,同樣,在了解AD之前,我也從來沒感覺Ai有多難以忍受,頂多有些地方感覺反人類罷了。但是經過兩三天的了解與試用,我立即就在App Store下單入正并拋棄了AI。

          因為AD,真的有點東西。

          作者:NOLeon_墨刃       來源:站酷
          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

          魏華的微信.png

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。
          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 
          UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司




          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.syprn.cn

          存檔

          亚洲va欧美va天堂v国产综合