藍湖使用教程

“藍湖”產物設計協作平臺，實現了一張畫板展示頁面跳轉邏輯、設計圖汗青版本辦理、打點評論、主動標注、建造高保真交互原型、團隊共享網盤等功能。

東西/原料

藍湖
Ps
Sketch

1.團隊辦理

點竄團隊名稱
只有該團隊的超等辦理員才有權限點竄團隊名稱。在首頁左側功能欄中選擇【辦理團隊】；
進入團隊辦理頁面，點擊右上角【設置】，選擇【更改團隊名稱】，或直接點擊最上方“團隊名稱”，即可點竄該團隊名稱。
建立新團隊
在首頁左側功能欄中選擇【切換/建立團隊】；
打開后，選擇【建立團隊】；
填寫“團隊名稱”，點擊【建立】即可建立一個新的團隊。
多團隊間切換
在首頁左側功能欄中選擇【切換/建立團隊】；
打開后，選擇需要切換的團隊名稱即可。
退出團隊
在首頁左側功能欄中選擇【辦理團隊】；
進入團隊辦理頁面，點擊右上角【設置】，選擇【退出團隊】即可退出該團隊。
★注：超等辦理員需將團隊移交出去才能退出團隊。
移交團隊
只有該團隊的超等辦理員有權限移交團隊。在首頁左側功能欄中選擇【辦理團隊】；
進入團隊辦理頁面，點擊右上角【設置】，選擇【移交團隊】；
在當作員列表中選擇團隊移交的當作員名稱，點擊【確定】，即可當作功移交團隊。被移交當作員主動當作為超等辦理員，原超等辦理員主動降級為辦理員。
閉幕團隊
只有該團隊的超等辦理員有權限閉幕團隊。在首頁左側功能欄中選擇【辦理團隊】；
進入團隊辦理頁面，點擊右上角【設置】，選擇【閉幕團隊】；
輸入你的“登錄暗碼”，點擊【確定】即可。
★注：閉幕團隊后，該團隊的所有內容將被刪除，且不成恢復，請穩重操作。
添加團隊當作員
只有該團隊的超等辦理員及辦理員有權限添加團隊當作員。在首頁左側功能欄中選擇【添加當作員】；
體例一：鏈/ 接邀請設置該當作員的身份（權限）；點擊【生當作邀請鏈/ 接】；復制“邀請鏈/ 接”分享給你的同事即可。
體例二：郵箱邀請在【郵箱】欄中輸入要邀請同事的郵箱；設置這些當作員的權限；最后點擊【發送邀請】；被邀請當作員會收到邀請郵件，只需點擊郵件中的邀請鏈/ 接即可。
移除團隊當作員
只有該團隊的超等辦理員及辦理員有權限移除團隊當作員。在首頁左側功能欄中選擇【辦理團隊】；
進入團隊辦理頁面，找到你要刪除的當作員，點擊最右邊當作員身份，鄙人拉列表中點擊【刪除當作員】即可。
團隊當作員權限申明

2.項目辦理

建立項目

點擊首頁左上方藍色按鈕【建立新項目】；

輸入“項目名稱”，選擇項目類型，點擊【確定】即可。

點竄項目名稱
只有該團隊的超等辦理員及辦理員才有權限點竄項目名稱。在首頁，將鼠標移至項目卡片上，點擊右上角呈現的“更多”圖標，選擇【設置】；
進入項目設置頁面，點擊“名稱”后的編纂按鈕即可點竄。
Ps：經由過程畫布右上方的“更多”圖標，也可以進入項目設置頁。
切換項目類型
只有該團隊的超等辦理員及辦理員才有權限切換項目類型。在首頁，將鼠標移至項目卡片上，點擊右上角呈現的“更多”圖標，選擇【設置】；
進入項目設置頁面，可以從頭選擇項目類型。
Ps：經由過程畫布右上方的“更多”圖標，也可以進入項目設置頁。
添加項目當作員
只有該團隊的超等辦理員及辦理員才有權限添加項目當作員。在首頁，將鼠標移至項目卡片上，點擊右上角呈現的“更多”圖標，選擇【設置】；
進入項目設置頁面，點擊藍色“添加當作員”圖標；
體例一：【邀請小伙伴進入項目】，即添加已經插手團隊，卻未介入該項目標同事。直接選擇當作員手刺，點擊【邀請】即可。
體例二：【從團隊外邀請】，即邀請還未插手團隊的新當作員。 ①經由過程鏈/ 接邀請設置該當作員的（身份）權限；點擊【生當作邀請鏈/ 接】；復制“邀請鏈/ 接”分享給你的同事即可。
②經由過程郵箱邀請在【郵箱】欄中輸入要邀請同事的郵箱，多個郵箱中心用“逗號”離隔；設置這些當作員的權限；輸入驗證碼，最后點擊【發送邀請】。被邀請當作員會收到邀請郵件，只需點擊郵件中的邀請鏈接即可。
Ps：經由過程畫布右上方的“更多”圖標，也可以進入項目設置頁。
移除項目當作員
只有該團隊的超等辦理員及辦理員才有權限移除項目當作員。在首頁，將鼠標移至項目卡片上，點擊右上角呈現的“更多”圖標，選擇【設置】；
進入項目設置頁面，點擊項目當作員身份（權限），選擇【移除項目】即可。
★注：移除項目當作員，該當作員只是不克不及介入此項目，他仍留在團隊中。如需從團隊中刪除當作員，請參看“移除團隊當作員”。 Ps：經由過程畫布右上方的“更多”圖標，也可以進入項目設置頁。
刪除項目
只有該團隊的超等辦理員及辦理員才有權限刪除項目。在首頁，將鼠標移至項目卡片上，點擊右上角呈現的“更多”圖標，選擇【刪除】。

3.畫布的利用

上傳設計圖

經由過程藍湖 Ps 插件或 Sketch 插件一鍵上傳設計圖。（詳情請見插件教程）

移動設計圖

鼠標左鍵長按設計圖不放，可隨意移動；鼠標右鍵可框選多張設計圖，隨意拖拽移動。

移動設計圖之后，點擊畫布右下角“撤銷”圖標，即可撤銷操作。

框選設計圖

01.按住 Shift + 鼠標左鍵選擇多張設計圖， 02.鼠標右鍵拖拽可框選設計圖框選后，可以選左對齊、右對齊、居中對齊等主動對齊選項，擺列設計圖。

下載設計圖

選中需要下載的設計圖，右鍵菜單，即可下載該設計圖。

刪除設計圖
選中要刪除的設計圖，右鍵菜單，或利用快捷鍵 “delete” 鍵即可刪除該設計圖及其所有相關狀況頁、汗青版本、批注等內容。
刪除設計圖之后，點擊畫布右下角“撤銷”圖標，即可撤銷操作。
復制設計圖
選中需要復制的設計圖/文字卡片，右鍵菜單；或利用快捷鍵“ Ctrl / Cmd + C ”；即可復制該設計圖及其所有相關狀況頁、汗青版本、批注等內容/文字卡片。
設計圖重定名
選中需要重定名的設計圖，右鍵菜單，即可對該設計圖進行從頭定名。
設置項目封面
選中需要設置為項目封面的設計圖，右鍵菜單，即可將該設計圖設置為項目封面。
設計圖樹狀連線
鼠標左鍵別離點擊兩張設計圖，便可在它們中心繪制一條跳轉邏輯連線。
文字卡片
點擊畫布上方【＋】圖標，選擇【文字卡片】，或利用快捷鍵 “T”，單擊畫布空白處，即可建立“文字卡片”。文字卡片巨細可按照需求隨意調整。
搜刮設計圖
點擊畫布上方“搜刮”圖標，輸入設計圖名稱即可。
Ps：設計圖搜刮功能撐持拼音。
設計圖分組
點擊畫布左側東西欄【添加分組】，或利用快捷鍵“G”；點擊選摘要添加至分組的設計圖，然后【確定】輸入“分組名稱”，點擊【確定】即可。
編纂分組
點擊左側分組列表中，分組名稱旁邊的“編纂”按鈕，進入分組編纂模式；
①分組添加/刪減設計圖在畫布上，選擇放進分組的設計圖，即將設計圖添加至該分組；將本來選中的設計圖的“√”點失落，即將該設計圖移出該分組。
②點竄分組名稱點擊左上角分組名稱旁邊的“編纂”按鈕，輸入分組新名稱即可。
③點竄分組排序在左側分組列表中，鼠標左鍵選平分組名稱拖拽到合適位置。
④刪除分組點擊右上角的“刪除”按鈕即可刪除分組。
設計圖全覽
利用快捷鍵“F”，即可全覽畫布上所有的設計圖。
拖拽整塊畫布
鼠標左鍵長按畫布空白處，可快速拖拽畫布；
或長按“空格”鍵，進入抓手模式，點擊畫布肆意處所都可以拖拽畫布。
設計圖的狀況圖
我們經常會碰到統一頁面、但表示分歧環境的設計圖 (例如無收集、未登錄等狀況下)，我們把這些圖拖拽歸并為狀況圖，就可以年夜年夜處所便團隊理解和查看。
① 添加狀況圖把是狀況圖的設計圖拖拽至設計圖的上方籠蓋，即可生當作狀況圖，設計圖右側標簽可切換。
② 打消狀況圖拖拽肆意一個子標簽出來（非第一個耳朵）即可打消。
③ 刪除狀況圖選中右側標簽后，按“delete”即可刪除該狀況圖。
分享畫布
點擊右上角“分享按鈕”；
①選擇【畫布和標注】分享給團隊當作員，可查看標注、原型等項目內容；直接復制鏈/ 接，分享給團隊當作員即可。
②選擇【僅畫布】分享給客戶等團隊外部人員，僅可查看畫布內容；復制鏈/ 接及暗碼，分享給客戶等外部人員即可，他們無需插手團隊，每次經由過程暗碼查看。

4.上傳設計圖（Sketch 插件）

安裝主動標注插件

在項目畫布左側東西欄中，可下載藍湖 Sketch 插件，安裝當作功后，請重啟 Sketch。

登錄
打開 Sketch【Plugins】——【藍湖】上傳設計圖；利用快捷鍵“cmd + ctrl + E ” 上傳全數設計圖， “cmd + L ” 上傳所選設計圖。
輸入藍湖賬號、暗碼登錄；選擇設計圖對應的團隊與項目，點擊【確定】。
選擇當前設計尺寸的倍數
‘當前設計’選項是切圖縮放的基準。
例如： 750 的設計圖內有 100x100 px 的切圖，此時選 iOS@2x 上傳，在藍湖網頁上下載 @2x 的切圖獲得的成果是 100x100 px；若是上傳時選 iOS@1x 上傳，則網頁下載 @2x 的切圖成果為 200 x 200px。所以當前設計的選項必然要選擇準確，例子里的數值并不是固心猿意馬值，只是參考，以設計圖的設計倍率為準。
設置切圖
方式 ①：選中圖標后，點擊右下角【Make Exportable】；文件夾列表圖標上，會呈現一個切刀；至此切圖設置完當作。 ★注：此方式切圖導出后不包含透明邊距。
方式 ②：選中圖標后，點擊右下角【Make Exportable】，然后點擊上面的切刀按鈕；此時會在頁面上生當作一個“切圖區域”；這個切圖區域可自界說調整巨細，切圖區域的巨細就是最后導出時圖標的巨細。至此切圖設置完當作。 ★注：這種方式切出的圖片會帶有布景顏色，如想去除布景顏色，把你的圖標和切圖綁心猿意馬當作組，然后在右側東西欄將【Export group contents only】勾上即可。
方式③：（建議利用此方式）在東西欄內找到“切刀”東西，或利用快捷鍵“S”，可以在頁面內隨意建立、拖拽切圖規模（同方式二）；
切圖設置完當作后，無需導出，直接上傳設計稿，切圖會一并上傳，可供團隊當作員一鍵下載。
設計圖上傳
打開藍湖插件，可一鍵上傳當前 page 內全數的 Artboard，也可以上傳選中的 Artboard。

5.上傳設計圖（Photoshop 插件）

安裝主動標注插件

在項目畫布左側東西欄中，可下載藍湖 Ps 插件，安裝當作功后，請重啟 Photoshop 注：藍湖 Ps 插件僅撐持 Photoshop CC2015 及以上版本。

登錄
打開Ps【窗口】——【擴展功能】——【藍湖】；
輸入藍湖賬號、暗碼登錄；選擇設計圖對應的團隊與項目，點擊【確定】。
選擇當前設計尺寸的倍數
當前設計選項是切圖縮放的基準。
例如： 750的設計圖內有 100 x 100px 的切圖，此時選 iOS@2x 上傳，在藍湖網頁上下載 @2x 的切圖獲得的成果是 100x100px；若是上傳時選 iOS@1x 上傳，則網頁下載 @2x 的切圖成果為 200 x 200px。所以當前設計的選項必然要選擇準確，例子里的數值并不是固心猿意馬值，只是參考，以設計圖的設計倍率為準。
設置切圖
選中切圖的圖層，或圖層組，點擊【標為切圖】即可；
數值是可選的，若是不填數值，默認利用當前圖標內容的巨細；若是巨細不是本身想要的，可自界說點竄。
PS：不勾選“顯示切圖區域”即可埋沒切圖區域，該切圖區域埋沒后，不影響切圖的上傳。
設計圖上傳
選摘要上傳的畫板，也可選擇全數畫板（無畫板選全數畫板），點擊【上傳】即可。
設置好的切圖，會跟從頁面一同上傳至藍湖 Web 端，可看標注，并下載切圖。注：藍湖保舉利用 Ps 畫板東西，避免上傳的多張設計圖當作為設計圖的汗青版本，未便于今后的點竄更新。
快速上傳模式
快速上傳模式是 v2.38 版新增的上傳模式, 開啟后可以更快的上傳, 而且撐持矢量圖層生當作 SVG 格局的切圖,還能避免切圖不合錯誤應等不測環境發生。
01.打開: Photoshop 首選項-增效東西-啟用生當作器
02.在插件右上角的菜單中勾選"啟用快速上傳"
03.若是你有上傳 SVG 的需求, 可以開啟"導出 SVG", 若是不需要, 可以封閉它來晉升上傳速度.
生當作 SVG
切圖生當作 SVG 格局需要切圖是矢量的圖層, 如外形圖層和文本圖層, 智能對象不克不及生當作 SVG.

6.標注詳情頁

添加設計圖版本

需安裝藍湖 Ps 或 Sketch 插件，經由過程 Ps 或 Sketch 插件上傳設計圖后，如設計圖有點竄或更新，再次上傳會主動當作為最新版本，原設計圖主動當作為汗青版本。（設計圖上傳請見插件教程。）

給設計圖添加批注（含@當作員）

點擊設計圖詳情頁左側東西欄上“添加批注”圖標，或利用快捷鍵“N”，即可在設計圖上打點標識表記標幟，或框選區域標識表記標幟，并寫下響應批注，同時可 @ 項目當作員，被 @ 當作員會實時收到通知。

點竄/刪除批注

批注的點竄/刪除只有此批注建立者可以操作。點擊批注右上角“更多”按鈕，點擊“編纂”圖標可對批注進行點竄；點擊“刪除”圖標，即刪除此條批注。

查看批注
點擊設計圖詳情頁左側東西欄上“批注”圖標，即可查看該設計圖上所有的批注信息。
埋沒批注
點擊設計圖詳情頁左側東西欄上“顯示/埋沒批注”圖標，即可選擇是否顯示設計圖上批注信息。
狀況圖切換
在連線頁添加當作狀況圖，設計圖詳情頁左側標簽可切換。
查看設計圖標注
單擊設計圖肆意處所，即可打開設計圖標注信息面板，查看該設計圖肆意元素巨細、邊距、顏色等信息。單擊空白處，可封閉標注面板。
右側屬性區有【跳轉頁面】和【跳動彈畫】兩種屬性，便利查看設計圖標注。
PS. 點擊右上角【設置】，可選擇數值保留小數仍是取整顯示。
查看 Sketch 原型
在Sketch上建造的交互原型上傳到藍湖Web端后，在藍湖標注頁面可以查看跳轉邏輯；按住 Shift 鍵即會呈現【跳轉熱區】，鼠標左鍵點擊【跳轉熱區】跳轉至鏈接頁面。
切換標注單元
點擊標注面板右上方三角圖標，打開標注單元列表，按照需要選擇標注單元即可。
標注單元參看下圖，切換標注單元時，列表內著重顯示設計圖當前上傳尺寸。
復制標注信息
鼠標單擊標注數值即可主動復制。
切換顏色模式
可在標注面板上，經由過程點擊色塊來切換顏色模式：16進制、RGB、RGBA。
分享標注
點擊設計圖詳情頁左側東西欄中的“分/ 享”按鈕，復制鏈/ 接，即可分/ 享給團隊同事。
下載切圖
點擊切圖圖標，即可下載該圖標的多倍切圖；
點擊設計圖詳情頁左側東西欄中的“下載切圖”，可以一鍵下載本頁面所有的切圖，可以選擇多倍數。
PS. 點擊右上角【設置】，可以選擇埋沒切圖虛線框。

7.交互原型

建造跳轉交互動作

第一步：在設計圖上框選出跳轉區域，該區域巨細偏向可調節；第二步：將跳轉區域與跳轉頁面鏈接。

首頁設置
點擊左上方“設為首頁”圖標，即將本頁面的設計圖設置為原型肇端頁。
返回上一頁
若頁面 a、頁面 b、頁面 c、等多個頁面都可以跳轉至統一個頁面 e，則頁面 e 的返回鍵可直接鏈接到右側設計圖列表中的“返回上一頁”，即從哪個頁面進入，便返回至哪個頁面。
演示原型
點擊原型頁左側的“演示”按鈕，即可預覽并操作建造好的原型。
也可點擊右下方“在手機上預覽”，下載藍湖手機端 App，直接在手機上預覽和操作原型。
項目類型會影響演示原型的預覽，APP類型的項目預覽時會有手機邊框； Web類型的項目設計圖會直接平鋪展示。
分享原型
點擊原型預覽界面左側的“分享”按鈕，直接復制原型鏈/ 接，發送給同事，同事在電腦端、手機端都可以直接打開預覽和操作。
共享 Sketch 中繪制的原型
在 Sketch49（及以上版本）中做好的交互原型，經由過程藍湖插件上傳設計圖后，該 Sketch 中的原型會直接同步至藍湖。上傳設計圖后，點擊畫布上方“交互原型”圖標，即可查看 Sketch49 做好的交互原型。
可以直接在 PC 端演示原型、分享原型；也可以經由過程藍湖 APP 演示原型、分享原型。