axure商城

Axure高級功能自適應視圖的使用方法和技巧

原型工具可以說是交互設計師們的傍身利器。設計提案時想要“亮瞎”產品經理的眼?設計交付時不想啰哩啰唆寫一堆設計說明?項目開發前想要做用戶測試?“可交互”的原型可以很好地幫助你解決這些問題。

而Axure制作可交互原型卻不需要“重構/代碼/編程”知識,已然成為很多交互設計師的首選。

隨著2013年底Axure RP 7.0版本的正式發布,Axure7.0新增了很多對移動設計的樣式和功能支持,最實用的就是Adaptive Views(自適應視圖)。有了這個功能,設計師們就能灰常灰常高效地創建”響應式原型”。老板們再也不用擔心“什么時候才能看到響應式效果?”了。

今天就跟大家來分享下CDC交互設計師—杰斯卡,總結的有關Axure7.0高級功能—Adaptive Views(自適應視圖)的一些使用方法和技巧。

首先借著我個人的Axure使用經驗,簡單介紹下Axure“常用功能”的版本變化,如下圖(單擊圖片可查看大圖)。

0 (1)

說到我為什么認為Adaptive Views是Axure7.0對移動設計最實用的功能,因為Adaptive Views的功能優勢太強大啦!總結主要有四點:

一、“快速”生成多尺寸設計稿,調整便捷, “實時可預覽”;

二、可分享,CE階段效果堪比“視覺并開發”版本,收集意見,降低風險;

三、可分享,CE階段效果堪比“視覺并開發”版本,收集意見,降低風險;

四、響應式讓設計提案更生動

0 (2)

講到這里,來個實例,相信大家會有對這個功能會有更直觀的感受。~so,那就來一個!(此處要有掌聲~~!)

大家用iPad掃描下上圖中的二維碼,示例原型支持Ipad橫豎屏相應,PC上輸入網址http://8inx6g.axshare.com 也支持集中分辨率的響應變化。(由于時間有限,未添加多種手機分辨率的變化。在此還要感謝WE大會設計師瑞姐和大琴琴提供的設計稿素材)。

而說回“學會如何制作及使用”,也主要有四條原則:

1.設置自適應視圖;

2.明白視圖之間的繼承關系;

3.選擇合適的工作流程;

4.預覽、生成和共享;

這里就不再用文字一一講述,因為整理好的圖文教程更直觀。

最后再特別奉獻自制“圖文漢化版”Axure官方Adaptive Views詳細使用教程(http://www.axure.com/learn/adaptive),大家可以對照學習。

備注:因詳細教程部分圖片較多,單擊可查看大圖。

0 (8)

0 (15)

 

給TA買糖
共{{data.count}}人
人已贊賞
高級教程

如何提高Axure設計的效率 提高Axure設計效率的10條建議

2014-7-2 15:17:10

高級教程

Axure原型設計教程:鏈接跳轉到動態面板的某個狀態

2014-11-17 14:19:27

axure商城
0 條回復 A文章作者 M管理員
    暫無討論,說說你的看法吧
?
個人中心
購物車
優惠劵
今日簽到
有新私信 私信列表
搜索
俄罗斯videoxxxoo