---
# System prepended metadata

title: 隊輔跳坑指南 - 第七屆黑客松 (1101)
tags: [' 110 學年', 文件, ' 上學期', ' 黑客松']

---

---
title: 隊輔跳坑指南 - 第七屆黑客松 (1101)
tags: 文件, 黑客松, 110 學年, 上學期
GA: UA-54884750-6
---
<!-- Tag 規範：https://hackmd.io/@cmrdb/tags -->

# 隊輔跳坑指南

## 隊輔要做啥？

擔任黑客松隊輔，不用特別會哪個技術，但主要是要注意以下幾件事情：

1. 協助與關注各組進行討論跟交流的狀況
2. 適時提醒或干涉討論進度，避免過於離題或是花過多時間
3. 若各組有需要協助的部分，找適當的人進行協助，如介面規劃或是系統建議

## 活動流程規劃

### ==主題發想==

#### 轉場

- 提到將會提供海報與便利貼提供討論，並且會由隊輔們從旁引導每組的發想方向，以及告知各隊在發想結束後務必將發想電子化

#### 器材&工具

- 海報紙
    - 海報架
        - 如果數量足夠
    - 便利貼
        - 304櫃子內可能有
    - 無痕膠帶
- Whimsical 
    - [連結](https://whimsical.com/)

#### 隊輔注意事項

- 商業分析
  - 特色
  - 客群
- 適時提供發想意見
    - 可以用使用者的角度說出希望這個系統在使用時可以解決什麼問題，將發想導向使用者需求與解決現有問題上，而非天馬行空沒完沒了的發想下去
- 便利貼歸納
    - 當該組結束發想後，可以協助各組開始便利貼分類，將發想收斂 

#### 產出文件

- 發想海報 * 1
- 心智圖 * 1

:::spoiler
<summary class="example">查看範例（點選展開）</summary>

![](https://i.imgur.com/W6DP97p.png)
:::

### ==功能發想==

#### 轉場

- 在該階段告訴參加者們時間差不多該準備進入下一階段，並且進行簡短的 HackMD 教學

#### 器材&工具

- HackMD

#### 隊輔注意事項

- 先請他們將所有訂下的大功能全部列出訂下，並慢慢地往內收，最後才是每個功能的細項
- 提醒細項需要夠明確，比如這個功能可能會需要什麼欄位，可舉例登入系統就需要有基本的帳號密碼，還有可提到如果往後有其他功能需要什麼相關資料也必須現在規劃進去
- 最後進行功能評估

#### 產出文件

- 功能列表 * 1
:::spoiler
<summary class="example">查看範例（點選展開）</summary>

![](https://i.imgur.com/EHGfF0v.png)
![](https://i.imgur.com/0xuBTO9.png)
:::

### ==流程規劃==

#### 轉場

- 在現場所有組別均差不多將功能規畫完畢後，即可提醒各組將進入下一個階段，在這個階段基本的介紹流程圖中各個不同的圖形分別代表什麼意思

#### 器材&工具

- Whimsical

#### 隊輔注意事項

- 在流程圖的繪製過程中需多注意組員們是否有確實的將所有階段的判斷加入流程中

#### 產出文件

- 系統流程圖

:::spoiler
<summary class="example">查看範例（點選展開）</summary>

- ![](https://i.imgur.com/0Qt4HvW.png)
:::

### ==畫面設計==

#### 轉場

- 進入這個階段後將會先帶出 Figma 如何使用

#### 器材&工具

- Figma

#### 隊輔注意事項

- 運用你個人的美感給點建議，或是請參加者們多參考相關網站的設計思路

#### 產出文件

- 畫面構想圖 * 1
:::spoiler
<summary class="example">查看範例（點選展開）</summary>

#### Pomodoro (Figma)

https://www.figma.com/file/40ymddYnLej4DbIT2OPr7B/Pomodoro?node-id=0%3A1

##### 知識王 網頁後台

<iframe width="640" height="360" src="https://xd.adobe.com/embed/3ae77cbc-5678-4e48-af3c-52d0aa5faa44-6fb4/" frameborder="0" allowfullscreen></iframe>

Link: https://xd.adobe.com/view/3ae77cbc-5678-4e48-af3c-52d0aa5faa44-6fb4/

---

##### 知識王 手機介面

<iframe width="640" height="360" src="https://xd.adobe.com/embed/b8070b44-bc54-47b6-bcaf-93740952b8e3-ed54/" frameborder="0" allowfullscreen></iframe>

Link: https://xd.adobe.com/view/b8070b44-bc54-47b6-bcaf-93740952b8e3-ed54/

:::

### ==資料庫分析（如果該組進度夠快）==

#### 轉場

- 如果有組別進度較快進入這個階段，那麼個別進行引導進資料庫分析，簡單講解 draw.io 該如何使用與 ERD 該如何繪製 

#### 器材&工具

- draw.io

#### 隊輔注意事項

- 提醒各組多注意在資料表的欄位形態要符合功能所需（這是細部規劃）

#### 產出文件

- ERD * 1
    - 資料庫分析圖
:::spoiler
<summary class="example">查看範例（點選展開）</summary>

![5th-hackathon](https://i.imgur.com/65oz0pb.jpg)
![6th-hackathon](https://i.imgur.com/TyqEqwV.jpg)
:::
- 系統循序圖 * n
    - n = 功能數量
    - 與資料庫溝通的流程
    - ![](https://i.imgur.com/7XKMtjz.png)


### ==成果簡報製作==

#### 轉場

- 在活動進入尾聲的前一至兩小時，提醒各組差不多該收尾並製作成果簡報了

#### 器材&工具

- [Google Slides](https://docs.google.com/presentation)（線上協作）
- [Office 365 PowerPoint](https://www.office.com/launch/powerpoint)（可線上協作版）

#### 隊輔注意事項

- 提醒各組簡報中需要一些畫面，並且前面幾個階段所產出的文件也必須加入簡報中並詳細說明設計的思路與流程規劃

#### 教學文章或影片

- [Google Slides 使用技巧](https://youtu.be/5wRBiKdIRoU)
- [簡報風格技巧](https://youtu.be/m4YKkj8An0s)

#### 產出文件

- 成果簡報 * 1

## 參考檢查清單

- [ ] 確認題目
- [ ] 發想功能與目標群眾
    - [ ] [商業模式圖](https://growthmarketing.tw/business-model-canvas/)
    - [ ] 功能心智圖
- [ ] 收斂發想的功能，找出必要元素
- [ ] 規劃系統與視覺
- [ ] 規劃細節功能架構，或是延伸發想更多內容，規劃多期進展
- [ ] 製作成果簡報

## 參考範例

## 推薦工具

### 討論工具

- 共識、共筆工具: [HackMD](//hackmd.io)
- [使用手冊](https://hackmd.io/s/quick-start-tw)

### 發想工具

- 便利貼發想: [Whimsical](//whimsical.com) (可以多人線上協作)
    - 注意不要使用行動裝置，輸入的時候不能直接輸入，需要用貼上的才會正常
- 備案
    - 便利貼發想: [Google Jamboard](//jamboard.google.com)
    - 便利貼發想: [Miro](//miro.com)

### 系統設計工具

- 心智圖、架構圖等等: [Whimsical](//whimsical.com) (可以多人線上協作)
- 備案
    - 心智圖、架構圖等等: [XMind](//www.xmind.net) (離線單人)
    - 通用繪圖工具: [draw.io](//draw.io) (線上單人)

### 介面設計工具

- [Figma](//www.figma.com) (可以多人線上協作)
- 備案
    - [Adobe XD](//www.adobe.com/tw/products/xd.html) (線上單人)

### 簡報製作

- [Google Slides](https://docs.google.com/presentation)（線上協作）
- [Office 365 PowerPoint](https://www.office.com/launch/powerpoint)（可線上協作版）
- [Prezi](//prezi.com)

## 參考執行方式與結果

- [Ray 4.0 青年學生體檢政府網站計畫](//ray2020.pdis.nat.gov.tw)

<style>
    details summary.example {
        font-size: 20px;
        line-height: 2;
        color: cornflowerblue;
        background: antiquewhite;
    }
</style>