Embed Size (px)
Citation preview
崑山科技大學
資訊管理系
四年制大學部
專題製作期末報告
食飯 APP-呷奔嘍
指導教授：游峰碩 助理教授
專題組員：郭家吟 4010Q073
王意嵐 4010Q009
侯鈺珍 4010Q010
張雍智 4010Q015
林冠賢 4010Q023
中華民國一百零四年十二月三十日
i
摘要
本專題的製作主要是結合餐飲業的平面資訊。本專題研究主要以餐飲店家與個
人飲食喜好作為本研究之系統開發主要方向，除了剖析各店家餐點食材和實際探訪來
了解實際使用者需求進行分析不同構面之使用者需求要素，再依據其分析結果進行行
動應用程式(App)的設計與開發。個人行動裝置以驚人的成長率襲捲全球，成為人們
使用科技的主要工具，為使用者帶來便利，更能提高業者彼此間的競爭力、增強客戶
關係、並即時取得各項資訊，進而提高各店家營業額。利用智慧型手機平台所提供之
各項機制例如 GPS, Wi-Fi, SQLite 等，提供使用者隨時隨地搜尋距離最近且符合自己
喜好的美食，並結合路徑規劃之地理資訊服務(Location Based Service, LBS)，指引使
用者到達目的地。
關鍵字：LBS、ANDROID、陀螺儀
ii
誌謝
在此誠摯地感謝指導老師 游峰碩 助理教授的指導，在專題製作的過程中
每週都不厭其煩的與組長開會討論細節並指點我們正確的方向，使我們的專題能順利
製作完成，並且從中學習到很多網頁設計排版及手機程式設計等等的相關方法。老師
對學生學習的態度嚴謹，教學的態度更是我們學習的典範。
感謝王麒讚學長在專題製作的過程中協助我們，幫助我們釐清各組員在專題製
作中應扮演的腳色及負責的工作有哪些，並且也提供相關資料及敘述自身經歷與我們
分享。
最後感謝組長及各位組員這段時間的互相幫助、互相配合體諒，雖然在過程中
還是會有小摩擦，從一開始選取要製作的題目、期初報告大家第一次緊張地上台報
告，參加校外相關的比賽，到最後的系統成果展示，雖然遇到相當多的挑戰與磨合，
但也在經過不斷地檢討和溝通下，終於一起完成當初我們自己設計的專題 APP，真的
很感謝食破天飢團隊的大家。
2015 年 12 月 30 日
iii
目錄
摘要 ............................................................................................................ i
誌謝 ........................................................................................................... ii
目錄 .......................................................................................................... iii
圖目錄 ....................................................................................................... v
表目錄 ...................................................................................................... xi
一、 緒論 .............................................................................................................................. 1
1.1 背景介紹 ...................................................................................................................... 1
1.2 計畫製作動機與目的 .................................................................................................. 2
1.2.1 動機 ............................................................................................................... 2
1.2.2 目的 ............................................................................................................... 3
1.3 專題製作的範圍 .......................................................................................................... 4
1.4 預期成果 ...................................................................................................................... 4
1.5 進行步驟與方法 .......................................................................................................... 5
1.6 所需人力及時程安排 .................................................................................................. 6
1.7 甘特圖 .......................................................................................................................... 7
1.8 軟硬體需求分析 .......................................................................................................... 7
1.8.1 開發軟體 ....................................................................................................... 8
二、 研究方法 ...................................................................................................................... 9
2.1 規劃網站架構格式與設計資料庫表格 ...................................................................... 9
2.1.1 規劃網頁架構 ............................................................................................... 9
2.1.2 規劃手機架構 ............................................................................................. 18
2.1.3 設計資料庫表格 ......................................................................................... 21
2.1.4 E-R Model 關聯圖 ...................................................................................... 25
2.2 系統分析 .................................................................................................................... 26
2.3 系統設計 .................................................................................................................... 26
2.3.1 軟體分層架構設計 ..................................................................................... 26
2.4 撰寫系統架構書 ........................................................................................................ 27
2.4.1 系統功能分析 ............................................................................................. 27
2.4.2 系統架構圖 ................................................................................................. 28
iv
2.5 使用案例圖 ................................................................................................................ 30
2.5.1 網站使用案例圖 - 遊客 ............................................................................ 30
2.5.2 網站使用案例圖 - 使用者 ........................................................................ 31
2.5.3 網站使用案例圖 - 管理者 ........................................................................ 32
2.5.4 手機使用案例圖 – 使用者 ....................................................................... 33
2.5.5 活動圖 ......................................................................................................... 34
2.5.6 循序圖 ......................................................................................................... 67
2.6 撰寫使用說明書 ........................................................................................................ 89
2.6.1 網站管理者使用說明 ................................................................................. 89
2.6.2 網站使用者使用說明 ................................................................................. 89
2.6.3 手機使用者使用說明 ................................................................................. 90
三、 成果展示 .................................................................................................................... 91
3.1 網站實體畫面 ............................................................................................................ 91
3.2 網站 RWD 實體畫面 ............................................................................................... 103
3.3 手機實體畫面 .......................................................................................................... 123
四、 結論 .......................................................................................................................... 136
五、 參考文獻 .................................................................................................................. 137
v
圖目錄
圖 1 各年齡層持有手機率 .................................................................................................. 2
圖 2 流程進行圖 .................................................................................................................. 5
圖 3 網站架構圖 – 首頁 .................................................................................................... 9
圖 4 網站架構圖 – 公告 .................................................................................................... 9
圖 5 網站架構圖 – 熱門餐點 .......................................................................................... 10
圖 6 網站架構圖 – 聯絡資訊 .......................................................................................... 10
圖 7 網站架構圖 – 搜尋 .................................................................................................. 11
圖 8 網站架構圖 – 登入 .................................................................................................. 11
圖 9 網站架構圖 – 餐點列表 .......................................................................................... 12
圖 10 網站架構圖 – 新增餐點 ........................................................................................ 12
圖 11 網站架構圖 – 新增餐點類型描述 ........................................................................ 13
圖 12 網站架構圖 – 更新餐點類型描述 ........................................................................ 13
圖 13 網站架構圖 – 優惠資訊列表 ................................................................................ 14
圖 14 網站架構圖 – 新增優惠資訊 ................................................................................ 14
圖 15 網站架構圖 – 更新優惠優惠資訊 ........................................................................ 15
圖 16 網站架構圖 – 優惠資訊 ........................................................................................ 15
圖 17 網站架構圖 – 設定超強主打 ................................................................................ 16
圖 18 網站架構圖 – 會員資料 ........................................................................................ 16
圖 19 網站架構圖 – 設定超強主打 ................................................................................ 17
圖 20 手機架構圖 – 首頁 ................................................................................................ 18
圖 21 手機架構圖 – 註冊會員 ........................................................................................ 18
圖 22 手機架構圖 – 會員資料 ........................................................................................ 18
圖 23 手機架構圖 – 搜尋(喜好設定).............................................................................. 18
圖 24 手機架構圖 – 錯誤回報 ........................................................................................ 19
圖 25 手機架構圖 – 登入 ................................................................................................ 19
圖 26 手機架構圖 – Tinder Swipe Cards .......................................................................... 19
圖 27 手機架構圖 – 餐點介紹 ........................................................................................ 19
圖 28 手機架構圖 – 店家資訊 ........................................................................................ 20
圖 29 手機架構圖 – 留言板 ............................................................................................ 20
圖 30 手機架構圖 – 關於我們 ........................................................................................ 20
圖 31 手機架構圖 – 左側拉 ............................................................................................ 20
圖 32 手機架構圖 – ERD Model ...................................................................................... 25
圖 33 軟體階層架構圖 ...................................................................................................... 26
圖 34 遊客系統架構圖 ...................................................................................................... 28
vi
圖 35 使用者系統架構圖 .................................................................................................. 28
圖 36 管理員系統架構圖 .................................................................................................. 29
圖 37 網站遊客使用案例圖 .............................................................................................. 30
圖 38 網站使用者使用案例圖 .......................................................................................... 31
圖 39 網站管理者使用案例圖 .......................................................................................... 32
圖 40 手機使用者使用案例圖 .......................................................................................... 33
圖 41 活動圖網頁遊客端 – 註冊新會員 ........................................................................ 34
圖 42 活動圖網頁遊客端 – 搜尋餐點 ............................................................................ 35
圖 43 活動圖網頁遊客端 – 關於我們 ............................................................................ 36
圖 44 活動圖網頁店家端 – 登入 .................................................................................... 37
圖 45 活動圖網頁店家端 – 登出 .................................................................................... 38
圖 46 活動圖網頁店家端 – 餐點列表 ............................................................................ 39
圖 47 活動圖網頁店家端 – 搜尋餐點 ............................................................................ 40
圖 48 活動圖網頁店家端 – 新增餐點 ............................................................................ 41
圖 49 活動圖網頁店家端 – 更新餐點 ............................................................................ 42
圖 50 活動圖網頁店家端 – 刪除餐點 ............................................................................ 43
圖 51 活動圖網頁店家端 – 餐點列表 ............................................................................ 44
圖 52 活動圖網頁店家端 – 查詢超強主打 .................................................................... 45
圖 53 活動圖網頁店家端 – 更新超強主打 .................................................................... 46
圖 54 活動圖網頁店家端 – 刪除超強主打 .................................................................... 47
圖 55 活動圖網頁店家端 – 新增優惠資訊 .................................................................... 48
圖 56 活動圖網頁店家端 – 更新優惠資訊 .................................................................... 49
圖 57 活動圖網頁店家端 – 刪除優惠資訊 .................................................................... 50
圖 58 活動圖網頁店家端 – 更新店家資料 .................................................................... 51
圖 59 活動圖網頁店家端 – 修改密碼 ............................................................................ 52
圖 60 活動圖網頁店家端 – 錯誤回報 ............................................................................ 53
圖 61 活動圖網頁店家端 – 關於我們 ............................................................................ 54
圖 62 活動圖手機使用端 – 註冊會員 ............................................................................ 55
圖 63 活動圖手機使用端 – 登入 .................................................................................... 56
圖 64 活動圖手機使用端 – 登出 .................................................................................... 57
圖 65 活動圖手機使用端 – 查詢會員資料 .................................................................... 58
圖 66 活動圖手機使用端 – 更新會員資料 .................................................................... 59
圖 67 活動圖手機使用端 – 會員 Shake ......................................................................... 60
圖 68 活動圖手機使用端 – 查詢我的最愛 .................................................................... 61
圖 69 活動圖手機使用端 – 查詢喜好設定 .................................................................... 62
圖 70 活動圖手機使用端 – 新增喜好設定 .................................................................... 63
圖 71 活動圖手機使用端 – 更新喜好設定 .................................................................... 64
圖 72 活動圖手機使用端 – 新增我要評分 .................................................................... 65
vii
圖 73 活動圖手機使用端 – 新增我要留言 .................................................................... 66
圖 74 循序圖網頁使用端 – 登入 .................................................................................... 67
圖 75 循序圖網頁使用端 – 註冊新會員 ........................................................................ 68
圖 76 循序圖網頁使用端 – 更新優惠資訊 .................................................................... 69
圖 77 循序圖網頁使用端 – 新增優惠資訊 .................................................................... 70
圖 78 循序圖網頁使用端 – 更新優惠資訊 .................................................................... 71
圖 79 循序圖網頁使用端 – 新增餐點 ............................................................................ 72
圖 80 循序圖網頁使用端 – 更新餐點 ............................................................................ 73
圖 81 循序圖網頁使用端 – 刪除餐點 ............................................................................ 74
圖 82 循序圖網頁使用端 – 新增餐點類型 .................................................................... 75
圖 83 循序圖網頁使用端 – 更新餐點類型 .................................................................... 76
圖 84 循序圖網頁使用端 – 搜尋餐點 ............................................................................ 77
圖 85 循序圖網頁使用端 – 新增公告 ............................................................................ 78
圖 86 循序圖網頁使用端 – 更新公告 ............................................................................ 79
圖 87 循序圖網頁使用端 – 刪除公告 ............................................................................ 80
圖 88 循序圖手機使用端 – 首頁 .................................................................................... 81
圖 89 循序圖手機使用端 – 登入 .................................................................................... 82
圖 90 循序圖手機使用端 – 註冊會員 ............................................................................ 83
圖 91 循序圖手機使用端 – SHAKE ................................................................................ 84
圖 92 循序圖手機使用端 – 喜好設定 ............................................................................ 85
圖 93 循序圖手機使用端 – 顯示餐點 ............................................................................ 86
圖 94 循序圖手機使用端 – 新增留言 ............................................................................ 87
圖 95 循序圖手機使用端 – 錯誤回報 ............................................................................ 88
圖 96 網站實體畫面 – 首頁 ............................................................................................ 91
圖 97 網站實體畫面 – 公告 ............................................................................................ 91
圖 98 網站實體畫面 – 公告內容 .................................................................................... 92
圖 99 網站實體畫面 – 公告列表 .................................................................................... 92
圖 100 網站實體畫面 – 更新公告 .................................................................................. 93
圖 101 網站實體畫面 – 熱門餐點 .................................................................................. 93
圖 102 網站實體畫面 – 聯絡資訊 .................................................................................. 94
圖 103 網站實體畫面 – 關於我們 .................................................................................. 94
圖 104 網站實體畫面 – 管理者資料 .............................................................................. 95
圖 105 網站實體畫面 – 搜尋餐點 .................................................................................. 95
圖 106 網站實體畫面 – 登入 .......................................................................................... 96
圖 107 網站實體畫面 – 餐點列表 .................................................................................. 96
圖 108 網站實體畫面 – 更新餐點資料 .......................................................................... 97
圖 109 網站實體畫面 – 新增餐點 .................................................................................. 97
圖 110 網站實體畫面 – 新增餐點類型描述 .................................................................. 98
viii
圖 111 網站實體畫面 – 更新類型餐點描述 .................................................................. 98
圖 112 網站實體畫面 – 優惠資訊類表 .......................................................................... 99
圖 113 網站實體畫面 – 新增優惠資訊 .......................................................................... 99
圖 114 網站實體畫面 – 更新優惠資訊 ........................................................................ 100
圖 115 網站實體畫面 – 優惠資訊 ................................................................................ 100
圖 116 網站實體畫面 – 設定超強主打 ........................................................................ 101
圖 117 網站實體畫面 – 會員資料 ................................................................................ 101
圖 118 網站實體畫面 – 更新會員資料 ........................................................................ 102
圖 119 網站 RWD 實體畫面 – 首頁 ............................................................................. 103
圖 120 網站 RWD 實體畫面 – 公告 ............................................................................. 104
圖 121 網站 RWD 實體畫面 – 公告內容 ..................................................................... 105
圖 122 網站 RWD 實體畫面 – 熱門餐點 ..................................................................... 106
圖 123 網站 RWD 實體畫面 – 聯絡資訊 ..................................................................... 107
圖 124 網站 RWD 實體畫面 – 關於我們 ..................................................................... 108
圖 125 網站 RWD 實體畫面 – 搜尋餐點 ..................................................................... 109
圖 126 網站 RWD 實體畫面 – 登入 ............................................................................. 110
圖 127 網站 RWD 實體畫面 – 餐點列表 ..................................................................... 111
圖 128 網站 RWD 實體畫面 – 新增餐點 ..................................................................... 112
圖 129 網站 RWD 實體畫面 – 更新餐點資料 ............................................................. 113
圖 130 網站 RWD 實體畫面 – 新增餐點類型描述 ..................................................... 114
圖 131 網站 RWD 實體畫面 – 更新餐點類型描述 ..................................................... 115
圖 132 網站 RWD 實體畫面 – 優惠資訊列表 ............................................................. 116
圖 133 網站 RWD 實體畫面 – 新增優惠資訊 ............................................................. 117
圖 134 網站 RWD 實體畫面 – 優惠資訊 ..................................................................... 118
圖 135 網站 RWD 實體畫面 – 更新優惠資訊 ............................................................. 119
圖 136 網站 RWD 實體畫面 – 設定超強主打 ............................................................. 120
圖 137 網站 RWD 實體畫面 – 會員資料 ..................................................................... 121
圖 138 網站 RWD 實體畫面 – 更新會員資料 ............................................................. 122
圖 139 手機實體畫面 – 三秒圖 .................................................................................... 123
圖 140 手機實體畫面 – 首頁 ........................................................................................ 124
圖 141 手機實體畫面 – 會員註冊 ................................................................................ 125
圖 142 手機實體畫面 – 會員資料 ................................................................................ 126
圖 143 手機實體畫面 – 搜尋(喜好設定)...................................................................... 127
圖 144 手機實體畫面 – 錯誤回報 ................................................................................ 128
圖 145 手機實體畫面 – 登入 ........................................................................................ 129
圖 146 手機實體畫面 – Tinder Swipe Cards .................................................................. 130
圖 147 手機實體畫面 – 餐點介紹 ................................................................................ 131
圖 148 手機實體畫面 – 店家資訊 ................................................................................ 132
ix
圖 149 手機實體畫面 – 留言板 .................................................................................... 133
圖 150 手機實體畫面 – 關於我們 ................................................................................ 134
圖 151 手機實體畫面 – 左側拉 .................................................................................... 135
x
表目錄
表 1 職務分配 ...................................................................................................................... 6
表 2 甘特圖 .......................................................................................................................... 7
表 3 Client 端 ........................................................................................................................ 7
表 4 Server 端 ....................................................................................................................... 7
表 5 表格名稱 – account ................................................................................................... 21
表 6 表格名稱 – bug ......................................................................................................... 21
表 7 表格名稱 – cook_way ............................................................................................... 21
表 8 表格名稱 – error ....................................................................................................... 22
表 9 表格名稱 – good ....................................................................................................... 22
表 10 表格名稱 – keyword ............................................................................................... 22
表 11 表格名稱 – master_type .......................................................................................... 22
表 12 表格名稱 – material_type ....................................................................................... 22
表 13 表格名稱 – meal ..................................................................................................... 23
表 14 表格名稱 – meal_r_type ......................................................................................... 23
表 15 表格名稱 – member_account .................................................................................. 23
表 16 表格名稱 – message ................................................................................................ 23
表 17 表格名稱 – post....................................................................................................... 24
表 18 表格名稱 – sale ....................................................................................................... 24
表 19 表格名稱 – superhit ................................................................................................ 24
表 20 表格名稱 – supply_type .......................................................................................... 24
表 21 表格名稱 – taste_type ............................................................................................. 24
表 22 遊客系統 .................................................................................................................. 27
表 23 使用者系統 .............................................................................................................. 27
表 24 管理者系統 .............................................................................................................. 27
1
一、 緒論
1.1 背景介紹
近年來，由於台灣餐飲業的發展迅速，有平價美食、中等美食、高級餐
廳等等，餐廳又分為英式、美式、義式、台式餐廳等等，為我們的食物增添
了許多色彩，讓我們有了更有多樣化的選擇，豐富了我們的生活。在傳統中
，店家們都是靠著發傳單、貼公告或者口頭告知顧客們店家的資訊，由於臺
灣的店家眾多，大家幾乎無法一一記住每間店家的資訊，發傳單給大家也都
隨手丟棄，十分不環保，餐點的多樣，讓我們在口味上有了更多種的多樣化
，但也造成了我們在選擇上相當的困擾，因為大家常常捉摸不定要選甚麼餐
點好。
由於自己也是個幸福的大學生，常常在中午吃飯時不知道吃什麼、沒什
麼想吃的，或者覺得什麼都好吃的情況下，要很苦惱的決定今天午餐吃什麼
，再加上我們經濟能力有限，物價都上漲，總是想要用最便宜的價格吃到美
味的食物，因此想到要做出一個可以幫自己做出決策的app軟體。現代人，
人手一機，手機對於大學生來說相當的普遍，相信這個軟體可以為生活帶來
便利。
很多人都會為自己所喜歡的店家做紀錄，看是喜歡哪個餐點，但由於食
物的多樣化，靠著傳統的筆記來記錄，很不方便，也不容易做查詢的動作，
藉著此行動平台，讓大家可以透過手機記錄自己所喜歡的店家及黑名單店家
。
本專題主要是藉由以上因素和手機發展的趨勢，研發了一套「即時」、
「便利」且具「環保性」的一套手機軟體，讓店家們可以在行動平台上公告
自己的店家的資訊，只要我們將手機搖一搖就可以讓我們知道附近有哪些店
家，選擇自己喜歡的店家，由店家資訊得知店家地址、菜單、聯絡電話 ...等
資訊，大家也可以在平台上互相推薦哪個餐點好、哪間店家服務好或者可以
把自己喜歡的店家及菜單作為收藏，有了這個行動平台，店家可以不用發傳
單、貼公告，大家也可以隨手取得有關店家的資訊。
2
1.2 計畫製作動機與目的
1.2.1 動機
1. 傳統的菜單不實用
在過去，店家們都是靠著發傳單來讓消費者知道店裡的菜色及價位，但大家
都是當下看看後卻隨手把傳單給扔了，再之後想要看各家菜單時，卻沒有參考的
傳單，又會到店家裡去拿傳單，再加上現在推動環保觀念，任意的使用紙張，很
不環保。
2. 想了解店家的營業時間及地址
在餐飲業裡，每間店家休息的時間都不一樣，也都只會在自家店門口貼上休
店時間，但大家都是看看卻不會記著，所以常常造成實地去了一趟，卻是撲空一
場的結果，這樣反而會讓客人引起反感；或者想去某一店家，但卻忘記它是在哪
哩，找了許久，始終找不到。
3. 許多的店家都會有重複的餐點，不知道哪間比較好
由於餐點的多樣化，雖然讓我們增加了更多的選擇性，但在許多的店家中都
會有重複的餐點，大家都會互相比較哪一間的餐點菜色比較合胃口，但卻缺少了
一個行動平台，讓大家互相做討論和互相推薦好吃的店家。
4. 錯過優惠
聰明的人都會想以最低價的方式獲得最美味的美食，但總是一直錯過優惠時
段，也許是店家廣告不足，或者是我們自己沒有注意到店家的公告資訊，這時如
果有一款 APP 能夠隨時更新店家的資訊，並且可以即時告知時，就不會錯過任
何一個優惠。
5. 讓手機替你做選擇
食物的五花八門，讓我們有了更多樣化的選擇，但是人們總是在猶豫要選擇
甚麼餐點，藉由 APP，我們只要把手機搖一搖，讓手機替我們做選擇，我們就
可以更輕鬆的選擇餐點了。
6. 智慧型裝置持有率逐年上升
科技日新月異，現代智慧型裝置
普及化，大學生們也都幾乎人手一支
智慧型手機，甚至同時擁有手機和平
板電腦；根據新聞報導，12 歲以上
(含)的人持有手機的就有 1330 萬
人，持有率趨近 65.4%
圖 1 各年齡層持有手機率
3
1.2.2 目的
1. 提升店家資訊的透明化
過去許多的店家都是在店門口張貼單子說哪一天店內休息或是貼菜單，但很
多人都是看過，卻過了一段時間就完全沒有印象了；不然就是聽別人說某餐廳很
好吃，但卻不知道地址；藉由此行動平台，讓使用者可以直接線上查詢店家休息
時間、地址及菜單，使用者也可以隨時了解店家營業資訊。
2. 依餐廳類型來選擇想要去餐廳，縮短決定的時
現在餐飲業多樣化，英式、美式、義式、台式餐廳等等，每家餐廳的餐
點特色都大不相同，藉由此行動平台，讓大家可以依照自己喜歡的風格選擇
自己所想要去的餐廳，再從中選擇自己喜歡的餐點，也可以從平台中取得聯
絡電話、餐廳地址...等店家資訊，以方便訂位。
3. 藉由智慧型手機的發展趨勢，提升互動性
藉由智慧型手機的發展，下載此 APP 就可以與其他使用者一起討論
店家的評價或是口感，也可以互相介紹自己喜愛的店家，同時並可針對店
家菜色發表個人看法，讓其他使用者可有更多參考依據。
4
1.3 專題製作的範圍
本專題是尋求便利且具有娛樂效果的研究，針對現代幸福的大學生們來做開發。
此應用程式可以讓管理者與使用者需求餐點資料庫互相連結，讓使用在利用搖一搖的
功能時就能出現任意餐點；如果使用者有設定餐點的任何需求，那麼使用者只要先進
行喜好設定後，再進行搖一搖搜尋，搜尋出來的餐點都會符合原先所設定的條件，如
此一來就能更貼切的符合使用者需求。
在管理者方面可分為網頁平台與行動平台，透過店家新增餐點的平台來管理店家
新增菜單的資料；行動平台管理可透過錯誤回報的信件來管理 app 哪裡有問題或是
錯誤，讓使用者可以更順暢的使用此 app。
在使用者方面分為一般使用者和店家，店家僅能使用網頁的平台，依據自己的菜
單特色來新增店家的餐點，新增完成後資料將會建立並儲存至資料庫。讓一般使用者
在使用搖一搖搜尋餐點時，在沒有任何條件的限制下，將會從資料庫中隨機選出一道
食物提供給當前使用者做為參考。
行動裝置方面我們以 Android 系統為主，使用者使用行動裝置進行搖一搖，便會
跑出餐點介紹(餐點名稱、價位、店家資訊、留言…)，給沒有想法或遲遲做不了決定
今天要吃什麼的你，提供的參考。
1.4 預期成果
本專題計畫利用 Android系統開發出一套實用且具有娛樂效果的應用程
式，透過 Eclipse撰寫 Java程式語言、MySQL建立資料庫、Java Server Pages (JSP)
製作網頁及 Photoshop和 Adobe Illustrator CS6進行手機及網頁介面的美工。此應
用程式預設的使用者為大學生，期望能夠為使用者們解決吃飯時的困擾。預期成果為
下列幾點：
1. 有效且依據個人喜好提供餐點選擇。
2. 提供具有娛樂性的搜尋方式。
3. 提升店家餐點資訊流通。
5
1.5 進行步驟與方法
訂定題目
相關資料蒐集
題目探討
需求分析
軟體規劃
系統開發
網站及手機測試
報告撰寫
口頭報告
圖 2 流程進行圖
6
1.6 所需人力及時程安排
表 1 職務分配
職 務 職 責 組 織 成 員
專案
組長
專題的總負責人，分派工作及監督組員的
工作進度，與指導老師討論會談時間並回
報製作進度。提出專題小組遇到的問題與
老師討論。
張雍智
資料庫
設計組
資料庫設計的負責人，負責後臺資料庫存
取的規劃設計與維護，並與程式設計組和
美工組配合、討論。遇到問題時，須跟老
師討論、請教。
郭家吟、林冠賢、
張雍智
美工組
美工的負責人，負責 Android 與網站美工
設計，完善地設計版面的配置及符合人類
眼睛的色彩協調度，並與全員和指導老師
討論。
侯鈺珍、王意嵐
Android 程式
設計組
Android 程式設計的負責人，負責 Android
程式的撰寫，並搭配資料庫確認完成度，
與資料庫設計組配合、討論。遇到問題時，
須跟老師討論、請教。
郭家吟、林冠賢、
張雍智
7
1.7 甘特圖
表 2 甘特圖
識別
碼 任務名稱
12
月
01
月
02
月
03
月
04
月
05
月
06
月
07
月
08
月
09
月
10
月
11
月
12
月
1 題目資料蒐集
2 需求分析
3 需求討論與發掘
4 功能架構圖
5 期初報告文件撰寫
6 開發環境架設
7 前台版型設計
8 前後台程式設計
9 行動裝置程式設計
10 單元測試
11 整體測試
12 期末文件撰寫
13 期末報告
- 第三學期
14 校內外競賽
1.8 軟硬體需求分析
表 3 Client 端
軟 體 說 明
Firefox、Google chrome 最低需求 含網路及瀏覽器的作業系統
Android 系統 最低需求 Android 4.x 以上作業系統
表 4 Server 端
軟 體 說 明
Apache Tomcat 最低需求 Windows XP 以上作業系統之
電腦
RAM:建議 1G 以上
6.0.36 版
MySQL 5.5.27 版
8
1.8.1 開發軟體
1. Android Development Tools Bundle （ADT Bundle）
ADT Bundle 結合了 Android SDK、ADT 以及 Eclipse 壓縮在一起，
可以大幅減少初次下載 Android SDK、ADT 以及 Eclipse 的使用者時間。
2. Apache Tomcat
由 Apache 下屬的 Jakarta 項目開發的一個 Servlet 容器，Tomcat 是
使用 Java 開發，可以運行在任何裝有 JVM 不同的作業系統上，並實現
了對 Servlet 和 Java Server Page（JSP）的支持，將 JSP 編譯成對應的
Servlet。由於本身也包含 HTTP 伺服器，可以被視作單獨一個 Web 伺服
器。
3. Java Development Kit (JDK)
是 Sun 公司針對 Java 開發人員發行的免費軟體開發套件 SDK
（Software development kit）。程式開發者必須安裝 JDK 來編譯、偵錯
程式。
4. XAMPP
XAMPP 是一個相當容易安裝的 Apache 擴充版本，它已經包括了
MySQL、PHP 及 Perl 等軟體在其中。 XAMPP 是一個相當容易安裝的
Apache 擴充版本，它已經包括了 MySQL、PHP 及 Perl 等軟體在其中。
5. Edit Plus
Edit Plus 是一套專為網際網路所設計的文字編輯程式。除了可以做
為取代筆記本的一個好選擇外，還可以作為網頁製作及程式設計師的撰
寫工具。它以鮮明色彩顯示文字語法的方式，讓使用者方便撰寫 HTML,
CSS, PHP, ASP, Perl, C/C++, Java, JavaScript, VBScript 以及其它的程式
語言。
6. Adobe PhotoShop
是為大眾所知的照片編輯軟體，也是一個效能良好的圖像編輯軟
體。主要處理以像素所構成的數位影像。使用其眾多的編修與繪圖工
具，可以更有效的進行圖片編輯工作。獨特的歷史紀錄浮動視窗和可編
輯的圖層效果功能使使用者可以方便的測試效果。對各種濾鏡的支援更
令使使用者能夠輕鬆創造出各種奇幻的效果。
7. Adobe IIIustrator
是一套向量架構的應用軟體，其穩定性也非常地高，即使內容十分
複雜的文件，執行起來不會壓垮系統。主要繪製出點、直線、曲線和形
狀來建立各種圖形。其向量圖形具有隨意縮放的特性。並具有彈性化的
排版工具、包羅萬象的格是工具以及搭載了不少專業級的文字藝術工
具，提供數種工具來解決各方面的需求令使用者輕鬆容易展現創意，使
工作流程保有最大的彈性。
9
二、 研究方法 2.1 規劃網站架構格式與設計資料庫表格
2.1.1 規劃網頁架構
圖 3 網站架構圖 – 首頁
圖 4 網站架構圖 – 公告
SHAKE TO EAT 功能選單
WELCOME 訊息
SHAKE TO EAT 功能選單
公告
10
圖 5 網站架構圖 – 熱門餐點
圖 6 網站架構圖 – 聯絡資訊
SHAKE TO EAT 功能選單
熱門餐點
SHAKE TO EAT 功能選單
聯絡資訊
© Kun Shan University 2015, 崑山科技大學 資訊管理系 103-1 專題製作, 食飯 APP - 呷奔嘍
11
圖 7 網站架構圖 – 搜尋
圖 8 網站架構圖 – 登入
SHAKE TO EAT 功能選單
搜尋餐點
供應時間
口味類型
食材類型
主食類型
烹飪方式
送出 取消
SHAKE TO EAT 功能選單
登入
送出 取消
12
圖 9 網站架構圖 – 餐點列表
圖 10 網站架構圖 – 新增餐點
SHAKE TO EAT 功能選單
餐點列表
SHAKE TO EAT 功能選單
新增餐點
餐點名稱
餐點描述
上傳檔案
提交 取消
13
圖 11 網站架構圖 – 新增餐點類型描述
圖 12 網站架構圖 – 更新餐點類型描述
SHAKE TO EAT 功能選單
新增餐點類型描述
供應時間
口味類型
食材類型
主食類型
烹飪方式
送出 取消
SHAKE TO EAT 功能選單
更新餐點類型描述
供應時間
口味類型
食材類型
主食類型
烹飪方式
送出 取消
14
圖 13 網站架構圖 – 優惠資訊列表
圖 14 網站架構圖 – 新增優惠資訊
SHAKE TO EAT 功能選單
優惠資訊列表
新增優惠資訊
SHAKE TO EAT 功能選單
新增優惠資訊
活動標題
活動開始時間
活動結束時間
餐點原價
優惠價格
活動說明
提交 取消
15
圖 15 網站架構圖 – 更新優惠優惠資訊
圖 16 網站架構圖 – 優惠資訊
SHAKE TO EAT 功能選單
更新優惠資訊
活動標題
活動開始時間
活動結束時間
餐點原價
優惠價格
活動說明
提交 取消
SHAKE TO EAT 功能選單
優惠資訊
16
圖 17 網站架構圖 – 設定超強主打
圖 18 網站架構圖 – 會員資料
SHAKE TO EAT 功能選單
設定超強主打
提交 取消
SHAKE TO EAT 功能選單
會員資料
註冊人
註冊人電話
註冊人信箱
店家名稱
連絡電話
店家介紹
更新會員資料
17
圖 19 網站架構圖 – 設定超強主打
SHAKE TO EAT 功能選單
更新會員資料
註冊人
註冊人電話
註冊人信箱
店家名稱
連絡電話
店家介紹
提交 取消
18
2.1.2 規劃手機架構
圖 20 手機架構圖 – 首頁
圖 21 手機架構圖 – 註冊會員
圖 22 手機架構圖 – 會員資料
圖 23 手機架構圖 – 搜尋(喜好設定)
呷飯嘍
商品牆
呷飯嘍
請輸入手機號碼
請輸入密碼
請輸入姓名
請輸入信箱
送出
呷飯嘍
帳號
姓名
電子信箱
更改會員資料
呷飯嘍
供應時間
口味類型
食材類型
烹飪方式
搜尋
19
圖 24 手機架構圖 – 錯誤回報
圖 25 手機架構圖 – 登入
圖 26 手機架構圖 – Tinder Swipe Cards
圖 27 手機架構圖 – 餐點介紹
呷飯嘍
標題
內容
送出
清除
呷飯嘍
帳號
密碼
登入
呷飯嘍
呷飯嘍
餐點名稱
餐點價格
餐點描述
店家資訊
留言板
20
圖 28 手機架構圖 – 店家資訊
圖 29 手機架構圖 – 留言板
圖 30 手機架構圖 – 關於我們
圖 31 手機架構圖 – 左側拉
呷飯嘍
店家名稱
電話
地址
店家描述
Google Map
呷飯嘍
呷飯嘍 呷飯嘍
側
拉
功
能
研發動機
四大特色
21
2.1.3 設計資料庫表格
表 5 表格名稱 – account
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
username varchar 255 否 無
password varchar 255 否 無
security_code varchar 20 否 無
shop_name varchar 255 否 無
shop_tel varchar 20 否 無
shop_address varchar 255 否 無
lon varchar 255 否 無
lat varchar 255 否 無
shop_supplytime varchar 255 是 null
owner varchar 255 否 無
owner_tel Int 11 否 無
owner_email varchar 255 否 無
shop_about varchar 255 否 無
表 6 表格名稱 – bug
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
whatbug varchar 255 否 無
title varchar 255 否 無
contents varchar 255 否 無
time date 否 無
acct_id int 11 否 無
表 7 表格名稱 – cook_way
欄位名稱 型態 長度 空值 默認 主鍵
cook_way_id int 11 否 無
cook_way_name text 否 無
22
表 8 表格名稱 – error
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
title varchar 255 否 無
contents varchar 255 否 無
表 9 表格名稱 – good
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
meal_id int 11 否 無
member_id int 11 否 無
good int 11 否 無
表 10 表格名稱 – keyword
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
meal_id int 11 否 無
keyword text 否 無
表 11 表格名稱 – master_type
欄位名稱 型態 長度 空值 默認 主鍵
master_type _id int 11 否 無
master_type_name text 否 無
表 12 表格名稱 – material_type
欄位名稱 型態 長度 空值 默認 主鍵
material_type _id int 11 否 無
material_type_name text 否 無
23
表 13 表格名稱 – meal
欄位名稱 型態 長度 空值 默認 主鍵
meal _id int 11 否 無
acct _id int 11 否 無
recommend int 11 否 無
meal _name text 否 無
meal _price int 11 否 無
meal _desc text 否 無
org_filename text 是 null
filename text 是 null
star int 11 是 null
upload_time timestamp 是 current_timestamp
表 14 表格名稱 – meal_r_type
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
meal_id int 11 否 無
table_name text 否 無
table_id int 11 否 無
表 15 表格名稱 – member_account
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
username varchar 50 否 無
password varchar 50 否 無
name varchar 225 否 無
email varchar 225 否 無
表 16 表格名稱 – message
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
member_name varchar 255 否 無
meal_id int 11 否 無
message varchar 255 否 無
date_time timestamp 否 current_timestamp
24
表 17 表格名稱 – post
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
time timestamp 是 current_timestamp
title varchar 255 是 null
contents varchar 1500 是 null
表 18 表格名稱 – sale
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
acct_id int 11 否 無
title varchar 255 否 無
time date 否 無
time2 date 否 無
old_price varchar 255 否 無
new_price varchar 255 否 無
contents varchar 1500 否 無
表 19 表格名稱 – superhit
欄位名稱 型態 長度 空值 默認 主鍵
id int 11 否 無
meal_id int 11 否 無
acct_id int 11 否 無
表 20 表格名稱 – supply_type
欄位名稱 型態 長度 空值 默認 主鍵
supply_type_id int 11 否 無
supply_type_name text 否 無
表 21 表格名稱 – taste_type
欄位名稱 型態 長度 空值 默認 主鍵
taste_type_id int 11 否 無
taste_type_name text 否 無
25
2.1.4 E-R Model 關聯圖
圖 32 手機架構圖 – ERD Model
26
2.2 系統分析
利用 UML 的工具來分析系統與設計，並且繪製出「使用案例圖、活動圖、
循序圖」，來達成最終預期的成果。
2.3 系統設計
2.3.1 軟體分層架構設計
從軟體分層負責的設計觀點，我們所開發的軟體系統可以區分為三個主要的
階層：
1. 資料顯示層：由 HTML、JavaScript、CSS、JSP 所組成。
2. 商業邏輯層：主要是由 Java 類別所組成。
3. 資料存取層：作為與資料庫的存取，由資料存取類別以及 JDBC 所組成。
經由瀏覽器或是行動裝置連接到系統介面，透過商業邏輯層處理。商務邏輯
層是顯示層和資料存取層溝通的橋樑，負責接收前端使用者的要求，透過 JDBC
技術對後端資料存取層進行資料存取，再將所得到的結果回傳給後端資料存取層
進行儲存，或是向上傳給顯示層。
圖 33 軟體階層架構圖
27
2.4 撰寫系統架構書
2.4.1 系統功能分析
表 22 遊客系統
角色：遊客
1 瀏覽公告：可以看到管理者新增的公告
2 熱門餐點：可以看到目前網頁所呈現的熱門餐點
3 搜尋餐點：可依照不同的方式搜尋餐點
4 註冊新會員：註冊成為新會員，可以使用更多的功能
5 關於我們：可以瀏覽製作團隊的相關聯絡資訊
表 23 使用者系統
角色：使用者
1 瀏覽公告：可以看到管理者新增的公告
2 熱門餐點：可以看到目前網頁所呈現的熱門餐點
3 搜尋餐點：可依照不同的條件搜尋餐點。
4 關於我們：可以瀏覽製作團隊的相關聯絡資訊
5 登入會員：可以讓使用者登入系統
6 登出會員：使用者在登入情況下點選登出即可完成登出此系統。
7 修改個人資料：編修自己設定的資料。
8 修改店家資訊：可對於店內公開的資料進行修改
9 管理餐點：對店內提供的餐點資訊進行新增、刪除、修改
10 管理超強主打：對店內的主打餐點進行管理
11 管理優惠資訊：對店內的優惠資訊進行管理
表 24 管理者系統
角色：管理者
1 管理公告：對所有使用者進行公告，可新增、修改以及刪除。
2 管理管理者資料：對自己的資料進行管理。
3 管理會員資料：對會員的資料進行管理，如有錯誤才進行移除以及刪除的動
作。例如店家已經休業，收到錯誤回報後，向店家確認無誤即刪除此店家資
料。
28
2.4.2 系統架構圖
(1) 遊客
圖 34 遊客系統架構圖
(2) 使用者
圖 35 使用者系統架構圖
遊客
瀏覽公告
熱門餐點
搜尋餐點
註冊新會員
關於我們
使用者
瀏覽公告
熱門餐點
搜尋餐點
關於我們
登入會員
登出會員
修改個人資料
修改店家資訊
管理餐點
管理超強主打
管理優惠資訊
29
(3) 管理者
圖 36 管理員系統架構圖
管理者
管理公告
管理管理者資料
管理會員資料
30
2.5 使用案例圖
2.5.1 網站使用案例圖 - 遊客
圖 37 網站遊客使用案例圖
31
2.5.2 網站使用案例圖 - 使用者
圖 38 網站使用者使用案例圖
32
2.5.3 網站使用案例圖 - 管理者
圖 39 網站管理者使用案例圖
33
2.5.4 手機使用案例圖 – 使用者
圖 40 手機使用者使用案例圖
34
2.5.5 活動圖
圖 41 活動圖網頁遊客端 – 註冊新會員
35
圖 42 活動圖網頁遊客端 – 搜尋餐點
36
圖 43 活動圖網頁遊客端 – 關於我們
37
圖 44 活動圖網頁店家端 – 登入
38
圖 45 活動圖網頁店家端 – 登出
39
圖 46 活動圖網頁店家端 – 餐點列表
40
圖 47 活動圖網頁店家端 – 搜尋餐點
41
圖 48 活動圖網頁店家端 – 新增餐點
42
圖 49 活動圖網頁店家端 – 更新餐點
43
圖 50 活動圖網頁店家端 – 刪除餐點
44
圖 51 活動圖網頁店家端 – 餐點列表
45
圖 52 活動圖網頁店家端 – 查詢超強主打
46
圖 53 活動圖網頁店家端 – 更新超強主打
47
圖 54 活動圖網頁店家端 – 刪除超強主打
48
圖 55 活動圖網頁店家端 – 新增優惠資訊
49
圖 56 活動圖網頁店家端 – 更新優惠資訊
50
圖 57 活動圖網頁店家端 – 刪除優惠資訊
51
圖 58 活動圖網頁店家端 – 更新店家資料
52
圖 59 活動圖網頁店家端 – 修改密碼
53
圖 60 活動圖網頁店家端 – 錯誤回報
54
圖 61 活動圖網頁店家端 – 關於我們
55
圖 62 活動圖手機使用端 – 註冊會員
56
圖 63 活動圖手機使用端 – 登入
57
圖 64 活動圖手機使用端 – 登出
58
圖 65 活動圖手機使用端 – 查詢會員資料
59
圖 66 活動圖手機使用端 – 更新會員資料
60
圖 67 活動圖手機使用端 – 會員 Shake
61
圖 68 活動圖手機使用端 – 查詢我的最愛
62
圖 69 活動圖手機使用端 – 查詢喜好設定
63
圖 70 活動圖手機使用端 – 新增喜好設定
64
圖 71 活動圖手機使用端 – 更新喜好設定
65
圖 72 活動圖手機使用端 – 新增我要評分
66
圖 73 活動圖手機使用端 – 新增我要留言
67
2.5.6 循序圖
圖 74 循序圖網頁使用端 – 登入
68
圖 75 循序圖網頁使用端 – 註冊新會員
69
圖 76 循序圖網頁使用端 – 更新優惠資訊
70
圖 77 循序圖網頁使用端 – 新增優惠資訊
71
圖 78 循序圖網頁使用端 – 更新優惠資訊
72
圖 79 循序圖網頁使用端 – 新增餐點
73
圖 80 循序圖網頁使用端 – 更新餐點
74
圖 81 循序圖網頁使用端 – 刪除餐點
75
圖 82 循序圖網頁使用端 – 新增餐點類型
76
圖 83 循序圖網頁使用端 – 更新餐點類型
77
圖 84 循序圖網頁使用端 – 搜尋餐點
78
圖 85 循序圖網頁使用端 – 新增公告
79
圖 86 循序圖網頁使用端 – 更新公告
80
圖 87 循序圖網頁使用端 – 刪除公告
81
圖 88 循序圖手機使用端 – 首頁
82
圖 89 循序圖手機使用端 – 登入
83
圖 90 循序圖手機使用端 – 註冊會員
84
圖 91 循序圖手機使用端 – SHAKE
85
圖 92 循序圖手機使用端 – 喜好設定
86
圖 93 循序圖手機使用端 – 顯示餐點
87
圖 94 循序圖手機使用端 – 新增留言
88
圖 95 循序圖手機使用端 – 錯誤回報
89
2.6 撰寫使用說明書
2.6.1 網站管理者使用說明
1. 管理公告:
對所有使用者進行公告，可新增、修改以及刪除。
2. 管理管理者資料:
對自己的資料進行管理。
3. 管理會員資料:
對會員的資料進行管理，如有錯誤才進行移除以及刪除的動作。例如店家
已經休業，收到錯誤回報後，向店家確認無誤即刪除此店家資料。
2.6.2 網站使用者使用說明
1. 瀏覽公告:
可以看到管理者新增的公告
2. 熱門餐點:
可以看到目前網頁所呈現的熱門餐點
3. 搜尋餐點:
可依照不同的方式搜尋餐點。
4. 註冊新會員:
註冊成為新會員，可以使用更多的功能。
5. 查詢關於我們:
可以瀏覽製作團隊的相關聯絡資訊。
6. 登入會員:
可以讓使用者登入系統，使用者在網站輸入帳號密碼驗證後即可完成登入。
7. 登出會員:
使用者在登入情況下點選登出即可完成登出此系統。
8. 修改個人資料:
編修自己設定的資料。
9. 修改店家資訊:
可對於店家公開的資料進行修改。
10. 管理餐點:
對店內提供的餐點資訊進行新增、刪除、修改。
11. 管理超強主打:
對店內的主打餐點進行管理。
12. 管理優惠資訊:
對店內的優惠資訊進行管理。
90
2.6.3 手機使用者使用說明
1. 註冊:
按下註冊後以手機號碼當帳號，輸入密碼跟姓名還有信箱即可註冊會員。
2. 會員資料:
可查詢會員的相關資料以及修改。
3. 搜尋:
使用者可依照供應時間、口味類型、食材種類、主食種類、烹飪方式搜尋。
4. 喜好設定:
使用者可依照供應時間、口味類型、食材種類、主食種類、烹飪方式儲存
偏好設定以用於 Shake 時搜尋。
5. Shake:
可切換 Shake 功能的開關，開啟時於水平方向搖一搖後會依照先前的喜好設
定進行搜尋。
6. TinderSwipeCards:
搜尋完餐點後看到的介面，往左滑代表對這樣商品不喜歡，往右滑則進入
商品詳細內容。
7. 餐點資訊:
顯示餐點的圖片、名稱、價錢及餐點的描述，下方有兩個按鈕分別能進入
店家資訊及留言版。
8. 店家資訊:
螢幕的上方會顯示店家名稱、電話、地址及店家的描述，下方以 GoogleMap
顯示店家的詳細地標，也可規劃路徑前往。
9. 留言板:
可以看到這道餐點的所有留言，按下’我要留言’可對此餐點留言。
10. 讚:
若對此商品覺得不錯可以按讚以鼓勵。
11. 錯誤回報:
若對此 APP 感覺有 BUG 或是任何資訊顯示錯誤可以與我們回報。
12. 關於我們:
此為本開發團隊‘Shake To Eat 食破天飢’的介紹及特色。
13. 登出:
從會員變為遊客的方式，損失部分權利。
91
三、 成果展示 3.1 網站實體畫面
圖 96 網站實體畫面 – 首頁
圖 97 網站實體畫面 – 公告
92
圖 98 網站實體畫面 – 公告內容
圖 99 網站實體畫面 – 公告列表
93
圖 100 網站實體畫面 – 更新公告
圖 101 網站實體畫面 – 熱門餐點
94
圖 102 網站實體畫面 – 聯絡資訊
圖 103 網站實體畫面 – 關於我們
95
圖 104 網站實體畫面 – 管理者資料
圖 105 網站實體畫面 – 搜尋餐點
96
圖 106 網站實體畫面 – 登入
圖 107 網站實體畫面 – 餐點列表
97
圖 108 網站實體畫面 – 更新餐點資料
圖 109 網站實體畫面 – 新增餐點
98
圖 110 網站實體畫面 – 新增餐點類型描述
圖 111 網站實體畫面 – 更新類型餐點描述
99
圖 112 網站實體畫面 – 優惠資訊類表
圖 113 網站實體畫面 – 新增優惠資訊
100
圖 114 網站實體畫面 – 更新優惠資訊
圖 115 網站實體畫面 – 優惠資訊
101
圖 116 網站實體畫面 – 設定超強主打
圖 117 網站實體畫面 – 會員資料
102
圖 118 網站實體畫面 – 更新會員資料
103
3.2 網站 RWD 實體畫面
圖 119 網站 RWD 實體畫面 – 首頁
104
圖 120 網站 RWD 實體畫面 – 公告
105
圖 121 網站 RWD 實體畫面 – 公告內容
106
圖 122 網站 RWD 實體畫面 – 熱門餐點
107
圖 123 網站 RWD 實體畫面 – 聯絡資訊
108
圖 124 網站 RWD 實體畫面 – 關於我們
109
圖 125 網站 RWD 實體畫面 – 搜尋餐點
110
圖 126 網站 RWD 實體畫面 – 登入
111
圖 127 網站 RWD 實體畫面 – 餐點列表
112
圖 128 網站 RWD 實體畫面 – 新增餐點
113
圖 129 網站 RWD 實體畫面 – 更新餐點資料
114
圖 130 網站 RWD 實體畫面 – 新增餐點類型描述
115
圖 131 網站 RWD 實體畫面 – 更新餐點類型描述
116
圖 132 網站 RWD 實體畫面 – 優惠資訊列表
117
圖 133 網站 RWD 實體畫面 – 新增優惠資訊
118
圖 134 網站 RWD 實體畫面 – 優惠資訊
119
圖 135 網站 RWD 實體畫面 – 更新優惠資訊
120
圖 136 網站 RWD 實體畫面 – 設定超強主打
121
圖 137 網站 RWD 實體畫面 – 會員資料
122
圖 138 網站 RWD 實體畫面 – 更新會員資料
123
3.3 手機實體畫面
圖 139 手機實體畫面 – 三秒圖
124
圖 140 手機實體畫面 – 首頁
125
圖 141 手機實體畫面 – 會員註冊
126
圖 142 手機實體畫面 – 會員資料
127
圖 143 手機實體畫面 – 搜尋(喜好設定)
128
圖 144 手機實體畫面 – 錯誤回報
129
圖 145 手機實體畫面 – 登入
130
圖 146 手機實體畫面 – Tinder Swipe Cards
131
圖 147 手機實體畫面 – 餐點介紹
132
圖 148 手機實體畫面 – 店家資訊
133
圖 149 手機實體畫面 – 留言板
134
圖 150 手機實體畫面 – 關於我們
135
圖 151 手機實體畫面 – 左側拉
136
四、 結論
本專題的使用者可分為管理者、餐飲店家、會員以及遊客。此專題的製作在我們
的預期下不但可以促進店家的商品曝光率提升，也可解決現代人每天煩惱該吃什麼的
困擾；店家可以透過此行動平台及網頁平台來行銷自己的店家，使用者利用行動裝置
搜尋這些公開的資訊並選擇自己想吃的餐點。行動裝置方面我們以 Android 平台為主，
使用者可以利用搖一搖的方式來決定今天要吃什麼；也可透過喜好設定的方式做篩選，
這樣可以讓搜尋出來的結果更符合自己的口味。
未來若系統經上線測試穩定後，我們預期會往 IOS 系統方面開始做研究，並且開
發出更多的功能，這樣不僅只有 Android 系統的使用者可以運用此行動裝置，更可以
造就 IOS 的福利。
本專題製作的過程中，要感謝很多人的幫助。認識的學長給我們很多的想法，讓
我們可以不斷的改進我們的作品，給我們創新的想法，雖然有許多的概念以現在的我
們還沒有辦法達成，但未來若有辦法，將會帶給使用者更多的驚喜；也非常謝謝老師
細心教導，在課餘時間和我們不斷的開會並修正我們的錯誤，讓我們受益良多；組員
之間也花費了相當多的時間去完成這個專題，製作當中難免會有誤會與吵架，但是也
因為如此讓我們有更多的默契去完成並產生了這個作品。能完成整個專題真的不容易，
大家都辛苦了。
137
五、 參考文獻
[1] 全台灣-iPeen 愛評網。
http://www.ipeen.com.tw/
[2] 在地美食 APP。
https://play.google.com/store/apps/details?id=com.orangefish.app.delicacy&hl=zh_TW
[3] 台灣美食 APP。
https://play.google.com/store/apps/details?id=com.CHIUCHIU.chiubooking_v&hl=zh_TW
[4] 新聞報導
http://www.iii.org.tw/m/News-more.aspx?id=1367
[5] 博是資訊顧問有限公司-多層系統架構
http://www.bossinfo.com.tw/domainKnowhowBefAction?doit=updateView&id=3
[6] 維基百科-MVC
http://zh.wikipedia.org/wiki/MVC
[7] 維基百科- Apache Tomcat
http://zh.wikipedia.org/wiki/Apache_Tomcat
[8] SQL Server 資料庫管理實務 陳會安 著
https://books.google.com.tw/books?id=-9SqBAAAQBAJ&pg=SA1-PA20&lpg=SA1-PA20&dq
=%E9%A1%AF%E7%A4%BA%E5%B1%A4+%E9%82%8F%E8%BC%AF%E5%B1%A4&source=
bl&ots=eWkE2OvUK6&sig=d8FtCH3BDJp-W7KXeVp6LblHgog&hl=zh-TW&sa=X&ei=ZBwVV
f2TGsyA8QWfxYLgDA&ved=0CCsQ6AEwAw#v=onepage&q&f=true
[9] 崑山二手書行動平台 4000A028 蔡姈樺、林素帆、陳昱全、蔡嘉祐、徐毓鴻 著
