1
00:00:04,300 --> 00:00:05,380
‫สวัสดีและยินดีต้อนรับ.

2
00:00:05,380 --> 00:00:05,770
‫การบรรยายครั้งนี้.

3
00:00:05,770 --> 00:00:10,780
‫เราจะดูว่าเราจะใช้กราฟแอนิเมชันของพิมพ์เขียวแอนิเมชันได้อย่างไร

4
00:00:10,780 --> 00:00:17,830
‫แนวคิดใหม่ทั้งหมด แนวคิดใหม่ทั้งหมดเพื่อผสมผสานแอนิเมชั่นเข้าด้วยกันโดยใช้ชุดตัวแปร

5
00:00:17,830 --> 00:00:19,270
‫อย่างที่คุณเห็น ฉันกำลังเปลี่ยนตัวแปร

6
00:00:19,270 --> 00:00:21,700
‫มันเปลี่ยนการผสมผสานของแอนิเมชั่น

7
00:00:21,700 --> 00:00:24,220
‫มาดูกันว่ามันทำงานอย่างไร

8
00:00:25,380 --> 00:00:27,690
‫ดังนั้นเราจึงมีแอนิเมชั่นที่คล้ายคลึงกันที่นี่

9
00:00:27,690 --> 00:00:30,030
‫แต่เห็นได้ชัดว่ามันไม่ไดนามิก

10
00:00:30,030 --> 00:00:32,130
‫มันไม่น่าสนใจเป็นพิเศษ

11
00:00:32,130 --> 00:00:38,670
‫เราต้องสามารถสร้างแอนิเมชั่นที่ซับซ้อนกว่านี้ได้ และ Unreal มีระบบที่ยอดเยี่ยมมากมายในการทำเช่นนี้

12
00:00:38,670 --> 00:00:45,750
‫สิ่งสำคัญคือพิมพ์เขียวแอนิเมชั่น ซึ่งเป็นพิมพ์เขียวอย่างเห็นได้ชัด

13
00:00:45,750 --> 00:00:51,420
‫ดังนั้นเราจะไม่ทำสิ่งนี้ใน C++ เพราะแอนิเมชั่นเหมาะสมที่จะทำในพิมพ์เขียว

14
00:00:51,660 --> 00:01:00,480
‫และประเด็นหลักของพิมพ์เขียวแอนิเมชั่นคือการนำตรรกะของแอนิเมชั่นทั้งหมดมารวมกัน และช่วยให้เราสามารถผสมผสานและผสานและสลับไปมาระหว่างแอนิเมชันต่างๆ

15
00:01:00,480 --> 00:01:10,470
‫เพื่อให้ตรรกะในเกมของเราสามารถขับเคลื่อนพิมพ์เขียวแอนิเมชั่นนั้นได้

16
00:01:10,620 --> 00:01:15,150
‫เพื่อไม่ให้เป็นการเสียเวลา เรามาลองสร้างพิมพ์เขียวแอนิเมชั่นกัน

17
00:01:15,150 --> 00:01:27,780
‫ดังนั้นในเบราว์เซอร์เนื้อหา เพิ่มใหม่หรือคลิกขวาแล้วเราจะไปที่แอนิเมชั่นและเลือกพิมพ์เขียวแอนิเมชั่นที่นี่และคุณจะเห็นได้ทันทีว่าค้างคาวกำลังขอให้เราอาจมีคลาสผู้ปกครอง

18
00:01:27,780 --> 00:01:28,830
‫เราไม่ต้องการชั้นเรียนผู้ปกครอง

19
00:01:28,830 --> 00:01:30,060
‫เราสามารถใช้ค่าเริ่มต้นได้

20
00:01:30,060 --> 00:01:39,600
‫แต่มันไม่จำเป็นต้องมีโครงกระดูกเพราะเหมือนอนิเมชั่น เหมือนกับโครงตาข่าย พวกเขาทั้งคู่พึ่งพาโครงกระดูก

21
00:01:39,600 --> 00:01:44,880
‫พิมพ์เขียวแอนิเมชั่นก็เช่นกัน ซึ่งหมายความว่าจากนั้นก็สามารถใช้แอนิเมชั่นทั้งหมดของโครงกระดูกนั้นได้

22
00:01:44,880 --> 00:01:48,390
‫และสามารถนำไปใช้กับเมชที่เกี่ยวข้องกับโครงกระดูกนั้นได้

23
00:01:48,930 --> 00:01:55,740
‫เห็นได้ชัดว่าเราต้องการโครงกระดูกเจตภูตที่นี่ มาเลือกกัน แล้วคลิก ตกลงไหม

24
00:01:55,740 --> 00:02:00,720
‫และนั่นจะดำเนินต่อไปและสร้างพิมพ์เขียวแอนิเมชั่นตามโครงกระดูกเจตภูต

25
00:02:00,720 --> 00:02:09,150
‫จากนั้นสำหรับการตั้งชื่อแบบแผน เราเริ่มต้นด้วยขีดล่างของ BP และฉันจะเรียกสิ่งนี้ว่าตัวละคร Just Shooter โดยพื้นฐานแล้ว

26
00:02:09,150 --> 00:02:12,060
‫เพราะเรามีคำนำหน้าที่แตกต่างกันนั้น

27
00:02:12,060 --> 00:02:16,200
‫ฉันคิดว่ามันชัดเจนเพียงพอแล้วที่มันเป็นพิมพ์เขียวแอนิเมชั่นสำหรับการถ่ายทำตัวละคร

28
00:02:16,200 --> 00:02:23,760
‫ดังนั้นถ้าเราเปิดพิมพ์เขียวแอนิเมชั่นนั้นและต่อเข้ากับหน้าต่างหลัก เราจะเห็นตัวแก้ไขพิมพ์เขียวแอนิเมชั่น

29
00:02:23,760 --> 00:02:29,880
‫ซึ่งดูคล้ายกับตัวแก้ไขพิมพ์เขียวปกติของคุณในหลายๆ ด้าน

30
00:02:29,880 --> 00:02:35,250
‫มันมีพื้นที่กราฟหลักอยู่ตรงกลาง แต่ต่างกันในบางแง่มุม

31
00:02:35,250 --> 00:02:37,680
‫เราก็ได้พื้นที่กราฟที่ใกล้เคียงกัน

32
00:02:37,680 --> 00:02:39,870
‫นี่เป็นกราฟที่ต่างไปจากเดิมเล็กน้อย

33
00:02:39,870 --> 00:02:41,010
‫เรียกว่าแอนิเมชั่นกราฟ

34
00:02:41,010 --> 00:02:44,610
‫คุณจะเห็นว่ามีกราฟเหตุการณ์เหมือนกับพิมพ์เขียวปกติของคุณ

35
00:02:44,610 --> 00:02:47,430
‫พวกเขามีกราฟเหตุการณ์ แต่ก็มีบางอย่างที่เรียกว่ากราฟแอนิเมชัน

36
00:02:47,430 --> 00:02:48,720
‫เราจะไปที่นั้นในไม่กี่วินาที

37
00:02:48,960 --> 00:02:53,670
‫มีบานหน้าต่างรายละเอียดที่ให้รายละเอียดเกี่ยวกับพิมพ์เขียวแอนิเมชั่น

38
00:02:53,670 --> 00:02:56,010
‫ตัวชั้นเรียนเอง คุณมีรายละเอียดเกี่ยวกับเรื่องนั้นแล้ว

39
00:02:56,580 --> 00:02:59,490
‫สังเกตว่า เราไม่มีส่วนประกอบใดๆ เทียบกับพิมพ์เขียวแอนิเมชั่น

40
00:02:59,490 --> 00:03:01,890
‫นั่นคือความแตกต่างที่ควรทราบอยู่แล้ว

41
00:03:01,890 --> 00:03:08,670
‫เรามีตัวแก้ไขการแสดงตัวอย่างแบบเคลื่อนไหว ซึ่งช่วยให้เราสามารถทำบางสิ่งกับหน้าต่างแสดงตัวอย่างนี้ได้ที่นี่

42
00:03:08,670 --> 00:03:10,560
‫เหตุใดจึงไม่สนิทกันโดยปริยาย

43
00:03:10,560 --> 00:03:11,310
‫ฉันไม่รู้.

44
00:03:11,940 --> 00:03:17,940
‫บราวเซอร์แอสเซท เช่นเดียวกับแอนิเมชั่นที่ช่วยให้เรามองผ่านแอนิเมชั่นที่นำเข้ามาในเอดิเตอร์ของเราได้อย่างง่ายดาย

45
00:03:17,940 --> 00:03:26,190
‫และที่นี่ที่ด้านบนขวาอีกครั้ง เช่นเดียวกับแอนิเมชั่นและเมช เรามีมุมมองนี้ที่ช่วยให้เราสลับไปมาระหว่างสเกเลตันได้อย่างรวดเร็ว

46
00:03:26,190 --> 00:03:35,850
‫ตาข่ายและแอนิเมชั่นและพิมพ์เขียวที่ทั้งหมดขึ้นอยู่กับโครงกระดูกเดียวกันนั้น

47
00:03:36,490 --> 00:03:42,550
‫จากนั้นที่ด้านล่างซ้าย เรามีบานหน้าต่างพิมพ์เขียวของฉัน ซึ่งเหมือนกับพิมพ์เขียวของฉันมาก

48
00:03:42,550 --> 00:03:48,300
‫บนพิมพ์เขียวมาตรฐานของคุณ คุณมีฟังก์ชัน ตัวแปร มาโคร อะไรทำนองนั้นเหมือนกัน

49
00:03:48,310 --> 00:03:49,240
‫ต่างกันอย่างไร?

50
00:03:49,240 --> 00:03:50,470
‫อ้อ เรามีกราฟด้วย

51
00:03:50,470 --> 00:03:51,250
‫นั่นก็เหมือนกัน

52
00:03:51,250 --> 00:03:54,970
‫แต่สิ่งที่แตกต่างคือกราฟแอนิเมชั่นและเลเยอร์แอนิเมชั่น

53
00:03:54,970 --> 00:03:57,190
‫ตอนนี้เราจะไม่แตะต้องเลเยอร์ของแอนิเมชันจริงๆ

54
00:03:57,190 --> 00:03:59,230
‫นั่นเป็นคุณลักษณะขั้นสูงอีกเล็กน้อยที่เราไม่ต้องการ

55
00:03:59,230 --> 00:04:06,100
‫แต่กราฟ นั่นคือสิ่งที่สำคัญมากจริงๆ เพราะกราฟเป็นเหมือนพิมพ์เขียว ยกเว้นว่าเราไม่มีโหนดการดำเนินการ

56
00:04:06,130 --> 00:04:13,570
‫หรือเราได้ข้อมูลที่ไหลผ่านกราฟแล้วอะไรไหลผ่านกราฟ

57
00:04:13,570 --> 00:04:21,040
‫โดยพื้นฐานแล้ว เรากำลังพยายามดึงเอาท์พุตนี้ โพสท่าแอนิเมชั่นเอาท์พุตที่เราควรจำลองตัวละครของเราเป็น

58
00:04:21,370 --> 00:04:25,900
‫และเราทำได้โดยเชื่อมต่อโหนดต่างๆ มากมายกับโหนดผลลัพธ์นี้

59
00:04:25,900 --> 00:04:31,330
‫และเมื่อผ่านมันไป เราก็ได้ข้อมูลที่เป็นผลลัพธ์ของเรา

60
00:04:31,720 --> 00:04:38,230
‫เอาต์พุตง่ายๆ อย่างหนึ่งที่เราสามารถทำได้คือ ตัวอย่างเช่น เพียงลากภาพเคลื่อนไหวลงในกราฟแอนิเมชันนี้

61
00:04:38,230 --> 00:04:44,350
‫คุณจะเห็นว่าสร้างโหนดและมีพินเอาต์พุต ซึ่งเป็นท่าทางแอนิเมชัน

62
00:04:44,350 --> 00:04:54,310
‫และถ้าเราลากท่านั้นไปที่ท่าส่งออกและกดคอมไพล์ คุณจะเห็นว่ามันจะแสดงในตัวอย่างของเราว่าพิมพ์เขียวแอนิเมชั่นนี้ทำอะไร

63
00:04:54,310 --> 00:05:06,880
‫โดยพื้นฐานแล้วมันก็แค่เล่นแอนิเมชั่นความสามารถนี้ และนั่นคือสิ่งที่เรากำลังทำอยู่ในขณะนี้ ยกเว้นตอนนี้ เราได้เพิ่มเลเยอร์พิเศษเข้าไประหว่างที่เราใส่พิมพ์เขียวแทนที่จะเล่นอนิเมชั่นโดยตรง

64
00:05:06,880 --> 00:05:14,560
‫นั่นไม่ได้มีประโยชน์อย่างยิ่งในตัวมันเอง แต่การดำเนินการประเภทต่างๆ ที่เราสามารถทำได้ในท่าเหล่านี้

65
00:05:14,560 --> 00:05:16,000
‫ตอนนี้มีประโยชน์

66
00:05:16,000 --> 00:05:19,570
‫หากเราคลิกขวาในกราฟแอนิเมชัน คุณจะเห็นว่ามีหลายอย่างเกิดขึ้นที่นี่

67
00:05:19,750 --> 00:05:26,440
‫ฉันต้องการค้นหาสิ่งที่เรียกว่าการผสมผสาน และมีสิ่งที่แตกต่างกันสองสามอย่างในที่นี้

68
00:05:26,440 --> 00:05:30,580
‫ลองดูว่าฉันสามารถหาอันที่มีประโยชน์มากที่สุดที่เราต้องการได้ที่ด้านบนหรือไม่

69
00:05:30,610 --> 00:05:36,430
‫มีบางอย่างที่นี่ ฉันคิดว่าผสมผสาน ผสมผสานกระดูก โดยช่อง ผสมผสานหลาย

70
00:05:36,430 --> 00:05:38,800
‫เราต้องการเพียงโหนดผสมมาตรฐาน

71
00:05:38,800 --> 00:05:39,760
‫เข้าเรื่องกันเลย

72
00:05:40,090 --> 00:05:45,580
‫และคุณจะเห็นว่าเรามีค่าแล้ว เรามีอินพุต 2 แบบและเอาต์พุต 1 แบบ

73
00:05:45,580 --> 00:05:49,450
‫สิ่งที่เราทำได้คือเราสามารถลากแอนิเมชั่นสองแบบที่แตกต่างกันได้

74
00:05:50,100 --> 00:05:52,040
‫และเราสามารถติดมันได้

75
00:05:52,050 --> 00:05:53,490
‫อันนี้เป็นแอนิเมชั่นเสริม

76
00:05:53,490 --> 00:05:54,540
‫ฉันไม่ต้องการที่จะนำสิ่งนั้นเข้ามา

77
00:05:54,540 --> 00:05:55,880
‫นั่นจะทำให้เราสับสน

78
00:05:55,890 --> 00:05:58,560
‫ลองใช้แอนิเมชั่นที่เราอาจใช้กันจริงๆ

79
00:05:58,560 --> 00:06:01,920
‫ดังนั้นเราจึงมองไปที่การเคลื่อนไหวไปข้างหน้า

80
00:06:01,920 --> 00:06:02,760
‫เรามีจ็อกกิ้ง

81
00:06:02,760 --> 00:06:06,030
‫การวิ่งจ็อกกิ้งอาจเป็นสิ่งที่เราต้องการมากกว่าการเดิน

82
00:06:06,030 --> 00:06:09,360
‫มาดูการวิ่งจ็อกกิ้งของเรากันก่อนดีกว่า

83
00:06:09,360 --> 00:06:15,900
‫นั่นอาจเป็นสิ่งหนึ่งที่เราสามารถผสมผสานและอีกสิ่งหนึ่งที่เราสามารถผสมผสานได้ก็คือการเขย่าเบา ๆ

84
00:06:15,900 --> 00:06:23,700
‫ลองมองหาการเขย่าเบา ๆ และเราได้ jog, jog b ซึ่งฉันคิดว่าย่อมาจาก Backwards, Forward, Backwards

85
00:06:23,970 --> 00:06:28,470
‫ลองนำสิ่งเหล่านี้มาสู่ Blend Node ของเราแล้วส่งออกและดูว่าผลลัพธ์จะเป็นอย่างไร

86
00:06:28,470 --> 00:06:35,880
‫เมื่อฉันกดคอมไพล์ คุณจะเห็นว่าฉันกำลังวิ่งไปข้างหน้าถ้าฉันติดอัลฟ่าของฉันไปที่หนึ่งแล้วคอมไพล์ใหม่

87
00:06:35,880 --> 00:06:42,750
‫คุณจะเห็นได้ว่าตอนนี้ฉันกำลังวิ่งถอยหลัง และคุณสามารถเห็นได้ในขณะที่การแสดงตัวอย่างทำงาน คุณสามารถดูได้ว่าโหนดใดที่ซึ่งข้อมูลไหลโดยทั่วไปจากการเขย่าเบา

88
00:06:42,990 --> 00:06:50,310
‫ๆ ย้อนกลับผ่านโหนดผสม และไม่มีอะไรผ่านมาทางพินนั้น

89
00:06:50,340 --> 00:06:53,430
‫A เพราะอัลฟ่าผสมผสานระหว่างทั้งสอง

90
00:06:54,030 --> 00:07:00,720
‫ตอนนี้ฉันทำ 0 ได้แล้ว 5 บนอัลฟ่าหรือที่ใดก็ได้ในระหว่างนั้น และนั่นจะเป็นการลองเล่นอนิเมชั่นทั้งสองและจัดวางซ้อนทับกัน

91
00:07:00,720 --> 00:07:03,840
‫ครึ่งหนึ่งของทั้งสองอนิเมชั่น

92
00:07:03,840 --> 00:07:09,330
‫และแน่นอนว่าเมื่อคุณต้องวิ่งจ็อกกิ้งไปข้างหน้าและข้างหลังในเวลาเดียวกัน นั่นเริ่มจะดูตลกหน่อยๆ

93
00:07:09,330 --> 00:07:10,740
‫ใช่ไหม

94
00:07:10,740 --> 00:07:17,190
‫สิ่งที่ฉันจะทำตอนนี้คือ ฉันจะลบการเขย่าเบา ๆ ไปข้างหลังแล้วใส่แอนิเมชั่นที่ไม่ได้ใช้งานแทน

95
00:07:17,460 --> 00:07:19,530
‫แล้วเราว่างตรงไหน?

96
00:07:21,620 --> 00:07:24,890
‫ฉันจะเลือกการต่อสู้ที่ไม่ได้ใช้งานและนำมาไว้ที่นี่

97
00:07:25,520 --> 00:07:31,200
‫ดังนั้นตอนนี้สิ่งที่ควรเกิดขึ้นคือถ้าเราอยู่ที่ 50% ก็เหมือนกับการอยู่เฉยๆ ไม่ใช่การต่อสู้

98
00:07:31,220 --> 00:07:34,880
‫ครึ่งหนึ่งหรือครึ่งหนึ่งแล้วเขย่าเบา ๆ ครึ่งหนึ่ง

99
00:07:34,880 --> 00:07:38,870
‫ในขณะที่ถ้าฉันใส่มันเข้าไป มันจะทำได้ 100%

100
00:07:39,540 --> 00:07:40,200
‫ไม่ได้ใช้งาน

101
00:07:41,250 --> 00:07:41,910
‫ศูนย์.

102
00:07:41,940 --> 00:07:44,040
‫มันจะวิ่งจ๊อกกิ้ง 100%

103
00:07:44,520 --> 00:07:47,280
‫ตอนนี้มันไม่เหมาะ

104
00:07:47,280 --> 00:07:49,950
‫ความจริงที่ว่าฉันเปลี่ยนอัลฟ่านี้ไปเรื่อย ๆ ต้องคอมไพล์ใหม่

105
00:07:49,950 --> 00:07:53,490
‫สิ่งที่เราทำได้คือเพิ่มตัวแปรลงในพิมพ์เขียวของเรา

106
00:07:53,490 --> 00:08:00,780
‫ต้องเป็นทศนิยมเพื่อให้เราสามารถไปข้างหน้าและเปลี่ยนประเภทตัวแปรในบานหน้าต่างรายละเอียดให้ลอยได้

107
00:08:01,050 --> 00:08:05,730
‫และฉันจะเปลี่ยนนี่เพื่อผสมปริมาณ

108
00:08:06,870 --> 00:08:18,630
‫จากนั้นเราสามารถลากเข้าไปเพื่อลากตัวแปรใดๆ จากพิมพ์เขียวของเราไปยังกราฟแอนิเมชันและเชื่อมต่อกับพินบางตัวที่ตีคอมไพล์

109
00:08:18,630 --> 00:08:21,360
‫และตอนนี้เรากลับไปที่ตัวแก้ไขตัวอย่างแอนิเมชันของเรา

110
00:08:21,360 --> 00:08:23,100
‫คุณจะเห็นว่ามันปรากฏขึ้น

111
00:08:23,100 --> 00:08:26,370
‫ตัวแปรเหล่านี้แบบที่เราได้สร้างไว้ตรงนี้คือปริมาณการผสม

112
00:08:26,520 --> 00:08:35,160
‫และนั่นหมายความว่าตอนนี้ถ้าฉันสามารถเปลี่ยนมันได้ในขณะรันไทม์ ฉันสามารถดูและดูตัวอย่างว่าจะเกิดอะไรขึ้น

113
00:08:35,160 --> 00:08:40,470
‫แล้วโดยพื้นฐานแล้ว สิ่งที่จะเกิดขึ้นคือเกมของเราจะขับเคลื่อนตัวแปรเหล่านี้ในพิมพ์เขียวแอนิเมชั่นเพื่อให้ได้แอนิเมชั่นที่เหมาะสม

114
00:08:40,470 --> 00:08:46,830
‫ณ จุดใดจุดหนึ่งระหว่างการเล่น

115
00:08:46,860 --> 00:08:50,580
‫นั่นคือสิ่งที่เราจะจัดการกับในภายหลังในส่วนนี้

116
00:08:50,580 --> 00:08:57,480
‫แต่สำหรับตอนนี้ เราจะพยายามทำให้แอนิเมชั่นนี้ดูถูกต้องเมื่อเรามีตัวแปรที่เหมาะสมในนี้

117
00:08:58,790 --> 00:09:00,610
‫ดังนั้นถึงเวลาสำหรับความท้าทายเล็กน้อย

118
00:09:00,620 --> 00:09:06,730
‫ดูว่าคุณสามารถตั้งค่าพิมพ์เขียวแอนิเมชั่นและเล่นกับกราฟแอนิเมชันได้หรือไม่

119
00:09:06,740 --> 00:09:09,050
‫ดังนั้นฉันต้องการให้คุณเพิ่มส่วนผสมอื่น

120
00:09:09,050 --> 00:09:11,000
‫เราจะบวกมันตามลำดับ

121
00:09:11,000 --> 00:09:12,800
‫ขั้นแรกคุณจะต้องทำการผสมผสาน

122
00:09:12,800 --> 00:09:18,020
‫เอาท์พุตจะเข้าสู่อินพุตของเบลนด์ถัดไป จากนั้นเลือกแอนิเมชั่นที่เหมาะสม เช่น

123
00:09:18,020 --> 00:09:25,580
‫เลื่อนไปทางขวาหรือซ้าย และเพิ่มตัวแปรบางตัวที่เหมาะสมด้วย เพื่อให้คุณปรับแต่งและดูตัวอย่างได้ สามารถผสมผสานระหว่างอนิเมชั่นทั้งหมด

124
00:09:25,580 --> 00:09:31,430
‫การไม่ใช้งาน การเคลื่อนไปข้างหน้า และแอนิเมชั่นที่คุณเลือกได้ ไม่ว่าจะเป็นการเคลื่อนไหวทางซ้ายหรือทางขวา

125
00:09:31,430 --> 00:09:36,140
‫อะไรทำนองนั้น

126
00:09:36,320 --> 00:09:37,940
‫หยุดวิดีโอชั่วคราวและไปกันเลย

127
00:09:37,940 --> 00:09:41,690
‫เพียงแค่เล่นกับส่วนผสมเหล่านี้ ดูว่าคุณสามารถทำความเข้าใจกับกราฟแอนิเมชันได้หรือไม่

128
00:09:43,170 --> 00:09:43,980
‫เฮ้ ยินดีต้อนรับกลับมา

129
00:09:44,010 --> 00:09:46,160
‫ดังนั้นหวังว่าคุณจะได้ไปสักหน่อย

130
00:09:46,170 --> 00:09:48,960
‫เรากำลังจะไปและเพิ่มโหนดผสมอื่น

131
00:09:48,960 --> 00:09:51,630
‫ดังนั้นให้ค้นหาการผสมผสานแล้วเลื่อนขึ้น

132
00:09:51,630 --> 00:09:54,470
‫ด้วยเหตุผลบางอย่างซึ่งอาจเกี่ยวข้องกับการปรับขนาดหน้าจอของฉัน

133
00:09:54,480 --> 00:09:58,260
‫ไปที่การผสมผสานและนำมาซึ่ง

134
00:09:58,290 --> 00:10:00,270
‫ดูภาพเคลื่อนไหวที่ไม่ได้ใช้งานเหล่านี้หรือไม่

135
00:10:00,270 --> 00:10:01,140
‫ฉันต้องการทำอะไร?

136
00:10:01,170 --> 00:10:05,460
‫ฉันคิดว่าฉันต้องการให้มันย้ายไปทางซ้าย

137
00:10:05,460 --> 00:10:14,160
‫ดังนั้นฉันจะดูการวิ่งจ๊อกกิ้งในเบราว์เซอร์สินทรัพย์ของฉัน และเราจะมองหาแอนิเมชั่นการวิ่งออกทางซ้าย

138
00:10:14,310 --> 00:10:18,180
‫ยังไงก็ตาม ฉันรู้ว่าการผสมไม่ใช่วิธีที่เหมาะที่จะทำสิ่งนี้

139
00:10:18,180 --> 00:10:23,820
‫ในการบรรยายครั้งต่อไป เราจะมาดูวิธีที่ดีกว่าในการทำเช่นนี้ ซึ่งก็คือการใช้สิ่งที่เรียกว่า

140
00:10:23,820 --> 00:10:29,730
‫Blend Space ซึ่งช่วยให้เราผสมผสานแอนิเมชั่นการเคลื่อนไหวได้อย่างสวยงามโดยอัตโนมัติ

141
00:10:29,730 --> 00:10:34,470
‫แต่เรากำลังทำสิ่งนี้เพียงเพื่อให้ได้แนวคิดเกี่ยวกับกราฟแอนิเมชัน ก่อนที่เราจะเจาะลึกลงไปในสิ่งที่ซับซ้อนกว่านี้

142
00:10:34,740 --> 00:10:41,280
‫ฉันคิดว่าเราจะผสมผสานระหว่าง ซ้าย กับ ไปข้างหน้า

143
00:10:42,170 --> 00:10:50,240
‫ออกจากที่นี่แล้วเราจะคัดลอก ตัด หรือเลื่อนไปข้างหน้าเพื่ออยู่ที่นี่

144
00:10:50,870 --> 00:10:59,930
‫จากนั้นเราจะทำการแพตช์สิ่งนั้นในเอาต์พุตของเบลนด์ไปยังอินพุตไปยังเบลนด์ถัดไป อันที่ไม่ได้ใช้งานหรือไม่

145
00:11:00,260 --> 00:11:01,280
‫สิ่งนี้สมเหตุสมผลหรือไม่?

146
00:11:01,280 --> 00:11:02,570
‫ลองคิดถึงตัวแปร

147
00:11:02,570 --> 00:11:04,220
‫ตัวแปรควรเรียกว่าอะไร?

148
00:11:04,220 --> 00:11:09,560
‫ฉันจะมีหนึ่งที่เรียกว่าไปข้างหน้า

149
00:11:10,750 --> 00:11:18,910
‫ไปข้างหน้า มันค่อนข้างง่ายและเรียกว่าขวาหรือซ้ายเพราะเรากำลังเลือกแอนิเมชั่นด้านซ้าย

150
00:11:18,940 --> 00:11:20,170
‫มันก็จะลอยกระทงด้วย

151
00:11:20,380 --> 00:11:26,440
‫ดังนั้นหนึ่งในส่วนผสมจึงต้องเลือกระหว่างไปข้างหน้าและไม่เคลื่อนที่

152
00:11:26,440 --> 00:11:32,110
‫งั้นก็ลองทำเป็น Blend แรกของเรากัน

153
00:11:33,120 --> 00:11:42,990
‫เราจะขอใช้การต่อสู้แบบไอดอลกับ a เพื่อว่าเมื่อเป็นศูนย์อัลฟ่ามันจะไม่เคลื่อนที่ไปที่จุดที่อยู่ข้างหน้า

154
00:11:43,140 --> 00:11:45,990
‫มาเชื่อมโยงตัวแปรไปข้างหน้านั้นกับอัลฟ่ากัน

155
00:11:45,990 --> 00:11:52,620
‫มันจะเคลื่อนไปข้างหน้า แล้วเราจะทำให้มันกลายเป็นศูนย์ของการเคลื่อนที่ไปทางซ้าย

156
00:11:53,920 --> 00:12:01,690
‫ขอเกี่ยวตัวแปรที่ด้านซ้ายขึ้นศูนย์ของการเคลื่อนที่ไปทางซ้าย และที่ด้านหนึ่งของการเคลื่อนตัวทางซ้ายกำลังจะเกี่ยวที่ B โดยพื้นฐานแล้ว

157
00:12:01,690 --> 00:12:03,760
‫เราจะทำการเขย่าเบา ๆ ทางซ้าย

158
00:12:04,060 --> 00:12:07,150
‫ดังนั้นถ้าเรารวบรวมสิ่งนั้น มันก็จะกระจัดกระจายเล็กน้อย

159
00:12:07,150 --> 00:12:08,530
‫แต่หวังว่าคุณจะได้รับความคิด

160
00:12:08,530 --> 00:12:15,400
‫ถ้าเราไปที่ตัวแก้ไขการแสดงตัวอย่างภาพเคลื่อนไหว และเราก้าวไปข้างหน้า คุณจะเห็นว่าเราเริ่มวิ่งจ็อกกิ้ง รีเซ็ตสิ่งนั้น

161
00:12:15,400 --> 00:12:19,840
‫และถ้าเราเคลื่อนไปทางซ้าย คุณจะเห็นว่าเราเริ่มเคลื่อนไปทางซ้าย

162
00:12:20,080 --> 00:12:25,180
‫และที่สำคัญถ้าเราทั้งสองขยับไปทางซ้ายและเริ่มวิ่งจ็อกกิ้ง

163
00:12:26,180 --> 00:12:28,970
‫เราควรเห็นการผสมผสานกันเล็กน้อยทั้งสองอย่างที่นี่

164
00:12:28,970 --> 00:12:30,770
‫เราได้รับที่ไปข้างหน้าถูกผสม

165
00:12:30,770 --> 00:12:36,320
‫ถ้าฉันต้องการให้เหลืออีกหน่อย 50% ของด้านซ้าย คุณจะเห็นว่าฉันกำลังเคลื่อนไหว

166
00:12:36,320 --> 00:12:37,460
‫เป็นแอนิเมชั่นที่ดูแปลกๆ

167
00:12:37,460 --> 00:12:44,270
‫มันไม่ได้กลมกลืนกันโดยเฉพาะ แต่คุณสามารถเห็นได้ว่ามันเล่นทั้งเขย่าเบา ๆ ไปทางซ้ายและเขย่าเบา

168
00:12:44,270 --> 00:12:45,530
‫ๆ ไปข้างหน้า

169
00:12:45,530 --> 00:12:50,660
‫อย่างที่ฉันพูดไป เราจะปล่อยให้ตัวแปรเหล่านี้ไม่เสียหายมากหรือน้อย แต่เรากำลังจะเปลี่ยนกลไกที่เราทำการผสมจริง

170
00:12:50,660 --> 00:12:56,570
‫ๆ เพื่อให้เข้าใจมากขึ้นและใช้แอนิเมชั่นที่เราเห็นมากขึ้น ในเบราว์เซอร์เนื้อหาสำหรับการจ็อกกิ้งไปข้างหน้า,

171
00:12:56,570 --> 00:13:01,700
‫จ็อกกิ้งไปข้างหลัง, จ็อกกิ้งซ้าย ฯลฯ

172
00:13:01,700 --> 00:13:03,650
‫แต่นั่นเป็นหัวข้อของการบรรยายครั้งต่อไป

173
00:13:03,650 --> 00:13:11,450
‫บทความนี้เราได้กล่าวถึงพิมพ์เขียวแอนิเมชั่นไม่มากก็น้อย วิธีการทำงานของกราฟแอนิเมชัน และเหตุผลที่เราสร้างกราฟไว้ตั้งแต่แรก

174
00:13:11,450 --> 00:13:14,540
‫แล้วพบกันใหม่ในการบรรยายครั้งต่อไปสำหรับแอนิเมชั่นเพิ่มเติม