Axure 原型 | 體驗Axure 8新特性-畫個高保真的手表

5 評論 21234 瀏覽 71 收藏 4 分鐘

一直非常喜歡有愛的設計,最近看了幾個手表的設計稿,嘗試使用axure的新特性模仿。

這個作品所有元素都可以使用現成的axure部件實現!先睹為快:點擊預覽

實現的功能有:

  1. 手表根據系統時間獲取
  2. 天氣依據時間,自動切換
  3. 模擬手表走時
  4. 天氣的開關
  5. 星期的顯示

未命名

下面介紹axure兩個新特性:

特性1:支持旋轉:(設置一個小的例子,去試試不同的組合會產生什么效果,立刻就能了解功能特性,網上教程也很多,我就不再贅述了)

2016-01-06_01-46-50

特性2:合并兩個部件(請嘗試使用,還有自定義變形工具)

月亮、云朵、天氣整體形狀、指針等,均可畫出!

2016-01-06_02-00-16

未命名2

下面開始具體的教程:

1、畫手表雛形 (矩形+圓形)

2016-05-12_22-58-31

2、繪制表盤[需要旋轉的指針使用兩個部件組合]

屏幕快照 2016-05-12 下午11.09.01

3、繪制天氣[利用形狀組合]

屏幕快照 2016-05-12 下午11.59.53

4、獲取系統時間讓指針動起來[使用新的旋轉特性\利用顯示和隱藏循環處理旋轉]

屏幕快照 2016-05-13 上午12.05.53

5、根據時間判斷天氣應該是白天還是夜間

屏幕快照 2016-05-13 上午12.35.23

6、繪制控制天氣的界面[主要做一個開關,用于顯示和隱藏天氣]

屏幕快照 2016-05-13 上午12.39.08

7、繪制一個半圓刻度[做一個手指觸摸表盤邊緣設置倒計時的效果]

屏幕快照 2016-05-13 上午12.51.39

按步驟做下來就可以實現初步的效果, 一些光暈和透明度,在控件的屬性設置里都能調節!

這個大約是5個月前做的,使用的是測試版本的axure8,之前由于沒有空編輯這個教程所以拖了半年才發布,也是懶到家了。

原型下載地址:

作者地址下載:http://pan.baidu.com/s/1mijI9jM。密碼:v7ae

官方下載:http://pan.baidu.com/s/1geVFLyb

在線預覽:點擊預覽

 

本文由 @陳張良 原創發布于人人都是產品經理?,未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 做的太棒啦!膜拜一下! ??

    來自本機地址 回復
  2. ??

    來自廣東 回復
  3. 很受啟發!旋轉也可以這么玩!

    來自廣東 回復