Skip to content

Instantly share code, notes, and snippets.

@Calvin-Huang

Calvin-Huang/FB-design-rules.md

Last active March 24, 2017 07:45
Show Gist options
  • Save Calvin-Huang/cd86a9180aae4ec31d6cb887bf76d702 to your computer and use it in GitHub Desktop.
Save Calvin-Huang/cd86a9180aae4ec31d6cb887bf76d702 to your computer and use it in GitHub Desktop.
Download ZIP
Facebook 在整合自家功能上存在一些公開原則，並且推出產品前會需要將完成的服務交給 Facebook 審核團隊檢查，這份文件將美術設計與產品設計者所需了解的資訊整理出來，協助參考流程與畫面設計。
Raw
FB-design-rules.md

Facebook 設計相關文件

Facebook 在整合自家功能上存在一些公開原則，並且推出產品前會需要將完成的服務交給 Facebook 審核團隊檢查，這份文件將美術設計與產品設計者所需了解的資訊整理出來，協助參考流程與畫面設計。

Facebook 平台政策

  • Icons 使用透明或有顏色的背景，如果 icon 需要白色背景，使用有顏色的邊界 Close Use a Transparent or Colored Background If Your Logo Has a Drop Shadow Use a Colored Background
  • Banners 不可以包含圓邊或是邊界，不能包含第三方的 Logo。

Facebook Login

登入審查

  • 必須已經上傳完整 App Icon
  • 必須要有非常清楚按鈕告知 User 接下來會帶領他到授權畫面 例如
    • 例如文字敘述 Log in with Facebook
    • 在 WWLive 上與 Facebook 朋友們互動 但是不能
    • 使用 Facebook 品牌名稱來暗示合作、贊助、或認證關係
    • 將自身產品名稱、團隊、任何宣告裡面與結合 Facebook 品牌做結合
      • "Facebook Friend Smash" or "FB Friend Smash"
      • "Friend Smash for Facebook" or "Friend Smash for FB"
      • "Friend Smash - play with friends on Facebook"
      • "Friend Smash - the best FB game"
  • 不可以事先幫使用者在分享的訊息裡面填入任何資訊

已 user_likes 為例

user_likes 流程示範圖 不過以使用者體驗為前提來要求的話，推播或是其他需要使用者授權的流程都以這種模式下去請求授權會比較友善。

Account Kit

由 Facebook 提供的 SMS 登入審查工具，簡易整合與可靠性高，但是提供的 UI 客製化程度不高 Account Kit UI 客製化工具 - Developers 管理後台

  • Basic UI Layout

  • Advanced UI Advenced UI

  • 客製化 Email Email 客製化介面

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment