跳至內容

【 GOSU 美研所 - 製作新年賀卡】教學步驟 【進階篇】

2026年10月1日 作者
設計部

進階篇


變更範本內容

延續【GOSU 美研所 - 製作新年賀卡】的變更教學,針對範本內容,根據三種變更情況,產生三個不同難易程度的變更教學!!

這裡會教大家怎麼變更裡面的素材內容,文案內容不做討論!

素材說明

容 易

直接使用範本,將推薦商品與優惠活動更換成自己的

❶ 點選【 GOSU 美研所 - 製作新年賀卡 】範本流程,進入優惠活動節點

❷ 將原先範本的圖片與卡片刪除

❸ 點擊對話視窗下方左二「插入圖片」後,點選「+上傳圖片」從電腦上傳優惠活動圖片

❹ 點擊對話視窗下方左三「插入卡片」後,點選「+建立新卡片」新增優惠活動卡片

卡片可編輯項目-

  • 卡片圖片:上傳一張 900*600 px 的商品圖,可選擇是否要放卡片圖!
  • 卡片標題、內容:和優惠活動相關敘述
  • 卡片按鈕:新增按鈕後,類型選擇「下一個流程」,並將按鈕文字、引導文字填寫成「看推薦商品」這類型的文字

*3 個優惠活動都要修改到喔!修改完成記得儲存變更!*

中 等

變更賀卡樣式

- 步驟 1 -

至圖像編輯器,變更賀卡樣式

❶ 前往圖像編輯器,點選「賀卡樣式 1 」,進入編輯

❷ 展開右側圖層欄位,可以看到在這張圖片上的素材,點擊賀卡底圖後展開下方圖片欄位,點圖片網址欄位後的上傳 icon(雲),從電腦上傳賀卡底圖

❸ 將「使用者上傳照片」圖層往上移,調整大小、位置,調整完成後,將「使用者上傳照片」圖層移到「賀卡底圖」圖層下面

新增、刪除、修改卡片上的文字大小、顏色、位置,這邊要注意的地方是綠色框框裡的文字不可被刪除,其他文字部分可以自行決定!

*賀卡樣式 2 、賀卡樣式 3 也是這樣更改喔!修改完成記得儲存變更!*

- 步驟 2 -

至流程編輯器,變更選擇賀卡的圖片

❶ 點選【 GOSU 美研所-製作新年賀卡】應用流程,進入選擇卡片樣式節點

❷ 將滑鼠移至賀卡樣式 1 卡片上方,右鍵選擇進入編輯卡片,將卡片圖片更改成新的賀卡樣式 1,標題與內容敘述也可更換成新的文案

      *「賀卡樣式 2 」、「賀卡樣式 3 」若有更改,卡片圖片也要更換喔!修改完成記得儲存變更!*

      困 難

      變更賀卡樣式與內容

      這裡會以「給度過糟糕 2020 的...」卡片作為示範

      卡片內容包含:2020 年度總結、2021 新希望、暱稱


      教學拆成三個部分進行

      PART1

      新增卡片樣式

      - 步驟1 -

      至圖像編輯器,新增賀卡

      ❶ 前往圖像編輯器,新增圖片,輸入新卡片名稱,建立完成後,點擊進入編輯

      ❷ 點選左上角,改變圖片寬度與長度

      ❸ 點選左側圖片 icon 後,至工作區拖拉出一個圖片區塊,展開右側圖片欄位,點擊圖片網址後面的上傳 icon(雲),從電腦上傳新卡片樣式圖

      ❹ 點選左側文字 icon 後,至工作區拖拉出 3 個文字區塊,分別為使用者輸入的「暱稱」、「 2020 年度總結」、「 2021 新希望」的預留位置


      - 步驟2 -

      進入資源,設定參數

      ❶ 點擊上方資源,設定文字區塊預設的參數

      ❷ 點擊新增參數後,填寫名稱、識別碼(僅限英文)、預設值,這裡要新增「暱稱/nickName/王小明」、「2020年度總結/before/多災多難,事事不順」、「2021新希望/hope/平安健康,可以快點出國玩」這三個!

      ❸ 完成後會得到三個設定好的項目參數,接著點擊上方編輯,回到卡片

      - 步驟 3 -

      將文字設定為程式碼

      這裡會使用到程式碼「${prop.識別碼}」

      ❶ 點擊最上方的 2020年度總結預留位置文字(滾滾長江東逝水)後,展開右側文字欄位,點擊文字內容後面的<>(撰寫一段程式碼),將滾滾長江東逝水刪除後,輸入「${prop.before}」

      ❷ 點擊中間的 2021新希望預留位置文字(滾滾長江東逝水)後,展開右側文字欄位,點擊文字內容後面的<>(撰寫一段程式碼),將滾滾長江東逝水刪除後,輸入「${prop.hope}」

      ❸ 點擊最下方的暱稱預留位置文字(滾滾長江東逝水)後,展開右側文字欄位,點擊文字內容後面的<>(撰寫一段程式碼),將滾滾長江東逝水刪除後,輸入「${prop.nickName}」

      ❹ 調整文字位置、顏色等樣式

        *修改完成記得儲存變更!若想新增其他卡片也是依照上方 3 個步驟製作!*

        PART 2

        新增好友屬性

        - 步驟 1 -

        至屬性管理,新增屬性

        ❶ 前往屬性管理,將原應用的「祝福的話」、「賀卡照片」、「我的暱稱」刪除

        ❷ 點擊好友旁的 ,新增屬性,進入後填寫屬性的中文及英文,這裡需要新增「暱稱/nickName」、「2020年度總結/before」、「2021新希望/hope」的屬性欄位

        *修改完成可以看到新增了 3 個好友屬性!*

        - 步驟 2 -

        至流程編輯器,設定屬性

        ❶ 點選【 GOSU 美研所-製作新年賀卡】應用流程,進入人的名字節點後面的設定屬性,先將原先應用的屬性刪除後,點擊「+新增設定動作」,在屬性欄位選擇「暱稱」

        ❷ 進入留言節點後面的設定屬性,將屬性欄位更換成「2020年度總結」

        ❸ 進入照片節點後面的設定屬性,將屬性欄位更換成「2021新希望」

        ❹ 進入讀取屬性,將原先應用的刪除,點「+新增讀取屬性」,新增「暱稱」、「2020年度總結」、「2021新希望」

        *文案請進入藍色節點更改喔!修改完成記得儲存變更!*

        PART 3

        更改流程內的卡片

        這裡以「賀卡樣式 2」作為示範

        - 步驟 1 -

        至流程編輯器,變更卡片

        這裡會使用到程式碼「 ${from.profile.propertyMap.英文屬性}」

        ❶ 點選【 GOSU 美研所-製作新年賀卡】應用流程,進入「賀卡樣式 2_合成卡片」節點

        ❷ 將原先應用的圖片刪除

        ❸ 點擊對話視窗下方左二「插入圖片」後,點「從圖像編輯器中篩選」,選擇新建的卡片樣式

        ❹ 將滑鼠移至圖片上右鍵點選「編輯範本細節」,將原先的預設值刪除,這裡要寫點小程式!

        預設值更改成程式碼-

        • 暱稱:${from.profile.propertyMap.nickName}
        • 2020年度總結:${from.profile.propertyMap.before}
        • 2021新希望:${from.profile.propertyMap.hope}

        這三個程式碼用來捕捉存放使用者輸入的內容!

        ❺ 進入賀卡樣式 2_合成卡片節點後的「分享及推薦商品」節點

        ❻ 將原先應用的圖片刪除

        ❼ 與上面 3、4 方法ㄧ樣,新增卡片與把預設值改成程式碼!這裡是使用者最後製作完成的卡片!

        - 步驟 2 -

        至流程編輯器,變更卡片

        ❶ 點選【 GOSU 美研所-製作新年賀卡】應用流程,進入「選擇卡片樣式節點」節點

        ❷ 將滑鼠移至賀卡樣式 2 上,右鍵進入編輯卡片

        ❸ 更換賀卡樣式 2 卡片的圖片,並改變文案敘述內容

        *修改完成記得儲存變更!*

        恭喜你,這樣就大功告成囉!!

        如果在 GOSU BAR 使用上有任何問題,歡迎到 GOSU BAR 右下角「GOSU 線上支援」,我們會有專人協助喔!

        提醒:若是體驗方案,將有 30 天試用期限制,如果想繼續使用,請升級成付費方案喔!

        還想知道更多變更內容教學嗎?

        >> 【GOSU美研所-製作新年賀卡】教學步驟基礎篇

        >> 【GOSU 美研所-肌膚檢測】教學步驟基礎篇

        >> 【 GOSU 美研所-內心特植測驗】教學步驟基礎篇

        GOSU BAR 支援中心立即填表預約諮詢