注冊(cè) | 登錄讀書好,好讀書,讀好書!
讀書網(wǎng)-DuShu.com
當(dāng)前位置: 首頁出版圖書科學(xué)技術(shù)計(jì)算機(jī)/網(wǎng)絡(luò)軟件與程序設(shè)計(jì)網(wǎng)絡(luò)編程網(wǎng)站藍(lán)圖:Axure RP高保真網(wǎng)頁原型制作

網(wǎng)站藍(lán)圖:Axure RP高保真網(wǎng)頁原型制作

網(wǎng)站藍(lán)圖:Axure RP高保真網(wǎng)頁原型制作

定 價(jià):¥99.00

作 者: 呂皓月,楊長韜 編著
出版社: 清華大學(xué)出版社
叢編項(xiàng):
標(biāo) 簽: 網(wǎng)站開發(fā)

ISBN: 9787302287858 出版時(shí)間: 2012-07-01 包裝: 平裝
開本: 16開 頁數(shù): 355 字?jǐn)?shù):  

內(nèi)容簡介

  盡量在100字以內(nèi)講清楚一本書的價(jià)值或賣點(diǎn)。AxureRP,一款偉大的,默默無聞的網(wǎng)站建模軟件。說它偉大,是因?yàn)樗萌绱撕唵蔚姆绞?,將千言萬語化作無聲的默契;說它默默無聞,是因?yàn)橹挥泻苌俚娜嗽谕低档氖褂弥?,編織和描繪自己的夢(mèng)想和創(chuàng)意。而大部分人尚不知道有這樣一款神奇的軟件,可以讓人們?nèi)绱饲逦挠|摸一個(gè)網(wǎng)站的脈絡(luò)。仁者見仁,智者見智這樣一句話,不知道讓多少網(wǎng)站的建設(shè)經(jīng)歷了推倒重來,混亂之治,莫名其妙,虎頭蛇尾的痛苦過程。這一切的原因都是因?yàn)?,文字是不可靠的!文字的不可靠在于,不同的人?duì)于同樣的文字,會(huì)有不同的理解。這樣不同的理解也就從一開始將網(wǎng)站建設(shè)帶入了深淵。所有的人都知道,建筑是靠圖紙?jiān)斐鰜淼?。建筑圖紙?jiān)敿?xì)說明了建筑是什么樣子的,所有人照著圖紙施工,造出來的大樓是跟圖紙一模一樣的。正因?yàn)楹芏嗑W(wǎng)站沒有好的圖紙,才導(dǎo)致了網(wǎng)站建設(shè)中的拖沓與混亂。那么,如何制作網(wǎng)站的圖紙?AxureRP就是用來給網(wǎng)站畫圖紙的軟件。它如同服裝設(shè)計(jì)師的樣衣,如同建筑師的圖紙,如同電影導(dǎo)演的故事板,如同售樓處的樣板間。總之,它能讓你在真正付出時(shí)間和金錢來制作一個(gè)網(wǎng)站之前,能夠完全了解到最終真正網(wǎng)站所具有的功能,設(shè)計(jì),交互和用戶體驗(yàn)。就親眼看到,親手用到一個(gè)網(wǎng)站。然后在這個(gè)原型的基礎(chǔ)上進(jìn)行用戶測試和改進(jìn),節(jié)省大量的時(shí)間和金錢。比這個(gè)更棒的是,它能讓別人一下子就明白網(wǎng)站是做什么的,如何使用一個(gè)網(wǎng)站以及要花多少人力物力把一個(gè)網(wǎng)站給做出來。

作者簡介

  呂皓月,網(wǎng)名阿睡(Mrsleepy),2002年畢業(yè)于北京大學(xué)物理系。畢業(yè)后出國未遂,一直從事互聯(lián)網(wǎng)相關(guān)的工作。曾就職于雅虎,阿里巴巴,公司A,公司B等公司。擔(dān)任過工程師,產(chǎn)品經(jīng)理,銷售策劃,市場策劃,營銷總監(jiān)等職務(wù)。對(duì)互聯(lián)網(wǎng)行業(yè)的產(chǎn)品,技術(shù),營銷等方面有著持續(xù)的熱情。曾為上線徹夜不眠,曾為書寫需求文檔嘔心瀝血,曾為表明觀點(diǎn)苦口婆心,曾為實(shí)現(xiàn)功能軟磨硬泡、威逼利誘,曾為爭取資源據(jù)理力爭,也曾為了迸發(fā)的靈感奮筆疾書到凌晨。不敢說對(duì)互聯(lián)網(wǎng)行業(yè)有多么深的理解,但是卻對(duì)自己喜歡的事情熱情未泯。期望能與互聯(lián)網(wǎng)的同業(yè)者共勉,能夠多勞真的多得。楊長韜,網(wǎng)名Tom Yang,近洋海歸。2004年初離開任職3年的卓越網(wǎng)出國深造,學(xué)習(xí)廣告營銷與視覺設(shè)計(jì)。2007年回國至今從事商業(yè)品牌建立、互聯(lián)網(wǎng)營銷以及體驗(yàn)設(shè)計(jì)等相關(guān)工作,參與的項(xiàng)目包括雀巢、北歐航空、三里屯Village以及釣魚臺(tái)米高梅集團(tuán)酒店等,然而最值得稱道的作品是2010年為其太太制作的Google Map電子賀卡,在被Google官方取締前的4天中,其訪問流量Alexa排名Google Map關(guān)鍵詞全球第二。

圖書目錄

                   PART 1   基礎(chǔ)部分第1章     關(guān)于Axure RP ………………………3                       3.4    部件區(qū)域(Widgets)………………………24   1.1   Axure公司的故事      ……………………………  3           3.4.1    線框圖部件庫   …………………………………24   1.2    裝修與Axure……………………………………      3           3.4.2    部件的屬性………………………………………28   1.3    愛上Axure RP的十大理由…………………         4        3.5    主部件區(qū)域(Masters)……………………30   1.4    AxureRP的特色功能       ………………………  6        3.6    頁面區(qū)域(Pages)  …………………………30       1.4.1   概念圖+設(shè)計(jì)(Sketch+Design)        ……6         3.7  頁面設(shè)置區(qū)域 (Page Notes/Interactions/       1.4.2    互動(dòng)………………………………………………8               Formattings)…………………………………32       1.4.3    文檔……………………………………………… 9       3.8    部件屬性區(qū)域(Widget        1.4.4    合作………………………………………………10               Properties)……………………………………33   1.5   AxureRP與其他原型工具的比較…………10                   3.9    動(dòng)態(tài)面板管理區(qū)域(Dynamic Panel                                                                          Manager)     ……………………………………34                                                       11
第2章     原型和高保真原型的比較 ………
                                                                                                                       35
                                                               第4章     AxureRP基礎(chǔ)操作與技巧 ………
   2.1    什么是原型 ………………………………………11   2.2    高保真原型………………………………………12            4.1    為部件添加事件     ………………………………35   2.3    為什么要制作高保真網(wǎng)站原型……………13                4.2    為頁面添加事件     ………………………………42   2.4    人人都愛高保真原型…………………………15              4.3    從Photoshop到Axure RP …………………42   2.5    誰來制作高保真原型…………………………18              4.4    在Axure RP中使用Flash ……………………47   2.6    高保真原型的更新 ……………………………19             4.5    背景覆蓋法 ………………………………………49   2.7    開始之前…………………………………………20            4.6    拖曳部件  …………………………………………50                                                                 4.7    坐標(biāo)    ………………………………………………51第3章    AxureRP軟件使用概述                  21               4.8    尺寸    ………………………………………………51                                                                 4.9    設(shè)置變量值 ………………………………………52
   3.1   AxureRP軟件安裝與界面        …………………21
                                                                 4.10 生成原型并在瀏覽器中查看         ………………55
   3.2    工具欄區(qū)域(Toolbox)……………………21
                                                                 4.11    Snag It使用簡介     ……………………………57
   3.3   站點(diǎn)地圖區(qū)域(Sitemap)         ………………23                                               PART 2   案例部分案例1   雅虎首頁幻燈 ………………………61                    步驟2    添加分享按鈕  ………………………………68   步驟1   創(chuàng)建新項(xiàng)目     …………………………………62      步驟3   制作新浪分享接口頁        ……………………69   步驟2    制作廣告動(dòng)態(tài)面板…………………………62           步驟4    添加登錄動(dòng)態(tài)面板 …………………………69   步驟3   制作Thumbnail區(qū)域        ……………………63      步驟5    添加分享按鈕動(dòng)作 …………………………70   步驟4   滑動(dòng)切換………………………………………64          步驟6    為Login面板添加事件……………………70   總  結(jié)………………………………………………………66        步驟7    分享成功頁面  ………………………………71                                                              步驟8    倒計(jì)時(shí)3秒 ……………………………………72
案例2  分享到新浪微博 ……………………67                     總  結(jié) ………………………………………………………73   步驟1   創(chuàng)建新項(xiàng)目      …………………………………686----------------------- 頁面 8-----------------------                                                                                                            目    錄案例3 Gmail的進(jìn)度條           …………………… 75         案例8 淘寶商城的全局導(dǎo)航             …………… 95   步驟1    制作進(jìn)度條   …………………………………75        步驟1    準(zhǔn)備A區(qū)的動(dòng)態(tài)面板 ………………………97   步驟2    制作覆蓋物   …………………………………76        步驟2    準(zhǔn)備B區(qū)的動(dòng)態(tài)面板 ………………………97   步驟3    移動(dòng)覆蓋物   …………………………………76        步驟3    為面板添加事件 ……………………………98   步驟4    登錄頁和郵箱頁……………………………76           步驟4    添加文字鏈    …………………………………98   步驟5    更改Axure RP的默認(rèn)打開頁面 ………78              步驟5    取巧的響應(yīng)區(qū)域 ……………………………99   總 結(jié) ………………………………………………………78        步驟6    更多的動(dòng)態(tài)面板 ………………………… 101                                                              步驟7    更多動(dòng)態(tài)面板  …………………………… 103                                                              總 結(jié)   …………………………………………………… 104
案例4 新浪富媒體廣告示意             …………… 79   步驟1    準(zhǔn)備頁面背景 ………………………………81
   步驟2    添加必勝客的Flash廣告…………………81          案例9  點(diǎn)評(píng)網(wǎng)的打分效果………………                105   步驟3    調(diào)整Flash廣告的尺寸……………………81            步驟1    準(zhǔn)備星星的圖片 ………………………… 106   步驟4   關(guān)閉Flash廣告………………………………82           步驟2    準(zhǔn)備動(dòng)態(tài)面板的狀態(tài)      ………………… 107   步驟5    Flash廣告的側(cè)邊欄 ………………………82           步驟3    讓“星星閃亮”   …………………………… 107   步驟6    Flash廣告自動(dòng)關(guān)閉 ………………………83           步驟4    打分完成后顯示分?jǐn)?shù)      ………………… 107   總 結(jié) ………………………………………………………84        步驟5    滿天都是小星星 ………………………… 108                                                              步驟6    Baby One More Time  ……………… 109案例5  iCast廣告       ……………………………85             總 結(jié)   …………………………………………………… 110   步驟1    創(chuàng)建頁面背景 ………………………………86
   步驟2   添加Flash廣告………………………………86         案例10  谷歌搜索提示效果……………                 111   步驟3    自動(dòng)關(guān)閉廣告 ………………………………86          步驟1    準(zhǔn)備背景…………………………………… 112   總 結(jié) ………………………………………………………86        步驟2    準(zhǔn)備搜索框     ………………………………112                                                              步驟3    準(zhǔn)備提示框     ………………………………113案例6  雅虎首頁全屏展開的廣告 ………87                       步驟4   處理tips動(dòng)態(tài)面板的狀態(tài)       …………… 113                                                              步驟5    其他的關(guān)鍵詞  …………………………… 114
   步驟1    準(zhǔn)備廣告動(dòng)態(tài)面板 …………………………88
                                                              步驟6    讓搜索提示出現(xiàn) ………………………… 115
   步驟2    準(zhǔn)備背景頁面 ………………………………88
                                                              步驟7    讓頁面完整     ………………………………116
   步驟3    自動(dòng)關(guān)閉廣告 ………………………………89
                                                              總 結(jié)   …………………………………………………… 117
   總 結(jié)  ………………………………………………………90                                                            案例11  自己設(shè)計(jì)網(wǎng)頁播放器…………                 119
案例7  淘寶首頁導(dǎo)航鼠標(biāo)懸停效果 …… 91
                                                              步驟1    搭建舞臺(tái)背景  …………………………… 120
   步驟1    準(zhǔn)備背景圖   …………………………………92
                                                              步驟2    播放和暫停按鈕 ………………………… 121
   步驟2    制作導(dǎo)航菜單 ………………………………92
                                                              步驟3    音量調(diào)節(jié)按鈕  …………………………… 121
   步驟3    另外一種方式 ………………………………93
                                                              步驟4    播放進(jìn)度條     ………………………………122
   步驟4    進(jìn)一步的可能性 ……………………………94
                                                              總 結(jié)   …………………………………………………… 124
   總 結(jié)  ………………………………………………………94                                                                                                                  7----------------------- 頁面 9-----------------------     網(wǎng)站藍(lán)圖網(wǎng)站藍(lán)圖 ——Axure RP高保真網(wǎng)頁原型制作——AxureRP高保真網(wǎng)頁原型制作案例12 凡客首頁的跑馬燈文字鏈                  …    125        步驟5   添加事件…………………………………… 159   步驟1    準(zhǔn)備頁面元素  ……………………………129              步驟6    親!您有新的微博 ……………………… 160   步驟2    編輯舞臺(tái)面板  ……………………………129              步驟7    新微博的顯示  …………………………… 161   步驟3    為文字鏈添加鏈接 ………………………131               總 結(jié)   …………………………………………………… 162   步驟4    無限循環(huán)…………………………………… 132   步驟5    開始無限循環(huán)  ……………………………135            案例17 制作iPhone交互效果                 ………      163   總 結(jié)   …………………………………………………… 136
                                                                  步驟1    自制iPhone 4的部件庫 ……………… 164                                                                  步驟2    添加iPhone 4的按鈕部件 …………… 165案例13 促銷的倒計(jì)時(shí)牌             ………………       137        步驟3   滑動(dòng)開關(guān)…………………………………… 166   步驟1    時(shí)·分·秒·百分之一秒 ……………………137           步驟4    彈出的通知窗口 ………………………… 167   步驟2    無限循環(huán)……………………………………137              步驟5    制作Tab按鈕……………………………… 168   步驟3    OnMove函數(shù) ……………………………139                 步驟6    其他部件…………………………………… 168   步驟4   初始化變量      ………………………………140          步驟7    iPhone 4的圖片應(yīng)用  ………………… 169   總 結(jié)   ……………………………………………………140           總 結(jié)   …………………………………………………… 171案例14 制作PPT(提案)               ……………      141      案例18 引用任意頁面的任意部分                  …     173   步驟1    制作背景……………………………………142              步驟1    火車票搜索      ……………………………… 175   步驟2   將背景制作為主部件                                    步驟2    機(jī)票搜索…………………………………… 176              (Masters) ………………………………142           步驟3    酒店搜索…………………………………… 177   步驟3    制作第一張幻燈片 ………………………143               步驟4    其他部分…………………………………… 178   步驟4    RaiseEvent事件       ………………………143           總結(jié)   …………………………………………………… 178   步驟5   其他幻燈片      ……………………………… 144   步驟6   將項(xiàng)目放在公司網(wǎng)站上         ………………145        案例19 通用登錄注冊(cè)第一部分                 ……      179   步驟7    簡單加密…………………………………… 146
                                                                  步驟1    完成表單的布局 ………………………… 180
   總 結(jié)   …………………………………………………… 147
                                                                  步驟2    輸入框的邊框變化 ……………………… 181                                                                  步驟3   讓邊框跟隨鼠標(biāo)變化         …………………182案例15 淘寶商城首頁幻燈效果                  ……    149        步驟4   添加其他輸入框的提示         ……………… 183   步驟1   搭建幻燈片      ………………………………150           總結(jié)   …………………………………………………… 184   步驟2   搭建幻燈片的頁碼部分         ………………150   步驟3    timer面板的無限循環(huán) …………………151              案例20 通用登錄注冊(cè)第二部分………                     185   總 結(jié)   …………………………………………………… 154
                                                                  步驟1    準(zhǔn)備驗(yàn)證Email輸入 …………………… 185                                                                  步驟2   驗(yàn)證Email輸入        …………………………186案例16 新浪微博的圖片和視頻                  ……    155        步驟3   驗(yàn)證密碼…………………………………… 188   步驟1    搭建背景……………………………………156              步驟4    再次驗(yàn)證密碼  …………………………… 190   步驟2   第一條微博      ………………………………156          步驟5    處理驗(yàn)證碼      ……………………………… 192   步驟3    第二條有圖有視頻的微博 ……………157                 總 結(jié)   …………………………………………………… 193   步驟4   為Blog2添加圖片和視頻         …………… 1588----------------------- 頁面 10-----------------------                                                                                                             目    錄案例21 Apple首頁的滑動(dòng)搜索框                 …    195     案例23 Looklet的真人試衣間 ………                 217   步驟1    準(zhǔn)備背景圖片  ……………………………196           步驟1    準(zhǔn)備模特…………………………………… 219   步驟2    準(zhǔn)備項(xiàng)目……………………………………197           步驟2    第一件上裝     ………………………………219   步驟3    滑動(dòng)模塊……………………………………198           步驟3    第二件上裝     ………………………………220   步驟4    讓搜索框變大  ……………………………200           步驟4    第一件下裝     ………………………………221   步驟5    讓搜索框變小  ……………………………200           步驟5    脫衣服 ……………………………………… 222   總 結(jié)  ……………………………………………………202          總 結(jié) …………………………………………………… 223案例22 優(yōu)衣庫淘寶商城購物車               ……     203     案例24 游戲\大家來找茬\ ……………                225   步驟1    創(chuàng)建商品圖片  ……………………………204           步驟1    主界面 ……………………………………… 226   步驟2    選擇產(chǎn)品顏色  ……………………………205           步驟2    關(guān)卡1    ……………………………………… 226   步驟3    選擇尺碼……………………………………207           步驟3    顯示當(dāng)前關(guān)卡數(shù) ………………………… 228   步驟4    加入購物車   ………………………………207         步驟4    挑選關(guān)卡…………………………………… 228   步驟5    搭建購物車   ………………………………208         步驟5    一個(gè)關(guān)鍵的地方 ………………………… 229   步驟6    購物車面板的顯示和關(guān)閉 ……………211              步驟6    倒計(jì)時(shí) ……………………………………… 230   步驟7    查看購物車   ………………………………213         步驟7    失敗了 ……………………………………… 231   總 結(jié)  ……………………………………………………216         步驟8    一關(guān)接一關(guān)的玩 ………………………… 234                                                               步驟9    解決幾個(gè)Bug     …………………………… 236                                                               總 結(jié)  …………………………………………………… 238                                             PART 3   綜合案例綜合案例1  電商網(wǎng)站 ……………………               241     綜合案例2 促銷專題——迅速制作精美的       1. 需求描述 ……………………………………………241                         促銷專題 ……………………         281   2. 線框圖  ………………………………………………242         需求描述   ……………………………………………… 281   3. 購物流程(略,請(qǐng)參考素材) ………………251              步驟1:功能區(qū)域 …………………………………… 283   4. 設(shè)計(jì)圖  ………………………………………………252         步驟2:Logo和搜索框 …………………………… 285   5. 高保真線框圖    ……………………………………253         步驟3:導(dǎo)航條  ……………………………………… 286   6. 試衣間  ………………………………………………268          步驟4:幻燈區(qū)域…………………………………… 287   7. 結(jié)賬頁面步驟1……………………………………269            步驟5:品牌、活動(dòng)推薦區(qū)域 …………………… 292   8. 結(jié)賬頁面步驟2……………………………………276            步驟6:分類商品區(qū)域       …………………………… 293   9. 結(jié)賬頁面步驟3……………………………………278            步驟7:頁腳     ………………………………………… 293   10. 結(jié)賬頁面步驟4 …………………………………279            總 結(jié)  …………………………………………………… 294   總 結(jié)  …………………………………………………… 279外篇  最簡單的專題制作方法…………                 295     綜合案例3  臭美——iphone App …                   299   圖片堆砌法 ……………………………………………295           需求描述    ……………………………………………… 299   直接切圖法 ……………………………………………296           需求分析    ……………………………………………… 301                                                                                                                   9----------------------- 頁面 11-----------------------    網(wǎng)站藍(lán)圖網(wǎng)站藍(lán)圖 ——Axure RP高保真網(wǎng)頁原型制作——AxureRP高保真網(wǎng)頁原型制作   高保真線框圖 …………………………………………301              幻燈區(qū)域     ……………………………………………… 321   首頁Homepage  ……………………………………303                  當(dāng)前登錄用戶的信息  ……………………………… 322   登錄頁面login     ………………………………………303           好友動(dòng)態(tài)     ……………………………………………… 323   我的臭美日記 My beauty dairy ………………305                  最近被我影響的……………………………………… 325   查看附近 nearby homepage list view  ……307                    Footer    ………………………………………………… 325   查看附近熱門排行neabyhottest          …………… 310          總結(jié)   …………………………………………………… 325   我關(guān)注的人friend feed…………………………… 311
                                                                綜合案例5  Morework——同行同事在線
   圖詳情頁single image rt and flag  ………… 313
                                                                交流平臺(tái)      ……………………………………            327
   轉(zhuǎn)評(píng)分享rt nd share ……………………………… 313
   Ta的信息heraccount        ……………………………313          項(xiàng)目描述     ……………………………………………… 327   拍照頁面take photo homepage  ……………315                    需求描述     ……………………………………………… 327   設(shè)置頁面settingpages        …………………………316          需求分析     ……………………………………………… 328   每日拍照鬧鐘提醒      …………………………………317          高保真線框圖 ………………………………………… 332   總 結(jié)   ……………………………………………………317            “事兒”頁面single post …………………………… 335                                                                  人的頁面     ……………………………………………… 335                                                                  發(fā)新事兒     ……………………………………………… 336
綜合案例4  沒夠網(wǎng)——影響力社交團(tuán)購
                                                                  注冊(cè)頁面register …………………………………… 339
                平臺(tái)……………………………           319        我的人脈圈…………………………………………… 340   需求描述    ………………………………………………319           登錄頁面     ……………………………………………… 341   需求分析    ………………………………………………320           我的公司     ……………………………………………… 341   高保真線框圖 …………………………………………320              總 結(jié)   …………………………………………………… 341

本目錄推薦

掃描二維碼
Copyright ? 讀書網(wǎng) m.ranfinancial.com 2005-2020, All Rights Reserved.
鄂ICP備15019699號(hào) 鄂公網(wǎng)安備 42010302001612號(hào)