WEB DESIGN
燕巢圖書館VR/AR導覽
HTML5、CSS3、JavaScript、pannallum.js
來一同探訪燕巢圖書館-燕巢圖書館VR/AR導覽
服務設計流程
長榮牧羊人與燕巢圖書館合作，將「 燕巢圖書館之相關辦法 」使用虛擬實境（VR）或擴增實境（AR）之技術呈現，不再只是讓民眾閱讀深硬的文字條文，而是透過身歷其境的解說更了解相關規定的內涵與使用方式。 結合VR虛擬實境將圖書館各樓層的場景以3D的方式呈現。改變多數人以平面照片搭配文字的介紹方式，使用者彷彿身在館中，而不單單只是某個固定視角的觀看方式。
服務創新性
經過幾次與圖書館主任開會討論後我們建議使用 VR 與 AR 的方式來結合這次的圖書館介紹，互動擴增實境（Augmented Reality，簡稱AR） 接近現實的虛擬環境裝置，利用電腦技術模擬出一個立體、高擬真的圖書館 3D 空間，讓使用者身歷其境產生如同在燕巢圖書館現實中一般的體驗，會有這個想法主要是因為寶可夢所帶來的風潮帶給大家互動擴增實境的全新體驗這股潮流蔓延整個全世界，所以我們打算在圖書館設幾個關卡景點提供來圖書館的讀者透過相機掃描，每個場景的內容都不一樣，包含閱覽規則、使用規範、贈書原則……等等館方想讓讀者了解的一些訊息。掃描後會由吉祥物「小芭」跳出來解說互動，除了吉祥物導覽解說服務，還有Q&A增加互動。虛擬實境（Virtual Reality，簡稱VR），是利用電腦模擬產生一個三維空間的虛擬世界，提供使用者關於視覺等感官的模擬，讓使用者能夠利用視覺來模擬真實的場景感受，我們將使用這項技術應用在本次的服務中。
資通訊科技應用
(一)、AR導覽說明? 開啟程式後，我們可以掃描館內特定的圖片，接著小芭就會出現在我們的螢幕上。在小芭的前方會有兩種水果，當小芭吃下蘋果後，將會開始進入語音導覽。 左上角的灰色框框和語音會依序顯示、說出在前置作業中對於該區的介紹。當小芭吃下草莓後，將會出現Q&A問答。 (二)、VR導覽說明 首先我們先利用 360 全景相機先將圖書館每個角落拍攝一遍，之後再使用 Unity 3D 所呈現出來，使用者必須下載 APP 並且裝上我們所準備的 Google Cardboard 就能快速體驗 VR 圖書館導覽了。我們結合VR虛擬實境將圖書館各樓層的場景以3D的方式呈現。改變多數人以平面照片搭配文字的介紹方式，使用者彷彿身在館中，而不單單只是某個固定視角的觀看方式。
問題解決
其實這次與燕巢圖書館合作的AR、VR導覽對我們來說很有挑戰性。在計畫的一開始規劃，架構、內容、發想、小芭、細節每一個環節都是很重要的。我們團隊在前置作業的無限迴圈內不斷的反覆的討論、整理了許久，最後才終於找到那段break;的判斷式。而在撰寫程式碼上又是另一個while(true)了。這次的開發對我們來說是第一次接觸的專案，我們知道這程式也許不夠完美，能夠改善的缺點更是多到不可數;但對我們來說它卻是意義重大。因為我們能夠用它幫助人並且解決問題。這不就是我們的初衷嗎?小芭只是一個開始，我們所做的只是一個拋磚引玉，將來會有人把這APP改版2.0、3.0、4.0版本，而它可以變得更好、更完善、更漂亮，而那唯一不變的，「依然是我們的開始的動機。」
行銷目的
長榮牧羊人團隊所服務的範圍是高雄市燕巢區，其中燕巢數位機會中心(DOC)就設立在高雄市立燕巢圖書館內，圖書館在106年重新裝潢及維修並在七月份重新開館，將原本普通不起眼的圖書館換上了新衣，因此我們有個想法，我們利用自己的資訊專業為圖書館打造一套屬燕巢圖書館的形象網頁其中包含館內設施介紹、公共區與讀書借閱說明、圖書館導覽電子手冊以及我們特別精心製作的圖書館 360° 導覽，希望能藉由我們的專業來完成這偉大的任務！
行銷策略
由於來訪燕巢圖書館的人群多為當地的小學生，因此我們設定的使用對象是以中小學生為目標，此外為主為了吸引大家的目光，所以網頁與導覽電子書設的計方式會以活潑、可愛為主，其中我們以小芭(燕巢圖書館吉祥物)為主軸出現在我們作品的各個角落添增了兒趣歡樂的氣氛，在電子書的部分我們分為兩大部分，第一部分是館內設施的介紹，我們以活潑的方式去介紹各個館內設施與使用公約並且搭配著可愛的貼圖與設計吸引閱讀的目光，擺脫了枯燥乏味白紙黑字的方式，第二部分為剪紙與著色的小玩意，我們會將它印出來分給來圖書館的小朋友在了解圖書館設施之餘也能摺摺紙畫畫圖。網頁部分的呈現使用了Google Material風格和簡單的幻燈片與特效達到介紹的效果，此外我們的重頭戲是圖書館 360° 導覽，會有個著想法主要是我們常常會要到一個地方前使用者都會先使用Google搜尋並查看那邊的環境如何，但網站上所提供的照片給予的有限，所以我們才會想利用360° 全景相機先將館內各個角落拍攝一遍並使用最新技術將這些全景照片串連起來，讓使用者在家也能立即感受館內的所有設施。
媒體整合應用
網頁： 在網頁的部分有「圖書館簡介」與「圖書館 360° 導覽」除去已往圖書館相關使用規則和區域介紹給使用者冗長、沉悶的感覺，並搭配動態的360° 導覽讓使用者能夠親自的使用滑鼠或以觸控方式上下左右的觀看各個角度。 導覽電子書： 在電子書的部分我們分為兩大部分，第一部分是館內設施的介紹，我們以活潑的方式去介紹各個館內設施與使用公約並且搭配著可愛的貼圖與設計吸引閱讀的目光，擺脫了枯燥乏味白紙黑字的方式，第二部分為剪紙與著色的小玩意，我們會將它印出來分給來圖書館的小朋友在了解圖書館設施之餘也能摺摺紙畫畫圖。
執行成效
從服務開始到需求評估以及與館內人員討論到最後的實作花了我們一學期的時間，中間來來回回的討論與修改，最後終於完成我們的作品，館方也非常開心我們做出這樣的作品，以下以條列式逐一說明我們所做的內容：
- 我們將電子導覽手冊印出來分給首次來館內的人
- 導覽手冊後面附有著色圖與有趣的摺紙小玩意
- 製作了圖書館自己的網站，內容包含館內設施介紹、公共區與讀書借閱說明以及圖書館 360° 導覽
- 圖書館 360° 導覽能夠快速的讓前來圖書館的民眾快速了解內部擺設與環境
- 在網頁中以問答的小遊戲讓使用者快速了解館內的使用公約
## 圖書館 360° 導覽 館內一到三樓 360° 度全景導覽無死角，在家就能夠一覽燕巢圖書館的館內設施。我們使用全景攝影機拍攝圖書館館內這個區域目的讓來使用的民眾能夠快速的一覽館內的所有設施。
截圖與功能介紹：
燕巢圖書館360全景導覽，裡面有引導鈕可以切換館內各個場景並支援各種裝置，手機平板用戶建議橫放並開啟全螢幕模式。
VR圖書館導覽: Link
燕巢圖書館介紹網頁: Link
燕巢圖書館導覽手冊: Link
GitHub: Link
跨媒體整合介紹: Link
資訊應用服務介紹: Link
#教育部資訊志工 #資訊應用競賽 #跨媒體整合獎
APPLICATION
登革小尖兵
Android、Http Request、SQLite、AJAX、HTML5
簡介
我們主要收集台灣與其他鄰近國家歷年的天氣與傳染疾病。例如:登革熱、茲卡…等。 探討與分析是否天氣因子，例如:連日大雨與高溫造成疾病的衍生以及溫室效應和聖嬰現象所帶給地球上疾病的幫兇，逐一以Open Data視覺化方式呈現讓使用者能得知哪幾項氣候因素而導致該疾病的爆發，且能夠提前預防，為了方便我們開發了App和Web平台供大家使用。
功能介紹
- 全球即時天氣 : 掌握目前天氣狀況、大氣天文、溫濕度以及氣象預報。
- 即時病情新聞 : 內容包含台灣目前登革熱病情相關新聞以及WHO世界衛生組織所提供的全球疾病警示新聞，出國旅遊能夠掌握國際疾病災情。
- 世界地圖 : 內有全球登革熱地圖、全球溫溼度地圖，一目了然全球相關資訊。
- 台灣登革熱災情地圖 : 內容包含全台縣市登革熱人數爆發人次，細可查詢當地鄉鎮病例人數。
- 登革熱防治 : 提供使用者登革熱小常識，四步驟一一檢視是否處於登革熱的溫床中。
亞洲跨國黑客松台灣選拔賽
🏆獲獎名次：亞洲跨國黑客松台灣選拔賽【台灣研發獎勵獎】
由蔡易霖、王士誠、羅葉丞三位同學組隊參加亞洲跨國黑客松，我們結合跨國資料，找出氣候與登革熱的關聯性，並製作網頁版登革熱地圖與APP「Dengue helper」打造一個專屬於登革熱災情的平台。
Website: Demo
GitHub: Link
#2017國際跨國黑客松 #台灣團隊研發獎
空污小幫手
Android
簡介
空氣汙染會危害人體健康，而「空汙小幫手」團隊的其中一團員就深受其害，因此該團隊特別注重此議題，使用了空氣品質及時汙染指標、空氣品質監測站基本資料、各地即時天氣資料、AQI數值等資料，會自動抓取離使用者最近之監測站，以視覺化呈現，讓使用者一目了然即時的空氣品質狀況，以提早作相關的防範措施。
功能介紹
空污小幫手總共分為四個小功能分別為目前狀況、新聞、看見空品、以及預報，目前狀況能夠掌握目前所在地的新式空氣指標AQI數值以及視覺化長條圖方式呈現近二十四小時的空汙濃度變化， 第二部分新聞使用JSOUP爬蟲方式撈取台灣環境資訊協會-環境資訊中心的環境新聞以及Yahoo的即時氣象預報新聞，第三部分看見空品以視覺化方式呈現全台各地空氣品質濃度色塊，並提供下拉式選單供使用者查詢全台各個區域的空品資訊，最後一個部分預報撈取環保署的空汙預報資料提供3日內的空氣品質預報，最後以色塊燈的方式為全台各地依序做出預報警示。
2017 嘉義黑蚵松 地方開放資料黑客松
🥉獲獎名次：嘉義黑蚵松-地方開放資料黑客松(環境污染組)【第三名】
蔡易霖與連建凱同學參與嘉義地方政府黑客松開發「空汙小幫手」APP，使用了空氣品質及時汙染指標、空氣品質監測站基本資料、各地即時天氣資料、AQI、PM2.5等數值資料，會自動抓取離使用者最近之監測站，以視覺化呈現，讓使用者一目了然即時的空氣品質狀況，以提早作相關的防範措施。
GitHub: Link
經濟部工業局報導: Link
2017 嘉義黑蚵松 地方開放資料戰獲獎作品介紹: Link
#2017嘉義黑蚵松 #環境汙染組 #第三名 #最佳人氣獎
OpenWeather天氣
Android、Http Request、SQLite、Firebase
簡介
我們團隊是一群大學學生，收集了世界各地天氣資訊，並且使用OpenData政府公開資料為依據，以不同的角度去欣賞天氣 ☀☁☂
-以視覺圖像的方式讓您了解現在的天氣概況 -使用GPS偵測目前位置，顯示目前所在地的即時天氣 -目前狀況掌握今日高低溫以及目前體感溫度 -風速風向搭配動畫一目了然 -詳細的氣壓、濕度、能見度資訊 -天文方面顯示日出日落時間，搭配仰角顯示目前太陽所在位置 -提供詳細的氣象資訊，包括五日十日天氣預報 -Android6.0初次執行時會要求GPS的存取權限，允許才能正常執行哦~ -初次執行App會建立資料庫，請確認GPS是否有開啟，若首次執行閃退是正常現象(待解決)，再次開啟App即可正常運作 -App背景圖片正急尋原作者，若看到請與我們聯絡哦 !
公開資料來源:行政院環境保護署、中央氣象局、Yahoo Weather API
功能介紹
首次開啟App會要求位置的存取權限，並且會依據當下的GPS經緯度利用Google Map API轉換成地址，擷取到位置訊息再使用Yahoo Weather API去查詢該地的即時天氣狀況，包含目前溫度、風速、風向、大氣、氣壓、天文、以及十日的天氣預報供使用者即時查閱。 為了解決離線瀏覽的問題我們設計了一個資料庫存取這些政府公開資料，並由手機SQLite資料庫去實作，此外您可以使用此App在世界的任何地方，因此我們還特別加入了多國語言功能將介面英文化，還搭配不同的度量衡為使用者做個人化的設定，例如華視與攝氏的選擇。
第二部分環境我們撈取行政院環保署的供該資料作為資料源，包含當地紫外線以及空氣品質AQI與PM2.5，在本App中不僅僅只是視覺畫呈現資訊，且依據當下的即時狀況未使用者做出即時的防護措施免於週遭的有害物質，此外資料撈取的依據我們是使用目前經緯度和環保署所提供的空氣品質監測站基本資料中的每筆測站經緯度利用Haversine formula大圓距離換算求面上兩點最短距離，找出哪筆測站資料與目前所在的位置最近，且提供給使用者資訊。
因APP尚未繼續維護，暫時下架。
2017 嘉義黑蚵松 地方開放資料戰
🥈獲獎名次：嘉義黑蚵松-地方開放資料戰(資料視覺化組)【第二名】
參加經濟部工業局舉辦的Open Data黑客松競賽，運用政府所提供的公開資料做資料清理與視覺化，並釋放資料集與開源程式碼供民眾存取。 
GitHub: Link
重灌狂人報導: Link
經濟部工業局報導: Link
2017 嘉義黑蚵松 地方開放資料黑客松獲獎作品介紹: Link
#2017嘉義黑蚵松 #資料視覺化組 #第二名
coding