本節學習目標

  • 物件的基本設定
  • 物件樣式管理
  • 常用物件
  • 物件的操作
物件的基本設定
物件的基本設定

點選任何一個物件,物件區會顯示該物件在樣式上的相關內容,可以直接進行修改。由上至下的類別分別是:

  • 位置及大小 (Location and Size)

  • 物件樣式(Widget Style)

  • 透明度 (Opacity)

  • 字體(Typography)

  • 填充(Fill)

  • 界線(Border)

  • 陰影(Shadow)

  • 圓角(Corner)

  • 間距(Padding)

另外在互動(Interactions)則是設定物件的互動,備註(Notes)則可以增加物件中的備註

物件樣式管理
物件樣式管理

物件樣式管理,可以預先統一規範物件中的樣式。在預設中,物件樣式多為文字,如標題(Heading)、段落(Paragraph)等,點入各物件即可設定如字體、填充、間距等。要套用物件樣式,點選物件後在功能列最左方下面之下拉式選單切換即可 ; 或者至物件區樣式中切換。

常用物件

常用物件可以分為 共同類別(Common)、表格(Forms)、流程(Flows)與圖示( Icon)。

 

  • 共同類別(Common)常用物件如:矩形、文字、按鈕、線條、圖片等
  • 表格類別(Forms)常用物件如:文字框、下拉式選單、勾選方格等
  • 流程(Flows):提供不同形狀來組合並表達使用者的使用情況
  • 圖示(Icon):提供多種圖案供選擇
物件的操作
物件的操作

透過操作功能,可以輕鬆整理、管理物件。

 

常用的操作功能如:

  • 排序(Front Back):將物件在繪圖區的位置排序,可以排至最前或最後
  • 群組與解散群組 (Group Ungroup):將不同物件組合成一組,也可解散成為各自獨立之物件
  • 對齊 (Left Middle Right):透過垂直的方式能將物件向左、置中、向右對齊
  • 對齊 (Top Middle Bottom):向上、中間、向下對齊
  • 等距離分配(Horizontal Vertical):垂直或者水平的方式,將多個物件等距離分配
  • 鎖定與解除鎖定 (Lock Unlock):鎖定可以將物件不被移動、更動

無需撰寫任何程式碼

製作逼真、實用的 UX 原型從未如此簡單。