① AXURE RP 8怎麼設置下拉菜單 AXURE下拉菜單的製作方法
axure中想要製作下拉菜單,該怎麼製作呢?下面我們就來看看詳細的教程。
先看效果
1、先把自定義的 下拉菜單 樣式設計好, 注意組件結構
2、批量編輯子選項按鈕的懸停,點擊和選中的樣式
1)批量選中所有按鈕
2)點擊右側面板的 交互樣式 中的 滑鼠懸停
3)編輯自定義按鈕樣式
用同樣的方法,設置下拉框的 交互樣式
3、把選項和背景一起設為動態面板,並命名“ 下拉選項-01 ”,命名最好在後面帶幾個數字,因為這樣在後面使用到該組件的時候方便搜索使用
4、設置點擊下拉框時的 選中狀態 ,並根據選中的狀態來決 定下來菜單是否顯示和箭頭的上下狀態 。
1)單擊下拉框,切換其選中狀態。
2)設置 選中時的樣式和狀態: 顯示下拉選項面板+箭頭向下(這里建議用絕對值),同樣的方法,設置下拉菜單的 取消選中時的狀態樣式 。
5、設置點擊選項時的效果
1)下拉選項面板收起,其實就是讓下拉框處於 取消選擇狀態
2)把選中的下來選項回顯在下拉框上。這里使用axure函數變數 [[This.text]] 來設置
6、設置好後,就可以復用了。 右鍵交互事件Case 1復制(Ctrl+c),然 後反擊下面兩個選項,一個一個粘貼(Ctrl+v).
7、到這里基本就差不多了,最後,把下拉選項動態面板隱藏。
8、再把這個組件設為動態面板,然後勾選“ 自動調整為內容尺寸 ”,這樣的好處時隱藏掉的部分,不再佔用空間,更有利於原型的排版。但是有一點,這樣做的話,顯示隱藏時的推拉組件功能會對動態面板外的組件失效。
以上就是AXURE下拉菜單的製作方法,希望大家喜歡,請繼續關注我們。
Axure怎麼製作頁面滾動時菜單固定在頂部的頁面?
② axure有哪些鮮為人知的使用技
1,把當前的xx轉化為圖片。這個功能可以解決你原型中文字的字體或者大小或者換行等在瀏覽器中預覽的一系列問題。
2,你也可以用axure代替viso來做流程圖。個人覺得更順手。
3,用axure生成一個多觸發的小游戲或者課件。然後發布成網頁壓縮包。發給別人玩或者瀏覽。
4,圖片熱區功能可以很好的解決使用者滑鼠經過時游標變化體驗的同時,范圍性的點擊也會讓小按鈕更好點。特別是當你做觸屏手游的時候。
5,良好的習慣,可以使你用得上更多的發布功能,特別是規格說明書。
6,用axure可以找到志同道合的朋友,比如說你給的都是干貨時候,(項目經理和產品經理應該是主要讀者),給你點贊的人,絕對是個心胸開闊的尊敬他人的人,他身邊的人對他評價應該也不錯。在文中給予評論的則是尊敬技術的,並樂於分享自己經驗看法的人,他們也是有匠心精神的人。
重復比較多的地方請盡量使用母板,最好是非固定位置的母板。
當功能不太好實現的時候(或者一時想不出來的時候),試試用動態面板,也許會有意想不到的方法。
Axure裡面的語句執行是有先後順序的。所以有時候如果你的語句設置都沒有問題,但是怎麼也出現不了應有的效果,請檢查一下你的語句防止是否有問題。
用Axure可以對圖片進行裁剪、拼接。
Axure可以對圖片進行切圖操作。
1.母版自定義觸發事。
2.動態面板多層嵌套。
3.自定義格式刷和注釋欄位。
用透明矩形框來做頁面級交互事件
具體步驟如下:
1.設計完全部原型(不可點擊);
2.把需要跳轉頁面的點擊區域,畫一個矩形框,設定好交互事件;
3.把矩形框設為透明;
4.復用到其他區域;
好處:
1.全部設計原型後再細化交互細節,可以避免陷入[摳細節]狀況,提高了設計效率;
2.用獨立矩形框設定交互,可以很快的復用到不同頁面,不同區域,簡單方便直接;
1,使用Project。如果你是團隊協作,Project無疑會使整個項目效率顯著提高且減少出錯;如果自己單獨使用也是好過Save的,可以方便做版本回溯。
2,更多時候,請把精力聚焦到線框的邏輯與結構,而非交互效果上,盡可能用簡潔的文字、分鏡、示意圖把交互效果描述清楚。很多人追求把交互效果做的跟flash或js編程似的,這完全本末倒置。
1.判斷
在遇到幾乎任何「什麼什麼時候」,想要「怎麼怎麼樣」的情況,能且只能用UC用例的判斷來實現。這幾乎是高保真原型的靈魂。
2.智能手機上那種圖片滑動效果
需要至少兩重動態面板嵌套才能保證滑動(Axure里是Drag拖動)時,不超出范圍顯示,至於滑動到一定程度返回,則需要結合判斷裡面「元件范圍」的接觸另一個控制項與否,然後用動作來實現。
能實現iPhone 在iOS 7那種解鎖。
3.自適應屏幕
這里說的不是Axure 7自帶的那個坑爹的自適應,在顯示左側站點地圖或者像素有一點點差別就失效的效果怎麼拿得出手呢?而這些其實是可以通過調用屏幕尺寸來強行使原型適應屏幕的。
比如一個banner,寬度=屏幕寬度;比如一個App原型,讓iPhone 機身始終處於屏幕水平垂直居中位置;Gmail 進度條也是一樣。
4.文本模糊搜索/分詞搜索
這些都可以利用中繼器實現,只是稍微麻煩點,要從另一列數據中包含搜索,並且那一列數據要寫得比較全面在查找部分里可以找到。用sousuo那一列里的關鍵詞都能搜出左邊的東西。
5.圖片文件上傳
自從文本框可以設置為文件類型,支持用戶選擇電腦文件的時候,我就知道總有一天可以實現圖片上傳。上傳的圖片只要是圖片,不管什麼格式都能正常顯示,不用在Axure里一個個後綴名單獨設置。我的做法是文件類型文本框選擇了一個文件之後,將文本框內的數據通過字元串函數進行一系列處理,在一個內部框架中打開。
6.圖片旋轉/翻轉
把同一張圖片放到不同尺寸/轉向的「圖片」控制項里,所有控制項以一個動態面板不同的狀態的形式保存,然後用一個UC設置動態面板的狀態「重復」顯示「下一個狀態」即可。
7.圖片按比例放大縮小
需要把圖片當作動態面板背景,並且在面板設置里設置好,才能用UC和變數控制它的比例縮放,此功能能衍生出非常多的效果。
③ 如何學習使用 Axure
以我自己為例,回答下這個問題,接觸Axure到熟練製作原型大概也就半個月的時間:
第一階段:熟悉Axure的基本用法
當時從網上下了一個 Axure實用實例合集的原型PR文件,忘了是不是官方出的,題主可以下載:axure實用實例.rp_免費高速下載,裡面對Axure常用各個部件和常見交互實現都有說明,看懂裡面的實現方式,基本就知道怎麼用Axure了。
第二階段:用Axure畫原型表達自己的想法
知道工具的使用規則,如何合理的運用,其實每個人都可以有不同的方式。比如需要策劃一個網站,拿主頁來說,先提煉出這一頁需要放哪些元素,比如:banner、導航、熱點推薦、頻道推薦、圖片列表等,那就先用axure把這些元素表達出來,什麼位置什麼大小,然後考慮需要做交互的元素,把它變成動態面板什麼的,可以嘗試實現一些比較簡單的交互,不會或實現不了的直接在頁面上用文字說明就行,這就是所謂的⎡線框圖原型⎦。
原型就是為了讓RD快速了解你的需求嘛,達到目的就行~
第三階段:用Axure製作高保真原型
⎡高保真原型⎦不是給UI或者RD看的,一般是為了讓老闆/客戶能更好的理解你要做的產品,給他們一種更直觀的感受,讓他們能夠快速決策是不是要做。
高保真原型需要你有一定的PS功底,不會PS的讓設計師根據你的線框圖幫忙畫也行⎡機智的我一般直接拿競品或類似產品的截圖來改,超級省時間⎦,總之要好看,有色彩有交互。
基本上Axure可以實現大多數你見過的交互,這個題主可以多研究下⎡動態面板⎦和⎡變數⎦的使用,復雜的交互實現起來需要嚴謹的邏輯,一般要多考慮層級、變數條件和觸發條件。遇到自己不知道如和下手的交互,就到網上找實例,看看別人怎麼做的,看得多了就通了,其實原理就一個:通過觸發條件響應事件,後面就沒有什麼交互能難倒題主了,當然有些交互用Axure實現成本比較高。
題主可以下載鄙人12年做的一個高保真原型:haiwai_new.rp_免費高速下載 摸懂了交互就不在話下了。
第四階段:不局限於Axure工具
畫原型的作用不僅僅是快速傳遞需求,表達想法。其實畫原型也是產品經理驗證自己想法的一種方式,你在實現原型的時候可能會發現自己沒有考慮全或者想法有錯誤的地方,這樣解決完以後就能避免在開發過程中遇到這些問題。
不過不一定非要用Axure,畫圖、excel、手繪等都能實現原型,就像楊過學習獨孤前輩的劍法,從巨劍、鐵劍、木劍到最後的無劍,掌握了思路和核心,功力到了,隨手的都是工具。
④ 如何使用Axure高效完成高保真原型
1、前期工作
1.1頁面邏輯梳理
利用思維導圖,以功能點(完成目標)為導圖的第一級子集,梳理頁面,其實這件事情很困難,如果沒有熟悉業務的同事幫助,會消耗相當長的時間,我這里也是很大方面藉助了Chester之前的整理。由於整個的視覺文件都是英文的,所以還是花了不少時間去理解。
之後我根據頁面布局,將布局類似的頁面從新歸類到一起,這是為了方便後期多層動態面板的設置及頁面間的復制。
1.2得心應手的部件庫
使用Axure,自然少不了給力的部件庫,強大的部件庫可以極大程度上提高我們的效率,增強演示效果。網上也可以搜索到一些還不錯的部件庫,比如小樓老師的axure7.0部件庫。但是別人的部件庫未必適合我們的產品風格及需要,所以最好還是要有自己的部件庫。我是個懶人,所以我經常做一勞永逸的事情,由於我長期從事電商工作,所以我專門設計了一個電商專用部件庫,再加上從其他人的部件庫中汲取的復雜交互部件,現在我的部件庫中已具備了90餘個部件,基本可以應對常規設計的絕大部分情況。
另外,由於部件庫是自己製作的,所以非常熟悉,用起來自然得心應手,事半功倍。
2、正式工作
2.1背景設置
這里說的背景設置一方面就是你們所理解的背景設置,另外一方面是指通過設置形狀(無邊框,填充顏色同背景色或透明)來設置背景。為什麼要做這么一件多此一舉的事情呢?這是考慮到一些可變部件,比如移動到絕對位置,固定在瀏覽器等等,另外一方面如果不製作這層背景,那麼在製作動態面板時,搞不清楚外部情況,或者文字/圖片放在最頂部,絕對是件很別扭的事。
2.2交互規則統一
由於我所設計Software Web application是由UI設計師完成的,所以在交互規則上欠統一,主要是以下幾個方面:1、下拉效果2、tab滑動效果3、hover選中4、面板切換推拉方式。這時,我就與Chester商量統一的方式,他給予我極大的信任及自由,這讓我不再畏手畏腳,從而放心大膽地選擇或從新設計交互方式。
2.3設計風格統一
主要是字體,字型大小、顏色、形狀、圓角等,在此不提。
2.4母版製作
母版,相信大家都經常用的,好處多多,諸如方便修改,復制簡單等等。這里我要說說自己的母版製作規則:
1、只做頻繁使用的地方
只是為了控制母版的數量,方便後期迭代時的梳理與查找。
2、先難後易
復雜交互往往是由多個簡單交互組成,所以在完成了復雜交互後,許多簡單交互只需要復制即可,而如果先做簡單交互,則在組成復雜交互時可能會受到邏輯順序和層級關系的影響,反而增加製作難度。
3、先全局後細節
在製作母版時,往往會遇到做完一個母版後,發現之前的母版可以跟這個母版合並,因此先做全局的母版更容易考慮到一些細節性的部件,進而減少操作難度。同時先做全局母版也更利於我對頁面布局的把控,能夠增加效率與成就感。
4、常用break away
這里即把母版作為一個部件用,因為在設計中不能及時製作相應的部件,所以將常用部件生成母版後,通過break away還原成部件是一個不錯的選擇。
5、命名很重要
命名真的很重要,如果名字起不好,就很有可能混淆,尤其是與其他人共同完成時,命名尤為重要。
2.5瘋狂的中繼器
中繼器是Axure7.0推出的功能,許多axure的使用者看到中繼器的高級函數就望而卻步,加上動態面板足夠強大,以至於明珠蒙塵。我在高保真的製作中使用了大量的中繼器,一個頁面中甚至使用超過4個,我甚至想到把絕大多是部件都轉化成中繼器。個人認為中繼器有以下幾個好處:1、靈活性強2、交互簡單3、復制簡單。當然中繼器也有諸多不足,動態面板依然是Axure部件中的王者。
2.6多層動態面板
針對頁面布局類似的頁面,我採用了多層動態面板的做法,以至於最終那110頁視覺圖被我做成了9張網頁,最多的一個頁面的主動態面板有8層,演示下來也是相當流暢。在使用多層動態面板時,應注意如下幾點:
1、注意麵板層級及其他頁面的邏輯
因為在製作頁面或動態面板時,往往是做好了前面一個再做後面後面,或者復制前面一個為新的頁面或模板,而之前頁面或面板與之後的對象之間的聯系,如鏈接,按鍵等的交互是在後期加上去的,這就會出現忘記增加交互的情況。
2、注意層級關系,善用面板隱藏
各個部件間的層級關系許多妥善處理,並且經常使用部件管理中的隱藏部件功能,才不會犯層級錯誤,顯示不完全的低級錯誤。
3、命名很重要
同母版部分。
2.7其他
1、細節討論。
問題是在執行時發現的,遇到疑惑或者趕緊不合理的地方,記錄下來,與業務人員或者設計人員討論,並提出自己的觀點,確保大家都clear,才能保證設計的快速展開。
2、時間管理
拿到任務後,我對任務進行了評估,然後得出自己每天工作9個小時要完成35頁左右的結論。但實際上有經驗的axure使用者都知道,困難都在前期,後面速度會非常快。
我使用的是番茄計時器,3天里平均每天工作19個番茄時間(25min*19),加上休息時間,大概每天工作9~10個小時,第一天第一個母版我做了5個小時,全天完成22個頁面,但在第三天的下午5點鍾我就完成了110個頁面的任務。
3、進度管理
為了明確知道自己的進度,我使用前期准備的頁面邏輯導圖,每隔一段時間就在導圖上用黑色標注自己已經完成的頁面,這樣一方面讓我對自己的進度有了較好的把控,另一方面也讓Chester那邊明確我的進度,能夠知根知底。
總結:
交互設計應當是每個產品經理的基本功,雖然交互工具的使用並不代表交互水平,但善用交互工具無疑能夠增強我們的交互功力,使我們的思維邏輯更加縝密,並能了解產品邏輯,甚至研發實現難度。
⑤ 如何使用Axure
基本概念就是 頁面、控制項、跳轉、動態面板,條件判斷,給頁面、面板取名字。 頁面裡面可以放各種控制項,點擊控制項可以實現頁面之間的跳轉。 動態面板就是一個局部的小頁面,也叫面板,裡面的內容分為a,b,c,d....各種狀態,比如你點擊一下某個按鈕,這個小頁面就從a狀態 切換到b狀態,這就是「動態」的意思。 條件判斷就是,比如點擊登陸按鈕,要判斷賬號輸入框里是否有文字,沒有的話就要顯示一條提示,提示放在一個動態面板中,默認為不顯示的狀態,點擊按鈕後觸發動態面板切換到顯示狀態,但是中間要加上一條判斷。 取名字很重要,跳轉需要通過頁面名字確定跳到哪個頁面,條件判斷需要通過名字確定被判斷的對象是誰。取名字都是通過選中對象,然後在右邊右上角有輸入框。
⑥ Axure有哪些鮮為人知的使用技巧
1,把當前的xx轉化為圖片。這個功能可以解決你原型中文字的字體或者大小或者換行等在瀏覽器中預覽的一系列問題。
2,你也可以用axure代替viso來做流程圖。個人覺得更順手。
3,用axure生成一個多觸發的小游戲或者課件。然後發布成網頁壓縮包。發給別人玩或者瀏覽。
4,圖片熱區功能可以很好的解決使用者滑鼠經過時游標變化體驗的同時,范圍性的點擊也會讓小按鈕更好點。特別是當你做觸屏手游的時候。
5,良好的習慣,可以使你用得上更多的發布功能,特別是規格說明書。
6,用axure可以找到志同道合的朋友,比如說你給的都是干貨時候,(項目經理和產品經理應該是主要讀者),給你點贊的人,絕對是個心胸開闊的尊敬他人的人,他身邊的人對他評價應該也不錯。在文中給予評論的則是尊敬技術的,並樂於分享自己經驗看法的人,他們也是有匠心精神的人。
@孫一,互聯網
重復比較多的地方請盡量使用母板,最好是非固定位置的母板。
當功能不太好實現的時候(或者一時想不出來的時候),試試用動態面板,也許會有意想不到的方法。
Axure裡面的語句執行是有先後順序的。所以有時候如果你的語句設置都沒有問題,但是怎麼也出現不了應有的效果,請檢查一下你的語句防止是否有問題。
用Axure可以對圖片進行裁剪、拼接。
Axure可以對圖片進行切圖操作。
@小樓,產品人
1.母版自定義觸發事。
2.動態面板多層嵌套。
3.自定義格式刷和注釋欄位。
@Capricornushane,產品經理
用透明矩形框來做頁面級交互事件
具體步驟如下:
1.設計完全部原型(不可點擊);
2.把需要跳轉頁面的點擊區域,畫一個矩形框,設定好交互事件;
3.把矩形框設為透明;
4.復用到其他區域;
好處:
1.全部設計原型後再細化交互細節,可以避免陷入[摳細節]狀況,提高了設計效率;
2.用獨立矩形框設定交互,可以很快的復用到不同頁面,不同區域,簡單方便直接;
@冬源,交互設計
1,使用Project。如果你是團隊協作,Project無疑會使整個項目效率顯著提高且減少出錯;如果自己單獨使用也是好過Save的,可以方便做版本回溯。
2,更多時候,請把精力聚焦到線框的邏輯與結構,而非交互效果上,盡可能用簡潔的文字、分鏡、示意圖把交互效果描述清楚。很多人追求把交互效果做的跟flash或js編程似的,這完全本末倒置。
@王俊傑,產品人
1.判斷
在遇到幾乎任何「什麼什麼時候」,想要「怎麼怎麼樣」的情況,能且只能用UC用例的判斷來實現。這幾乎是高保真原型的靈魂。
2.智能手機上那種圖片滑動效果
需要至少兩重動態面板嵌套才能保證滑動(Axure里是Drag拖動)時,不超出范圍顯示,至於滑動到一定程度返回,則需要結合判斷裡面「元件范圍」的接觸另一個控制項與否,然後用動作來實現。
能實現iPhone 在iOS 7那種解鎖。
3.自適應屏幕
這里說的不是Axure 7自帶的那個坑爹的自適應,在顯示左側站點地圖或者像素有一點點差別就失效的效果怎麼拿得出手呢?而這些其實是可以通過調用屏幕尺寸來強行使原型適應屏幕的。
比如一個banner,寬度=屏幕寬度;比如一個App原型,讓iPhone 機身始終處於屏幕水平垂直居中位置;Gmail 進度條也是一樣。
4.文本模糊搜索/分詞搜索
這些都可以利用中繼器實現,只是稍微麻煩點,要從另一列數據中包含搜索,並且那一列數據要寫得比較全面在查找部分里可以找到。用sousuo那一列里的關鍵詞都能搜出左邊的東西。
5.圖片文件上傳
自從文本框可以設置為文件類型,支持用戶選擇電腦文件的時候,我就知道總有一天可以實現圖片上傳。上傳的圖片只要是圖片,不管什麼格式都能正常顯示,不用在Axure里一個個後綴名單獨設置。我的做法是文件類型文本框選擇了一個文件之後,將文本框內的數據通過字元串函數進行一系列處理,在一個內部框架中打開。
6.圖片旋轉/翻轉
把同一張圖片放到不同尺寸/轉向的「圖片」控制項里,所有控制項以一個動態面板不同的狀態的形式保存,然後用一個UC設置動態面板的狀態「重復」顯示「下一個狀態」即可。
7.圖片按比例放大縮小
需要把圖片當作動態面板背景,並且在面板設置里設置好,才能用UC和變數控制它的比例縮放,此功能能衍生出非常多的效果。
@王文忠,產品經理
比如切圖(摳圖)啊,各種動作啊,各種函數和條件的結合運用。
⑦ 怎麼使用Axure的
全名應該是這個「Axure RP」
Axure RP--是一個非常專業的快速原型設計的一個工具,客戶提出需求,然後根據需求定義和規格、設計功能和界面的專家能夠快速創建應用軟體或Web網站的線框圖、流程圖、原型和規格說明文檔。
Axure RP--作為專門的原型設計的工具,它比一般創建靜態原型的工具如Visio、Omnigraffle、Illustrator、Photoshop、Dreamweaver、Visual Studio、FireWorks要快速、高效。
它同時支持多人協作設計和版本控制管理。
使用Axure可以帶來一些工作方式的改變:
進行更加高效的設計;
體驗到動態的原型;
清晰有效的交流想法。
希望對您有所幫助,希望採納,謝謝!
⑧ axure是做什麼用的
Axure RP是一款專業的快速原型設計工具。Axure(發音:Ack-sure),代表美國Axure公司;RP則是Rapid Prototyping(快速原型)的縮寫。
Axure RP是美國Axure Software Solution公司旗艦產品,是一個專業的快速原型設計工具,讓負責定義需求和規格、設計功能和界面的專家能夠快速創建應用軟體或Web網站的線框圖、流程圖、原型和規格說明文檔。作為專業的原型設計工具,它能快速、高效的創建原型,同時支持多人協作設計和版本控制管理。
工作環境
Axure的可視化工作環境可以讓你輕鬆快捷的以滑鼠的方式創建帶有注釋的線框圖。不用進行編程,就可以在線框圖上定義簡單連接和高級交互。在線框圖的基礎上,可以自動生成HTML(標准通用標記語言下的一個應用)原型和Word格式的規格。