Nghiên cứu các tín hiệu thị giác ứng dụng trong thiết kế giao diện website quảng bá thương hiệu mellower coffee

TỔNG LIÊN ĐOÀN LAO ĐỘNG VIỆT NAM TRƯỜNG ĐẠI HỌC TÔN ĐỨC THẮNG KHOA MỸ THUẬT CÔNG NGHIỆP - NGUYỄN BẢO THÙY AN NGHIÊN CỨU CÁC TÍN HIỆU THỊ GIÁC ỨNG DỤNG TRONG THIẾT KẾ GIAO DIỆN WEBSITE QUẢNG BÁ THƯƠNG HIỆU MELLOWER COFFEE LUẬN VĂN THẠC SĨ MỸ THUẬT ỨNG DỤNG THÀNH PHỐ HỒ CHÍ MINH, NĂM 2023 TỔNG LIÊN ĐOÀN LAO ĐỘNG VIỆT NAM TRƯỜNG ĐẠI HỌC TÔN ĐỨC THẮNG KHOA MỸ THUẬT CÔNG NGHIỆP - NGUYỄN BẢO THÙY AN NGHIÊN CỨU CÁC TÍN HIỆU THỊ GIÁC ỨNG DỤNG TRONG THIẾT KẾ GIAO DIỆN WEBSITE QUẢNG BÁ THƯƠNG HIỆU MELLOWER COFFEE LUẬN VĂN THẠC SĨ MỸ THUẬT ỨNG DỤNG THÀNH PHỐ HỒ CHÍ MINH, NĂM 2023 iii LỜI CẢM ƠN Trước tiên, học viên xin bày tỏ trân trọng lòng biết ơn TS Nguyễn Đức Sơn tin tưởng ủng hộ hướng dẫn học viên thực đề tài luận văn tốt nghiệp Học viên xin cảm ơn sở đào tạo trường Đại học Tôn Đức Thắng thầy cô Khoa Mỹ Thuật Công Nghiệp giảng dạy hỗ trợ học viên suốt q trình học hồn tất Chương trình cao học chuyên ngành Mỹ thuật ứng dụng Lời cảm ơn thứ hai xin gửi đến tất đồng nghiệp Mellower Coffee tạo điều kiện, cung cấp kiến thức, cổ vũ tinh thần suốt thời gian học viên theo học làm luận văn tốt nghiệp, đặc biệt em Trung Tín ln đồng hành hỗ trợ thực mơ hình thực nghiệm, cố vấn kiến thức liên ngành Học viên xin cảm ơn em Lan Anh, bạn Trung Hiếu, anh Thành Sơn, chị Thanh Hằng, bạn Duy Hoàng, em Thanh Triết chia sẻ động viên học viên Cảm ơn tất tình nguyện viên, cộng đồng Specialty coffee thực khảo sát, quan tâm chia sẻ góp ý để học viên hồn thành luận văn có thêm sở để tiếp tục phát triển dự án tương lai Con xin cảm ơn Mẹ, người âm thầm chăm lo sức khỏe thể chất tinh thần con, xin cảm ơn thân học viên cố gắng nỗ lực vượt qua để hồn thành tốt nghiệp TP Hồ Chí Minh, ngày 01 tháng 01 năm 2023 Tác giả Nguyễn Bảo Thùy An iv LỜI CAM ĐOAN LUẬN VĂN Cơng trình hồn thành Trường Đại học Tôn Đức Thắng Cán hướng dẫn khoa học: TS Nguyễn Đức Sơn Chữ ký: TS Nguyễn Đức Sơn Luận văn thạc sĩ bảo vệ Hội đồng đánh giá Luận văn thạc sĩ Trường Đại học Tôn Đức Thắng vào ngày 11/12/2022 theo Quyết định số 3286-3/QĐ-TĐT ngày 09/11/2022 Thành phần Hội đồng đánh giá Luận văn thạc sĩ gồm: 1.GS.TS Nguyễn Xuân Tiên Chủ tịch 2.PGS.TS Đỗ Lệnh Hùng Tú Uỷ viên, Phản biện 3.PGS.TS Võ Thị Thu Thuỷ Uỷ viên, Phản biện 4.PGS.TS Cung Dương Hằng Uỷ viên 5.TS Ngô Tú Quỳnh Loan Uỷ viên, Thư ký Xác nhận Chủ tịch Hội đồng đánh giá Luận văn Trưởng khoa quản lý chuyên ngành sau nhận Luận văn sửa chữa (nếu có) CHỦ TỊCH HỘI ĐỒNG TRƯỞNG KHOA GS.TS Nguyễn Xuân Tiên ThS Nguyễn Thị Thuỳ Vân v CƠNG TRÌNH ĐƯỢC HỒN THÀNH TẠI TRƯỜNG ĐẠI HỌC TÔN ĐỨC THẮNG Học viên xin cam đoan cơng trình nghiên cứu riêng học viên hướng dẫn khoa học TS Nguyễn Đức Sơn; nội dung nghiên cứu, kết đề tài trung thực học viên thực không vi phạm đạo đức nghiên cứu Những số liệu bảng biểu phục vụ cho việc phân tích, nhận xét, đánh giá tác giả thu thập từ nguồn khác có ghi rõ phần tài liệu tham khảo Ngồi ra, Luận văn cịn sử dụng số nhận xét, đánh số liệu tác giả, quan tổ chức khác có trích dẫn thích nguồn gốc Nếu phát có gian lận học viên hoàn toàn chịu trách nhiệm nội dung Luận văn Trường Đại học Tơn Đức Thắng không liên quan đến vi phạm tác quyền, quyền học viên gây trình thực (nếu có) TP Hồ Chí Minh, ngày 01 tháng 01 năm 2023 Tác giả Nguyễn Bảo Thùy An vi NGHIÊN CỨU CÁC TÍN HIỆU THỊ GIÁC ỨNG DỤNG TRONG THIẾT KẾ GIAO DIỆN WEBSITE QUẢNG BÁ THƯƠNG HIỆU MELLOWER COFFEE TĨM TẮT Tín hiệu thị giác yếu tố thị giác có ý nghĩa quan trọng nghệ thuật truyền thơng thị giác (bằng hình ảnh), yếu tố thị giác giúp truyền đạt thông điệp cách nhanh chóng Các khảo cổ phát hình vẽ, chữ tượng hình Ai Cập từ trước ngôn ngữ chữ viết đời, nay, giao tiếp hình ảnh phần thiết yếu công nghệ bùng nổ với phương tiện điện tử mở kỉ nguyên việc giao tiếp hình ảnh Bất kì cá nhân, doanh nghiệp, hay tổ chức muốn quảng bá thương hiệu thời đại phải có kênh thơng tin trực tuyến làm phương tiện để truyền thông, Website cơng cụ nên có, tín hiệu thị giác giao diện web quảng bá thương hiệu lại có tính chất đặc điểm riêng thiết kế Đặc biệt lĩnh vực F&B, trải nghiệm vật lý bao gồm đầy đủ giác quan xúc giác trải nghiệm trực tuyến chủ yếu thơng qua cảm nhận thị giác, thính giác, tương tác thơng qua thao tác hình thiết bị điện tử, đó, tín hiệu thị giác yếu tố có tầm ảnh hưởng định phần lớn Lĩnh vực Specialty coffee, thông qua Coffee Taster's Flavor Wheel sử dụng tín hiệu màu sắc yếu tố để phân biệt hương vị Tuy nhiên, lĩnh vực mẻ Việt Nam dần phổ biến Đề tài nghiên cứu tín hiệu thị giác truyền đạt hiệu ứng dụng Thiết kế giao diện Website quảng bá thương hiệu Mellower Coffee Thông qua phương pháp nghiên cứu phương pháp thu thập, phân tích tổng hợp liệu; phương pháp mĩ thuật học; phương pháp nghiên cứu thực nghiệm hướng tiếp cận liên ngành Các phương pháp ứng dụng để tổng hợp, phân tích sở lý vii luận liệu để đúc kết làm tiền đề cho thiết kế để khảo sát kết dùng để đánh giá chứng minh tính ứng dụng đề tài vào thực tiễn Ngồi ra, luận văn cịn có hướng tiếp cận liên ngành với lĩnh vực khác Specialty coffee, lập trình giao diện Website, thương mại, thương mại điện tử, quảng bá thương hiệu, để hướng tiếp cận bao quát, khách quan hiệu ứng dụng vào thực tiễn Khảo sát thực trực tuyến 329 người với mơ hình giao diện Website đưa kết luận minh chứng mức độ quan trọng tín hiệu màu sắc hình minh họa, ngôn ngữ hiệu truyền đạt thông tin hương vị cho lĩnh vực Specialty coffee, mang lại cảm nhận đa giác quan đạt trải nghiệm tốt cho người dùng, góp phần nâng cao nhận thức người dùng Specialty coffee cà phê thương mại Dưới góc độ Thiết kế giao diện chuyên sâu mặt thẩm mỹ, nội dung luận văn mang lại giá trị Mỹ thuật ứng dụng, cụ thể ứng dụng tín hiệu thị giác tiêu biểu màu sắc hình minh hoạ cảm nhận đa giác quan, để hỗ trợ cảm nhận hiệu lĩnh vực Specialty coffee Từ khố: tín hiệu thị giác Specialty coffee, giao diện web, Website quảng bá thương hiệu, quảng bá thương hiệu, viii RESEARCHING ON VISUAL ELEMENTS APPLIED IN WEBSITE INTERFACE DESIGN FOR BRANDING MELLOWER COFFEE ABSTRACT The visual element is a term that is used to demonstrate the elements relating to visual communication (by images), and communication methods that require sight and can be used for the rapid transferring of arranged messages Archaeological excavations have discovered several Egyptian hieroglyphs and drawings which were used as a communication method even before the invention of written languages Until today, visual communication still plays an important part in our daily communication routine, and thanks to the evolution of electronic devices have opened a new era of visual communication Any individual, business, or organization that wants to promote itself needs at least one online information channel for media solutions, Website is one of the most basic tools for this matter, the visual cues on the interface of the Websites used to promote each brand has particular properties and characteristics in design Especially in the F&B industry, customers use the five senses and tactile feeling for physical experiences, but online experience mainly relies on visual and hearing feelings, through the interactions with the screen on electronic devices where visual signals are one of the most influential and decisive factors In the Specialty coffee sector, Coffee Taster’s Flavor Wheel has applied the colors signals to the demonstrations to differentiate coffee flavors However, this Subject is relatively new in Vietnam and has not been popular This topic elaborates on finding out which visual element will be effectively communicated when applied in the design of the Website interface to promote Mellower Coffee Research methods are methods of data collection, analysis, and synthesis; aesthetics methods; empirical research methods, and interdisciplinary ix approaches These methods are applied to synthesize and analyze theoretical bases or data to summarize as a premise for survey designs The results will be used to evaluate and prove the applicability of this methods-topic in practice In addition, the thesis also has an interdisciplinary approach to other fields such as Specialty coffee, Website interface programming, commerce, e-commerce, and brand promotion, for a comprehensive approach, which is objective and effective when applied in practice The online survey of 329 people and result is about the importance of colors and illustrations cues in the Website’s interface design for Mellower Coffee brand, bringing multi-sensory perception and achieving the best user experience, contributes to increasing the awareness of customers about Specialty coffee compared to commercial coffee From the perspective of aesthetic intensive interface design, the content of the thesis brings the value of applied art, namely the application of typical visual signals such as colors and illustrations in multi-sensory perception, to support more effective perception in the Specialty coffee sector Keywords: visual element in Specialty coffee, Website interface, brand promoting Website, brand promoting, x MỤC LỤC DANH MỤC HÌNH VẼ xiii DANH MỤC BẢNG BIỂU xviiii DANH MỤC CHỮ VIẾT TẮT xviii DANH MỤC THUẬT NGỮ xviii PHẦN MỞ ĐẦU 1 Lý chọn đề tài Tình hình nghiên cứu Mục đích nghiên cứu Đối tường phạm vi nghiên cứu 5 Phương pháp nghiên cứu Những đóng góp luận văn Cấu trúc luận văn Sơ đồ nghiên cứu CHƯƠNG 1: CƠ SỞ LÝ LUẬN VÀ THỰC TIẾN NGHIÊN CỨU TÍN HIỆU THỊ GIÁC TRONG THIẾT KẾ GIAO DIỆN WEBSITE QUẢNG BÁ THƯƠNG HIỆU 1.1 Một số khái niệm liên quan đến nội dung đề tài nghiên cứu 10 1.1.1 Khái niệm tín hiệu thị giác 10 1.1.2 Khái niệm Website quảng bá thương hiệu 12 1.1.3 Khái niệm Thiết kế giao diện Website 13 1.2 Tín hiệu thị giác Thiết kế giao diện Website 15 1.2.1 Các thành phần Trang giao diện web 15 ... Nguyễn Bảo Thùy An vi NGHIÊN CỨU CÁC TÍN HIỆU THỊ GIÁC ỨNG DỤNG TRONG THIẾT KẾ GIAO DIỆN WEBSITE QUẢNG BÁ THƯƠNG HIỆU MELLOWER COFFEE TĨM TẮT Tín hiệu thị giác yếu tố thị giác có ý nghĩa quan... ứng dụng tín hiệu thị giác thiết kế giao diện website quảng bá thương hiệu Mellower Coffee 60 3.2 Quy chuẩn thiết kế nhận diện thương hiệu Mellower Coffee 64 3.3 Phác thảo sơ đồ thiết kế. .. giác thiết kế giao diện Website 23 1.3 Vai trò tầm quan trọng tín hiệu thị giác Thiết kế giao diện Website quảng bá thương hiệu trải nghiệm người dùng .26 1.3.1 Tín hiệu thị giác Thiết