Designers in Tech- Open Source Design Workshop - Eriol Fox
======

{%hackmd @coscup/BkyL5IdFA %}

> [工作坊簡報 COSCUP 2024 - Workshop - Miro](https://miro.com/app/board/uXjVK7S_xCQ=/)
> [sprblm/The-Design-We-Open | Github](https://github.com/sprblm/The-Design-We-Open)
## 最靠近門的那一組的共筆
### 組員簽到區
- [name=Katie] [Github]()
- [name=stella] [Github](https://github.com/zucci)
- [name=Dong] [Github](https://github.com/rr37)
- [name=Annie] [Github](https://github.com/AnnieLu1101)
- [name=Meg] [Github](https://github.com/meghsu)
- [name=yi-ting] [Github](https://github.com/eating-lu)
### Issue 選擇
#### 想要做哪一個 Issue?
- Cofacts
::: spoiler 其他專案頁面備存
- Session 
- Ceno 
:::
#### 為什麼？
- [name=Meg]
- 感覺很多人會需要，因為長輩會在 Line 上傳沒有經證實的資料
- [name=Dong]
- 想要做新的 165 的網站，因為他是空白的，做什麼都是對的
- [name=Katie]
- 因為上次參加大松有參與到 165 的討論，比較了解他的脈絡
- 雖然台灣已經有 165 的網站，但大多數台灣人不知道
- Session app 第二個寫的也蠻清楚的，覺得也可以做
#### 如果選到一樣的組別怎麼辦？
- [name=stella]
- 應該還好，可以有不同的解法。
- 如果大家都選 Cofacts，我們也可以選 Ceno
- 主辦方說不會怎麼樣
#### 結論
- 決定要做 165 專案
### 165 專案相關資訊
- 165 的專案在做什麼？
- 讓使用者查詢某些詐騙關鍵字時，能先搜尋到防詐騙的網站（網址 ex. `165.g0v.tw/可疑的詐騙關鍵字`），避免被二次詐騙
- 目標群眾（target audience）
- 會在 Google 搜尋詐騙關鍵字(xx娛樂城、xx金融公司)的人
- 被加入群組要求說請在某某地方輸入帳號密碼
- 怎麼匡出這些人的？
- [name=MrOrz]
- 直覺（？
- 在查核的過程中，發現詐騙集團會跟用戶私下溝通，用戶會把這些聊天記錄丟到 Cofacts，這些回報很難回覆，因此想做出自己的網站，
- 工程師看到一個大問題（詐騙），其中有一些小東西可以先做，就先做來試試看效果
- 參考資料：
- [Open165 反詐騙 - 假網站公告搜尋引擎最佳化 - HackMD](https://g0v.hackmd.io/xl7YbrcTRECluGKK_HGo6Q#%E5%8F%AF%E4%BB%A5%E6%94%BE%E7%9A%84%E6%9D%B1%E8%A5%BF)
- [民間：目前的 g0v 版 165 網站](https://165.g0v.tw/)
- [官方：內政部警政署 165 全民防騙網-涉詐資訊公告(檢視內容)](https://165.npa.gov.tw/#/article/9/1541)
- [cofacts/open165 | Github](https://github.com/cofacts/open165)
### 使用者調查
:::spoiler
:::
- 以使用者為中心，分為四象限討論
- 他們需要什麼？
- 他們想要什麼？
- 他們要做什麼？
- 什麼會傷害他們？
### 使用者的使用流程（journey map）
:::spoiler
:::
- 由左至右列出各個階段會發生的事情，
### 設計貢獻模板
#### 不受歡迎的人 模板
:::spoiler
:::
- 如果有一些奇奇怪怪的人想運用開源軟體的話，該怎麼辦？
- Cofacts 平常會遇到哪些奇奇怪怪的人或事？ [name=MrOrz]
- 情色訊息
- DDos 攻擊
#### 開源軟體工具的啟發式分析/使用者體驗評估 模板
:::spoiler
:::
- 模板參考來源：[For Publication: Accessibility and Usability Heuristic Review](https://superbloom.design/resources/superbloom-accessibility-and-usability-heuristic-review.pdf)
- 文件中有 10 種原則
#### 使用者同理心地圖 模板
:::spoiler
:::
#### 用戶測試/用戶研究腳本 模板
:::spoiler
:::
### 工作時間
#### Crazy 8 ( 8 分鐘內快速產出的想法)
- 開放政府
- 提升網站的公信力
- 在網站上顯示被擋下的金額有多少
- 跟警政署建立更即時的資訊串接
- 政府跟民間的網站有不同標記
- 舉報、回傳 165
- persona
- old and young person
- 天真小白
- 易相信
- 易分享
- uh...... immediate answer
- 直觀的資訊 (網站)
- 直接畫 165 的設計稿
- 在詐騙網站上，彈出滿版的廣告
- make it cute
- 介面訊息清晰
- at a glance
- 1 click
- 警示提醒
- AI mapping 自動導入 info 對照
- 連回相關詐騙新聞
- show source under results
- Is this the scam
- 停看聽
- 先不要轉傳、不動作
- 即時訊息，告知 user 訊息是否正確
- you might have been scammed(可能被騙的比例圖)
- 收到 msg 的警示鈴
- 詐騙警示 tag
- UI tags
- o true
- x false
- ! 有疑慮
- 通知：你查的別人查過
- 去個資化地監聽外連的連結
### 成果報告: 詐騙停看聽
#### Story Board
- 利用情境方式，把腦力激盪的結果畫出來
- 解說牌
| 1. 使用者| 2. 情境 | 3. 靈光一閃|
| -------- | -------- | -------- |
| 4. IDEA 1| 5. IDEA 2 | 6. IDEA 3 |
1. 使用者：長輩或容易相信別人的人，有人傳訊息給他
2. 情境：聊天軟體收到一則月入百萬的投資資訊
3. 靈光一閃：如何提供警示訊息
4. IDEA 1：
- 提供真實度百分比視覺化顯示
- 可以點到官方 165 網站
5. IDEA 2:
- 訊息可信度
- O 安全
- X 危險
- ! 有疑慮
6. IDEA 3:
- 紅綠燈的顯示方式
- 紅燈：危險
- 黃燈：有疑慮
- 綠燈：安全
- Figma 檔案 by Meg
- [Figma 設計稿連結](https://www.figma.com/design/YFzYrVW3TqI6j3FmHnzDh3/Untitled?node-id=0-1&t=VV26AoJMF89cG8Nw-1)
- 已將本份共筆連結補回 [Open165 反詐騙 - 假網站公告搜尋引擎最佳化]()
:::spoiler 完賽證明
:::
- 已將本次工作坊內容 comment 至 [cofacts/open165 | Issue | Github](https://github.com/cofacts/open165/issues/7)
:::spoiler 完賽證明
:::