Nghiên cứu quy trình xây dựng bối cảnh cho TVC 3D và ứng dụng thiết kế môi trường cho TVC “ZocaZola – Dzo Tết sum vầy”

HỌC VIỆN CÔNG NGHỆ BƯU CHÍNH VIÊN THÔNG KHOA ĐA PHƯƠNG TIỆN (yr ĐỎ AN TOT NGHIEP DAI HOC Dé tai: NGHIEN CUU QUY TRINH XAY DUNG BOI CANH CHO TVC 3D VA UNG DUNG THIET KE MOI TRUONG CHO TVC “ZOCA ZOLA - DZO TET SUM VAY” Giảng viên hướng dẫn: TS TRAN QUOC TRUNG Họ và tên: ĐOÀN VĂN THỊNH Lớp: DI9TKDPT03 Mã sinh viên: BI9DCPT229 Hà Nội, 2023 DO AN TOT NGHIỆP ĐẠI HỌC Khoa Đa Phương Tiện LOI CAM KET Tôi xin cam đoan rằng đồ án tốt nghiệp “Nghiên cứu quy trình xây dung bối cảnh cho TVC 3D va ứng dụng thiết kế môi trường cho TVC “ZocaZola — Dzo Tết sum vay” là công trình nghiên cứu của bản thân mình Những phần có sử dụng tài liệu tham khảo có trong đồ án đã được liệt kê và nêu rõ ra tại phan tài liệu tham khảo Đồng thời những số liệu hay kết quả trình bày trong đồ án đều mang tính chất trung thực, không sao chép, đạo nhái Nếu như sai tôi xin chịu hoàn toàn trách nhiệm và chịu tất cả các kỷ luật của bộ môn cũng như nhà trường đề ra Hà Nội, ngày 5 thang 12 năm 2023 SINH VIÊN THỰC HIỆN Thịnh Đoàn Văn Thịnh Doan Văn Thịnh — B19DCPT229 2 DO AN TOT NGHIỆP ĐẠI HỌC Khoa Đa Phương Tiện LỜI CẢM ƠN Lời đầu tiên, em xin gửi lời cảm ơn sâu sắc tới Thầy giáo Ts Trần Quốc Trung đã tận tình chỉ bảo, hướng dẫn em trong quá trình thực hiện Đồ án Nhờ sự giúp đỡ của Thay, em đã có những định hướng tốt để hoàn thành môn học này Em xin gửi lời cảm ơn chân thành đến Học viện Công nghệ Bưu chính Viễn thông đã tạo điều kiện dé chúng em có cơ hội rèn luyện và vận dụng các kiến thức đã học được dé hoan thiện va nâng cao các kỹ năng của bản thân phục vụ cho công việc sau này Ngoài ra, em xin cảm ơn các thầy cô khoa Đa phương tiện đã luôn nhiệt tình chỉ dẫn, giảng day cho em những kiến thức về đồ họa 3D dé em có thé có đầy đủ kiến thức dé hoàn thành môn học này Em xin chân thành cảm ơn! Hà Nội, ngày 5 thang 12 năm 2023 SINH VIÊN THỰC HIỆN Thịnh Đoàn Văn Thịnh Doan Văn Thịnh — B19DCPT229 3 DO AN TOT NGHIỆP ĐẠI HỌC Khoa Đa Phương Tiện MỤC LỤC 2 LOL CAM 8‹ nh LOI CAM 0900 3 MỤC LỤC - 25c 2E 2112E112112711211711221211 77T E.TE.EE.EEEEEEEEErrrrrrrrerrrrrererrrrre 4 098) 96971000010107 13 CHƯƠNG 1 CƠ SỞ LÝ THUYẾT : ©25+22S+t2EEY222EYE223312231122EEtEEttrrrrrrrree 16 1.1 Khái niệm bối cảnh: ¿55:22 v22 222 tt rtttrrrtttrrrrttrrrrrtrirrrirrrrrirrrr 16 1.1.1 Khái niệm - ccccccesssssccecccceeesssssseeeececesessssseeeeceeeeeseeeseessssaauanaeeseess 16 1.1.2 Tầm quan trong của bối cảnh 2.-2.-2.St.2E.‡2E.2EE.2EE.2E1.2EE.E2E.232.221.221.21.22 -xe2 16 1.1.1 Enviroment ATẨISẨ: .- á- Gv nh nh TH HT TH ng nh 16 1.2 Tổng quan về TVC: . - -©+St+S12E2EE21921211217111211211211111111111111111111t1r1u 17 1.2.1 Khái nIỆm: - - c E1 111112211 1112231 111102111111 021 11190 111kg 011k xà 17 1.2.2 Sự ra đời của TÌVC: . - - c 1 211112111110 111g 11H kg g1 255 18 1.2.3 Phân loại TVC: . Ă 1 2 1111221111192 111g 1K TH kg 1 19 1.2.4 Vai trO lia u98 21 1.2.5 Quy trình sản xuất 1 TVC quảng Ca0% ccccceccecsessessesssssessessessessessessessessesseees 21 1.2.6 Các yếu tô tạo nên sự thành công của T'VC: .¿.+2.+.x.+£z.Ee.£+.+Ee.rz.zx.ez 23 1.3 Tổng quan về TVC 3ÌD: ¿2-2121 EE9E19212112171712121121111111111111111111xe1.24 L321 9:i6i 1n 3 24 1.3.2 Ưu điểm của TVC 3DD: .5c 222.22.2 t.2 tt t r e 25 1.3.3 Quy trình sản xuất TVC 3D .- s.21.1 121.211.211.211.1 2.111.1211.11 11.111.11.nr-txe 28 1.3.4 Vai trò của Modeling/Texturing trong quy trình sản xuất TVC 3D: 29 CHƯƠNG 2 NGHIÊN CỨU QUY TRÌNH XÂY DUNG BOI CANH CHO TVC 3D 31 2.1 Quy trình chung xây dựng bối cảnh cho TVC 3D 2-5.2 2.cc.c2.2Ec.£2.Ec.rxz.xe.ei 31 Doan Van Thinh — B19DCPT229 4 DO AN TOT NGHIỆP ĐẠI HỌC Khoa Đa Phương Tiện 2.2 Nghiên cứu chuyên sâu từng giai ỔOẠT: . .2.c 2.32.21.12.11 EE.EE.sr.rr.es.rr.vr.e 31 2.2.1 C 680/217 31 "No co an 35 2.2.3 cv 1n .4 36 PÁPA A0 /AOIo2v0)0iì3nhniỉỶÝỒ55 44 2.2.5 0y di 33 2.2.6 Set ETIVITOTN€TIL - s19 TH HH Tu TH nh 75 , 8P 0 79 P8000.) 2018 e Ö 90 CHƯƠNG 3 :ỨNG DỤNG QUY TRÌNH XÂY DỰNG BÓI CẢNH VÀO THIẾT KÉ BOI CANH CHO TVC 3D “ZOCAZOLA - DZO TET SUM VẬY”” -: 97 3.1 Giới thiệu về TVC “ZOCAZOLA — DZO TET SUM VẬY” :©5:55¿ 97 3.2 Ung dụng quy trình xây dựng bối cảnh vào sản xuất TVC 3D ZOCAZOLA - DZO TET SUM VẢY 2.222E.E12.112.7121.127.112.112.1127.121.111.121-1111¿211-111©1212121- 12 1 ©2g 2 98 3.2.1 Ý tưởng xây dựng bối cảnh .2.-52.+.s9.EE.2EE.2E2.EE.2E5.E1.211.21.717.111.1 212-1 c-ce 98 3.2.2 Xây dựng bối cảnh Hồ Gươm .2-.2 2 +SE.+EE.2EE+.E£E.EEE.EEEE.EEE.EEe.rEeE.rrk.rrr-ree 98 3.2.3 Xây dựng bối cảnh Hoàng Thanh Thăng Long 2-.52 2.52.2 s£.zz.£z-s-x299 3.2.4 Xây dựng bối cảnh Chùa Một CỘI .2.-2.2 22.E22.EE.t2.E 2.2 2 r.e99 3.2.5 Xây dựng bối cảnh Văn Miếu Quốc Tử Giám +.2.+s.+c.+c.z.+x.zz-vc-xe-: 100 3.2.6 Xây dựng các bối cảnh phụ khác ¿.+.s.+S2.2S.£+.E2E.+E.eE.Ez.EeE.eE-rx-ere-re-re-ee 100 3.3 Một số công việc khác trong quá trình sản xuất TVC ZOCAZOLA — DZO TET "00.9522 -:1â 104 E6 1 104 3.3.2 Thiết kế các đối tượng Prop phụ ¿.2 +.z+.E2.+E.2Ee.EE.eEE.eE-er-xrk-er-rre-rk-ee 105 Doan Văn Thịnh — B19DCPT229 5 DO AN TOT NGHIỆP ĐẠI HỌC Khoa Đa Phương Tiện 3.3.3 Thiết kế bao bì cho sản phẩm ZocaZola 2 52.2.+E.+E+.£z.E+.Ez.Eez.E+-Ez-rr-ez 107 KHUYEN NGHỊ VÀ KẾT LUẬN .5.22.Et.2E2.E12.EEE.12E.2E.12E.121.21E.212.121-212-11E-1EE5EEx-eE 108 TÀI LIEU THAM KHẢO - 52 St k SE EEEESEEEEEEEEEEEEEEEEEEEEEEEEEEEEEETETEEEEEEEEErrkrkree 109 Doan Văn Thịnh — B19DCPT229 6 DO AN TOT NGHIỆP ĐẠI HỌC Khoa Đa Phương Tiện DANH MỤC HÌNH ANH Hình ảnh chương 1: Hình 1 1: Pipeline và các thể loại 3D Artist - tác giả anh Phú Nguyén - 16 Hình 1 2: Quy trình làm TVC 18 Hình 1 3: TVC đầu tiên trên thế giới - 19 Hình 1 4: Quảng cáo truyền hình - 20 Hình 1 5: Quảng cáo trực tuyén - 20 Hình 1 6: TVC của Pana Motion 26 Hình 1 7: TVC Cáp điện Tran Phú của Pana Motion 27 Hình ảnh chương 2: Hình 2 1: Thông tin nghiên cứu references của Stef Velzeboer 32 Hình 2 2 :References của Dekogon Studio 33 Hình 2 3: Bối cảnh căn phòng của người Nhat - 34 Hình 2 4: Bối cảnh căn phòng của người Trung Hoa 35 Hình 2 5: Một số lưu ý về Blockout của Artist Stef Velzeboer từ Dekogon Studio 36 Hình 2 6: Minh hoạ giai đoạn Blockout - 36 Hình 2 7: Ví dụ về việc chuyên đổi giữa High Poly và Low Poly - 38 Hình 2 8: Ví dụ về references cho model tàu h0a 39 Hình 2 9: Ví dụ về Retopology - 39 Hình 2 10: Giao diện của Marvelous - 40 Hình 2 11: Giao diện của X-Gen 40 Hình 2 12: Ví dụ điển hình về sự khác nhau khi subdivision giữa lưới quad va lưới tris TT nnnnnnnnnnnnnnnannnnannnannnaaanannnnanaa.aaaa.ra.ara ren 42 Hình 2 13: Hình ảnh kết xuất giữa lưới tris và quad -43 Hình 2 14: Vi dụ về sự khác biệt về hệ thống lưới giữa phim và game - 44 Hình 2 15: Ví dụ cơ bản nhất Unwrap khối lập phuong 45 Hình 2 16: Model chiếc xe và ban đồ Uv của nó ~-~~~~~-~-~~~~~~~~~~~~~================45 Hình 2 17: Ví dụ Uv map bị lỗi dẫn đến những mảng kết cau bị biến dạng - 46 Hình 2 18: Minh họa đường Seam khi Uv bởi Blender - 47 Doan Van Thinh — B19DCPT229 7 DO AN TOT NGHIỆP ĐẠI HỌC Khoa Đa Phương Tiện Hình 2 19: Minh Họa đường Seam khi Uv bởi Blender -47 Hình 2 20: Minh họa quá trình mở UV -: 48 Hình 2 21: Minh hoạt quá trình tạo đường néi - 49 Hình 2 22: Unwrapping : 49 Hình 2 23: Điều chỉnh Uv - 50 Hình 2 24: Điều chỉnh tổng hop Uv map = ~-====-=~====~========================—= 50 Hình 2 25: Vết cắt Seam bị lỗi - 51 Hình 2 26: Overlapping 52 Hình 2 27: Minh hoa ban đồ Uv hoàn hảo bởi Artist Phú Nguyén 3 Hình 2 28: Model chiếc xe tăng chưa được lên texture - 54 Hình 2 29: Model chiếc xe tăng đã được lên texture 54 Hinh 2 30: Vi du vé mot sé loai Texture Maps dé làm nên kết cấu bề mặt gỗ của một loại cay - 55 Hinh 2 31: PBR Render Chart 57 Hình 2 32: So sánh của Artist Nguyễn Phú về kim loại giữa PBR và Non PBR 58 Hình 2 33: Minh họa cho Hand - Painted Texture - 59 Hinh 2 34: Non PBR va PBR Roughness Metallic 59 Hình 2 35: Non PBR va Specular Glossiness - 60 Hình 2 36: Diffuse Map va Base Color Map + 60 Hình 2 37: Normal Map : 61 Hình 2 38: Minh họa có Normal Map và không có Normal Map 62 Hình 2 39: Minh họa 2 model có Normal Map và không có Normal Map - 62 Hình 2 40: Minh hoa Normal Map - 63 Hình 2 41: Bang giá tri màu của Specular Map 64 Hình 2 42: Base Color Map 65 Hình 2 43: Sự khác biệt khi có Base Color và không có Base Color 66 Hình 2 44: Metallic Map 66 Hình 2 45: Gia tri Metallic 67 Hình 2 46: Ví du Roughness màu t6i - 68 Doan Van Thinh — B19DCPT229 8 DO AN TOT NGHIỆP ĐẠI HỌC Khoa Đa Phương Tiện Hình 2 47: Ví dụ Roughness mau sang -: 69 Hình 2 48: Quy trình Hand Painted 70 Hình 2 49: Quy trình Hand Painted 70 Hình 2 50: Các loại Map khac 7] Hình 2 51: AO Map 72 Hinh 2 52: Word Space Normal - 72 Hình 2 53: Thickness : 72 Hình 2 54: Curvature : 73 Hình 2 55: Sản phẩm thực hiện bởi Quixel Mixel - Substance Painter - Armor Paint 74 Hình 2 56: Giai đoạn Set Environment trong 3D Pipeline 76 Hình 2 57: Block out của Clara Tan - 77 Hình 2 58: Modeling thực hiện bởi Clara Tan T7 Hình 2 59: Texturing bởi Clara Tan - 78 Hình 2 60: Set Environment va Lighting đơn giản bởi Clara Tan - 79 Hình 2 61: Cảnh phim kinh di bởi Polygon Artist - 8l Hình 2 62: Cảnh phim vui nhộn trong phim hoạt hình “Minion Rush” - 81 Hinh 2 63: Skydome va Glonal illumination 83 Hinh 2 64: Directional Light - 84 Hinh 2 65: Point Light 84 Hinh 2 66: Area Light 85 Hinh 2 67: Spotlight - 86 Hinh 2 68: Minh hoa 3 Point Lighting set up boi Frameforest Film School - 87 Hình 2 69: Minh hoa 2 Point Lighting bở Brighton West Video 87 Hình 2 70: Minh hoa Visual Clarity bởi Cg Fastrack 88 Hình 2 71: Minh hoa Coney Emotion bởi Cg Fastrack 89 Hinh 2 72: Minh hoa 80/20 Rule boi Cg Fastrack - 90 Hình 2 73: Compositing trong san xuất phim - 90 Hình 2 74: Environment Compositing boi Alexandre Huyaux từ Artstation 92 Hinh 2 75: Background Render Element 93 Doan Van Thinh — B19DCPT229 9 DO AN TOT NGHIỆP ĐẠI HỌC Khoa Đa Phương Tiện Hình 2 76: Lighting Render Element - 93 Hình 2 77: Reflection Render Element - 94 Hình 2 78: Reflaction Render Element -: 94 Hình 2 79: Final Image sau khi kết hợp các elements trén - 95 Hình 2 80: Compositing với Nuke ( 3DArt) 95 Hình 2 81: Compositing với After Effect từ TPV Production 96 Hình 2 82: Logo ZocaZola 97 Hinh anh chuong 3: Hình 3 1: Bối cảnh Hồ Guom 98 Hình 3 2: Bối cảnh Hoàng Thành Thăng Long - 99 Hình 3 3: Bối cảnh Chùa Một Cột - 99 Hình 3 4: Bối cảnh Văn Miếu Quốc Tử Gidm 100 Hình 3 5: Bối cảnh lớp học - 100 Hình 3 6: Bối cảnh đường phố - 101 Hình 3 7: Bối cảnh bãi gửi xe công ty - 101 Hình 3 8: Bối cảnh trường học và bãi gui xe 102 Hình 3 9: Bối cảnh phòng làm viéc - 102 Hình 3 10: Bối cảnh phòng lam việc chi gai 103 Hình 3 I1: Bối cảnh phòng an - 103 Hình 3 12: Bối cảnh trước cửa nhà nhân vật ~~ ========================== 104 Hình 3 13: Model Sap ban hang sản phẩm ZocaZola 105 Hình 3 14: Model lon nước ZocaZola - 105 Hình 3 15: Model thùng nước ZocaZola - 106 Hình 3 16: Một số Prop trang trí - 106 Hình 3 17: Bao bi lon nước ZocaZola -: 107 Hình 3 18: Bao bì thùng nước ZocaZola - 107 Doan Văn Thịnh — B19DCPT229 10