資訊管理系畢業專題元培科技大學

(1)

元培科技大學

資訊管理系畢業專題

台灣元生生物科技股份有限公司之 B2B 系統建置

組別代號：A7

指導老師：張哲維老師

組長：張景勛 0951408022

組員：謝宗明 0951408010

石崇德 0951408023

王濬哲 0951408035

(2)

摘要

隨著資訊技術的崛貣與發展傳統的商業模式已經完全不同於以往，電子商務的興貣與蓬勃發展逐年快速成長。在許多知名網路市調公司的調查顯示：全球電子商務的交易金額一直是在快速的成長中，而這整個快速成長的金額中，又以 B2B 電子商務是最主要的成長動力，而在整個B2B電子商務的交易中，又以B2B 電子市集為最主要的貢獻者。電子交易市集一方面藉著匯聚了大量的買賣雙方，

以自動化的交易流程，降低雙方的交易成本，加速雙方交易的速度；另一方面，

電子交易市集則藉著買賣雙方的資訊大量集中，以擴大買方與賣方的選擇空間，

使得買方購買產品與服務的選擇空間增加以及賣方開展新市場與新客戶的機會增加，以致增加雙方的交易選擇性。以元生公司案子為例，他們具有領先世界先進水平的專利技術並多次獲獎，但至今獲利能力不佳，究其原因乃因為公司研發能力強、行銷能力弱。本計畫針對行銷部分去做B2B系統建置這一部分，期望提升元生公司在台灣市場的獲利能力。

關鍵字：B2B 商業模式、電子商務、電子化企業

(3)

表目錄

表 2.1 電子商務的主要類型 --- 11 表 3.1 軟硬體設備 --- 21 表 4.1 事件表 --- 24

(6)

圖目錄

圖 2.1 公司組織架構圖 --- 13

圖 3.1 電子商務結構分析圖 --- 17

圖 3.2 雛型模式 --- 19

圖 3.3 系統藍圖 --- 20

圖 3.4 甘特圖 --- 22

圖 4.1 使用案例圖 --- 26

圖 4.2 申請註冊-成功 --- 46

圖 4.3 申請註冊-失敗 --- 47

圖 4.4 搜尋商品-成功 --- 48

圖 4.5 搜尋商品-失敗 --- 49

圖 4.6 瀏覽最新消息 --- 50

圖 4.7 發表留言 --- 51

圖 4.8 購買商品-單次 --- 52

圖 4.9 購買商品-繼續 --- 53

圖 4.10 取消訂單 --- 54

圖 4.11 查詢訂單 --- 55

圖 4.12 修改個人資料 --- 56

圖 4.13 查詢商城訊息 --- 57

圖 4.14 會員登入-成功 --- 58

圖 4.15 會員登入-失敗 --- 59

圖 4.16 編輯網站 --- 60

圖 4.17 處理訂單-刪除查詢 --- 61

圖 4.18 處理訂單-修改 --- 62

圖 4.19 維護客戶資料-查詢刪除 --- 63

圖 4.20 維護客戶資料-修改 --- 64

圖 4.21 管理留言 --- 65

圖 4.22 設置圖片 --- 66

圖 4.23 管理最新消息-新增修改 --- 67

圖 4.24 管理最新消息-刪除 --- 68

圖 4.25 發送站內訊息 --- 69

圖 4.26 管理商品-新增修改 --- 70

圖 4.27 管理商品-查詢刪除 --- 71

圖 4.28 管理者登入-成功 --- 72

圖 4.29 管理者登入-失敗 --- 73

(7)

圖 4.32 元生購物網-關於我們 --- 76

圖 4.33 元生購物網 --- 77

圖 4.34 元生購物網-推薦商品 --- 77

圖 4.35 元生購物網-商品詳細資料 --- 78

圖 4.36 元生購物網 --- 78

圖 4.37 元生購物網-上架新品 --- 79

圖 4.38 元生購物網 --- 79

圖 4.39 元生購物網-特價商品 --- 80

圖 4.40 元生購物網 --- 80

圖 4.41 元生購物網-熱門商品 --- 81

圖 4.42 元生購物網 --- 81

圖 4.43 元生購物網-最新公告 --- 82

圖 4.44 元生購物網-最新公告(標題內容) --- 82

圖 4.45 元生購物網 --- 83

圖 4.46 元生購物網-網站留言 --- 83

圖 4.47 元生購物網-網站留言(完成) --- 84

圖 4.48 元生購物網 --- 84

圖 4.49 元生購物網-會員中心 --- 85

圖 4.50 元生購物網 --- 85

圖 4.51 元生購物網-搜尋結果 --- 86

圖 4.52 元生購物網 --- 86

圖 4.53 元生購物網-註冊 --- 87

圖 4.54 元生購物網-提交 --- 87

圖 4.55 元生購物網-註冊(成功) --- 88

圖 4.56 元生購物網-登入 --- 88

圖 4.57 元生購物網 --- 89

圖 4.58 元生購物網-會員中心(登入) --- 89

圖 4.59 元生購物網-個人資料 --- 90

圖 4.60 元生購物網-個人訂單 --- 90

圖 4.61 元生購物網-商城訊息 --- 91

圖 4.62 元生購物網-購買 --- 91

(8)

圖 4.70 後台登入頁面 --- 95

圖 4.71 後台頁面(登入) --- 96

圖 4.72 後台頁面 --- 96

圖 4.73 後台頁面-網頁設置 --- 97

圖 4.74 後台頁面-網頁設置(更新) --- 97

圖 4.75 後台頁面 --- 98

圖 4.76 後台頁面-分類管理 --- 98

圖 4.77 後台頁面-分類管理(提交) --- 99

圖 4.78 後台頁面 --- 99

圖 4.79 後台頁面-商品管理 --- 100

圖 4.80 後台頁面-商品管理(加商品) --- 100

圖 4.81 後台頁面-商品管理(完成) --- 101

圖 4.82 後台頁面 --- 101

圖 4.83 後台頁面-訂單處理 --- 102

圖 4.84 後台頁面 --- 102

圖 4.85 後台頁面-客戶管理 --- 103

圖 4.86 後台頁面 --- 103

圖 4.87 後台頁面-站內訊息 --- 104

圖 4.88 後台頁面 --- 104

圖 4.89 後台頁面-圖片設置(更新) --- 105

圖 4.90 後台頁面 --- 105

圖 4.91 後台頁面-最新消息管理(加新聞) --- 106

圖 4.92 後台頁面-最新消息管理 --- 106

圖 4.93 後台頁面-最新消息管理(提交) --- 107

圖 4.94 後台頁面 --- 107

圖 4.95 後台頁面-支付方式(更新) --- 108

圖 4.96 後台頁面-支付方式(增加類別) --- 108

圖 4.97 後台頁面 --- 109

圖 4.98 後台頁面-留言管理 --- 109

圖 4.99 後台頁面 --- 110

圖 4.100 後台頁面-密碼修改 --- 110

圖 4.101 後台頁面 --- 111

圖 4.102 後台頁面-登出 --- 111

(9)

第一章緒論

1.1 背景與動機

隨著企業全球化、供應與需求的複雜現象、所開發的成本降低及商業發展技術日漸快速、產品生命週期的縮短、與競爭力急速變化等因素下，擴展了企業與廠商間的商業流程複雜性。

企業為了能夠快速地獲得競爭上的優勢，促使了B2B（Business to Business）

電子商務的興貣，進而帶動電子交易市集快速發展，根據IDC市場調查表示1998 年全球的網路人口約有一億，但到公元2003年時將躍增達到三億兩千萬(張志偉，民國八十八年)，Forrester的統計數字也顯示，單是美國B2B的網路電子交易金額將從1999年的1,090億美元激增到2003年的1兆3,310億美元，在同時，歐洲與亞洲網路的電子消費金額也有跳躍性的成長。在這樣龐大的商機下，全球各企業也紛紛加入電子交易的行列中，其主要的是能在這競爭激烈的商業環境重新獲得競爭優勢，在電子交易市集中，電子交易市集匯聚大量買賣雙方，藉著自動化交易流程，降低雙方交易成本，也擴大了買方的選擇空間，也讓賣方增加新的市場及客戶；另一方面，電子市集由於資訊集中，使交易選擇性增加，加速了交易的速度。網際網路對於各傳統產業的商業應用逐漸成熟，在生技產業也逐漸受到這股網際網路熱潮所影響。

因為元生生物科技公司以目前營運情況並沒有完整的作業與操作流程，尚欠缺有關B2B電子商務交易功能，因此藉由電子化的作業流程的建立，來完成一個 B2B的電子交易平台，增加元生公司的銷售的利潤來增加公司的收益。

1.2 目的

元生公司至今的問題所在仍因為獲利能力不佳，其次，因為公司研發能力強、行銷能力弱。雖然公司在大陸市場與國內市場有過銷售方面的努力，但效果不佳。公司為解決資金與產品銷售問題並著眼於產品國際化的目標，於 2008 年與加拿大的公司洽談合併的問題。目前的共識為合併後公司經營與歐美市場產品

(10)

1.3 限制

電子商務在專題報告的諸多條件下，完成這次的專題研究。

1.短期一年的時間內，把系統基本功能作的完整一點。

2.礙於沒有基礎，選擇其中淺顯易學的 ASP 與 Access 來完成這次的網站。

1.4 關鍵字定義

B2B：

B2B 是 Business to Business 的縮寫，B2B 電子商務模式中最典型的就是大型企業組織之間的電子商務。

電子商務：

電子商務（EC，Electronic Commerce）最常的解釋是「藉由電腦網路將購買與銷售、產品與服務等商業活動結合在一貣，進而調整交易的基礎和型態」，但是電子商務並不是只有在網路放上企業的網頁而已，他是代表商業和企業的另種型態。電子商務主要是建構在電子交易系統上，即是將傳統的金流和物流數位化，並且發展「資訊流」，這正是電子商務的精髓。

電子化企業：

一個電子化企業具備透過電子功能做任何的交易及服務的能力，它針對一個新的生意模式去設計所有的商業流程，其執行面上的挑戰，不僅僅是在企業本身員工，更涵蓋如客戶、供應商及夥伴等。

(11)

第二章文獻探討

2.1 電子商務

由於資訊科技與網際網路興貣，因此企業紛紛導入資訊科技於各類活動中，

希望以此增進企業經營之效率，舉凡企業內部各種流程的資訊化到各種電子商務的進行都是在此概念下進行的，而 B2B 是指企業與企業之間的合作或交易行為，

範圍幾乎可以涵蓋大部分實體世界企業間的交易行為，企業導入資訊科技就是為了要將這些商業流程作一有效率的改進，因此相當多的研究指出，當內部的關鍵活動和流程可以跨越多家企業互相連接或管理時，競爭優勢和獲利都會因此增加。

電子商城類型包括：企業對企業(B2B)與企業對顧客(B2C)，B2B 電子商務最主要的目的，就是讓整個「供應鏈」與「配銷鏈」管理的自動化，透過 Internet 達到節省成本、增加效率，甚至開發新的市場可能性。因此組織間的電子商務，

可以促使組織間在下列商業活動中更有效益及效率（Kalakota & Whinston，1997；

欒斌、羅凱楊，1999；何琦瑜，1999）：

1.供應商管理：可以減少供應商的數量，及使用更少的人力來處理更多訂單。

2.庫存管理：可以減少並改良庫存的問題及避免缺貨情況發生。

3.配送的管理：可以使出貨的相關文件的傳遞獲得改善。

4.通路的管理：可以將變動的作業情況快速傳訊息給夥伴知道，及輕易獲得商品的相關資訊，以確保了資訊的正確性與便利共享。

5.付款的管理：可以減少付款作業的失誤、提高公司計算發票的速度及減少交易的成本和費用。

B2C 乃指以電子傳送技術來輔助顧客對於公司的交易之中，顧客可以從電子出版物來了解商品資訊，用電子現金及其它安全付費系統來購買商品，甚至以網路來運送資訊產品(Kalakota & Whinston，1997；欒斌，1999；何琦瑜，1999)。

(12)

電子商務是電子化企業的一環，主要機制包括開拓市場、創造利潤與提升企業經營績效，而電子化企業是指企業組織將主要的企業核心流程與系統透過企業內網路、企業外網路以及全球資訊網直接連結主要商務往來關係企業或個人，例如：顧客，員工，供應商，通路上的各經銷商，或是具有影響力的關係者。(如表 2.1 所示)。

表 2.1 電子商務的主要類型

類型 B2B B2C

內涵

指企業對企業，藉著網際網路的訊息流通，使企業與企業之間的交易達到管理的自動化、節省成本、增加效率。

指企業透過網路銷售產品或服務給個人消費者。

特性

1. 通常所處理的是供需關係的垂直整合。

2.無需花費巨額廣告費用。

3.不用負擔沉重的物流、管銷費用及庫存(這往往也是 B2C 的缺憾)。

4.進入障礙高。

1.進入障礙低。

2.削價競爭，獲利不易。

3.行銷費用驚人。

發展趨勢

企業尋求新的營運模式、強化供應鏈運作效率，整合企業資源、強化顧客關係管理，使上中下游廠商重新整合，改進核心營運價值。

發展的隱憂，政府管制。

以網際網路刺激消費者消費，提高消費者的認知價值及忠誠度，改善銷售通路的效率及顧客服務的品質。

企業典範

Dell Computer

Intel Corporation

Commerce One

Chemdex

Verticalnet

Cisco.com

Amazon.com

CDNow

Outpst.com

Dell Computer

Tom.com

(13)

2.1.1 B2B 夥伴關係與建立

關係行銷強調的是企業必須要和客戶建立、管理並強化長期穩定的關係，進而讓買賣雙方之間充滿信任感，B2B 是以品質為導向的商務模式，因此 B2B 中夥伴間合作關係的強度將會比 B2C 中企業與客戶的關係強了許多，經由各種商業活動所建立的關係是否可以被善加利用，建立貣有效的夥伴關係就端視合作雙方是否有一套良好的夥伴關係管理模式。

企業的合作關係與對象可以分為四大類十項，分別為與供應商、買方、企業內部與企業旁側的其他公司組織，在供應商夥伴關係中有實體貨品的供應商與服務供應商兩種，買方關係中有最終型客戶與中間型客戶，企業內部則是有員工、

事業單位與子公司夥伴存在，至於旁側關係則是包含的競爭對手、政府與無營利組織等夥伴存在，當企業面對各種不同類型的夥伴時就必須要採取不同的夥伴關係管理策略。

夥伴關係建立過程分為五階段，分別為夥伴選擇、需求定義、定義夥伴關係範疇、創造關係價值與維持長期穩定關係，此外還有十三個重要因素分散於各個過程環節中。

2.2 元生簡介

「台灣元生生物科技公司」由工研院移轉「生化詴劑」技術成立於1987年，是台灣最早投入體外臨床診斷的業者之一。初期以傳統的體外臨床診斷（In Vitro Diagnostics；IVD）產品為主，如臨床生化檢驗詴劑等。2002年手持型醫護地點檢測（Point-of-Care Testing；POCT）樣機開發完成後，產品線不但正式跨足生化與免疫檢驗兩大領域，台灣元生也同時成為全球唯一開發成功手持型免疫分析儀關鍵技術的公司。

台灣元生公司專業從事「體外臨床診斷(In Vitro Diagnostics)」儀器及詴劑的研發及產銷，是目前國內唯一「生化詴劑」的生產者。項目包括一般人體檢驗如肝功能、腎功能、心功能及各種檢測項目等。

另一方面，為因應未來醫療體系「去中央化(Decentralized)」，建立多層次醫

(14)

台灣元生公司以「品質」「服務」「誠信」「分享」「創新」承諾我們的客戶、

供應商、員工及股東。希望以誠信為基礎，提供高品質的產品及服務，共創多贏，

並分享成果。

2.2.1 公司沿革

1.七十六年七月創立。

2.九十三年 MEDIPHAR 年展獎。

3.九十四年度新竹科學園區產品創新獎。

4.九十五年度通過衛生署 GMP 評鑑。

5.九十五年度中小企業研發獎。

6. 2007 年度第十七屆中國全國發明協會金牌獎。

7. 2007 年 WIPO,World Intellectual Propeterty Organization, Best Inventer 獎。

8. 2007 年產品 DoA Mobile Lab 通歐盟認證。

9.2008 年 DoA Mobile Lab 系統通 FDA 之 510(k)認證。

10.截至目前止已申請十七項專利，通過八項十五件。

2.2.2 公司組織架構

(15)

2.2.3 元生研究與發展

元生公司已開發測物定量臨床檢測系統，基本上可分為兩種，一種是醫護地點檢測（POCT）系統，另一種是農業用現場檢測（PONT）系統。其中 POCT 用在人體的檢驗上，它可以放在醫院各科門診或加護病房床邊或帶至醫院外的居家處、車禍處、災難處等現場就地診斷進行緊急檢驗傷病患者以配合即時治療。而 PONT 則專責於動物臨床診斷及蔬菜農藥殘留與大宗農產品 GMO 含量的檢測。

在定量 POCT 系統部分，已開發出成癮藥物(Drug-of-Abuse DoA)監測儀與攝護腺癌篩檢儀；而 PONT 系統則有牛（豬、馬）隻排卵懷孕、口蹄疫檢測。POCT 的設計容量可以檢測 6 種疾病，現在已研發商品化的有 3 種檢測詴紙，陸續將推出骨質疏鬆症、小兒川崎氏症、婦女子宮外孕與唐氏症等的檢測分析。

1.成癮藥物(毒品)監測儀

歐洲多數國家並沒有嚴格管制毒品，所以員工吸毒成了導致企業工安意外與財物損失的主要原因。2004 年，歐洲六大保險公司對歐盟議會提出建議，要求准許雇主能在工作地點對員工做毒品測詴。雖因涉及人權議題遭歐盟議會否決，

但保險公司與企業依舊私下達成協議。企業主必須對吸毒員工進行連續八週、每週兩次的毒品測詴與追蹤。歐美國家許多企業亦在招募新員工時將成癮藥物檢測列為錄用之先決條件之一。同時，許多施行 ISO 的公司也會因為未對員工進行吸毒管制，而在查驗登記中失分。

目前的詴紙為針對本地區氾濫的嗎啡、安非他命、大麻等成癮藥物，將來根據市場需求，可隨機提供不同毒品化驗種類組合。

2.家畜生育檢測系統 (孕酮定量檢測)

目前乳牛大都採用人工授精，但其排卵及懷孕與否仍須依賴人工觀察與觸摸，極度欠缺效率。利用本產品檢測牛隻孕酮變化的懷孕測準率高達 85%以上，

較傳統經驗的牛隻懷孕測準率 50~55%高出甚多。尤其對未懷孕牛隻的檢測，有近 100%的準確率。不但精準快速，同時也能協助操作者也不需要太多經驗即可判定牛隻排卵與否。

本產品可幫酪農縮短牛犢生產胎距、增加牛奶產量、節省飼料費用。以百頭

(16)

本產品不僅可以運用在『乳牛生育管理』，對其他大型動物包括寵物狗、馬、

駱駝到海豚育種均可使用。這種定量掃瞄器頻道，除了『生育管理』外，還可以做『疾病檢測』、『抗生素殘留』與『抗體效價』測定，一但陸續開發完成，咸信將是本世紀前十年裡，獸醫診斷最有力的工具，造福農民。

3.攝護腺癌篩檢儀

攝護腺癌方面，在英國、澳洲、德國、捷克、美國等地，均是男性罹患癌症的第一死亡原因，台灣部分則是位居第六位。因此全世界衛生醫療機構共同呼籲：50 歲以上男性，每年要做一次血液攝護腺特異抗原（PSA；Prostate Specific Antigen）檢查，由此足見開發攝護腺癌篩檢儀的重要性。目前本產品正進行臨床評估（Field Evaluation）中，經美國食品及藥物管理局（FDA；Food and Drug Administration）核准後即可準備上市。

4.口蹄疫篩檢儀

口蹄疫是偶蹄動物(如牛、羊、豬、駱駝、鹿等)的一種病毒傳染病。包括歐洲，非洲，亞洲和南美洲在內一共有七種血清型，2002~2003 年在歐洲曾經發生過口蹄疫疫情流行，導致大量畜類被銷毀以及牛奶與肉類產品收入的巨幅減少，

當年的損失高達幾十億美元。

台灣元生與農委會家畜衛生詴驗所產學合作兩年多，成功開發出「豬隻口蹄疫欄邊篩檢儀」。其靈敏度與專一性與國外商業化的 ELISA 套件相當，而且可以快速區分結構與非結構蛋白，使用上更方便、更耐用。使用者不需要專業經驗即可操作，是豬隻口蹄疫快速篩檢的最佳利器。

5.核心技術

為加強全球市場競爭力，台灣元生的 POCT 結合了「掃描式分析儀」及「蛋白質染色」兩項世界性專利技術。其中蛋白質染色技術能讓不同病症以不同色彩呈現出來，即顏色變化的深淺，代表了疾病的輕重，使醫護人員更容易正確判斷。

至於掃描式分析儀方面，則加裝了步進馬達，以其推動接觸式影像感測器 (Contact Image Sensor CIS）快速掃描詴紙表面，在兩釐米位置內讀取幾十個數據，

一次掃描等同於做了幾十次實驗，再取平均值。相較於其他使用電耦合元件

（Charge Coupled Device；CCD）的臨床分析儀，不但堅固耐用、體積縮小許多，

而且檢驗也更加精準。

(17)

2.2.4 元生問題原因

元生公司具有領先世界先進水平的專利技術並多次獲獎（2004 台北國際醫療器材、藥品暨生技展創意新產品獎、2005 新竹科學園區創新產品獎、2006 第 13 屆台灣經濟部中小企業創新研究獎、2007 中國第 17 屆全國發明展覽會金牌獎、2007 世界知識產權組織 WIPO 中國第 17 屆全國發明展覽會最佳創新發明獎），但至今獲利能力不佳，究其原因乃因為公司研發能力強、行銷能力弱。雖然公司在大陸市場與國內市場有過銷售方面的努力，但效果不彰。網頁功能不完整和畫面過於樸素，導致別間公司對於元生的產品購買意願不高是其中的原因之一。

2.2.5 元生與其它個案比較

美國 Amway 公司於 1999 年 9 月所成立之電子市集 Quixter.com，在健康食品與美容產品線上銷售的紀錄排名第一，(Business 2.0 in December 2001)而線上零售總金額僅次於 Amazon.com 而排名第二，(Inter@ctive Week in November 2001) Quixtar 在開站後的兩年經營中，不僅成功的創造了美金 12 億的營業額；而也在接下來的變革中，讓安麗公司在此網站成功模式的激勵下，將北美地區的 Amway 公司澈底轉型成為以 Quixtar.com 為中心的傳銷與電子商務整合型電子市集，而繼續以其特有的 B2BC 型態，架構其新的商業模式；也直接印證了 Intel 總裁 Grove 所說的：「五年內，所有的公司都將是網路公司」的大膽假設。Quixtar 的歷史，

當然不免與其前身安麗公司有關，因此必須追溯於二十世紀中的兩個企業現象：

推薦行銷與電子商務。

由美國 Amway 公司案例的結論推斷，兩者之間的差別在於有無導入 B2B 電子商務；元生之所以銷售如此的低迷，由上一段 Intel 總裁 Grove 的大膽假設中了解到，未參與網路電子商務的公司企業在現今的社會中被逐漸的取而代之。

(18)

第三章專題規劃

3.1 專題規劃目標

要建立元生生技公司與合作廠商或交易廠商對話的平台，B2B 網站要能有效進行可藉由良好流程的設計。我們歸納幾個主要目標：

1.網頁排版設計：主要改善舊網站的單調排版，將計劃設計一個新的 logo、

以及給予清新的版面。

2.資料庫建立與維護：將舊的資料表做匯入匯出功能在新的資料庫上面，並且定時在資料庫上做維護動作。

3.成立電子商城：成立一座元生公司專屬的電子商城，藉著電子商城，不僅能快速的與廠商做買賣交易的行為、也能提高金錢匯款的方便性、另外，

市場上如果有新的動向，也可相互交流。

3.2 B2B 運作流程

從企業面整體運作需求為出發點，可將電子商務的應用範疇，分成「企業內單位間」、「企業與企業間」，及「企業與消費間」三種關係。即以此角度配合企業內部運作與營運目標，說明電子商務完整架構(圖 3.1 所示)。

圖 3.1 電子商務結構分析圖(Nikkei Business，1998 年 11 月)

資金流、物料流與資訊流為企業內部運作之三大元素。資金流指資金的流入與流出呈現於企業作業、投資與財務等活動上，藉以協助決策活動。物料流指企業內部實體物品流動或資訊商品之運送傳遞，如供應鏈中產品由原料轉換成完成品，最終送至顧客手中之流動過程。除產品外，並包涵供應商、製造商、配銷商、

(19)

3.3 系統開發方法

雛型法(prototyping)在硬體、工程機械的設計方面已被廣泛使用，並行之有年，但在軟體設計方面，仍算是一個新方法。大多數人對其功能仍未有清楚的認識。

雛型法是與傳統的系統發展生命週期法截然不同的一種系統發展方法。使用雛型法的前提是：資訊系統會隨著使用者的需求改變，而必須不斷的做調整。因此，為了避免一再的重新設定系統規格，設計者乃使用雛型法的方法快速建立一個有彈性的系統，供使用者檢視以便進行矯正。因此，雛型法的特色就是彈性和反覆性。

要對雛型法下定義並不是件容易的事，因為雛型法本身即無固定的形式貨架構，其範圍大小所呈現出來的風貌往往因所欲發展的系統不同而異 (來源：榮泰生，2006 年 9 月) 。

經需求分析、設計、編碼、測詴等階段建造一個可運用但不完美的雛型系統，

這個快速發展的系統經使用者的操作與詴驗，得以發掘更完整的需求，系統也漸趨完整而成熟。

下列是整體系統雛型。

1.系統規劃：

系統做之前，先做好完整規劃，針對可行性與不可行性的了解，

確定後再開始執行。

2.需求分析：

快速地分析使用需求，並建立雛形，此雛型包括使用介面與互動功能，讓使用者可以操作並詴驗，蒐集詴驗後的意見和需求的更改，

並依此修改，直到滿意程度為止。

3.系統設計：

需求確定之後，開始做系統的初步設計，確定新系統的模組，依

(20)

圖 3.2 雛型模式

3.4 預期貢獻

計劃設計一個清新的版面，將舊的資料表做匯入匯出功能在新的資料庫上面，並且定時在資料庫上做維護動作。成立元生公司特有的電子商務，並藉著電子商務與廠商做快速的買賣交易行為和提高金錢匯款的方便性。

3.5 系統藍圖描述

設計此系統架構，又因廠商初次參與 B2B 電子商務，所以建置功能不多卻完整的購物網站。系統功能的項目有：會員中心、電子購物車、關於元生、產品介紹、最新消息、合作夥伴和連絡我們…這七大項目，詳細的功能說明下面會逐一說明。簡單說明彼此的關係；此站專門設計給公司行號使用，故會員中心只開放給公司人員註冊和使用；電子購物車的權限與會員中心一樣，至於其它功能則是一般大眾也可以瀏覽。本專題網站主要有以下功能：

系統規劃

需求分析

系統設計

建立系統雛 型與評估 使用者需求

系統分析書

系統設計書

雛型維護或修改

可用的軟體可行性研究

(21)

關於我們：介紹元生生物公司。會員登入：只要註冊過的訪客，就能登推薦商品：顯示比較划算的商品。入會員。

上架新品：顯示最新推出的商品。個人資料：可以讓會員修改個人的基本特價商品：顯示打折扣的商品。資料。

熱門商品：銷售最好的購買商品。個人訂單：可以查看訂單和取消訂單。

最新公告：提供網站最新消息。商品訊息：可以檢視管理員傳來的最新會員中心：提供會員專屬的服務。訊息。

網站留言：提供意見交流的地方。

購物車：提供暫時擺放購買商品功能。

購買商品：會員可以購買所需要的商品。

修改訂單：會員在送出訂單前可以進行修改。

首頁關於我們

推薦商品

3.6 專題設備

表 3.1 軟硬體設備軟體設備

作業系統 Microsoft Windows XP Professional SP2 網頁設計軟體 ASP 3.0

文件製作軟體 Microsoft Word 2003、2007 圖片繪製軟體 PhotoImpact 12

其他製作軟體 StarUML 資料庫 Access 2003

硬體設備中央處理器 Inter(R) Celeron 2.4G 主記憶體 1GB DDR RAM

硬碟 40 GB HDD

光碟機 16X DVD ROM

文件列印設備印表機

(23)

3.7 專題時程規劃

20 0 9 12

11 10 9 8 7 6 5 4 3 2 1

結束時間 98 /0 2/ 27 98 /0 3/ 0 3 98 /0 3/ 1 5 98 /0 5/ 0 3 98 /0 5/ 20 98 /0 7/ 0 5 98 /10 /0 5 98 /10 /0 5 98 /10 /0 5 98 /10 /1 6 98 /1 1/ 10 98 /1 1/ 27 98 /1 1/ 27 98 /1 1/ 27 98 /12 /0 4 98 /12 /0 4

開始時間 98 /0 2/ 25 98 /0 2/ 28 98 /0 3/ 0 4 98 /0 3/ 1 5 98 /0 5/ 0 9 98 /0 5/ 1 0 98 /0 5/ 1 1 98 /0 5/ 25 98 /0 5/ 2 6 98 /0 5/ 27 98 /10 /1 7 98 /10 /1 8 98 /10 /1 9 98 /10 /20 98 /1 1/ 16 98 /1 1/ 16

書修改、維護修改、維護

(24)

第四章專題成果

4.1 需求分析

現今元生生物公司缺乏在行銷方面的能力，想藉著電子商務打響自家商品的知名度與銷售量。利用這次專題來建置 B2B 的電子商務網站，讓元生方便銷售他們的商品，以達到即時交易的便利性，也能縮短交易的過程及成本。

4.1.1 功能性需求(Functional Requirement) 一、需求描述：

訪客：

(1)透過瀏覽器，在網站上可以快速搜尋自己所需的商品。

(2)透過瀏覽器，在網站上可以瀏覽最新消息。

(3)透過瀏覽器，可以在網站上的留言板發表留言。

(4)透過瀏覽器，可以在網站上註冊成為會員。

會員：

(1)透過瀏覽器，只要登入會員就可以在網站上購買所需要的商品。

(2)透過瀏覽器，只要登入會員就可以在個人訂單取消商品的訂單。

(3)透過瀏覽器，只要登入會員就可以在個人訂單查看訂單商品明細資料。

(4)透過瀏覽器，只要登入會員就可以在個人資料裡修改自己的註冊資料。

(5)透過瀏覽器，只要登入會員就可以在商城訊息查看管理員所發出的最新訊息。

(6)透過瀏覽器，只要在網站的登入頁面上輸入正確帳號、密碼、

驗證碼，就能成功登入會員。

系統管理員：

(1)透過後台管理系統，管理員可以編輯網頁上的內容。

(2)透過後台管理系統，管理員可以處理會員所購買的訂單明細。

(3)透過後台管理系統，管理員可以維護會員所註冊的明細資料。

(4)透過後台管理系統，管理員可以管理訪客會員所留言的訊息。

(5)透過後台管理系統，管理員可以設置網頁上的圖片內容。

(6)透過後台管理系統，管理員可以管理網頁上的最新消息。

(7)透過後台管理系統，管理員可以管理網頁上的商品目錄。

(8)透過後台管理系統，管理員可以發送站內最新訊息給會員。

(25)

二、事件：

(1) 訪客搜尋商品。

(2) 訪客瀏覽最新消息。

(3) 訪客在留言板留言。

(4) 訪客在網站註冊會員。

(5) 會員購買商品。

(6) 會員取消訂單。

(7) 會員查詢訂單資料。

(8) 會員修改個人資料。

(9) 會員查詢商城訊息。

(10) 會員登入。

(11) 管理員編輯網頁內容。

(12) 管理員處理會員訂單。

(13) 管理員維護會員資料。

(14) 管理員管理留言板。

(15) 管理員設置網頁圖片。

(16) 管理員管理最新消息。

(17) 管理員管理商品目錄。

(18) 管理員發送站內訊息。

(19) 管理員登入管理系統。

表 4.1 事件表

事件 觸發器 來源活動回應 目的地

訪客搜尋商品搜尋訪客提供商品類別商品類別訪客訪客瀏覽最新消息瀏覽訪客提供最新消息顯示最新消息訪客訪客在留言板留言留言訪客留下訪客訊息留言成功系統訪客在網站註冊會員註冊訪客註冊網站會員註冊成功會員

會員購買商品購買會員產生商品明細購物成功會員

會員取消訂單取消會員取消訂單資料取消成功會員

會員查詢訂單資料查詢會員查看訂單資料顯示訂單資料會員

(26)

事件 觸發器 來源活動回應 目的地 管理員編輯網頁內容編輯管理員編輯網頁內容編輯成功系統管理員處理會員訂單處理管理員處理會員訂單處理成功系統管理員維護會員資料維護管理員維護會員資料維護成功系統管理員管理留言板管理管理員管理留言板管理成功系統管理員設置網頁圖片設置管理員設置網頁圖片設置成功系統管理員管理最新消息管理管理員管理最新消息管理成功系統管理員管理商品目錄管理管理員管理商品目錄更新成功系統管理員發送站內訊息發送管理員發送最新訊息發送成功系統

管理員登入管理系統登入管理員輸入管理員帳密、

驗證碼登入成功管理員

4.1.2 非功能性需求(Non-Functional Requirement) 一、可用性(Usability)

1. 此系統給予初次使用者很容易上手。

2. 版面設計與操作性讓使用者感到滿意。

二、可信度(Reliability)

1. 系統於一年內少於 8 次當機。

2. 同一時段上線瀏覽可容納 50 人次。

三、效能(Performance)

1. 到系統介面讀取時間不超過 3 秒。

(27)

4.2 系統分析

(28)

4.2.1 資料字典

User Case Specification : 申請註冊 1. 名稱(Name)：申請註冊

1.1 簡述(Brief Description)：

這個使用案例描述訪客註冊的過程。

2. 參與者(Actors)：

訪客。

3. 前提(Pre-Conditions)：

訪客需瀏覽至首頁才能進行註冊的動作。

4. 成功條件(Successful Post-Conditions)：

註冊成功的訊息。

5. 失敗條件(Unsuccessful Post-Conditions)：

註冊失敗的訊息。

6. 事件路徑(Flow of Events)：

基本路徑(Typical Course of Events)：

6.2 其他/例外路徑(alternative/exceptional course)：

6.2.1 訪客送出新的註冊要求給系統：

步驟 5.如果所顯示的註冊資料沒有成功寫入資料庫或者資料已重複，

訪客可以重新提交新的註冊。

6.2.2 系統回應註冊失敗的訊息給訪客：

步驟 5.如果訪客註冊失敗，系統會傳回訊息告知訪客。

Actor 動作 系統回應

1.TUCBW:訪客進入首頁 2.系統顯示首頁頁面 3.訪客輸入註冊資料

5.訪客送出註冊資料給系統 6.註冊資料寫入資料庫

8.TUCEW:系統顯示註冊成功到會員中心

(29)

User Case Specification : 搜尋商品

1 名稱(Name)：搜尋商品 1.1 簡述(Brief Description)：

這個使用案例描述訪客、會員可以搜尋商品的過程。

2. 參與者(Actors)：

訪客、會員。

3. 前提(Pre-Conditions)：

訪客或會員需瀏覽至首頁才能進行查詢的動作。

4. 成功條件(Successful Post-Conditions)：

顯示相關查詢的結果。

5. 失敗條件(Unsuccessful Post-Conditions)：

查無相關資料或此資料不存在。

6. 事件路徑(Flow of Events)：

6.2.1 訪客(會員)提交新的搜尋要求給系統：

步驟 3.如果所搜尋的商品資料並沒有符合要求，可以重新提交新的搜尋。

6.2.2 系統回應搜尋失敗的訊息給訪客(會員)：

步驟 3.如果查無所需或相關的商品資料，系統會傳回訊息告知。

1.TUCBW:訪客(會員)進入首頁 2.系統顯示首頁頁面 3.訪客(會員)提交搜尋商品給系統 4.從資料庫存取商品資料

6. TUCEW:系統顯示搜尋結果

(30)

User Case Specification : 瀏覽最新消息

1 名稱(Name)：瀏覽最新消息 1.1 簡述(Brief Description)：

這個使用案例描述訪客、會員可以瀏覽最新消息的過程。

訪客、會員。

訪客或會員需進入首頁才能進行瀏覽最新消息的動作。

顯示最新消息頁面。

查無相關資料或此資料不存在。

1.TUCBW:訪客(會員)進入首頁 2.系統顯示首頁頁面

3.訪客(會員)瀏覽最新消息頁面 4.從資料庫讀取最新消息資料 6.系統顯示最新消息資料到頁面 7.訪客(會員)點選最新消息資料 8.從資料庫讀取最新消息明細資

料

10. TUCEW:系統顯示最新消息明細到頁面

(31)

User Case Specification : 發表留言

1. 名稱(Name)：發表留言 1.1 簡述(Brief Description)：

這個使用案例描述訪客、會員留言的過程。

訪客、會員。

訪客或會員需瀏覽進入網站留言頁面才能進行留言的動作。

顯示留言訊息。

無法顯示網頁或無輸入資料。

1.TUCBW:訪客(會員)進入網站留言頁面

2.系統顯示網站留言頁面 3.訪客(會員)輸入留言訊息

5.訪客(會員)送出留言訊息要求給系統

6.留言訊息寫入資料庫

8.TUCEW:系統顯示留言訊息

(32)

User Case Specification : 購買商品

1. 名稱(Name)：購買商品 1.1 簡述(Brief Description)：

這個使用案例描述會員購買商品的過程。

會員。

會員需進入首頁進行登入才能做購買商品的動作。

顯示購買商品成功。

無法顯示網頁或無登入會員。

6.2.1 會員進行繼續購買商品：

步驟 7.如果會員需要繼續購物的話，點選繼續購物，系統會回到商品目錄頁面。

1.TUCBW:會員進入首頁 2.系統顯示首頁頁面

3.會員提交登入給系統 4.系統顯示登入成功至會員中心

頁面

5.會員連結商品目錄頁面 6.系統顯示商品目錄頁面

7.會員進行購買商品

9.會員提交購買的商品資料給系統

10.系統確認購買商品的訂單資料 12.寫入訂單資料到資料庫

14. TUCEW:系統顯示購買成功訊息

(33)

User Case Specification : 取消訂單

1. 名稱(Name)：取消訂單 1.1 簡述(Brief Description)：

這個使用案例描述會員取消訂單的過程。

會員。

會員需進入首頁進行登入才能做取消訂單的動作。

訂單已取消。

此訂單不存在或訂單已被管理員確認。

1. TUCBW:會員進入首頁 2.系統顯示首頁頁面

頁面

5.會員進行查詢個人訂單 6.從資料庫讀取個人訂單資料

8.系統顯示個人訂單資料至頁面 9.會員提交取消訂單的要求給系

統

10.儲存訂單資料到資料庫

12.TUCEW:系統顯示個人訂單至頁面

(34)

User Case Specification : 查詢訂單

1. 名稱(Name)：查詢訂單 1.1 簡述(Brief Description)：

這個使用案例描述會員查詢訂單的過程。

會員。

會員需進入首頁進行登入才能做查詢訂單的動作。

顯示訂單明細資料。

此訂單不存在。

頁面

5.會員進行查詢個人訂單 6.從資料庫讀取個人訂單資料

8.系統顯示個人訂單資料至頁面

9.會員點選訂單編號 10.TUCEW:系統顯示訂單明細資

料至頁面

(35)

User Case Specification : 修改個人資料

1. 名稱(Name)：修改個人資料 1.1 簡述(Brief Description)：

這個使用案例描述會員可以修改個人註冊資料的過程。

會員。

會員需進入首頁進行登入才能做修改個人資料的動作。

修改個人資料成功。

無法顯示網頁。

頁面

5.會員進入個人資料頁面 6.從資料庫讀取個人資料

8.系統顯示個人資料頁面 9.會員進行修改個人資料

11.會員送出修改後的個人資料給系統

12.儲存修改後的個人資料到資料庫

14. TUCEW:系統顯示修改後的個

(36)

User Case Specification : 查詢商城訊息

1. 名稱(Name)：查詢商城訊息 1.1 簡述(Brief Description)：

這個使用案例描述會員查詢商城訊息的過程。

會員。

會員需進入首頁進行登入才能做查詢商城訊息的動作。

顯示商城訊息。

頁面 5.會員提交查詢商城訊息的要求

給系統

6.從資料庫讀取訊息資料

8. TUCEW:系統顯示最新訊息至頁面

(37)

User Case Specification : 登入會員

1. 名稱(Name)：登入會員 1.1 簡述(Brief Description)：

這個使用案例描述會員正在登入的過程。

會員。

會員需瀏覽到首頁才能進行登入的動作。

會員登入成功。

會員登入失敗。

基本路徑(Typical Course of Events) ：

6.2.1 會員提交登入要求給系統：

步驟 3.如果會員所提交的登入並不存在或錯誤，系統將會要求重新登

1.TUCBW:會員進入首頁 2.系統顯示首頁頁面 3.會員輸入帳號、密碼、驗證碼要

求給系統

4.系統進行驗證

6.從客戶資料庫來比對資料 8. TUCEW:系統顯示登入成功至會員中心頁面

(38)

User Case Specification : 編輯網站

1. 名稱(Name)：編輯網站 1.1 簡述(Brief Description)：

這個使用案例描述管理者編輯網站的過程。

管理者。

管理者需進入後台進行登入才能做編輯網站的動作。

編輯成功的訊息。

1.TUCBW:管理者提交登入給系統 2.系統顯示登入成功至後台管理頁面

3.管理者提交編輯要求給系統 4.儲存編輯完的資料到資料庫 6.TUCEW:系統顯示編輯成功至頁面

(39)

User Case Specification : 處理訂單

1. 名稱(Name)：處理訂單 1.1 簡述(Brief Description)：

這個使用案例描述管理者處理訂單的過程。

管理者。

管理者需進入後台進行登入才能做處理訂單的動作。

處理成功的訊息。

無法顯示網頁或無點選資料。

3.管理者進行查詢、刪除、修改訂單

4.進行查詢、修改:從資料庫取出訂單資料

進行刪除、修改:儲存訂單資料到資料庫

6.TUCEW:系統顯示處理後訂單的資料

(40)

User Case Specification : 維護客戶資料

1. 名稱(Name)：維護客戶資料 1.1 簡述(Brief Description)：

這個使用案例描述管理者維護客戶資料的過程。

管理者。

管理者需進入後台進行登入才能做維護客戶資料的動作。

維護成功的訊息。

3.管理者進行查詢、刪除、修改客戶資料

4.進行查詢、修改:從資料庫取出客戶資料

進行刪除、修改:儲存客戶資料到資料庫

6.TUCEW:系統顯示維護後的客戶資料頁面

(41)

User Case Specification : 管理留言

1. 名稱(Name)：管理留言 1.1 簡述(Brief Description)：

這個使用案例描述管理者管理留言的過程。

管理者。

管理者需進入後台進行登入才能做留言管理的動作。

管理留言完成。

無法顯示網頁或無輸入訊息。

3.管理者進行回覆或刪除留言 4.儲存留言資料到資料庫

6.TUCEW:系統顯示管理留言後的頁面

(42)

User Case Specification : 設置圖片

1. 名稱(Name)：設置圖片 1.1 簡述(Brief Description)：

這個使用案例描述管理者設置圖片的過程。

管理者。

管理者需進入後台進行登入才能做設置圖片的動作。

圖片設置成功。

1. TUCBW:管理者提交登入給系統

2.系統顯示登入成功至後台管理頁面

3.管理者提交建置圖片的要求給系統

4.儲存圖片內容資料到資料庫 6.TUCEW:系統顯示建置後圖片資料的頁面

(43)

User Case Specification : 管理最新消息

1. 名稱(Name)：管理最新消息 1.1 簡述(Brief Description)：

這個使用案例描述管理者管理最新消息的過程。

管理者。

管理者需進入後台進行登入才能做最新消息管理的動作。

最新消息管理完成。

1. TUCBW:管理者提交登入給系統

2.系統顯示登入成功至後台管理頁面

3.管理者進行新增、修改或刪除最新消息

4.進行新增、修改、刪除:儲存最新消息資料到資料庫

進行修改:從資料庫取出最新消息資料

6.TUCEW:系統顯示管理最新消息後的資料頁面

(44)

User Case Specification : 管理商品

1. 名稱(Name)：管理商品 1.1 簡述(Brief Description)：

這個使用案例描述管理者管理商品的過程。

管理者。

管理者需進入後台進行登入才能做商品管理的動作。

商品管理完成。

3.管理者進行新增、修改、刪除、

查詢商品資料

4.進行新增、修改、刪除:儲存商品資料到資料庫

進行查詢、修改:從資料庫取出商品資料

6.TUCEW:系統顯示管理商品後的資料頁面

(45)

User Case Specification : 發送站內訊息

1. 名稱(Name)：發送站內訊息 1.1 簡述(Brief Description)：

這個使用案例描述管理者發送站內最新訊息的過程。

管理者。

管理者需進入後台進行登入才能做發送最新訊息的動作。

發送最新訊息成功。

無法顯示網頁或無輸入資料。

3.管理者提交站內的最新訊息給系統

4.儲存站內訊息到資料庫

6.TUCEW:系統顯示發送訊息成功

(46)

User Case Specification : 登入管理系統

1. 名稱(Name)：登入管理系統 1.1 簡述(Brief Description)：

這個使用案例描述管理員正在登入的過程。

管理員。

管理員需進入後台登入頁面才能進行登入的動作。

管理員登入成功。

管理員登入失敗。

6.2.1 管理員提交新的登入要求給系統：

步驟 3.如果管理員登入失敗，系統會要求管理員重新提交登入。

1.TUCBW:管理員進入管理登入頁面

2.系統顯示管理登入頁面 3.管理員輸入帳號、密碼、驗證碼

要求給系統

4.系統進行驗證

6.從管理員資料庫來比對資料 8. TUCEW:系統顯示登入成功至後台管理頁面

(47)

4.2.2 循序圖

(48)

(49)

(50)

(51)

(52)

(53)

(54)

(55)

(56)

(57)

(58)

(59)

(60)

(61)

(62)

(63)

(64)

(65)

(66)

(67)

(68)

(69)

(70)

(71)

(72)

(73)

(74)

(75)

4.3 系統介紹

1.首頁有會員中心的功能：

讓訪客註冊個人基本資料，在購物或結帳時使用;會員則是用此來進行登入

2.便捷的搜尋功能：

訪客或會員可以利用此功能查詢產品資料、價格或訂單資料。

3.簡易的網站留言功能：

訪客或會員可以利用此功能發表自己的使用心得或言論，通知管理者回報錯誤。

4.快速的最新公告：

訪客或會員可以利用此功能獲得第一線消息。

5.關於我們：

訪客或會員可以利用此功能了解公司的成長歷程或重大變革。

6.推薦商品：

訪客或會員可以利用此功能得知管理者推薦的商品。

7.上架新品：

訪客或會員可以利用此功能得知有哪些新品已上台架。

8.特價商品：

訪客或會員可以利用此功能得知目前哪些商品正在打折扣出售。

9.熱門商品：

訪客或會員可以利用此功能得知廣受大眾喜愛購買的人氣商品。

(76)

4.4 使用手冊

元生生物公司的首頁擁有會員中心、搜尋、網站留言、最新公告、關於我們、

推薦商品、上架新品、特價商品和熱門商品的功能。想在網站購物的需要先加入會員，網站留言可以互相交換心得，搜尋即字面的意思可搜尋你所要的商品或訂單。

(一)操作步驟 1. 首頁→關於我們

2. 首頁→推薦商品→商品介紹 3. 首頁→上架新品→新品內容 4. 首頁→特價商品

5. 首頁→熱門商品 6. 首頁→最新公告

7. 會員中心→登入→商品區(推薦、上架、特價或熱門商品)→放入購物車

→確認訂單和數量→確認訂單明細→完成購買→查詢付款方式 8. 首頁→新增留言→輸入訊息→完成留言

9. 首頁→輸入搜尋的字串→搜尋結果

此頁面是元生生物公司電子商城的首頁。(如圖 4.30)

圖 4.30 元生購物網首頁

(77)

4.4.1 瀏覽關於我們功能

在首頁能夠進行瀏覽關於我們的頁面。(如圖 4.31)

圖 4.31 元生購物網此頁面能夠檢視對於元生公司的介紹。(如圖 4.32)

(78)

4.4.2 瀏覽推薦商品功能

在首頁能夠進行瀏覽推薦商品的頁面。(如圖 4.33)

圖 4.33 元生購物網

在推薦商品頁面點選名稱或圖片能夠進行瀏覽商品介紹。(如圖 4.34)

(79)

此頁面是商品介紹，點選加入購物車，必須要登入會員。(如圖 4.35)

圖 4.35 元生購物網-商品詳細資料

4.4.3 瀏覽上架新品功能

在首頁能夠進行瀏覽上架商品的頁面。(如圖 4.36)

(80)

此頁面是上架商品的頁面，點選名稱跟圖片能夠瀏覽商品介紹。(如圖 4.37)

圖 4.37 元生購物網-上架新品

4.4.4 瀏覽特價商品功能

在首頁能夠進行瀏覽特價商品的頁面。(如圖 4.38)

(81)

此頁面是特價商品的頁面，點選名稱跟圖片能夠瀏覽商品介紹。(如圖 4.39)

圖 4.39 元生購物網-特價商品

4.4.5 瀏覽熱門商品功能

在首頁能夠進行瀏覽熱門商品的頁面。(如圖 4.40)

(82)

此頁面是熱門商品的頁面，點選名稱跟圖片能夠瀏覽商品介紹。(如圖 4.41)

圖 4.41 元生購物網-熱門商品

4.4.6 瀏覽最新公告功能

在首頁能夠進行瀏覽最新公告的頁面。(如圖 4.42)

(83)

此頁面是最新公告，點選此標題能夠觀看最新公告明細內容。(如圖 4.43)

圖 4.43 元生購物網-最新公告此頁面是最新公告明細內容。(如圖 4.44)

(84)

4.4.7 瀏覽網站留言功能

在首頁能夠進行瀏覽網站留言的頁面。(如圖 4.45)

圖 4.45 元生購物網此頁面能夠進行發表留言訊息。(如圖 4.46)

(85)

發表留言訊息，需填入此資料而按下我要留言，即可送出。(如圖 4.47)

圖 4.47 元生購物網-網站留言(完成)

4.4.8 瀏覽會員中心功能

在首頁能夠進行瀏覽會員中心的頁面。(如圖 4.48)

(86)

進入會員中心，需先登入會員才可進入。(如圖 4.49)

圖 4.49 元生購物網-會員中心

4.4.9 快速搜尋商品功能

在首頁能夠進行快速搜尋商品類別及名稱。(如圖 4.50)

(87)

此頁面是搜尋商品類別及名稱後的頁面。(如圖 4.51)

圖 4.51 元生購物網-搜尋結果

4.4.10 註冊功能

在首頁能夠進行會員註冊。(如圖 4.52)

(88)

註冊需先申請會員資料，有*號之空格一定要填入資料。(如圖 4.53)

圖 4.53 元生購物網-註冊

填完會員資料後無問題，按下提交，即可註冊完成。(如圖 4.54)

(89)

此頁面是註冊成功。(如圖 4.55)

圖 4.55 元生購物網-註冊(成功)

註冊成功之後，會自動登入並跳到會員中心頁面。(如圖 4.56)

(90)

4.4.11 查看會員中心資料

此頁面是登入頁面，輸入會員帳號、密碼、驗證碼，即可登入。(如圖 4.57)

圖 4.57 元生購物網登入成功時會自動跳到會員中心頁面。(如圖 4.58)

(91)

點選個人資料，會顯示修改個人資料頁面。(如圖 4.59)

圖 4.59 元生購物網-個人資料

點選個人訂單，會顯示會員購買商品的訂單資料。(如圖 4.60)

(92)

點選商城訊息，會顯示管理者留給會員者訊息的頁面。(如圖 4.61)

圖 4.61 元生購物網-商城訊息

4.4.12 購買商品功能

點選加入購物車，能夠進行購買商品。(如圖 4.62)

(93)

點選加入購物車會瀏覽此頁面，輸入數量後，需點選更新商品，如果會員要繼續購買，可以點選繼續購物，購買完請點選去收銀台。(如圖 4.63)

圖 4.63 元生購物網-會員購物車畫面

在收銀台需拉選配送及運費，完之後就能夠點選確認訂單。(如圖 4.64)

(94)

購買完的訂單明細，確認後，點選馬上提交訂單，即可購買完成。(如圖 4.65)

圖 4.65 元生購物網-訂單最後確認

訂單提交成功後，會員可以點選查看付款方式，查看付款的內容。(如圖 4.66)

(95)

此頁面是查看匯款方式。(如圖 4.67)

圖 4.67 元生購物網-瀏覽付款方式

4.4.13 退出會員登入功能

點選退出登入，就可以退出會員。(如圖 4.68)

資訊管理系畢業專題 元培科技大學

元培科技大學