中華醫事科技大學
98 學年度專題製作報告
電子商務網站之建置─
夯機王
指導老師：林肇哲 老師
研 究 生：蔡宗恩 陳毅蓁 謝侃呈 張彥彬 李惠惠 張朝陽 李采芸 楊椀喬 施文雅
98
學 年 度 專 題 製 作 報 告
電 子 商 務 網 站 之 建 置
│
夯 機 王
指 導 老 師
： 林
肇 哲
老 師
日 期：99 年 1 月 4 日
電子商務網站的建置 – 夯機王
第一章、緒論
本文之研究架構主要目的是利用電子商務(Electronic Commerce；EC)的概 念，實際製作一個企業對消費者B2C(Business to Consumer；B to C)的電子 商務網站，以探討台灣企業在面臨網際網路(Internet)的潮流之下，如何藉由開發 電子商務網站來提昇企業營運績效，並能成功的將商品和服務透過網際網路行銷給 消費者。此外，提供給消費者和管理者豐富的資訊及親和力的便利界面，藉此吸引 消費者購買及便利管理者操作。
不同於一般網頁，為了能夠跨平台(Window、Linux)的使用，選擇使用 PHP 動 態網頁程式語言來製作。其次，PHP 是嵌入式語言，具有高度隱藏性，再搭配連結 後端 My SQL 資料庫，讓開發人員可以更容易開發出網路資料庫的應用程式，使網 頁提供更多的功能、更快速的反應及絕佳的錯誤處理能力。最後，為了增加網頁美 觀及多樣性功能，結合 CSS、JavaScript、AJAI 等多樣技術，期望可建置出親和力 的便利界面。
現在建置網路事業不必耗費數十萬甚至更多的成本，就可以設計出電子商務網 站。而人們越來越依賴網際網路，也逐漸依賴起網路購物，因為在網路上一樣可以 滿足消費者購物的慾望又能節省時間，更重要的是「先享受後付款」一樣可以達到 購物的目的。而功能完善的電子商務網站的確能夠提供真正符合客戶需求的服務與 商品，進而增加顧客滿意度。
第一節、研究背景
電子商務最早產生於 60 年代，發展於 90 年代，其產生和發展的重要條件主要 是：
計算機的廣泛應用：近 30 年來，計算機的處理速度越來越快，處理能力越來 越強，價格越來越低，應用越來越廣泛，這為電子商務的應用提供了基礎。
1997 年 5 月 31 日，由美國 VISA 和 Mastercard 國際組織等聯合指定的 SET（Secure Electronic Transfer Protocol）即電子安全交易協議的出台，以及該協議得到大 多數廠商的認可和支持，為在開發網絡上的電子商務提供了一個關鍵的安全環境。
政府的支持與推動：自 1997 年歐盟發佈了歐洲電子商務協議，美國隨後發佈
「全球電子商務綱要」以後，電子商務受到世界各國政府的重視，許多國家的政府 開始嘗試「網上採購」，這為電子商務的發展提供了有利的支持。
隨著網際網路的快速發展，電子商務已經成為人們進行商務活動的新模式。越 來越多的人開始透過網際網路從事商業活動，許多商家也開始利用網際網路來買賣 商品。使得電子商務已成為從事商業交易、行銷及廣告等商業行為的重要工具與媒 介，也對全球消費者、製造者、銷售者及企業家提供一個潛力無窮的市場機會。
電子商務市場的快速成長，不但對企業之行銷活動產生影響，亦對消費者進行 線上購物的方式產生影響。因此，未來企業在採用各項方案以及策略時，也需將電 子商務環境之種種影響納入考量，仔細評估進而創造企業的最大競爭優勢。
企業競爭應以創造顧客價值為前提；不能滿足顧客需求的競爭，短期或許可以取得 獨佔的地位，但終將會被其他更有價值的替代品所取代。因此，只有不斷提升與創 造顧客價值，企業才能永遠立於不敗之地。
Kotler 等人同時也曾對顧客價值做了如下的定義：「顧客傳送價值
(customer delivered value) 係整體的顧客價值 (total customer value) 與整 體的顧客成本 (total customer cost) 二者之差距，而整體的顧客價值係指顧客 期望從特定的產品或服務所能獲得利益的集合。」
第二節、研究動機
截至 2009 年 6 月底為止，我國有線寬頻用戶達 487 萬戶，電話撥接用戶數為 63 萬戶，學術網路(TANet)用戶數為 444 萬人，行動網路用戶數為 1,661 萬戶。將 上述各個連線方式用戶數經過加權運算，並扣除低用度用戶、一人多帳號與多人一 帳號等重複值後，估算 2009 年 6 月底止，我國經常上網人口達 1,060 萬人，網際 網路連網應用普及率為 46%。
圖 1.上網人口成長狀況
依據上述調查結果，網路的應用至今已達 46%。在網路普及化的大環境下網路 行銷已經不是趨勢，而是現在進行式！透過網路行銷，可以節省掉租店面、人事費 用、水、電費、貨品及管銷實體成本等等..。網路購物現今已為很普遍的購物方式，
因為它對顧客來說想消費時不用長途跋涉親自到實體店面去，只需在空閒時間逛逛 網路商店不但可以充分利用時間且可在短時間內購得物品，使得購物不受時間與地 域的限制。
現今網際網路的普遍已經不是過去剛形成時的樣貌，食、衣、住、行、育樂皆已 在網際網路上慢慢衍生。正所謂人潮就是商潮，在此環境趨勢之下電子商務的發展
已造就出龐大的商機。
當然網際網路只是行銷的工具，此外還須配合一套好的行銷方法，如此一來 網路行銷才有他的意義存在。本次研究動機在於建製手機電子商務網站再搭配 Flas h 廣告及小遊戲當作促銷方法，來探討網路商店的經營與運作方式。
第三節、研究目的
本研究的主要目的是在於透過開發電子商務網站，降低企業營運成本及拓展行 銷管道，並加速對客戶回應的速度及增強對客戶服務的能力。企業電子商務的效益 也包含了效率的提升，例如減少固定成本、流動成本、節省開發廣告費用、縮短交易 流程、搜集情報容易、24 小時開放、全球行銷、直接開發目標市場、增加產品通路等。
然而有別一般的手機行，雖然能提供看得到、摸得到、當面詢問、試用的功能，
但確很少有建置功能完善的買賣雙方線上互動平台。所以本研究希望能透過網際網 路的資訊方便的即時性、便利性來為客戶提供最快速、最完整的服務，也希望這個 研究能實際被運用在手機行業數位產業工作上，讓手機產業能有幫助，並達成良性 的互動。
此外，研究的目的也希望在網際網路的交易平台上，建立一個線上銷售通路，
以增進商業交易，裡面有商品的資訊，透過網際網路給客戶，並在線上進行交易，
從尋價、報價、下單、付款及售後服務等的商業行為，皆希望透過網際網進行。
最後也是盼望這個研究能被採用，並真正導入實務工作後，能對企業產生幫助，
所以如何建置一個功能完善的電子商務網站，使顧客用的習慣也利用網路平台來購 物，滿足顧客的即時性與便利性的需求，也藉此來提升企業營運績效及競爭力和擴 展市場，除了是本小組的研究目的，也是現代的企業應該思考及努力的目標。
第二章、研究方法
隨著網際網路的普及與其無遠弗屆的便利性，近年來各企業已紛紛將其銷售 活動及業務的執行由傳統的通路，漸漸地移轉到網際網路上；因此如何建構一個以 網際網路為交易平台的電子商務網站，對近代的企業而言是相當重要。以下藉系統 開發生命週期(System Development Life Cycle；SDLC)的方式來開發系統的流程，
從無到有過程，其中的活動可分成四個階段進行：分析階段、設計階段、執行階段、
評估階段。
第一節、分析階段
建置一個電子商務網站，需先瞭解電子商務網站如何支援企業的需求。一般而 言，網路行銷有三個目標：增加銷售、減少成本與促進溝通。因此為瞭解企業電子 商務網站開發的可行性與產出為何物，組員們先至各個手機相關網站調查、瀏覽及 翻閱相關資料，進一步瞭解現行電子商務網站的作業方式，研究現行系統的功能與 特性。最後依照目前電子商務網站的需要與特性，提出 SWOT 分析與可行性研究。此 研究結果歸納如下：
一、SWOT 分析
(一) S(Strength)優勢：
企業的優勢取決於產品及服務是否更好、價格是更低、選擇性多寡與便利性等。
故企業電子商務網站優勢方面包括：
1.交易不受時間與地域的限制，增加購物的便利性。
2.資訊具有即時更新的功能。
3.提升交易及訂單處理效率。
5.增進顧客對企業商品與服務的了解與認識。
4.快速掌握顧客的資訊以做客製化的服務及行銷。
6.提升企業的形象。
(二) W(Weaknesses)劣勢：
由於企業是藉於虛擬通路進行交易，無法面對與顧客直接進行互動，故企業電 子商務網站劣勢方面包括：
1.花費時間取得顧客信任與建立口碑。
2.實體通路的弱勢，若顧客想退貨或換貨時，負擔的成本就相當高昂。
3.技術與設備需求。
(三) O (Opportunities)機會：
3C 產業目前仍以傳統通路為主，而手機產品日新月異不斷更新與進步，從長 遠來看，若能成功開發虛擬通路，其龐大市場必定非常可觀，且其客製化產品與多 樣性服務使潛力更加不可忽視。
(四) T (Threats)威脅：
目前同產業中已有數家。由於其本身已有實質通路市場，再加上虛擬通路的配 合，其競爭力必定造成不小威脅。此外，台灣地小人稠，電子商務原本就是在國土 面積廣大的美國誕生，似乎有其地理上的需要，但台灣面積狹小，商店林立，大多 數人們還是習慣到實體商店購買。
二、可行性研究
(一)操作可行性
此電子商務網站在開發完成後可加快企業在訂單處理的速度，藉此提升顧客服 務的品質，使人員在作業上更佳有效率及便利，且透過親和性介面與顧客互動，也 使整個網站系統的操作更為便捷。
(二)技術可行性
開發此系統需要軟體程式為 Dreamweaver、Photoshop、PHP、MySql 資料庫、Java Script 及撰寫程式的技術。由於 PHP 程式及資料庫基礎已在大二及大三學習，雖然
其它軟體及非課堂所學的程式幾乎沒概念，但透過不斷的學習、查閱書籍及請教老 師的結果，相信是可以克服的。
(三)經濟可行性
在經濟成本考量下，決定自行開發網站，所選擇使用的開發軟體均屬於免費，
因此可降低系統開發的成本。
(四)時程可行性
專題製作規劃為一學年的課程，相信只要按部就班配合老師的進度，並定期的 執行考核與討論，必定可以在規定時間內將此電子商務網站完成。
第二節、設計階段
電子商務網站系統建置必須依照企業及使用者的需求，先規劃出整個網站系統 的架構及功能，在網站功能介面的部分主要以一般電子商務的基本功能為主，如：
會員加入、購物車、留言板、討論區等，再搭配搜尋手機搜尋訂單及購物紀錄等功能，
讓顧客可以更有效率且方便的運用。除此之外，更規劃管理者介面，讓一般企業管 理者可以享受更具親和力及便利的介面來與顧客互動，而不只是從後端資料庫來做 管理。
故此次電子商務網站系統需求與開發環境茲分如下：
1.系統需求：
用戶(Client)端：Windows、IE 瀏覽器 6.0 以上。
伺服(Server)端：Wampserver、或能執行 PHP 與 MySQL 之 Server。
2.開發環境：
Dreamweaver、Photoshop、CorelDRAW X3、Ulead GIF Animator、Macromedia Flash 8、 MySql 資料庫，並使用 HTML、PHP、SQL、JavaScript、CSS、AJAI 等程式語言。
3.程式設計：
電子商務系統的建置，在設計程式之前必須先安裝 PHP 的 Wamp 伺服器，並透
過 SQL 語法連結後端的 MySQL 資料庫來建置整個系統完備的電子商務網站。除此之 外，由於是單機測試，必須注意本身的主機是否開啟 IIS 的伺服器、若已開啟 IIS 伺服器則必須先關閉。另外，透過網址列輸入 IP：127.0.0.1 來進行單機測試。單 機板的 Wamp 伺服器有關閉郵件功能，因此得在 wamp\Apache\php.ini 做修改，必 須更改成此網路的 ISP 業者網路名稱。
此外，網頁的編輯環境則透過 Dreamweaver 的介面，除了內建功能之外，更需 要學會使用 HTML 的各種標籤及 JavaScript、CSS 等語法運用，才能製作出多變化及 符合需求的網頁功能，最後再搭配 Photoshop、 CorelDRAW X3、Ulead GIF Animato r、Macromedia Flash 8 等圖片及動畫設計軟體來美化網頁，使得網頁更具人性化。
另外，最重要的連結後端資料庫則需要透過 PHP 及 SQL 語法之結合，才能夠完成具 互動功能的網頁。
首先，先依照系統設計時需求文件，使用 HTML 及 PHP 製作網頁前端介面，再 利用表單送出功能與後端資料庫做連結，接著設定各個互動式網頁所需連結的後端 資料表，下表為本電子商務網站設定之前端與後端資料表連結情形：
表 1、會員動態網頁功能與後端資料庫連結情形
功能名稱 前端使用者介面網頁 後端資料表名稱
會員功能
會員登入（全部網頁）
會員登入成功 login_success.php 註冊會員 add.php
註冊成功 add_success.php 修改會員資料 Mem_Modify.php 查詢訂單 goods.php
查詢歷史購買手機資料 buyrecord.php 會員登出(全部網頁)
addmen buyrecord
goods
購物車
購物車 shoppingcart.php 加入至購物車 savecart.php 確認送件資料 confirm.php
addmen ec buyrecord
確認訂單資料 confirm_date.php
送出訂單 confirm_order.php goods 留言板 留言板board.php addmen
guestbook
討論區
所有主題 bbs.php 主題內容 message.php 發新主題 post.php
修改文章 alter_post.php
addmen bbs
手機館 顯示所有手機 phone.php
詳細手機資料 phone_date.php ec 手機搜尋 手機廠牌及型號搜尋（全部網頁） ec
表 2、管理者動態網頁功能與後端資料庫連結情形
功能名稱 前端使用者介面網頁 後端資料表名稱
管理者功能
管理者登入（全部網頁）
管理者登入成功 login_success.php 管理者介面 manage.php
查詢會員資料表 manage_user.php 查詢留言版資料表 manage_board.php 查詢討論區資料表 manage_bbs.php 查詢訂單資料表 manage_goods.php 新增手機資料 manage_addphone.php 修改手機資料 manage_menphone.php 管理者登出(全部網頁)
addmen bbs buyrecord
ec goods guestbook
另外，各資料表之欄位性質與設定茲分述如下：
表 3、文章分類資料表 catalogs
前端欄位 資料表欄位 型態 null 預設值或附加 文章性質編號 CatalogID int(20) 否 auto_incremen
t 主題名稱 Name varchar(20) 否
表 4、會員資料表 addmen
前端欄位 資料表欄位 型態 null 預設值或附加 無 id int(20) 否 auto_incremen
t 帳號 username varchar(25) 否
密碼 password varchar(25) 否 姓名 name varchar(20) 否
電話 tel varchar(20) 否 預設值0 職業 career varchar(10) 否
性別 sex varchar(10) 否 地址 address varchar(30) 否 信箱 mail varchar(30) 否 大頭圖 upload
varchar(30) 否
權限 level varchar(5)
否 預設值0
表 5、討論區資料表 bbs 前端欄位 資料表欄位 型態 nu
ll
預設值或附加
無 bbsid int(20) 否 auto_increment 判斷是否為主題
文章或回應文章
reference int(20) 否 預設值0
主題發表日期 postdate datetime 否 0000-00-00 00:00:00 回應主題日期 postdate1 datetime 否 0000-00-00 00:00:00
文章分類 topictop varchar(20) 否 主題名稱 topic varchar(50) 否
點閱數 Click_Times int(100) 否 預設值0 回應數 Reply_Times int(100) 否 預設值0 文章內容 message longtext 否
發表者id id int(20) 否 預設值0
表 6、留言板資料表 guestbook
前端欄位 資料表欄位 型態 null 預設值或附加 無 ID int(10) 否 auto_increment 發表時間 DateTime datetime 否 0000-00-00 00:00:00
發表人 Guest varchar(20) 否 發表主題 Subject varchar(30) 否 發表內容 Memo text 否
發表人權限 ref varchar(50) 否 預設值0
表 7、購買手機資料表 buyrecord
前端欄位 資料表欄位 型態 null 預設值或附加 無 id int(100) 否 auto_incremen
t 手機型號 model varchar(50) 否
購買數量 number varchar(50) 否 小計 subtotal varchar(50) 否 手機圖片 image varchar(50) 否 會員編號 buyid varchar(50) 否 訂單 goodid varchar(20) 否
表 8、文章資料表 tbnews
前端欄位 資料表欄位 型態 null 預設值或附加 無 NewsID int(10) 否 auto_incremen
t 主題 Title varchar(30) 否
內容 Body text 否
圖片 Image varchar(50) 否
發表日期 PuteDate date 否 0000-00-00
文章分類 CatalogID int(10) 否 預設值0
表 9、手機資料表 ec
前端欄位 資料表欄位 型態 null 預設值或附加
無 ID int(20) 否 auto_incremen t
廠牌 owner varchar(20) 否 型號 model varchar(20) 否 額外名稱 model2 varchar(50) 否 規格 t1 longtext 否 介紹 t2 longtext 否 功能 t3 longtext 否 圖片 images varchar(30) 否
價格 cost varchar(50) 否 預設值0 點閱數 num varchar(100) 否 預設值0
表 10、訂單資料表 goods
前端欄位 資料表欄位 型態 null 預設值或附加 無 id int(50) 否 auto_incremen
t 訂單編號 orderid varchar(50) 否
總計金額 amount varchar(50) 否
付款情形 pay varchar(50) 否 預設值 未付款 出貨情形 move varchar(50) 否 預設值 未出貨 取貨方式 way varchar(50) 否
地址 address varchar(50) 否 預計取貨時間 time varchar(50) 否 訂購日期 date varchar(50) 否 訂購會員 orid varchar(50) 否 關聯式資料庫連結情形：
圖 2.關聯式資料庫
接下來在撰寫程式前，尚需先描繪出網站系統程式功能邏輯架構，各程式頁面 執行功能及步驟敘述如下：
1.會員登入流程
圖 3.會員登入流程 2.管理者專區功能流程
圖 4.管理者專區功能流程
3.會員專區功能流程
圖 5.會員專區功能流程
4.選購商品功能流程
圖 6.選購商品功能流程
5.確認購物車結帳功能流程
圖 7.確認購物車結帳功能流程
6.留言板功能流程
圖 8.留言板功能流程 7.討論區功能流程
圖 9.討論區功能流程 8.搜尋功能流程
圖 10.搜尋功能流程
第三節、執行階段
系統測試與上線
當整個網站系統建置完成後，最重要的階段在於系統測試與偵錯，此階段主要 目的在於讓使用者實際操作網頁系統，並評估是否符合需求，包含：操作介面是否 具親和性、流程是否順暢、功能是否完善…等；在顧客方面，必須考量到功能是否 便利、購物的便利及流程是否順暢、是否能夠讓顧客產生購買的意願及美工設計是 否能吸引顧客駐足，各種構面及考量都是此測試階段的重點。
在系統測試階段若能讓越多使用者或消費者有足夠的時間實際反覆測試網站的 每項功能，並進行多次訂購測試，評估訂購過程，如此才能真正發掘問題所在，也 正因系統建置的最終目的為提供使用者更有效率及便利的操作環境，故如果在使用 者測試後，發現有任何操作介面或是系統流程的問題，皆必須在經過不斷的修改與 再測試，才能真正達到功能完善與具親和性的電子商務網站之目標。
第四節、評估階段
系統評估就是要確定新系統是否滿足需求。因此當新系統開始真正操作時，小 組就必須與其它網站使用者討論，瞭解他們對整個系統的滿意程度，並提出建議，
可做為下次對類似系統做系統分析時之參考。
第三章、網站呈現
當一個電子商務網站系統建置完成後，為了後續的維護與修改，書面化的文件 是不可或缺的要素，在此已將整個電子商務網站之架構圖完成書面化的文件，並詳 細地介紹整個網站之功能、連結及操作方法，如此即能讓日後之系統維護人員更方 便且有效率的執行系統維護工作。
第一節、網頁的架構
夯機王網頁架構圖如下圖所示：
圖 11.夯機王網頁架構圖
第二節、網頁功能展示
1.夯機王首頁
夯機王網頁架構是用表格來規劃，可分成四部分。上面是標題也就是 logo。左 邊有 PHP 語法製作做月曆，上面會標示當天的日期，下面的滑動目錄是用Java script 語法製作，點一下會滑出子目錄，再來就是顯示上線人數及訪客人數。
右邊有設置會員登入、加入會員、忘記密碼的選項，方便讓使用者操作，除此之外，
還有手機搜尋及站內搜尋，讓使用者可以依自己的喜好來尋找廠牌與型號和輸入關 鍵字來搜尋最新消息及小常識的文章。最後是中間會根據每頁網頁需求，顯示不同 的內容，例如：首頁有顯示FLASSH 廣告來吸引消費者的注意、最新消息則是會提 供最新手機資訊、熱門手機會根據點閱率來排名、小常識會提供消費者一些使用手 機或保養手機的基本常識。
圖 12.夯機王首頁
1. 加入會員
若使用者想到夯機王購買手機，就必須先加入會員，除了最基本的帳號及密碼，
還有信箱、地址、姓名、電話等等，都必須輸入正確，確保當消費者願意購買手機且 下訂單後，商品能確實送達到顧客手中。有 * 符號的欄位要輸入正確，如果輸入 格式沒依照規定，則無法加入會員。
圖 13.加入會員
2. 加入會員成功
當加入成功會員，系統會寄一封通知信到會員的信箱，會員可以去查看。當註 冊成功時，系統會自動登入，因此右邊會顯示大頭圖跟歡迎的標語，還有提供修改 會員資料及登出的功能。
圖 14.加入會員成功
3. 修改會員資料
當會員想修改密碼及個人資料，即可進入修改會員的頁面，系統會自動將該會
員的資料從資料庫取出來放至表單欄位，讓會員能夠快速且方便的使用。另外為了 美觀及在討論區顯示大頭圖，提供讓會員依個人喜愛來上傳圖片。
圖 15.修改會員資料
4. 上傳圖片
上傳的圖片有限制副檔名及檔案大小，以免使用者上傳錯誤的檔案或過大的圖 片，造成不必要的系統資源浪費。
圖 16.上傳圖片
5. 忘記密碼
當使用者想登入夯機王會員系統時，若忘記密碼，可以透過忘記密碼的頁面來 輸入會員帳號及會員資料裡的信箱。輸入完成後，會判斷是否輸入正確，當兩項資 料都符合時，系統會自動寄密碼到會員的信箱。
圖 17.忘記密碼
6. 最新消息
首頁有設置最新消息的連結，版面設置最多顯示是三個，按 more 後會連結到 最新消息的列表，會顯示所有的文章。
圖 18.最新消息
7. 小常識
首頁還有小常識的版面，跟最新消息一樣，按下 more 後會連結到小常識的文 章列表，選擇其中一項文章點選後，會顯示該文章的主題、日期、圖片及所有內容。
圖 19.小常識
8. 手機館
進入手機館頁面，會顯示全部的手機資料，利用分頁來顯示，以免顯示過多造 成使用者操作不方便。會員想要瞭解手機詳細資訊時，可以點選手機圖片或是名稱 來連結，若是想觀看大圖片則可點選放大鏡顯示。若按下購物車圖示即可將手機加 入到購物車。
圖 20.手機館 9.手機詳細資訊
當使用者從手機館點選某款手機時，會連結至手機規格介紹的頁面，裡面有完 整的手機名稱、手機規格、詳細功能、價格、運費等資料，讓會員可以方便且快速瞭 解該手機的資訊，來提高會員購買的意願度。
圖 21.手機詳細資訊
10.留言板
留言板的設置主要是與管理者的互動，使用者可以將疑問透過留言板發表出來，
然後管理者看見之後，可以即時的回應，解決使用者的問題。留言板設置較開放，
因此沒有登入會員時也可以留言，但是留言時，要確實輸入姓名、主題、內容，否 則無法留言。
圖 22.留言板 11.討論區
討論區主要是會員與會員之間的互動，會員們可以將任何關於手機或是其它問 題在這裡發表出來，讓所有會員們看見，然後給予回應。當會員想要發表新文章或 是回應其它會員文章時，必須先登入會員才能使用。
圖 23.討論區
12.購物車
當會員將中意的手機放入購物車後，即可到購物車清單裡查看，並且可以修改 購買數量或是刪除。購物車上限是 4 款手機，當購物車到達上限時，無法再將手機 放入購物車。會員確定購物後，按確認結帳送出。
圖 24.購物車
13.確認送件資料
會員按下確認結帳後，要先確認送件資料是否填寫正確。選擇收件方式，根據 選擇不同，下面選項也會不一樣，如果是選郵寄，會顯示送件地址及預計收件時間；
若選擇 7-11 收件，則會顯示門市選擇，讓會員可以選擇自己方便的地區取貨。當確 認無誤後，即可按下送出。
圖 25.確認送件資料
14.訂單確認
會員確認送件資料後，讓會員再一次確認購買的手機、數量、價格及送件資料是 否正確，並用顯眼的注意事項來提醒會員。確認無誤後即可按下確定送出，送出此 訂單。
圖 26.訂單確認 15.訂購完成
再訂單確認按下送出後，即無法再修改。本頁面會顯示此次訂購的訂單編號、
選購的手機及價格、送件資料，並提醒會員至付款方式頁面中查看。
圖 27.訂購完成
16.付款流程
當會員送出訂單後，可至付款流程頁面瞭解付款及收貨方式。選擇 7-11 取貨，
要等商品送達 7-11 後在付款取貨；若選郵寄方式，要在送出訂單三日內透過 ATM 轉帳或匯款將錢匯至指定帳戶。
圖 28.付款流程
17.訂單查詢
會員在送出訂單後，可以到查詢訂單頁面查看付款情形及出貨情形。當會員付 款後與商品寄出後，會經由管理者頁面修改付款及出貨情形。
圖 29.訂單查詢
18.購買紀錄
會員可以經由購買紀錄頁面瞭解到曾經購買過哪些商品。
圖 30.購買紀錄
19.管理者專區
登入夯機王時，系統會判斷帳號的權限，符合管理者權限時會自動轉入管理者 頁面。管理者專區主要目的是為了方便與會員互動，而且採用較具親和力介面來操
作每項功能，大幅縮短使用時間及增加便利性，不必在透過後端資料庫來管理。
圖 31.管理者專區
20.管理者專區 – 會員資料表
會員資料表的功能者要是讓管理者瞭解目前夯機王有多少會員註冊，當一個電 子商務網站有著大量的會員使用，相信是會很成功的。
圖 32.會員資料表
21.管理者專區 – 留言板資料表
當使用者在留言板提出問題時，管理者可以透過此頁面快速回應使用者的問題。
若是遇到不當發言時，管理者可以將此留言刪除掉。
圖 33.留言板資料表
22.管理者專區 – 討論區資料表
討論區資料表會顯示所有的主題，若是有不當的主題管理者可以將其刪除；或 者是主題裡所回應的內容可以選擇刪除。
圖 34.討論區資料表
23.管理者專區 – 訂單資料表
訂單資料表是管理所有會員的訂單，當會員付款後，管理者可以透過此頁面將 付款情形改成已付款；若是已將商品寄出時，將出貨情形改成已出貨。讓會員可以 快速瞭解付款和出貨情形。
圖 35.訂單資料表
24.管理者專區 – 新增手機資料
有新手機要上架時，可以透過新增手機頁面來新增，管理者只需要選擇廠牌、
輸入型號、名稱、價格及詳細功能，最後上傳手機圖片即可完成。讓管理者可以方便 且快速的使用。
圖 36.新增手機資料 25.管理者專區 – 修改手機資料
若管理者要修改手機資料時，可以透過此頁面來修改。另外附加調色盤，來幫 助管理者可以更容易呈現美觀的網頁。
圖 37.修改手機資料
第四章、結論
隨著人們生活的行動性以及對網際網路依賴程度的增加，網際網路的行動性需
求越來越大。無線網路在過去十年中主要用於提供語音服務，這些網路實現了電話 的行動應用，行動用戶數量在今後的 1- 2 年內將可望超過有線電話用戶。隨著人們 在任何時間、任何地點獲取資訊的需求增加，人們期望網際網路能支援行動應用。
在本研究中可發現藉由電子商務網站的建置，企業可以透過便利的網路購物平 台，提供消費者客製化的產品與服務。而消費者也只需要利用瀏覽器連接網際網路，
進入企業所建構的電子商務網站，即可進行商品目錄的瀏覽、加入會員、線上訂購 及訂單查詢等活動。企業管理者亦能透過系統將消費者在網站中所購買的訂單資料 加以彙整，並於接單後即時出貨，以求能迅速有效率地將商品送至消費者手中；其 次，管理者亦可藉此網站系統更有效率且即時的進行訂單管理的工作及與顧客進行 互動，且迅速地回應顧客的需求，以提升企業之競爭力，成為一個企業所不可或缺 的電子商務網站系統。
第五章、心得
陳毅蓁 心得分享
最重要的專題終於完成了，我們這組從確認主題開始便決定了要以電子商務網 站為題目，之後討論結果最終決定製作以賣手機為主的網站，一開始的蒐集資料從
手機網站.各家電信行 DM...等揭開了我們的專題序幕，再來便以製作網站為重心 與專題展開了長期抗戰，先製作網站大概雛型，再進一步慢慢修改網站，然後加入 了程式，終於有了一點點的成果，經過了美工設計還有網站偵錯，我們的專題終於 漸漸成型了，歷時了快一年的時間，謝謝肇哲老師的耐心指導，還有靠組員們的分 工合作才能有今天的成果，如今告一段落，也因為越來越接近成果發表會而越忐忑 不安，希望那天表現不要失常，隨著專題的結束，有如釋重負的感覺，很謝謝組長 的教導以及團結的組員們的分工合作，很開心我們真的完成了專題!
李惠惠 心得分享
這次的專題網頁，這個學期，過得特別快，感覺專題就佔了學期的八成…到了 期末，真的有一種說不出的累，不過正所謂知易行難，大概知道要怎麼做也知道它 的概念但是在寫程式上面仍是有些許的困難，這都要歸功於我們的組長張彥彬，因 為在許多方面他都能夠適時給予組員很多的建議，在程式寫不出來的時候也幸好有 他才能夠順利的把程式完成其實專題給我的感覺還蠻愉快的(除了在程式寫不出來 的時候)，像我們在討論的時候也是天馬行空的亂想，但是最後卻能夠化成實際上 的東西，也因為大四了，可以跟班上同學相聚的時間不多了，因此特別珍惜最後與 同組的同學相聚的時間，最後希望此次的專題能夠完美成功。
蔡宗恩 心得分享
電子商務的發展基礎，是建立於新興網際網路科技上的，由於網際網路的使用 人口快速成長，運用層面不斷加深加廣，使網際網路的發展有限的可能。電子商務 蘊藏著無限的商機，企業經營的競爭模式，也產生了革命性的改變。因此身為現代 人，不能不了解網路世界的特性。而網路特性便是無遠弗屆的連結，全球各地的企 業與人們透過電腦、PDA、電視等各種網路工具，彼此傳達訊息。隨著無線傳輸及頻 寬的科技大幅進步，人與人的互動更不受到時間與空間的限制，人與資訊世界的連 結將更加緊密，地球村的理想得以實現。
由於網路無形體的特性，音樂及知識轉化成為數位式的商品，大幅節省了印製
及運輸成本。而且網路傳輸速度快，複製過程簡單，且幾乎不必任何成本、不佔空間 因此，當人們習慣於使用數位化的商品後，無形體商品的銷售會變得愈來愈重要，
規模愈來愈大。在網路上利用轉帳、信用卡等方式來付款，已經是相當普遍了。此外，
投資者不但可以在網路上得到更快速、更有價值的資訊，而且是免費的，不必辛苦 的到銀行或證券商交易，在網路上就可以輕鬆付款、下單投資，效率高且具有隱密 性，金融服務更完善。
以往商品只能透過電視、廣播、報章與消費者進行單向的宣傳，人員的雙向溝 通耗時又無效率。然而，在網路上人與人溝通的省時，商店貨品也可將資訊以文字、
聲音、影像、虛擬實境等多元方式來呈現，吸引彼此的注意並同時與多人進行溝通。
網路商店可以利用討論區及 E-mail 信箱的方式，與消費者進行互動式討論，立即 為消費者解答問題、提供服務，來提高網站閱率與知名度。
此次我們研究專題做的是電子商務網站-夯機王的架設，從一開始的收集手機 資料到今天已接近完成，從中學習到不少實作東西與上課的理論面談有很大的相異 之處。時間達至一學期左右，雖然中間遇過不少問題但在大家的合作與討論下多多 少少都有解決。我想分工合作與協調溝通也是專題製作該學習到得。實作已快接近 尾聲，近一學期專題學分沒白費掉。相信大家也從中獲得了不少的東西。
張朝陽 心得分享
做了這個專題，一開始就先在想要做什麼，然後再慢慢去構想，最後決定以手 機為主題，起初先做資料庫，常常碰到困難，大家一起想，還有去問老師或者上網 尋求幫助，一步一步來，這個報告跟以往的報告不一樣，以前在做報告就是短短的 為了交差用，也沒啥實體的展現，最多是 PPT 加口頭報告，而這個專題，是大家一 起去做，誰那個方面比較強就負責那方面，大家一起面對，還有工作上的分配，是 個很好的經驗，大家都不會想成為拖油瓶，所以都會找些事情做，壓力使人成長，
為了要做出好的成果，大家都花了不少心思，最後做出這個網頁，或許還有待改善，
但是我覺得大家都有盡力，當然還有老師辛苦的給我們指導，還有適當的給我們壓 力，否則事情一定不會如期完成，這次的專題，使我了解到互助合作完成一件東西
需要溝通、協調、合作，大家有啥意見都可以說出，從意見中找出瑕疵，這樣才能 使作品更好，不管成果如何，我想對大家都是很好的經驗。
謝侃呈 心得分享
三年級上學期開始專題分組，我選擇的是林肇哲老師帶的電子商務，剛開始只 知道電子商務是利用網路來進行商業活動而已，直到實際參與，才發現裡頭其實有 很多的學問，例如說:資料的蒐集，資料庫的應用和程式的撰寫...等等。在建置網 路網站的過程中，一定會遇到瓶頸，當有瓶頸時，大家就會找時間討論，在討論過 後還是無法解決的話，就會請教老師，而老師也會給我們一些意見和方法。
透過這個專題，我從中學到團隊合作的精神，討論過程中難免會有意見相佐的時候，
如何在眾多的意見中，協調出一個讓大家都何接受的方案，此時團隊的溝通就顯的 相當重要，雖然說專題的成果稱不上是非常完美，但是該有的都有，不管如何，這 是一個相當寶貴的經驗。
楊椀喬 心得分享
我做的專題是電子商務的建置，是類似在架設網站。我常常都會上網看一些奇 奇怪怪的網頁，我都會覺得網頁瀏覽起來好簡單，只要點一點就可以了，可是沒想 到，在實際架設網站的時候，好難，好複雜！
我有時都會佩服那些在網頁的背後，日也操，夜也操，每天都在設計網頁的設 計師們，佩服他們能夠做出這麼厲害的網頁。
網頁它都要用到一些很複雜的程式設計，我從高中的時候我就對程式設計感到 很煩感，因為它好難，好複雜，有一些英文都看不懂，連ｂｏｄｙ呀、ｈｅａｒ呀，
都不知道要放在哪裡，有些他們也都會重覆到，就覺得它好雜亂的感覺...
我在專題小組裡是著重於美工，雖然聽起來是很簡單，只要加點顏色就可以了（那 時我是這樣子想的）...可是沒想到，美工一點也不簡單，而且很難，難 上加難，要怎樣讓網頁看起來既美觀又不能太華麗，既簡單又不能太複雜，這是一
筆很大的學問。
專題的美工是我和一位同學一組，我們兩人每次都會費盡心思的在配色，因為 我們都覺得我們用色不夠大膽，都很保守，畢竟我們沒有專業的配色技巧，所以在 顏色方面我們都會簡單，不會太花俏，剛剛好就好。
我們有時候還會做到對方互相 ''張來張去''(台語)，例如....我想要這樣，可是 他卻覺得不好，總會發生意見不合的時候，不過吵架歸吵架，我們也有產生許多笑 點，笑笑就沒事了...
專題製作讓我學到了還蠻多的東西，比如說在配色的運用上，一些比較簡單的 程式設計操作，還有團體間的互動等等...這些在我畢業之後還是會繼續碰到的 東西，所以努力學的話，將來也一定可以架設屬於自己的網站...over！！
李采芸 心得分享
關於這個專題我們所架設的是一個賣手機的電子商務網站，一開始還很茫然的 不知道該如何下手，後來經過討論與工作分配，我和椀喬負責了美工的部分，組長 說美工算是我們的興趣與專長，所以決定讓我們來美化這個網頁。美工這工作看是 簡單、輕鬆，可是對於用色的部分對我們來說是一大考驗，總覺得我們用色不夠大 膽，後來決定去買一本有關配色的書回來研究。
首先一開始先是幫忙搜集資料，再來就是幫忙看看網頁提供意見，在測試網頁 的時候，當下真的好佩服那些程式設計師，全是密密麻麻的程式語言，他們寫得很 明瞭，我看了卻很頭痛，可能是我真的不擅長語法的部分吧!初步架設網站時，我 跟椀喬只能幫上一些小忙，但架設大概 70%後，我們就開始塗塗畫畫了，製圖過程 中我們經常因為一些小細節耍個性，但還好都只是小小逗嘴，不至於到吵架的地步，
逗完下一秒就又好了。
這個專題讓我又認識了一個軟體”Ulead GIF Animator”，一開始我還不知道 有這個軟體，本來是打算用 Flash 做的，可是好像因為語法有衝突放到網頁上都失
敗，害我懊惱好久，後來跟組長討論線上人數計數器那個部分要如何呈現時，才偶 然得知這個軟體，也還好我電腦裡有這個軟體，稍微摸索了一下，其實它並不複雜，
有些圖片若怕失真，利用複製貼上藉由這軟體存檔就可以成功了，或是想要圖片也 具有動畫效果，都可以用這個軟體做出來，現在我變得超喜歡用這個軟體的!另外 我還學到了團體工作中的包容、多聽點別人的意見，互動也很重要，這些東西可以 說是一個實習，對於出社會前的實習，將來陸陸續續都還是會遇到的，最重要的是
”做中學，學中做”，這句話對我影響蠻大的!
張彥彬 心得分享
這是我們第一次製作專題，對每個人而言也許是最後一次。當題目確定是製作 關於手機網站後，大家就開始分配工作。萬事起頭難，一開始起步的確不簡單，發 生不少問題，所以專題第一學期進度非常緩慢，頂多只有收集資料與初步網頁的架 構及會員登入。暑假期間發現網頁製作有問題，畢竟整個小組都沒有人有製作網頁 的經驗，所以就重新規劃一次網頁，並在暑假期間完成留言板、討論區及手機館的 功能。最早是希望可以在暑假期間都完成，這樣往後日子就輕鬆許多，但想的一回 事，做又是一回事。在規劃網站過程中，夯機網網站重新製作四次，雖然每一次所 規劃都不是令人很滿意，但大家也盡力了。暑假過後，面臨研究所的推甄，所以在 進度上有慢下來，在那時候才曉得，凡事要先未雨綢繆，如果專題早點製作完成，
我想專題第二學期期間就比較不會那麼辛苦。
最後，感謝整個小組的用心與配合，感謝美工的李采芸與楊椀喬，在網頁的美 工製作下配合我非常多；感謝網頁製作與資料庫整理的蔡宗恩與施文雅，雖然在製 作上常遇到問題，但你們還是用心的製作；感謝幫忙製作會員登入的謝侃呈與張朝 陽，程式雖然不是你們的強項，但感謝你們的配合；感謝謝侃呈、張朝陽、李惠惠、
陳毅蓁、李采芸與楊椀喬製作FLASH 動畫，讓網頁呈現更加豐富。還有，無論專題 或是研究所推甄的問題，感謝林肇哲老師幫助我許多；感謝鄭文昌老師及羅逸文老 師在我遇到程式上問題時，幫我解答。謝謝。
施文雅 心得分享
這次的專題題目是電子商務網站，說真的“電子商務”這名詞彷彿只應該會出 現在課本上，一開始接觸到連方向都模模糊糊的。還傻傻的用 Frontpage 做了一大 堆網頁，但是後來才知做的方向錯誤是該用 SQL 的資料庫正 Dreamweaver 來構成整 個網站，然後變 180 度升級整個網站真是讓我開了眼界！後來網站慢慢的完成，也 開始測試陸續找到了 bug，雖然不能說是 100%好，但我們投入的心力至少也有 120
%。
這電子商務網站的功能雖然不能像大企業做的那麼完善但也是以方便、快速、
體貼的 3 個指標下去做功能希望能讓消費者方便，也讓企業有更完善的制度
這專題真的要感謝小組裡每一位的努力，由其是組長彥彬他真的是我們專題的 主要靈魂，還有一直指導我們的林肇哲老師一直細心的教導我們該如何該注意什麼 的來完成專題，這專題真的是大家的心血結晶啊。
