Learning Axure-Core Training: Complete 6 Tutorials in 1 Hour

从axure官网上面看来的入门介绍，网址http://www.axure.com/learn 以及官网上面提供的pdf版本

1 Getting Started

Add and format a widget, create a basic link, preview in your browser, get a link to share and then generate HTML locally.

步骤：

  1. 新建一个蓝色按钮
  2. 加链接
  3. 发布到AxShare
  4. 生成local文件

涉及到的操作和按钮：

  • "Widgets" pane： 组件库

  • button shape： 建立按钮

  • Fill Color： 在toolbar里面，可以换颜色

  • Create Link…： 在"Widget Interactions and Notes"面板的"Interactions" 里面，用来在button上面添加链接地址

  • "Preview"： toolbar里面，可以预览效果

  • "AxShare"： axure家的onlineshare，可以发布上去，得到项目url然后就能在网上看了

  • "Publish"： 用来导出？这个教程是生成HTML，CSS以及JS

  • "Generate HTML Files…"： 生成HTML文件

2 Working with Pages

Add and organize pages in the sitemap, setup the grid and guides, and style a single page or all pages at once.

步骤：

  1. 排布网页嵌套逻辑
  2. 在网页上面添加grid和create guide
  3. 在单网页上添加guide，在特定位置添加图片
  4. 网页选择居中对齐
  5. 改变所有网页的背景颜色
  6. preview

涉及到的操作和按钮：

  • Page 部分可以通过拖拽安排逻辑，在"Sitemap"面板
  • "Add > Child Page" 在页面右击选择可以添加子页面
  • 鼠标slow left-click可以给页面重命名
  • 在design area（工作区）右击"Grid and Guides > Show Grid" 可以显示grid，一些小的点点辅助
  • "Grid and Guides > Create Guides" 设置preset，生成grid分区
  • 从design area的顶部标尺向下拖拽可以产生page guide，如果同时点ctrl（windows）或者cmd（mac）可以生成global guide
  • "Page Properties"面板选择"Page Style"，改变Page Align为居中
  • Page Style Editor 在Page Style旁边的小按钮，可以改变背景颜色，把父网页的颜色同时改变了
  • page formatting changes:
    • just one page: in the Page Style tab of the Page Properties Pane
    • all pages: the Page Style Editor dialog
  • [Grid & Guides > Lock Guides]: 锁定guide使其保持不动

Widgets & Masters

Add, edit, and style widgets. Then, convert them to a Master that you can manage centrally and reuse throughout your design.

步骤：

  1. 插入button shape并设置mouseoverstyle
  2. 复制多个按钮并设置排布布局2widgetandmaster
  3. 转换button shapes为master 3widgetandmaster
  4. 把master放置在每个page上 4widgetandmaster
  5. 为master里面的button shape添加link 5widgetandmaster