---
# System prepended metadata

title: IPH UI＆排版統整會議

---

# IPH UI＆排版統整會議
- 時間：3/3 週三11:00
- 地點：6F
- 與會人員：Martin、Michelle、Fuyuki、Mike、Mico、Hobby、Hazel、Naiky、Lala、Bento

## 會議總結
1. 提供工程師個別板塊與組合板塊的UI畫面，以供刻板參考
2. icon一律使用svg
3. 設定流程第一步的「類別」更名為「風格」
4. 會員/錢包/登入 、跑馬燈 提供三樣式待主管決定
5. API格式待Naiky、Martin、Hobby、Hazel定義後，Fuyuki施作

## 設定流程 v2.0
![](https://i.imgur.com/lAnJwel.jpg)
- 流程： 風格 + Mode > 板塊 > 主題色
    - 新增Mode：為因應不同背景色，列出Mode選擇 Dark or Light
    - 類別修正名詞為風格
- 後台系統設定
    -  主題色
        -  色碼
        -  Name
        -  屬於何種Mode
    -  風格
        -  ex.真人、體育...
        -  表格呈現
    -  板塊
        -  Name
        -  圖片：針對不同色，可上傳多張
        -  風格：由「風格」頁面的列表拉出做tag，在此可選擇

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

- 板塊已劃分完成
    - 會員/錢包/登入 、跑馬燈 提供三樣式待主管決定 

---    
- 時間：2/23 週二 10:30
- 地點：6F 會議室
- 與會人員：Michelle、Mike、Martin、Hobby、Hazel、Fuyuki、Mico、Naiky、Lala

## 設定流程
![](https://i.imgur.com/B3RUJUF.jpg)

- 手機（H5與APP）與電腦(Web)差異在於，電腦不可拖動板塊，僅follow選擇的類別呈現版型並拉出顏色變數配合主題色
- 流程：類別 > 板塊 > 主題色
    1. 類別
        - 下拉選單，可提供營商選擇主推產品，藉此進行到板塊的篩選
        - 分為基本板塊、競技（體育電競）、電子捕魚、真人、棋牌、彩票
    2. 板塊
        - 可拖動的選擇 ex.有三種Banner可供選擇類型及擺放位置
        - 規則：
            - 跑馬燈僅能換位置
            - 能換位置則不能Fixed
            - 下方Bar為固定框架，不可選擇樣式及移動，僅能配合主題色變色
            - 不同樣式的操作行為須一致
            - 不同樣式之大小尺寸皆須一致
    4. 主題色
        - 文字顏色、icon顏色、底色
        - 皆為組合配色，不提供營商進行自行配色

### 後續討論：

Q: 能換位置則不能fix<<有點疑惑 我理解的是...同一組版型 只能選擇fix或是不fix 因為這個算是行為的一部分

A: 這塊的部分主要像是登入如果在上方，滑動的時候固定，不跟著滑動走，那就不能換位置
不能放在中間的時候又要讓他跟著滑動
等於也是操作行為的意思沒錯

---
Q: 我有疑問的部分是「遊戲分類選單」 通常這個都會做滑到上面就固定的功能 因為怕選項太多 user滑回選單會很麻煩 向這樣是可以的嗎？我們就統一都一樣的行為 只是style不同

A: 這個是沒問題的

---
- 時間：2/4週二 14:00
- 地點：6F 會議室
- 與會人員：Michelle、Bento、Mico、Lala
## 版型規劃
- 預計四種版型參考：
![](https://i.imgur.com/P7EsNx1.png)
1. 遊戲類型為橫走向，遊戲商排版按照IMF88方式，閱讀使用上下滑動
2. 遊戲類型為橫走向，遊戲商排版按照IMF88 APP方式，閱讀使用左右滑動
3. 遊戲類型為直走向，遊戲商排版按照亞博APP方式，閱讀使用上下滑動
4. 遊戲類型為直走向，遊戲商排版按照亞博APP方式，閱讀使用左右滑動
P.S. 以上遊戲商排版方式皆為參考，待討論

---
## 預計後台設定
![](https://i.imgur.com/IJm80Ub.png)

- 模板
    - 風格類型選擇
- 主題
    - 組合色選擇
- 版型
    - 區塊可調整選擇

1. 增加模板設定可行性？
2. 是否要增加板塊類型？
   ex. Banner1、Banner 2、Banner 3
   可選擇呈現的類型樣式
   
 --- 
## 結論

1. 可選擇區塊：待範本提供後，UI分配，提供不同樣式
    - Banner
    - 會員資料
    - 遊戲類別 + Vendor
    - 跑馬燈（待討論）
    - 賽事

2. 提供呈現範本：Mico
3. 主題色規則統一：UI LALA
4. 設定頁採用類似cake resume，以拖曳的方式選擇
5. Web僅配合主題色

---

## 2/2

- 首頁風格模板
    - 體育、電子 -LALA
    - 真人、棋牌 -便當
