㈠ 如何利用Axure RP 8製作登錄並鏈接功能
第一步,打開Axure RP 8軟體,找到「Rounded Rectangle」,拖出一個到Home頁面
第二步,拖出兩個「Label」和兩個「Text Field」到Home界面,並修改了Label標簽內容
第三步,再拖出兩個「Link Button」、一個「Vertical Line」、一個」Checkbox「和兩個」HTML Button「,並修改其顯示的內容
第四步,為了限制用戶名、密碼輸入,將用戶名長度限制為20,密碼長度也為20,並且顯示成密碼格式輸入
第五步,給」忘記「和」注冊「添加鏈接,一個鏈接到」Page 1「,另一個鏈接到」Page 2「
最後一步,在瀏覽器上預覽,點擊」忘記「或」注冊「
㈡ 利用axure進行響應式自適應網站的設計
在axure 8發布以後,可以利用幾項技術(axure自動生成自適應html、前後端分離、響應式網站設計、restful介面、json或xml等)進一步簡化網站的開發,該設計模式的主要流程如下:
1. 產品經理利用axure設計原型。
2. 原型討論定型後由UI人員設計圖標,更新到axure原型中。
3. 由axure生成 自適應的響應式網站 設計的html文件。
參考:http://www.woshipm.com/rp/696039.html
注意:axure發布項目生成html時,在左側的「 移動設備 」這個設置頁,需要 勾選「包含視口標簽」,不勾選「禁止頁面垂直滾動」,寬度設置為「device-width」, 高度留空不設置,初始縮放倍數絕對不能設置 ,最小縮放倍數設置為「0.1」,最大縮放倍數設置為10,允許用戶縮放留空不設置 ,ios部分可以不理默認即可。另外需要 axure 8以上版本才能普遍適配手機 屏幕。
4a. 前端開發人員全盤使用上面生成的html文件、資源文件、axure的js文件,在各個頁面上以前後端分離方式添加業務邏輯的實現(比如在html中加入jquery的ajax,和後端交互數據)。
4b. 後端開發人員設計和實現業務邏輯和前後端介面(4b可以和3、4a步驟同步進行),比如前後端使用restful的json封裝作為前後端介面的數據交互。
5. 單元測試、集成測試、灰度測試,bug修復,發布上線。
該模式問題 : 一旦axure原型有修改,前端怎麼能更快適配該修改(現在是文件比較方式,類似git的merge)。
http://www.car-ocean.com/app-download/news.html
㈢ 如何利用Axure RP 8設計按鈕控制頁面框改變大小
具體步驟如下: 1、打開Axure RP,然後新建一個原型網頁,如下圖 2、在打開的界面中,選擇底部菜單中的小桶圖標,選擇背景色 3、設置背景顏色以便於觀察背景圖片,在這里設置的是淺灰色系 4、背景顏色已經設置好了
㈣ rp8怎麼製作購物網站
1、在AxureRP8軟體內注冊店鋪。
2、准備店鋪資料。
3、將資料填入AxureRP8進行店鋪裝修。
4、提交審核。
5、審核通過店鋪就可以售賣了。AxureRP8是一款專業快速原型設計軟體。主要是針對負責定義需求、定義規格、設計功能、設計界面的專家,包括用戶體驗設計師、交互設計師、業務分析師、信息架構師、可用性專家和產品經理。
㈤ 如何利用Axure RP 8設計注冊界面
注冊界面的原型製作很簡單,直接拖放「文本框」元件、「文本標簽」元件,調整尺寸、位置、樣式即可。
效果圖:
如果是交互上,那有很多鍾注冊方案,你需要先確定好。比如較為快捷的方式:手機端驗證碼方式注冊,第三方微信、QQ注冊等等。主要看適不適合你自己產品。
所以說,注冊重在注冊的流程,並不是要用Axure怎麼設計注冊界面,Axure只是個軟體工具而已。
㈥ 如何利用Axure RP 8設計軟體設置Android樣式圖
若要解釋清楚像素和解析度需要的篇幅比較長,請大家參考網路。 這里金烏直接給大家提供一個常用的移動設備尺寸列表,製作原型時根據查詢的尺寸在axure中設置大小即可,設計完畢後在生成HTML時設置 手機/移動設備 中勾選包含視圖介面( include Viewport tag ),並進行配置即可。 如: iPhone4 320*480 iPhone5 320*568 Samsung Galaxy S4 360*640 Viewport Sizes 設備名稱 系統平台 像素密度 屏幕尺寸 豎屏尺寸 橫屏尺寸 Acer Iconia Tab A100 Android 166dpi 7″ 800 1280 Acer Iconia Tab A101 Android 170dpi 7″ 600 1024 Acer Iconia Tab A200 Android 160dpi 10.1″ 800 1280 Acer Iconia Tab A500 Android 149dpi 10.1″ 648 1280 Acer Iconia Tab A502 Android 149dpi 10.1″ 800 1280 Ainol Novo 7 Elf 2 Android 170dpi 7″ 496 1024 Apple iPad iOS 132dpi 9.7″ 768 1024 Apple iPad 2 iOS 132dpi 9.7″ 768 1024 Apple iPad 3 (and 4) iOS 264dpi 9.7″ 768 1024 Apple iPad Mini iOS 163dpi 7.9″ 768 1024 Apple iPhone 3G iOS 163dpi 3.5″ 320 480 Apple iPhone 3GS iOS 163dpi 3.5″ 320 480 Apple iPhone 4 iOS 326dpi 3.5″ 320 480 Apple iPhone 4S iOS 326dpi 3.5″ 320 480 Apple iPhone 5 iOS 326dpi 4″ 320 568 Apple iPod Touch iOS 163dpi 3.5″ 320 480 Archos 70b (it2) Android ?? 7″ 600 1024 Archos 80G9 Android 160dpi 8″ 768 1024 Arnova 7 G2 Android ?? 7″ 480 800 Arnova 7FG3 Android ?? 7″ 640 1067 Arnova 8C G3 Android 125dpi 8″ 800 1067 Arnova 10b G3 Android 160dpi 10.1″ 600 1024 ASUS Padfone Android ?? 4.3″ 800 1128 ASUS Transformer Pad TF300T Android ?? 10.1″ 800 1280 ASUS Transformer TF101 Android 149dpi 10.1″ 800 1280 BAUHN AMID-972XS Android ?? 9.7″ 768 1024 BlackBerry 9520 Blackberry OS 185dpi 3.25″ 345 691 BlackBerry Bold 9360 Blackberry OS 246dpi 2.44″ 320 N/A BlackBerry Bold 9780 Blackberry OS 246dpi 2.44″ 480 N/A BlackBerry Bold 9790 Blackberry OS 246dpi 2.45″ 320 N/A BlackBerry Bold 9900 Blackberry OS 287dpi 2.8″ 356 N/A BlackBerry Curve 9300 Blackberry OS 246dpi 2.45″ 311 N/A BlackBerry Curve 9320 Blackberry OS 164dpi 2.44″ 320 N/A BlackBerry Curve 9380 Blackberry OS 188dpi 3.2″ 320 N/A BlackBerry PlayBook Blackberry Tablet OS 169dpi 7″ 600 1024 BlackBerry Torch 9800 Blackberry OS 187.5dpi 3.2″ 320 480 BlackBerry Torch 9810 Blackberry OS 250dpi 3.2″ 320 480 BlackBerry Z10 Blackberry OS10 355dpi 4.2″ 345 521 Google Nexus 5 Android 445dpi 4.95″ 360 598 HP Touchpad Android 132dpi 9.7″ 768 1024 HP Veer WebOS 197dpi 2.6″ 320 545 HTC 7 Mozart Windows Phone 7 252dpi 3.7″ 320 480 HTC 7 Trophy Windows Phone 7 245dpi 3.8″ 320 480 HTC Desire Android 252dpi 3.7″ 320 533 HTC Desire C Android 164dpi 3.5″ 320 480 HTC Desire HD Android 216dpi 4.3″ 320 533 HTC Desire Z Android 252dpi 3.7″ 480 800 HTC Evo 3D Android 256dpi 4.3″ 540 960 HTC Legend Android ?? 3.2″ 320 480 HTC One S Android 256dpi 4.3″ 360 640 HTC One V Android 252dpi 3.7″ 320 533 HTC One XL Android 260dpi 4.7″ 360 640 HTC Sensation XL Android 198.5dpi 4.7″ 360 640 HTC Titan 4G Windows Phone 7 198.5dpi 4.7″ 320 480 HTC Velocity 4G Android 245dpi 4.5″ 360 640 HTC Wildfire S Android 180dpi 3.2″ 320 480 HTC Windows Phone 8X Windows Phone 8 341dpi 4.3″ 320 480 Huawei U8650 Android 165dpi 3.5″ 320 480 Kindle 3 Kindle 167dpi 6″ 600 N/A Kindle Fire HD 7 Android 216dpi 7″ 533 801 Kindle Fire HD 8.9 Android 254dpi 8.9″ 533 801 Kindle Fire HDX 7″ Android 323dpi 7″ 600 902 Kindle Paperwhite Kindle 212dpi 6″ 758 N/A Kobo eReader Touch Android N/A (E Ink) 6″ 600 N/A LG Optimus 2X Android 233dpi 4″ 320 533 LG Optimus L3 Android 125dpi 3.2″ 320 427 LG Optimus Pad Android 168dpi 8.9″ 768 1280 LG Viewty KU990 Java 155dpi 3″ 240 400 Microsoft Surface (RT) Windows RT 148dpi 10.6″ 768 1366 Motorola Defy Android 265dpi 3.7″ 320 569 Motorola Droid3 Android 275dpi 4″ 360 599 Motorola Droid Razr Android 256dpi 4.3″ 360 640 Motorola Milestone Android 265dpi 3.7″ 320 569 Motorola Razr HD 4G Android 312dpi 4.7″ 360 598 Motorola Razr M 4G Android 312dpi 4.7″ 360 598 Motorola Xoom Android 149dpi 10.1″ 800 1280 Motorola Xoom 2 Android 149dpi 10.1″ 800 1280 Nexus 4 Android 318dpi 4.7″ 384 598 Nexus 7 Android 216dpi 7″ 603 966 Nexus S Android 233dpi 4″ 320 533 Nokia 300 Nokia 167dpi 2.4″ 234 N/A Nokia 500 Symbian 229dpi 3.2″ 360 640 Nokia 700 Symbian 229dpi 3.2″ 240 427 Nokia 2700 S40 200dpi 2″ 240 N/A Nokia Lumia 520 Windows Phone 8 233dpi 4″ 320 480 Nokia Lumia 610 Windows Phone 7 252dpi 3.7″ 320 480 Nokia Lumia 710 Windows Phone 7 252dpi 3.7″ 320 480 Nokia Lumia 800 Windows Phone 7 252dpi 3.7″ 320 480 Nokia Lumia 820 Windows Phone 8 217dpi 4.3″ 320 480 Nokia Lumia 900 Windows Phone 7 217dpi 4.3″ 320 480 Nokia Lumia 920 Windows Phone 8 332dpi 4.5″ 320 480 Nokia Lumia 1020 Windows Phone 8 332dpi 4.5″ 320 480 Nokia Lumia 1520 Windows Phone 8 367dpi 6″ 320 480 Nokia N95 S60 154dpi 2.6″ 240 N/A Nokia N900 Naemo 267dpi 3.5″ 480 800 Panasonic Toughpad A1 Android 127dpi 10.1″ 768 1024 Samsung Galaxy Ace Android 165dpi 3.5″ 320 480 Samsung Galaxy Ace 2 Android 246dpi 3.8″ 320 533 Samsung Galaxy Grand Android 187dpi 5″ 480 800 Samsung Galaxy Note Android 285dpi 5.3″ 400 640 Samsung Galaxy Note 2 Android 267dpi 5.5″ 360 640 Samsung Galaxy Note 10.1 Android 149dpi 10.1″ 800 1280 Samsung Galaxy S2 Android 217dpi 4.3″ 320 533 Samsung Galaxy S3 Android 306dpi 4.8″ 360 640 Samsung Galaxy S3 Mini Android 233dpi 4″ 360 640 Samsung Galaxy S4 Android 441dpi 5″ 360 640 Samsung Galaxy S4 Mini Android 256dpi 4.3″ 360 640 Samsung Galaxy Tab 2 7.0 Android 170dpi 7″ 600 1024 Samsung Galaxy Tab 7 Android 170dpi 7″ 600 1024 Samsung Galaxy Tab 8.9 Android 170dpi 8.9″ 800 1280 Samsung Galaxy Tab 10.1 Android 149dpi 10.1″ 800 1280 Samsung Galaxy Tab 10.1 Android 149dpi 10.1″ 800 1280 Sony Xperia E Dual Android 164dpi 3.5″ 320 480 Tesco Hudl Android 242dpi 7″ 600 799 Windows Surface Pro Windows 8 207dpi 10.6″ 1080 1920 關於 Viewport 大家可以參考PPK大神的資料!
㈦ 如何用axure rp 8製作登錄界面
製作登錄界面的話,你可以在網路搜索Axure7.0從入門到精通,視頻就是教如何製作登錄界面的