中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

今天決定開(kāi)一個(gè)新坑，來(lái)講講產(chǎn)品經(jīng)理的大殺器——Axure。

眾所周知Axure是款原型設(shè)計(jì)工具，應(yīng)用十分廣泛。在國(guó)內(nèi)近年來(lái)也有一些創(chuàng)業(yè)公司在做原型設(shè)計(jì)工具，如墨刀、mockplus等，主打簡(jiǎn)單、易用。但是Axure依然是主流。當(dāng)然了我并不是說(shuō)它們不好，其實(shí)我都有用過(guò)，對(duì)于新手來(lái)說(shuō)，確實(shí)是很容易上手。

但是我想提醒的一點(diǎn)是，很多“易用”其實(shí)是甜蜜陷阱，在這些主打簡(jiǎn)單易用的原型工具上，很多細(xì)節(jié)其實(shí)你沒(méi)法仔細(xì)思考其中的奧妙。很多效果都是工具給你封裝好的，你拖一拖就完事了，這也限制了你的創(chuàng)造力。你只是在利用別人給你做好的輪子，你無(wú)法創(chuàng)造一個(gè)輪子。國(guó)產(chǎn)的原型工具設(shè)計(jì)出發(fā)點(diǎn)和理念很好，便利的同時(shí)就是要犧牲一點(diǎn)創(chuàng)意與成長(zhǎng)空間。

目前的很多Axure教程都是按著特定的例子來(lái)的，標(biāo)題一般長(zhǎng)這樣：

• Axure教程：做出模擬時(shí)鐘的效果？
• Axure教程：如何做出滑動(dòng)解鎖的效果？

那我這個(gè)Axure之旅和Axure教程有啥區(qū)別呢？回到很久就以前就有人提到產(chǎn)品經(jīng)理的道與術(shù)，是的，借用一下這個(gè)概念。我想講的是Axure的道。

在這系列文章中，你不會(huì)看到太多的具體操作，以及那些無(wú)數(shù)你看不懂的公式（許多作者在文章中給出一個(gè)公式然鵝沒(méi)有解釋?zhuān)粝乱荒樸卤鹊男“?。）在這里我想分享的是如何運(yùn)用工具去創(chuàng)造，將你腦子里的東西用可視化的形式展示出來(lái)。

本文閱讀有一點(diǎn)難度，建議新手可以收藏，學(xué)完Axure基本操作后再來(lái)看。

好，接下去進(jìn)入正題。

我把任意效果，都抽象為三層。

表現(xiàn)層：

就是這個(gè)效果（組件）長(zhǎng)什么樣，比如我們常見(jiàn)的淘寶五星打分，樣子就是這樣。

邏輯層：

用一個(gè)經(jīng)典的句式來(lái)描述：if…then…

還是拿五星好評(píng)的例子舉例。

if我鼠標(biāo)移動(dòng)到星星上then星星變成黃色

if我鼠標(biāo)移出星星then所有星星都變成白色
……

數(shù)據(jù)層：

數(shù)據(jù)層是你想展示給用戶(hù)的東西。 表現(xiàn)層通過(guò)邏輯層連接數(shù)據(jù)層。

一般可以用一個(gè)公式表示：

數(shù)字=星星數(shù)

用一個(gè)圖表示就是：

有了這個(gè)的關(guān)系，我們就可以分析絕大部分效果。

假設(shè)，我們要做一個(gè)這樣的效果，如圖：

分析如下：

表現(xiàn)層：

• 矩形框box
• 文字label
• 音量icon
• 滑竿dynamic panel

（動(dòng)態(tài)面板，凡是能夠拖動(dòng)、變化的東西，一般都是用這個(gè)組件做的，因?yàn)橹挥兴型蟿?dòng)事件。這點(diǎn)就需要一點(diǎn)使用經(jīng)驗(yàn)了。）

好，我們照著在Axure里畫(huà)一個(gè)：

邏輯層：

• if我拖動(dòng)滑塊then右邊的數(shù)字會(huì)跟著我的滑動(dòng)在0到100之間變化。
• if我拖動(dòng)滑塊到最左邊then無(wú)法繼續(xù)拖動(dòng)
• if我拖動(dòng)滑塊到最右邊then無(wú)法繼續(xù)拖動(dòng)

這邊有一個(gè)拖動(dòng)的限制，這個(gè)我們可以通過(guò)限制動(dòng)態(tài)面板的邊界實(shí)現(xiàn)。主要講下思路：

• 動(dòng)態(tài)面板的x軸數(shù)值不能小于滑軌的x軸。
• 動(dòng)態(tài)面板的x軸數(shù)值不能大于滑軌的x軸與滑軌長(zhǎng)度之和。

所以設(shè)置如下：

left 大于或等于[[LVAR1.x]]

left小于或等于[[LVAR1.x+LVAR1.width]]

其中LVAR1是本地變量，指向滑軌。

這里我們已經(jīng)可以實(shí)現(xiàn)滑軌移動(dòng)了。

這里我們觀察到當(dāng)滑塊在最左邊時(shí)候數(shù)字為0，在最右邊的時(shí)候數(shù)字為100，可以知道其實(shí)滑塊的位置占滑軌的百分比就是數(shù)字變動(dòng)的規(guī)律。

那么數(shù)據(jù)層就是：

數(shù)據(jù)層：

數(shù)字=100*滑塊占滑軌的百分比。

進(jìn)一步翻譯層Axure公式就是：

數(shù)字=[[(((slider.x-slide.x)/slide.width)*100).toFixed(0)]]

解釋一下公式：

（滑塊的x值-滑軌的x值）/滑軌的寬度整個(gè)值保留0位小數(shù)

x.toFixed（y）函數(shù)，即對(duì)x保留y位小數(shù)。

至此，這個(gè)效果完美實(shí)現(xiàn)。

預(yù)覽

總結(jié)一下：

將你想達(dá)成的效果分拆為表現(xiàn)層、邏輯層、數(shù)據(jù)層，表現(xiàn)層通過(guò)拖拽組件實(shí)現(xiàn)，邏輯層通過(guò)事件觸發(fā)，數(shù)據(jù)層通過(guò)Axure函數(shù)實(shí)現(xiàn)。

開(kāi)始你的Axure之旅吧！

本文由 @躚塵 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來(lái)自PEXELS，基于CC0協(xié)議