NYCU Glocal Digital Service & Innovation Competition 黑客松活動紀錄

Nijia Lin2021-07-05

LINE Taiwan Technology Evangelist

前言

大家好我是技術推廣工程師 Nijia Lin，本次將分享我們(Developer Relations)與陽明交通大學 - 國際事務處一同合辦「NYCU Glocal Digital Service & Innovation Competition」活動中的相關內容，此次活動內容為三天的黑客松，主題為如何利用 Open Data 結合 LINE Bot，提升醫療與健康照護，期間包括了演講、工作坊、競賽三個環節，讓同學們可以在這三天的時間內與來自不同國家的同學一同發揮創意打造產品，想了解這三天究竟發生了什麼事情嗎？讓我們一同往下看吧！

活動網頁: https://event.oia.nycu.edu.tw
活動日期: 7/1(四)-7/3(六)

TL;DR

第一天 - 則由 Evan Lin、我(Nijia Lin) 以及 API Expert - Richard Lee 以演講的方式帶大家了解 LINE 的 Ecosystem 下能做到的各式創意內容。
第二天 Mentor 問答時間 - 則由其他 Expert - 戴均民、Wolke、卡米哥、Caesar Chi、陳佳新讓大家可以在線上預約時間詢問專家們開發與設計上的意見。
最後一天評分與講評 - 則由 Evan 與另 Expert - CL Sung 為大家講評並頒獎給獲獎同學，更多細節歡迎大家繼續往下看囉！

第一天 - 演講

Introducing LINE ecosystem

第一天下午 LINE 的時段開場由資深技術推廣工程師 - Evan Lin 為大家介紹 LINE 的 Ecosystem，逐步讓各位了解每個服務以及 Chatbot 能帶來更多的應用與契機。

首先在 LINE 中我們擁有了許多各式各樣的服務，讓大家可以即時在 LINE 上解決需求，但在使用這些服務時總是會有官方帳號，會在特定時間內將你想看到的內容推送給你，且你也可以透過問答的方式找到自己想要的東西，這也是接下來要介紹的 LINE Bot。

相信大家看到這一頁應該不陌生，LINE Bot 在發送訊息時其實可以客製化許多內容，其中此部分介紹的為「Flex Message」，設計時也都會以 Flex Message Simulator 做開發，更多細節請參考下方文章。

藉由 Flex Message Simulator 實現並發送測試用 Flex Message

相信大家不管有在電商網站、手遊都會有使用過 Single Sign On(SSO)，讓使用者可以快速地透過點擊登入按鈕即可登入平台之中，且服務端也不用管理使用者的密碼(同時也增加安全性)，而此功能在 LINE 這即稱為 LINE Login，只要使用者平常有在使用 LINE，都可以透過快速登入的方式使用。

LINE Bot 開發者指南詳解 – 4. LINE Login

更多的內容歡迎參考官方文件

另一個由 LINE 開發的網頁前端框架 LIFF(LINE Frontend Framework)，它是整合 LINE Login 又更上一層樓的強大功能，可以讓使用者在 LINE 中打開 LIFF 頁面時，會自動辨認是否為 LINE 的使用者，讓整體使用體驗大幅提升。

LINE Bot APIs introduction and demonstration

接著輪到我為各位更詳細介紹 LINE Bot API 與提供範例給大家參考。首先就先帶大家了解 LINE Bot 的運作流程(在 LINE 上面打字 -> LINE 轉發至你的服務中)，並說明 LINE Bot 主要的兩個功能 Repl 與 Push Event 個別的使用情境，讓同學們在開發時可以依照自己的創意點子來使用(如下圖所示)。

接著此部分則詳述每則訊息可涵蓋的訊息格式為哪些，不論是純文字、貼圖、圖片、影片、聲音、位置、以及客製化訊息內容(Flex Message)皆可使用，更詳細的說明大家請參考官方文件。

下一個環節則是帶大家手把手從程式碼中一步一步頗析在演講中的功能究竟如何實現，透過 MIT_flask-line-bot-demo 可以讓各位實際演練從最基本的 Echo bot(所見即所得)、各式回應訊息的練習、到 Rich Menu 的建立，全部都在 MIT_flask-line-bot-demo 這個專案中，大家可以 Fork 去試玩看看。

取得使用者資訊
取得貼圖關鍵字範例
更換 LINE Bot 頭像讓使用者快速辨認當前身份
讓使用者在手機介面上快速回答的功能 - Quick Reply
強大而樸實無華，讓你可以建立選單給使用者滿滿的視覺饗宴 - Rich Menu
- 建立步驟程式碼

Advanced UX patterns with LINE Bot APIs

第一天的尾聲則由 API Expert - Richard Lee 來為大家介紹如何在 LINE Bot API 上增進使用者體驗，透過先前的議程分享後在此部分讓同學們可以在開發的過程中，設計出一個良好互動體驗的 LINE Bot，除了讓同學們在作品呈現上可以更有效的展示，也在短短的時間內帶大家認識在業界開發上時常會需要注意的部分。

其他參考內容： TECHPULSE 2020 - LIFF SDK 的開發者體驗與實用秘訣

第二天 - API Expert Mentor 預約問答時間

同學們從演講完後即開始緊鑼密鼓的開始撰寫程式，當然在過程中難免會遇到些開發上的問題，這裡我們邀請了業界的 LINE Bot 專家來為每一位學生解惑，同學們都非常踴躍與積極地把握每個可以詢問的時間來請教這些大師。

早上時段由 Caesar Chi 與佳新為同學們解答，一早就看到同學們這麼有活力且詢問了許多點子發想上實作的問題。

下午時段由均民與 Wolke 與各位同學在線上解答，下午的部分除了同學們把先前討論的問題提出外，再請教實作問題的同時均民也大方分享了他在開發上有遇到的狀況，提醒同學們在實作時需要注意哪些環節，讓整個發想的流程可以更順利地被完成！

晚上的部分則由卡米哥與均民輪流與各位同學最後的問題加催，同學們都已逐漸有些架構來詢問晚上的 Mentor，透過經驗分享也讓同學們了解當中所需要整理與修改的部分為哪些，把握最後的時間把創意點子實現出來，也讓第三天 Demo 時可以更加順利！

第三天 - 評分與講評

第一名：FINIC：清楚的定義情境跟故事並整合許多 APIs、System design 也在短時間內清楚呈現出來
- 設定了 Panic 按鈕，當你真的遇到問題時可以透過 Rich Menu 上的按鈕緊急呼叫附近的人來幫助你，也借助了台灣的風俗民情(會互相幫忙)，讓周遭的人可以藉由 LINE Bot 收到需要幫忙的朋友的消息，藉此避免事故發生。
- 有效整個醫院地圖資料，讓線上預約系統也可以整合在系統中，並透過 Email 可以寄送預約確認信，也提供醫院位置讓預約的人可以快速找到醫院位置。

第二名：Smart AI Health Advisor：清楚的展示出目標以及整體架構，將 Open Data 資訊整理在 LINE Bot 中，並有效整合與管理使用者生活習慣：三餐、健康管理助理、持續給予使用者鼓勵，讓使用者在記錄的同時也被激勵到，持續的維持良好的身活習慣，其中也整合上許多 LINE Bot 上的功能，讓整體設計可以更加順暢。