Our Innovation
Motivates Us Forward
![](/themes/md_beau/img/work-BMWindow/hero-img.png)
Client BM Windows
Field Façade Architecture
SOW UX/UI Design
Time
Q4 2023 - Q1
2024
![](/themes/md_beau/img/work-BMWindow/hero-img-2.jpg)
TỔNG QUAN DỰ ÁN
Câu chuyện của BM Windows, như sự tinh vi và phức tạp của những kết cấu nhôm kính do họ thiết kế/sản xuất, là một điều kỳ diệu vẫn luôn tồn tại vô hình trong mắt của công chúng.
Website mới cho BM Windows là một trong những dự án mang tính thử thách nhất của Beau Agency ở giai đoạn cuối năm 2023. BM Windows không chỉ là công ty hàng đầu Việt Nam về kiến trúc - facade, họ còn đồng thời tìm đến chúng tôi để giải một bài toán thử thách đặc biệt thú vị.
Đặc thù về dự án
Câu chuyện của BM Windows, giống như sự tinh vi và phức tạp của những kết cấu nhôm kính do họ thiết kế/sản xuất, là một điều kỳ diệu vẫn luôn tồn tại vô hình trong mắt của công chúng.
Facade là một lĩnh vực của kiến trúc, chuyên xử lý phần bề mặt của các toà cao ốc, công trình lớn, mang tính trọng điểm của một thành phố. Đây là một lĩnh vực đòi hỏi đơn vị chịu trách nhiệm không chỉ phải sở hữu chuyên môn đặc biệt sâu về kỹ thuật mà còn phải sở hữu một hệ thống đáp ứng được toàn bộ các khâu từ thiết kế thẩm mỹ, tính toán về kỹ thuật, sản xuất, vận chuyển, giám sát và lắp đặt hàng trăm tấn vật liệu.
Chính vì điều này, client đã nhấn mạnh rằng họ chỉ có thể đồng ý để Beau triển khai website này sau khi đã tham quan nhà máy của BM Windows tại Sài Gòn và hiểu được đặc thù của lĩnh vực mà họ đang hoạt động. BM Windows tự hào nói về thứ mà mình đang làm là “kỹ nghệ facade” chứ không đơn giản là nhôm kính phổ thông.
Đối với dự án phát triển website mới cho BM Windows, hai bài toán phức tạp nhất mà Beau cần phải xử lý chính là truyền tải được bản sắc thương hiệu đặc trưng độc đáo của client; đồng thời, hệ thống hoá và tối ưu được cách trình bày cho khối thông tin phức tạp về các hoạt động của công ty.
Truyền tải tầm vóc và nhận diện
Trước khi bắt tay vào triển khai dự án, chúng tôi đã có một quá trình để tiếp xúc, trao đổi, khảo sát và thực địa tới rất nhiều hoạt động của BM Windows và thu thập nhiều hình ảnh về những công việc mà đội ngũ 500 con người (bao gồm 300 chuyên gia kỹ thuật) đang hàng ngày xử lý.
Chỉ riêng trong một module về nhôm kính mà BM Windows đang cung cấp trong bộ giải pháp về facade của mình tới chủ đầu tư là những công trình cao tầng, landmark của những thành phố lớn tại Việt Nam đã bao gồm 200 cấu kiện khác nhau. Chúng là những cấu trúc treo tinh vi và phức tạp, cho phép phần tiếp diện bên ngoài của các toà nhà có thể chịu được sức gió, quá trình chuyển vị và những điều kiện thời tiết khắc nghiệt ở độ cao vài trăm m so với mặt đất.
Đội ngũ của Beau cảm thấy đây là một chi tiết đặc biệt ấn tượng để nói về chiều sâu trong kỹ nghệ facade của BM Windows. Vì thế, chúng tôi đã sử dụng một đoạn animation tách lớp một module facade của BM Windows và đặt ngay tại trang Home để tất cả mọi người có thể nhìn thấy điều kỳ diệu về kỹ thuật này ngay từ ấn tượng đầu tiên.
Bên cạnh đó, Beau còn phát triển thêm một loạt các chi tiết về đồ hoạ xoay quanh motif chủ đạo của nhôm kính như hiệu ứng bề mặt kim loại, gradient trong suốt, sáng bóng… để làm rõ hơn tính cách của thương hiệu. Tất cả được đặt trong một layout với hệ lưới thoáng để thể hiện tầm vóc của doanh nghiệp.
Tối ưu về cấu trúc nội dung
Website của BM Windows cũng đi kèm với một khối lượng thông tin lớn trong từng hạng mục nội dung, trong đó bao gồm cả những thông tin nặng về yếu tố kỹ thuật của sản phẩm/giải pháp mà đối tác đang cung cấp tới thị trường. Để đảm bảo trải nghiệm tổng thể của website giữ được cảm giác cao cấp xuyên suốt qua từng trang, Beau đã thiết kế một loạt vị trí mà thông tin có thể được mở rộng hiển thị responsive mỗi khi người dùng click vào hoặc hover chuột qua.
Cùng với đó, ở một số trang đặc thù như trang Listing về danh mục sản phẩm, chúng tôi cũng đưa ra hai option về các duyệt nội dung để đáp ứng nhu cầu và hành vi của những profile người dùng khác nhau, đảm bảo cho việc tất cả mọi người đều có được trải nghiệm tốt khi tìm kiếm thông tin về doanh nghiệp hoặc hỗ trợ cho các kiến trúc sư khi tìm kiếm thông tin kỹ thuật về giải pháp cho thiết kế của mình.
Để có thể biểu diễn một cách trực quan và dễ hiểu cho các quy trình làm việc của BM Windows, Beau cũng đồng thời xây dựng ra một hệ thống icon và các vẽ các model để giản lược và hệ thống lại các thông tin phức tạp, giúp người dùng có thể nhanh chóng nắm bắt những thông tin quan trọng nhất. Đối với một dự án như website của BM Windows, chúng tôi cần đảm bảo rằng đây là một thiết kế sẽ thoả mãn cho cả hai trường phái tư duy của những con người duy mỹ và những con người logic.
Điều hướng tối ưu cho chuyển động của mắt
Mạch nội dung trong từng trang cũng được tính toán để người dùng luôn giữ một điểm nhìn tập trung với đường di chuyển của mắt được thoải mái nhất. Song hành với đó là hệ thống điều hướng và các nút điều hướng được bố trí tỉ mỉ ở những nơi mà người dùng có nhu cầu sử dụng cao nhất.
VỀ BM WINDOWS
BM Windows tự hào nói về những sản phẩm của mình là “kỹ nghệ façade”
Chỉ riêng trong một module về nhôm kính đã bao gồm 200 cấu kiện khác nhau
GIẢI QUYẾT BÀI TOÁN
Bài toán đầy thử thách của BM Windows
![](/themes/md_beau/img/work-BMWindow/baitoan-img-1.png)
![](/themes/md_beau/img/work-BMWindow/baitoan-img-2.png)
![](/themes/md_beau/img/work-BMWindow/baitoan-text-1.png)
Điều hướng tối ưu theo
hành vi người dùng
Mạch nội dung trong từng trang cũng được tính toán để người dùng luôn giữ một điểm nhìn tập trung với đường di chuyển của mắt được thoải mái nhất.
![](/themes/md_beau/img/work-BMWindow/baitoan-img-4.png)
![](/themes/md_beau/img/work-BMWindow/baitoan-foot-1.png)
![](/themes/md_beau/img/work-BMWindow/baitoan-foot-1-sharp.png)
![](/themes/md_beau/img/work-BMWindow/baitoan-foot-2.png)
![](/themes/md_beau/img/work-BMWindow/baitoan-foot-3.png)
![](/themes/md_beau/img/work-BMWindow/baitoan-foot-4.png)
![](/themes/md_beau/img/work-BMWindow/time-text.png)
![](/themes/md_beau/img/work-BMWindow/time-img.png)
GIẢI QUYẾT BÀI TOÁN
![](/themes/md_beau/img/work-BMWindow/giaiquyet-img-1.png)
![](/themes/md_beau/img/work-BMWindow/giaiquyet-img-2.jpg)
![](/themes/md_beau/img/work-BMWindow/giaiquyet-img-3.png)
![](/themes/md_beau/img/work-BMWindow/giaiquyet-img-4.png)
TỐI ƯU VỀ CẤU TRÚC NỘI DUNG
Xây dựng hệ thống model để trực quan hoá quy trình và chức năng của facade
![](/themes/md_beau/img/work-BMWindow/foot-bg-pc.jpeg)
Tối ưu về cấu trúc nội dung
Để đảm bảo trải nghiệm tổng thể của website giữ được cảm giác cao cấp xuyên suốt qua từng trang, Beau đã thiết kế một loạt vị trí mà thông tin có thể được mở rộng hiển thị responsive mỗi khi người dùng click vào hoặc hover chuột qua.
![](/themes/md_beau/img/work-BMWindow/foot-img-1.png)
![](/themes/md_beau/img/work-BMWindow/foot-img-2.png)
![](/themes/md_beau/img/work-BMWindow/foot-img-3.png)
BM WINDOWS FACADE
BM Windows
Website Showcase
Phạm Hoàng Hà
Nguyễn Huy Long
Lưu Kiên Định
Bùi Thị Hoà
Phạm Hải Linh
Nguyễn Thái Đức Anh
Nguyễn Ngọc Lê
Phan Đức Trọng
Nguyễn Quốc Khánh
Trần Đại Đăng Khoa