極限健身俱樂部網(wǎng)站設計與實現(xiàn)課程設計報告書

1、 .PAGE29 / NUMPAGES29 .工程技術師學院設計與建設課程設計報告設計題目： 極限健身俱樂部設計 2011年12月信息工程學院摘 要隨著生活的日益發(fā)展，人們的生活水平也不斷提高，健身房也是很多年輕人青睞的地方，不但可以強身健體，還能豐富業(yè)余生活。健身俱樂部作為專業(yè)的健身辦事行業(yè)，已經(jīng)越來越受到人們的青睞。隨著自身的圍不絕擴大，客戶數(shù)量也不斷增多。由于本人愛好運動，所以選折為俱樂部設計，運用網(wǎng)頁設計這門課程所學的基礎知，實現(xiàn)了將靜態(tài)網(wǎng)頁與各種特效效果相結合。例如：網(wǎng)頁中插入flash動畫，增加網(wǎng)頁生動性，還運用圖層、字幕滾動等特效使網(wǎng)頁色彩搭配協(xié)調，看起來很舒服。在理論和技術的基

2、礎上，能夠掌握網(wǎng)絡環(huán)境中設計和建設的應用技術。通過課程設計的過程，加深了對理論知識的理解和技術的運用，加強了個人的分析問題、解決問題、設計實施 方案的能力，并掌握多門知識的運用，加強了個人專業(yè)技能的提高。該網(wǎng)頁風格設計簡明清晰。容豐富、操縱輕便、界面雅觀?；緷M足俱樂部實際的需要。關鍵字：俱樂部 設計 容豐富 flash目 錄第一章 緒論4 1.題目的背景4 1.題目的意義5 1.結構設計5第二章 技術設計功能分析6 2.1 功能分析6 2.2 技術設計分析6第三章 總體設計與詳細設計7 3.1 總體設計9 3.2 結構分析10 3.3 詳細設計14第四章 編碼實現(xiàn)15第五章 系統(tǒng)調試20 5

3、.1 調試遇到的問題21第六章 總結與心得22附錄： 參考資料22緒論1.1題目的背景經(jīng)過近幾年的觀察，健身房成為許多中年人和年輕朋友們比較喜歡的娛樂場所，既能娛樂又能保持身體健康。致使越來越多的人去健身房，如學生、上班一族、中年人、老年人。這是一個非常好的現(xiàn)象，因為越來越多的人懂得多鍛煉，少對點電腦，可以利用這些時間多做運動，放松心情，還能減輕壓力，達到減肥的目的。大多數(shù)女同志們去健身房的直接目的是為了減肥，隨著健身設施的增加，減肥的方式也變的多樣，并不像以前只是跑步來減肥，現(xiàn)在很多女孩子最喜歡的減肥方法就是瑜伽，既能減去贅肉，還能美化身體線條。是女生首選的運動項目。 而男生們大多數(shù)是為了增

4、強體質，增加自己的肌肉感，使身材看起來更有型一些，當然，除了健身方面的原因，還有一個原因是現(xiàn)在很多年輕人把去健身房當作一個很好的交際場所，他們可以借此機會結交一些朋友，擴展自己的交際圈，平時也可以和大家組織一些群體活動。而老人去健身房的主旨是為了鍛煉身體，很多老人不再只是散散步，打打拳之類的，他們也追隨年輕人的運動方式，偶爾去去健身房。 介于健身房如此火熱，我這次的選題就是為健身房設計的。極限健身俱樂部是我所知比較有代表性的俱樂部，其市環(huán)境優(yōu)雅，服務到位，健身設施齊全，適合男女老少各個年齡的人們到來，為了大家更好的了解極限健身俱樂部，我已以的形式向大家展示。相信大家一定會更了解極限健身俱樂部。

5、更多朋友也會被它吸引。1.2 題目的意義 通過本，希望更多的人了解健身的意義，不僅僅是娛樂，也并不僅僅只是達到減肥的目的，更多的是從中我們會獲得快樂，還能增強自身的體質，更能和更多的人成為朋友，希望大家能把上網(wǎng)玩游戲，看電影的時間多一點用來健健身。何嘗不是一個更好的選折呢。1.3 結構設計 論文的結構分為六部分，從背景介紹到功能分析，從總體設計到編碼實現(xiàn)部分，最后是系統(tǒng)調試與總結，論文主要是圍繞我制作的分步介紹，而的結構是由一個主頁到九個子頁構成的，每一頁的容都是獨立又與其他頁保持聯(lián)系的，主頁是一個最主要的部分，要想做好一個必須首先做好一個主頁，給人新穎的感覺才能吸引人們的眼球，我的主頁選折的

6、是清新淡雅的顏色，因為運動本身就是給人感覺悠閑、自由的，所以顏色清淡更能讓人心感覺放松，愉悅。主頁我選用極限健身俱樂部的招牌健身運動，瑜伽作為主頁的圖片。也相應給出其他健身項目的圖片，不要給人單調的感覺。 第一個子頁分別介紹了俱樂部都有哪些健身項目，給人一目了然的視覺效果，第二個子頁是對極限健身俱樂部的介紹，該頁插入flash動畫效果，讓人在閱讀資料的過程中不會感到枯燥，動態(tài)的效果更能吸引人的眼球。第三頁是對各個健身項目的簡介，讓前來參觀極限健身俱樂部的顧客更多的了解俱樂部的各種運動設施，和他們各自的功能，相信一定會有一項運動適合您的。 的第四個子頁體現(xiàn)的是極限健身俱樂部的新聞頁，上面顯示了俱

7、樂部的最新動態(tài)，近期做過哪些活動，并且有什么優(yōu)惠方便大家。第五個子頁是客戶服務頁，方便大家有什么問題可以與時與我們聯(lián)系。第六頁專門介紹了俱樂部的頂級教練員，詳細介紹教練信息，讓大家更多的了解，方便提前預約教練。第七頁給出了俱樂部的詳細地址和聯(lián)系方式，方便大家很容易找到俱樂部。第八頁展示了俱樂部的招牌運動項目，讓顧客了解我俱樂部目前的趨勢動態(tài)，方便給您更好的建議。最后一頁是在線留言頁，顧客可以二十四小時聯(lián)系我們在線的顧問，隨時咨詢您不懂的問題，也希望大家多多提出寶貴意見。第二章 技術設計功能分析2.1功能分析本是瀏覽健身俱樂部，以圖片和Flash動畫欣賞為主，包含了少量的文字。以圖片為主，圖片更

8、能很好的體現(xiàn)俱樂部的特征。主要由首頁，圖片和Flash動畫組成，首頁包括圖片和Flash按鈕。還運用文字滾動字幕實現(xiàn)了動態(tài)的效果。訪問起來簡單方便。網(wǎng)頁風格統(tǒng)一，色彩基本一致，看似舒服自然。將自己的風格、愛好從整個網(wǎng)頁中表現(xiàn)出來。該網(wǎng)頁主要靜態(tài)網(wǎng)頁為主，但個別子頁也加入flash動畫增加動態(tài)效果。加強網(wǎng)頁的活力性，靜而不死板。個別子頁使用框架集制作，還集合了模版頁的功能。子頁中還運用圖層，表單等。2.2 技術設計分析本網(wǎng)頁的制作可利用的操作系統(tǒng)如Windows XP，Linus系統(tǒng)，Unix系統(tǒng)等等。 制作本網(wǎng)頁的主要工具是利用Dreamweaver和fash等設計軟件與html編寫。 本網(wǎng)頁

9、圖片的與色彩的搭配都是用Photoshop、fierwork等制圖軟件美化出來的，不同的子頁，不同的背景，Photoshop都把它們渲染的淋漓盡致。 另外flash基于矢量，所以還有以下特點：第一，普與性強，flash軟件操作界面簡單易懂可以充分發(fā)揮自己的創(chuàng)造力。第二，互動性強，多媒體和交互性強大。第三，通用性好，在各類瀏覽器中樣式統(tǒng)一，在沒有安裝插件的系統(tǒng)里，可以使用JAVA或動態(tài)GIF89a來運行。基于以上的優(yōu)點，網(wǎng)頁制作過程充分使用了flash與Photoshop等軟件。第三章 總體設計與詳細設計3.1總體設計 設計圖如：鏈接各子頁導 航 條首 頁咨 詢 方 式俱樂部新聞圖 片 區(qū)健身項

10、目展示最 新 動 態(tài)詳 細 地 址圖31 主頁總體結構圖3.2 結構設計首頁健身項目俱樂部簡介項目簡介俱樂部新聞聯(lián)系我們售后服務教練員簡介其他在線留言極限健身俱樂部網(wǎng)站導航圖32 子頁結構設計 網(wǎng)頁設計思路是進入主頁后會看到上方相應的導航條，子頁共設為九個部分，可因個人喜好習慣進入自己想要參觀的網(wǎng)頁，參觀者可任意選折進入。3.3 詳細設計 主頁以與相關子頁截圖如下：主頁如圖所示 主頁設計風格主頁以熱門健身項目為主，例如：瑜伽等主打運動項目，讓顧客了解我俱樂部目前的趨勢，頁面色彩搭配協(xié)調，以淡色為主，紅色部分較為顯眼，目的是吸引參觀者的眼球，上面有注明俱樂部特色，會員風采，減肥訓練立即加入等字樣

11、。導航前加入flash按鈕使網(wǎng)頁多樣化，導航上面設有滾動字樣，使網(wǎng)頁整體效果富有活力性。白色滾動字樣更能吸引顧客的注意力，紅色區(qū)域上是俱樂部近期做過的各種活動，和即將要組織的活動，以與最新的動態(tài)，希望顧客與時參與。子頁1如圖 該頁體現(xiàn)的的主體是主要項目的具體介紹，如俱樂部主打的幾項運動，有瑜伽、大眾健身操、動感單車、街舞、羽毛球、健美操等。這幾項運動是目前本俱樂部開展的最受歡迎的幾項運動，能很好的體現(xiàn)俱樂部與時俱進、抓住現(xiàn)在年輕人的心理，開展各項大眾喜愛的健身項目，吸引顧客前來親身體驗。旁邊列舉了俱樂部的一些其他健身項目，如拉丁舞，搏擊健美操等。種類多樣，適合青年，中年，老年的各種健身器材，頁

12、面色調簡單，沒有加入太多的色彩，因為我個人感覺運動的顏色就是白色甚至是透明，是無色的，喜歡運動的人會從中找到快樂，懂得運動的人在運動之后不會感覺疲憊，而是大汗淋漓后的輕松，會感到身心愉悅，輕松自在，我個人感覺運動是神奇的，有時會從中找到自信，也會鍛煉人的意志力。我建議大家都根據(jù)自身情況做適合自己的運動項目。生命在于運動是很有道理的。 子頁2如圖所示本頁是健身項目，設計的思想是頁面設計不要太復雜，既然只是讓顧客知道極限健身俱樂部都有哪些運動項目，就要直入主題，避免一些無用的東西，以免顧看看起來不舒服，覺得啰嗦還沒有達到自己的目的，本頁我加入flash動畫配合本頁，看起來非常搭配，顏色也很符合，而

13、且加上是動態(tài)的效果，還是一個球體在上下運動，可謂是恰到好處。就像健身球一樣，有著動感的元素，中間是各項運動項目列表，有健身球、網(wǎng)球、動感單車、瑜伽、羽毛球、跑步機、健美操。當然還有很多項目不能一一列舉，置導航，可供顧客自行進入更多了解。 子頁3如圖所示本頁是客戶服務頁，專為客戶設置，為方便客戶更好的聯(lián)系我們，如遇到任何問題可以與時與我們溝通保持聯(lián)系，我們會盡最大能力幫助解決困難。頁面簡單清晰，導航還設置其他服務項目，例如高級教練、專業(yè)顧問、相關咨詢等服務項目。 子頁4如圖所示 本頁主要容是本俱樂部高級健身教練簡介，為方便客戶能第一時間預約到適合自己的教練，該頁體現(xiàn)的是俱樂部具代表性的高級教練，

14、他主要以健美操為主，曾經(jīng)獲國家健美操比賽第二名，是眾多顧客最喜歡的教練之一，所以現(xiàn)想要找他作為自己的私人教練必須提前預約，為客戶更了解該教練，在此特設計此頁，該頁運用鼠標滑過圖像等小特效，當鼠標滑過一圖片會顯示另一圖片，雖然簡單，但看起來效果還不錯，是網(wǎng)頁不可缺的特效之一。 子頁5如圖所示 本頁是這次設計的最后一頁，也是用戶留言頁，設計風格與前幾頁相似，都是以淡色為主，本頁運用表單中的按鈕和文本域等功能，設計以簡潔為主，作用是方便用戶與時留言，提出寶貴的意見。第四章 編碼實現(xiàn)主要編碼實現(xiàn)： 首頁 健身項目 俱樂部簡介 項目簡介 俱樂部新聞 Flash動畫 實現(xiàn)代碼如下： Flash 按鈕代碼如

15、下： 層代碼如下： 字幕滾動代碼如下： 歡迎光臨極限健身俱樂部！歡迎您踴躍報名，多一點運動，多一份健康！ 表單代碼如下： ： 留言容： 第五章 系統(tǒng)調試5.1 調試過程中遇到的問題 1設計困難 制作之前必須先要構思清楚，自己想要做什么風格和主題的，而這個看似簡單的問題其實很復雜，也是最關鍵的部分，主要設計思路清晰，就可以按照計劃進行，但恰恰萬事開頭難，主頁的設計讓我花費很長時間，當設計好主頁，掌握方向后，便順利了很多。 2. 首頁失敗制作過程中不知道什么原因，一開始只是插圖的時候出現(xiàn)問題，但卻無法進行下去，導致前半部分白做了，又從頭開始做的。3.圖層運用不當 圖層使用起來還是有很多問題的，例如

16、，圖片位置不對，擋住了部分文字，只能回到設計頁面重新調整，一開始很難一次成功的，必須要進行多次修改才能達到自己理想的效果。4.布局掌握不準確 設計中并沒有使用大量布局設計，原因是使用不是很理想，總是搞不清自己要用多大的空間，總是不恰當，導致只在一個子頁中使用布局功能。可能是一開始學習表格習慣了，不習慣用布局做的原因。后面的都是以表格為主設計。5.路徑出錯 做的過程中曾出現(xiàn)連接出錯，找不到要的容，后來仔細檢查改正過來，網(wǎng)頁正常運行。第六章 總結與心得 經(jīng)過本學期的學習，我學會了網(wǎng)頁制作這門課程，網(wǎng)頁在日常生活中運用非常的廣泛，學好這門課，對我們是有很大幫助的，這學期經(jīng)過王少華老師詳細的講解這門課

17、程，我真的從中學到了很多關于網(wǎng)頁制作的知識。感王老師的認真教導。們堂課老師講解的都很詳細，很透徹，還拓展一些書本沒有的知識。同時也少不了課設指導老師的幫助，為我們收集相關資料，方便我們更好的完成課設。課程設計是培養(yǎng)學生綜合運用所學知識發(fā)現(xiàn)提出分析和解決實際問題，鍛煉實踐能力的重要環(huán)節(jié)，是對學生實際工作能力的具體訓練和考察過程，.隨著科學技術發(fā)展的日新月異，當今計算機應用在生活中可以說得是無處不在。因此作為二十一世紀的大學來說掌握計算機開發(fā)技術是十分重要的?；仡櫰鸫舜握n程設計，至今我們仍感慨頗多，從理論到實踐，在整整半個學期的日子里，可以學到很多很多的東西，同時不僅可以鞏固了以前所學過的知識，而且學到了很多在書本上所沒有學到過的知識。通過這次課程設計使我們懂得了理論與實際相結合是很重要的，只有理論知識是遠遠不夠的，只有把所學的理論知識與實踐相結合起來，從理論中得出結論，才能真正為社會服務，從而提高自己的實際動手能力和獨立思考的能力。在設計的過程中遇到問題，可以說得是困難重重，但難