【TyranoBuilder 教學 #02】新增畫面特效 / 人物 / 圖片

更新於 發佈於 閱讀時間約 6 分鐘

此文章來自我的個人Blog - Space Of NingNing

這是第一篇的後續 , 在這篇文章裡我會繼續講完上一篇沒有寫到的按鍵們

第一篇可以點這裡進入

點這裡可以從 Steam 下載 TyranoBuilder

深藍色區域 ( Screen Effects ) 的工具 :

raw-image

Hide Screen — 加入 Hide Screen 的話畫面會黑掉直到你加入 Unhide Screen / 除了讓畫面黑掉外你也可以讓某個圖片蓋住螢幕

raw-image

改變 Duration 的時間可以拉長或縮短蓋住螢幕的過場特效的時間,過場的特效可以透過 Effect 來選擇

Color 可以用來選擇要用甚麼顏色蓋住螢幕 — 如果選擇了圖片就不能使用 Color 囉

Unhide Screen  —  取消擋住螢幕的指令,放上他之後之前用來擋住畫面的顏色或圖片就會消失拉

Blend Images - 加入一個顏色或是圖片在畫面上,他會被算做為 1 個圖層

如果選了圖片就不能使用 Color

Duration 是用來決定這個圖層出現的過場時長

定義圖片的 ID 之後就可以單獨刪除某個 blend 過的圖片囉

透過 Mode 可以選擇不同的模式來顯示圖層

raw-image

顏色畫面範例 :

範例 1 ( Overlay ) — 這裡我使用了紅色 :

raw-image

範例 2 ( Hue ):

raw-image

圖片範例 — 這裡我用了一張在森林的圖 :

raw-image

Blend Movies - 加入一段影片,你可以選擇播放 1 次或是無限 loop loop
 跟 Blend Images 的用法差不多,一樣有不同的模式 ( Mode ) 可以選擇也可以自訂影片的 ID

Undo Blend  — 刪掉之前加入的圖片或影片,如果在 set ID to Cancel 裡寫上特定的 ID 的話就會只刪掉那個 ID ( 那張圖片 / 影片)

如果沒有特別寫上 ID 的話就會把上面所有 Blend 過的圖片/影片刪掉

raw-image

範例:

raw-image

我這裡有 3 張圖片然後我在下面設了一個 Undo Blend  —  要取消的圖片是 ID 被設為 2 的圖片 — 呈現出來的畫面

黃色區域 ( Characters ) 的工具 :

raw-image

Join Scene — 讓某個之前建立過的角色登場

raw-image

沒有選擇 Character 的話會出現下面這個 Error 窩

raw-image

選了一個角色之後點入 Browse 就會出現角色的立繪拉 (( 你要先把立繪放到對應角色的資料夾裡面

用 Positioning Tool 可以把立繪用滑鼠放到想要的位置上也可以直接更改圖片的大小

raw-image

也可以更改 x/y Position 和 Width / Height 裡的數字來改變位置/大小

勾選 Flip Image 的話可以翻轉圖片

Exit Scene  —  讓某個之前登場過的角色退場

Change Expression  —  改變角色的表情  —  像是從開心變生氣之類的

Move Character - 可以改變角色站的位置

raw-image

Movement Effects 是 Enable 的話就會讓圖片有移動的感覺

有不同的 Effect 可以選擇((雖然我覺得每個看起來都差不多

raw-image

Exit All  —  這會讓所有在場的角色都退場

綠綠範圍 (Images) 的工具:



raw-image

Change Background  — 可以用他改變背景

raw-image

點一下 Browse 的按鈕就能進去到這個畫面

raw-image

在這裡你可以把要用的圖片拉進來然後就能使用了,如果圖片已經在專案裡了那你就可以點 2 下來確認使用那張圖片

Duration 會決定圖片的轉場要花多長的時間

點一下 Effect 會進入到這個清單你可以從這裡選一個想要的轉場

raw-image

Show Image  —  可以把一張圖片放到畫面上

raw-image

使用 Positioning Tool 可以方便的用滑鼠把圖片放到想要的位置上窩

Remove Image  — 可以把畫面上的圖片刪除

raw-image

只是貌似無法只消失一張圖片,放上 Remove Image 的話所有的圖片都會消失窩

Clickable Area-可以讓畫面上的某塊地方可以被選擇/點擊

raw-image

用這個超讚 Positioning Tool 可以在裡面劃出範圍的大小和用滑鼠把範圍拖到想要的位置上

raw-image

Location 和 Target 是必要的窩填了才能知道點了這個範圍後要跳到哪裡

ImageButton — 用圖片來當按鈕

raw-image

跟 Clickable Area 一樣需要指定 Location 和 Target 這樣 TyranoBuilder 才能知道點了這個按鈕後要跳到哪裡

也同樣的可以透過 Positioning Tool 來調整按鈕的位置/大小

一個我比較不滿意/可惜的地方是不能決定 Hover (當玩家把滑鼠移到按鈕的位置上時)的圖片或效果

— — — — — — — — — 分隔線 — — — — — — — — -

第二篇到這裡就差不多結束,第一篇可以點這裡

第三篇可以點這裡


其他連結:

我的 Twitter: @wSmileFlowerw

我的 Blog: Space Of NingNing

視覺小說 (Visual Novel) GUI 素材下載: Itch.io

在其他平台找到我 Space of NingNing

喜歡這篇文章的話 - 點個愛心, 留言或是為我拍手, 我都會很開心的 !

留言
avatar-img
留言分享你的想法!
avatar-img
SmileFlower的星球 ⭐ 歡迎入住~
56會員
115內容數
此沙龍呢,主要包含 Renpy 中文教學還有其他遊戲引擎 (專注於視覺小說引擎) 的教學。 歡迎想學自製遊戲的人加入! 除了遊戲製作的教學外也有一些我的生活上的各種事的分享,只想學製作遊戲的話就可以先忽略他們拉
2025/01/03
回顧2024年忙碌充實的一年,完成了畢業、考試、實習和接案等重要事項,並新增32篇教學、3個UI範本,參與2個Game Jam。2025年計畫完成未完成教學、製作教學影片,並考慮新增會員投稿教學。新年推出限時優惠方案,訂閱新年方案享對折優惠。
Thumbnail
2025/01/03
回顧2024年忙碌充實的一年,完成了畢業、考試、實習和接案等重要事項,並新增32篇教學、3個UI範本,參與2個Game Jam。2025年計畫完成未完成教學、製作教學影片,並考慮新增會員投稿教學。新年推出限時優惠方案,訂閱新年方案享對折優惠。
Thumbnail
2022/04/11
使用介面 這是你創建新的 scene 後會看到的畫面 右上方的工具列 : 從頭開始瀏覽你的專案 創建角色
Thumbnail
2022/04/11
使用介面 這是你創建新的 scene 後會看到的畫面 右上方的工具列 : 從頭開始瀏覽你的專案 創建角色
Thumbnail
2022/03/08
這篇文章是我在去年 (2021) 7月的時候寫的目前 TyranoBuilder 經過更新有改善很多問題 也加了一些新的東西/功能歡迎參考第二篇窩 原文來自我的 Blog - Space Of NingNing 我認為TyranoBuilder的優點和缺點, 簡單的小介紹還有推薦, 使用後的感想
Thumbnail
2022/03/08
這篇文章是我在去年 (2021) 7月的時候寫的目前 TyranoBuilder 經過更新有改善很多問題 也加了一些新的東西/功能歡迎參考第二篇窩 原文來自我的 Blog - Space Of NingNing 我認為TyranoBuilder的優點和缺點, 簡單的小介紹還有推薦, 使用後的感想
Thumbnail
看更多
你可能也想看
Thumbnail
每年4月、5月都是最多稅要繳的月份,當然大部份的人都是有機會繳到「綜合所得稅」,只是相當相當多人還不知道,原來繳給政府的稅!可以透過一些有活動的銀行信用卡或電子支付來繳,從繳費中賺一點點小確幸!就是賺個1%~2%大家也是很開心的,因為你們把沒回饋變成有回饋,就是用卡的最高境界 所得稅線上申報
Thumbnail
每年4月、5月都是最多稅要繳的月份,當然大部份的人都是有機會繳到「綜合所得稅」,只是相當相當多人還不知道,原來繳給政府的稅!可以透過一些有活動的銀行信用卡或電子支付來繳,從繳費中賺一點點小確幸!就是賺個1%~2%大家也是很開心的,因為你們把沒回饋變成有回饋,就是用卡的最高境界 所得稅線上申報
Thumbnail
全球科技產業的焦點,AKA 全村的希望 NVIDIA,於五月底正式發布了他們在今年 2025 第一季的財報 (輝達內部財務年度為 2026 Q1,實際日曆期間為今年二到四月),交出了打敗了市場預期的成績單。然而,在銷售持續高速成長的同時,川普政府加大對於中國的晶片管制......
Thumbnail
全球科技產業的焦點,AKA 全村的希望 NVIDIA,於五月底正式發布了他們在今年 2025 第一季的財報 (輝達內部財務年度為 2026 Q1,實際日曆期間為今年二到四月),交出了打敗了市場預期的成績單。然而,在銷售持續高速成長的同時,川普政府加大對於中國的晶片管制......
Thumbnail
重點摘要: 6 月繼續維持基準利率不變,強調維持高利率主因為關稅 點陣圖表現略為鷹派,收斂 2026、2027 年降息預期 SEP 連續 2 季下修 GDP、上修通膨預測值 --- 1.繼續維持利率不變,強調需要維持高利率是因為關稅: 聯準會 (Fed) 召開 6 月利率會議
Thumbnail
重點摘要: 6 月繼續維持基準利率不變,強調維持高利率主因為關稅 點陣圖表現略為鷹派,收斂 2026、2027 年降息預期 SEP 連續 2 季下修 GDP、上修通膨預測值 --- 1.繼續維持利率不變,強調需要維持高利率是因為關稅: 聯準會 (Fed) 召開 6 月利率會議
Thumbnail
這篇文章分享了一個感覺高科技的AVG製作工具,詳細介紹了TyranoBuilder和TyranoScript之間的區別,並提到了自己對於文字 + 選項的AVG玩法的看法。
Thumbnail
這篇文章分享了一個感覺高科技的AVG製作工具,詳細介紹了TyranoBuilder和TyranoScript之間的區別,並提到了自己對於文字 + 選項的AVG玩法的看法。
Thumbnail
今天的教學要來教各位如何使用類似畫面崩壞的特效如果希望重複破損特效的話可以在圖片定義的最後加上:如果你不想一張一張圖片定義的話也可以使用以下的方式使用該特效如果是背景圖片的話你可以如果是立繪圖片的話你可以注意使用第一種方式 一張一張圖片定義以外的方式的話 崩壞的特效是不會動的窩 會維持同樣的外觀
Thumbnail
今天的教學要來教各位如何使用類似畫面崩壞的特效如果希望重複破損特效的話可以在圖片定義的最後加上:如果你不想一張一張圖片定義的話也可以使用以下的方式使用該特效如果是背景圖片的話你可以如果是立繪圖片的話你可以注意使用第一種方式 一張一張圖片定義以外的方式的話 崩壞的特效是不會動的窩 會維持同樣的外觀
Thumbnail
Tyranobuilder中文介紹教學 這是第一篇的後續 , 在這篇文章裡我會繼續講完上一篇沒有寫到的按鍵們 點這裡可以從 Steam 下載 TyranoBuilder 深藍色區域 ( Screen Effects ) 的工具 : 顏色畫面範例 :
Thumbnail
Tyranobuilder中文介紹教學 這是第一篇的後續 , 在這篇文章裡我會繼續講完上一篇沒有寫到的按鍵們 點這裡可以從 Steam 下載 TyranoBuilder 深藍色區域 ( Screen Effects ) 的工具 : 顏色畫面範例 :
Thumbnail
這篇,是延續之前的視覺筆記創作出的圖解版 那就廢話不多說,直接看圖吧 更多視覺筆記、圖像思維知識或疑問,歡迎加入圖像思維研究室提問喔 https://line.me/ti/g2/Vo4qwpJiOjsKe8c29jpnAQ
Thumbnail
這篇,是延續之前的視覺筆記創作出的圖解版 那就廢話不多說,直接看圖吧 更多視覺筆記、圖像思維知識或疑問,歡迎加入圖像思維研究室提問喔 https://line.me/ti/g2/Vo4qwpJiOjsKe8c29jpnAQ
Thumbnail
Step1. 開啟範例練習檔,新增圖層1填入白色,複選白色與文字圖層並合併圖層,執行『濾鏡 > 模糊 > 高斯模糊』設定強度:4像素。 Step2. 執行『影像 > 調整 > 色階』調整左右控制點至中央,讓文字邊緣模糊部分實體化,使用魔術棒工具選到所有文字內容,新增空白霓虹燈圖層,執行『編輯 >
Thumbnail
Step1. 開啟範例練習檔,新增圖層1填入白色,複選白色與文字圖層並合併圖層,執行『濾鏡 > 模糊 > 高斯模糊』設定強度:4像素。 Step2. 執行『影像 > 調整 > 色階』調整左右控制點至中央,讓文字邊緣模糊部分實體化,使用魔術棒工具選到所有文字內容,新增空白霓虹燈圖層,執行『編輯 >
Thumbnail
STEP1. 開啟範例練習檔,按住Ctrl滑鼠點取文字圖層建立文字選取區,按下色版控制版下方『儲存選取範圍成為色版』按鈕,將選取區儲存為Alpha 1,Ctrl+D取消選取。 Step2. 回到圖層控制版,在文字圖層上執行 [ 濾鏡 > 模糊 > 高斯模糊 ] 強度:5 像素,按住Ctrl滑鼠點
Thumbnail
STEP1. 開啟範例練習檔,按住Ctrl滑鼠點取文字圖層建立文字選取區,按下色版控制版下方『儲存選取範圍成為色版』按鈕,將選取區儲存為Alpha 1,Ctrl+D取消選取。 Step2. 回到圖層控制版,在文字圖層上執行 [ 濾鏡 > 模糊 > 高斯模糊 ] 強度:5 像素,按住Ctrl滑鼠點
Thumbnail
【檢視範例】【下載範例】 目標動畫效果:應用影片片段元件與傳統補間動畫,以及遮色片動畫表現產品出現效果,再搭配形狀補間動畫的遮色片技巧,細膩表現產品的動態呈現。 使用動畫技巧:影片片段元件、傳統補間動畫、形狀補間動畫、遮色片動畫。 Step1. 範例檔元件庫中包含了所有將進行動畫的元件(直接由
Thumbnail
【檢視範例】【下載範例】 目標動畫效果:應用影片片段元件與傳統補間動畫,以及遮色片動畫表現產品出現效果,再搭配形狀補間動畫的遮色片技巧,細膩表現產品的動態呈現。 使用動畫技巧:影片片段元件、傳統補間動畫、形狀補間動畫、遮色片動畫。 Step1. 範例檔元件庫中包含了所有將進行動畫的元件(直接由
Thumbnail
【檢視範例】【下載範例】 目標動畫效果:應用影片片段元件與傳統補間動畫,以及遮色片動畫技巧,表現金屬框與文字的光澤效果。 使用動畫技巧:影片片段元件、傳統補間動畫、遮色片動畫。 Step1. 範例檔元件庫中包含文字、圓與漸層光三元件。點取場景上文字元件並複製,新增圖層,於圖層上原地貼上文字元件
Thumbnail
【檢視範例】【下載範例】 目標動畫效果:應用影片片段元件與傳統補間動畫,以及遮色片動畫技巧,表現金屬框與文字的光澤效果。 使用動畫技巧:影片片段元件、傳統補間動畫、遮色片動畫。 Step1. 範例檔元件庫中包含文字、圓與漸層光三元件。點取場景上文字元件並複製,新增圖層,於圖層上原地貼上文字元件
Thumbnail
這次我們要說到遊戲經常使用到的圖片指令系列。在不使用插件的情況下也可以使用來做對話框背景或是立繪顯示。
Thumbnail
這次我們要說到遊戲經常使用到的圖片指令系列。在不使用插件的情況下也可以使用來做對話框背景或是立繪顯示。
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News