Axure RP

2020/12/16 (更新內容)
2021/01/09 (新增投影片)
2021/03/27 (更新)

簡介

Axure RP是個功能很完整的雛型工具，可以很快的建構一個可互動的雛型。目前最新版是Axure RP 10 (詳參: Introducing Axure RP 10 )，可以申請免費教育版。

Axure RP 10

• Rediscover Repeaters

• A Nicer Way to Make Forms

• Dynamic Panels on Display

AXure RP 9

• Getting started with Axure Prototyping | Axure RP: Noob to Master Ep1 (6:05)

安裝

• Installing on Windows / MacOS (RP 9)

• Activating Axure RP (RP 9)

基本操作

• The Axure RP Environment / Getting Started with Axure RP (RP 9)

• Axure RP 9線上課程

  • 1-1 Axure RP 9 簡介

基本元件 (Widget)

• Axure RP可以很快的完成一個頁面(網頁或App)，可以試著利用下面的這些基本物件，建一個表單，詳參:

  • 第二章 物件 (Widget) (9.0) / 1-1 基礎教學：物件功能介紹 (8.0)

    • 圖像

      • Image Widgets

      • Box

      • Placeholder

    • 按鈕

      • Button

      • Primary Button

    • 文字

      • Heading 1

      • Heading 2

      • Label

      • Paragraph

    • 輸入框 (Text Field and Text Area Widgets)

      • Text Field

      • Text Area

    • 下拉選單

      • Droplist Widgets

      • List Box Widgets

互動

• 可以很容易的建立互動式的網頁，詳參:

  • 第三章 基礎互動設計

  • 3-1 基礎互動：簡介 (9.0) / 2-1 基礎互動設計：基礎功能介紹 (8.0)

  • 3-2 基礎互動：點選後開啟連結（OnClick） (9.0) / 2-2 基礎互動設計：示範互動事件 OnClick

  • 3-3 基礎互動：點選後改變能見度（Visibility） (9.0)

  • 3-4 基礎互動：滑鼠移動（Mouseover）樣式改變 (9.0)

  • Working with Buttons and Links | Axure RP: Noob to Master Ep3 (6:23)

  • Interactions

    • Events, Cases, and Actions

    • Variables

    • Conditional Logic

    • Math, Functions, and Expressions

    • Animations and Move Action Boundaries

    • Style Effects

    • Selection Groups

多頁面

• 可以建立多個頁面，通常我們會利用共用區塊建一個選單，利用點選選單切換到不同的頁面

  • 第四章 頁面功能 (9.0)

  • Pages

    • Managing Pages

    • Styling Pages

    • The Grid, Guides, and Snapping

    • Adaptive Views

  • Navigation Menu Tutorial

    • 先產生一個Navigation Menu

    • 將Navigation Menu轉換成Master (Create Master)

    • 將Master套用到所需要的頁面 (Add to pages)

  • Tab Menu Tutorial

共用區塊

• 可以利用共用區塊 (master)設計所有網頁共用的介面，如: 選單，詳參:

  • 第六章 共用區塊（Master） (9.0) / 4-1 共用區塊：Master 基本運用 (8.0)

  • 4-2 共用區塊：Master 進階設定 (8.0)

  • 4-3 共用區塊：新增 Master 至多個頁面與刪除 Master (8.0)

  • Masters

    • Creating and Using Masters

    • Raised Events

    • Master Views

使用 Axure Team Projects & Axure Cloud (Axure Share)

• Creating and Sharing Team Projects

  • Axure share開帳號

  • 開workspace

  • create team project from current file

  • invite

• Working with Team Projects

  • get and open project

  • getting changes (得到最新的檔案)

  • check out (要編輯時，鎖住檔案，其他人不能改)

  • check in (編輯完時，上傳檔案，讓其他人可以改)

  • sending changes (上傳最新的檔案，送出檔案，但還是保持check out狀態，其他人不能改)

  • 有人check out忘了check in

    • 可以利用 steal check outs，詳參: steal check outs

• Managing and Viewing Team Project History

• Upgrading Team Projects to RP 9

• Publish

  • 第五章 預覽與發佈 (9.0) / 3-3 發布原型：發佈至雲端共享空間 Axure share (8.0)

  • Publishing to Axure Cloud

  • Axure Cloud Workspaces

Axure Cloud

• The New Axure Cloud

• New in Axure Cloud: Inspect Your Designs

• New in Axure Cloud: Publish Artboards from Sketch

• New in Axure Cloud: Build Prototypes from Sketch and Image Files

• Axure Cloud for Business — On Your Servers or Ours

進階

動態面板 / Dynamic Panel

• 第七章 動態面板（Dynamic Panel） (9.0)

  • 7-1 基礎動態面板（Dynamic Panel）：介紹 (9.0)

  • 7-2 基礎動態面板（Dynamic Panel）：互動 (9.0)

• 可利用Dynamic Panel設計輪播，詳參: 10-1 進階動態面板（Dynamic Panel）：旋轉木馬（Carousel） (9.0) / 9-1 進階 Dynamic Panel：旋轉木馬 (8.0) / Rotating Carousel / Slideshow Tutorial

• 可利用Dynamic Panel設計選單，詳參: 10-2 進階動態面板（Dynamic Panel）：Mega Menu (9.0) / 9-2 進階 Dynamic Panel：Mega Menu (8.0)

• 可利用Dynamic Panel設計彈性的下拉選項 (droplist)

• The Power of Dynamic Panels | Axure RP: Noob to Master Ep6 (8:12)

  • 選擇元件，再將元件轉為Dynamic Panel

  • 在不同的狀態(state)下增加元件

  • 利用元件切換狀態

• Dynamic Panel & Form

  • Forms, Inputs and Smart Radio Buttons | Axure RP: Noob to Master Ep7 (9:23)

  • Contextual Input Fields in Forms | Axure RP: Noob to Master Ep8 (6:09)

  • Custom Form Inputs and Radio Buttons | Axure RP: Noob to Master Ep9 (11:49)

  • Form Field Validation with Condition Statements | Axure RP: Noob to Master Ep10 (12:22)

• Dynamic Panel for Menu

  • Fixed Website Header | Axure RP: Noob to Master Ep11 (10:41)

• Masters vs Dynamic Panels | Axure RP: Noob to Master Ep12 (6:56)

• Dynamically Set Droplist Options Tutorial

Repeater

可以利用repeater設計資料的CRUD，就像真的可以新增、刪除、修改一樣，詳參:

• repeater

  • 新增repeater

  • 輸入資料

  • 進入repeater，複製repeater裡的rectangle，決定每個欄位的位置與寬度

  • 回到原本的page，就可以看到對應的位置與寬度

  • 設定OnItemLoad，設定repeater的內容對應的rectangle

  • 就可以在repeater上看到資料了

• Repeater Widgets

  • Dynamically Adding Rows to a Repeater

  • Dynamically Deleting Repeater Rows

  • Updating Repeater Rows

  • Marking Repeater Rows

• Repeater可以排序及篩選，詳參:

  • Sorting Repeater Rows

  • Filtering Repeater Rows

    • 【axure-rp-7.0】-練習repeater應用-篩選資料

    • ADVANCED REPEATER FILTERING

• 處理分頁

  • Paginating Repeaters

• Axure RP8 repeater实例

• Axure高级教程：如何从外部获取Axure中继器里的数据

• Axure教程：列表拖动排序的实现方式

  • 注意: 將repeater轉為動態面板時，不是在頁面上將repeater轉為動態面板，這樣是可以拖拉整個repeater而不是repeater內的項目，要點進repeater後，針對rectangle進行轉換

• Dynamic Product Grid and Lists with Repeaters | Axure RP: Noob to Master, Ep42 (11:53)

• Repeaters: Adding Custom List Entries | Axure RP: Noob to Master, Ep43 (15:24)

• Repeaters: Unique Content in Each of the Items | Axure RP: Noob to Master, Ep44 (13:58)

• Repeaters: Remove Custom List Entry | Axure RP: Noob to Master, Ep57 (4:18)

• Add Items to a Shopping Cart with Repeaters | Axure RP: Noob to Master, Ep58 (13:29)

• Using Worksheet Table Data in Repeaters | Axure RP: Noob to Master, Ep63 (8:01)

手機介面

可以很快的產生手機介面，詳參:

• Swiping Slideshow Tutorial

• Toggle Switch Tutorial

• Responsive Prototypes with Adaptive Views | Axure RP: Noob to Master Ep14 (7:45)

• Create mobile menus | Axure RP: Noob to Master, Ep59 (17:59)

• Create Mobile Bubble Menu | Axure RP: Noob to Master, Ep60 (11:42)

可下載:

• Material Design Axure Library

Axure RP 9

• What's new in Axure RP 9

• New In Axure RP 9: Building Interactions Inline

• New in Axure RP 9: Dark Mode

• New in Axure RP 9: Edit Dynamic Panels Inline

• New in Axure RP 9: Configure Your Environment

範例

複雜互動

• Account Login Tutorial

• Scrolling Region Tutorial

• Dynamically Set Droplist Options Tutorial

購物車

• 購物車商品增減刪除練習

• Axure RP 中继器数据求和-购物车商品单价合计

• Functional Shopping Cart with Math Functions | Axure RP: Noob to Master Ep30 (17:04)

• Add Items to a Shopping Cart with Repeaters | Axure RP: Noob to Master, Ep58 (13:29)

• Shopping Cart and Product List Using Repeaters (drag & drop)

檢查必填欄位

• 必填字段 / Required Fields Tutorial

對話框

• Axure RP如何制作弹出窗口

• Creating Modal Dialogs with Axure

變數

• 如何在 Axure 中設置動態的數值

• Axure原型設計中變數的使用（1）

• Axure原型設計中變數的使用（2）

• How to SUM values in a repeater column

圖表

• Animated dashboard with Axure 8

• Dashboard Lite

延伸閱讀

• Axure RP 9.0 線上課程

• Axure RP 9: Noob to Master (Youtube playlist: 107部影片) **

  • Getting started with Axure Prototyping | Axure RP: Noob to Master Ep1 (6:05)

  • Convert Design to Prototype | Axure RP: Noob to Master Ep2 (4:19)

    • From Sketch to Axure RP

  • Working with Buttons and Links | Axure RP: Noob to Master Ep3 (6:23)

  • The Power of Dynamic Panels | Axure RP: Noob to Master Ep6 (8:12)

  • Masters vs Dynamic Panels | Axure RP: Noob to Master Ep12 (6:56)

  • Responsive Prototypes with Adaptive Views | Axure RP: Noob to Master Ep14 (7:45)

  • Export to HTML or Share On AxShare | Axure RP: Noob to Master Ep29 (10:13)

  • Premade and Free Widget Libraries | Axure RP: Noob to Master - Ep39 (7:36)

  • Dynamic Product Grid and Lists with Repeaters | Axure RP: Noob to Master, Ep42 (11:53)

  • Repeaters: Adding Custom List Entries | Axure RP: Noob to Master, Ep43 (15:24)

  • Repeaters: Unique Content in Each of the Items | Axure RP: Noob to Master, Ep44 (13:58)

  • Repeaters: Remove Custom List Entry | Axure RP: Noob to Master, Ep57 (4:18)

  • Add Items to a Shopping Cart with Repeaters | Axure RP: Noob to Master, Ep58 (13:29)

  • Create mobile menus | Axure RP: Noob to Master, Ep59 (17:59)

  • Create Mobile Bubble Menu | Axure RP: Noob to Master, Ep60 (11:42)

  • Using Worksheet Table Data in Repeaters | Axure RP: Noob to Master, Ep63 (8:01)

• Import Figma Designs into Axure

• TRAINING AND SUPPORT (Axure RP 8)

• 教學影片: Axure RP 8.0 線上教學

  • 基礎教學

    • 基礎教學

    • 基礎互動設計

    • 發佈原型(雛型)

    • 共用區塊(Master)

    • 動態面板(Dynamic Panel)

    • 頁面功能

    • 流程圖 (Flow)

    • 規格文件 (Spec)

  • 進階教學

    • 進階動態面板

    • 物件(Widget)資料庫

    • 在手機上瀏覽原型(雛型)

• The 10 Commandments Of Efficient Design In Axure

• 25 Tips from a black belt in Axure