MUDA ’26: Creative Kinetic Web Design by Etter Studio Instead of hiding the navigation menu in the corner like most typical museum websites, Etter Studio took a fresh, unconventional route for the Museum of Digital Art Zurich (MUDA) by placing a bold cobalt blue (#2A04D1) SVG circle right in the center of the screen. This menu button dynamically deforms, bounces, and stretches in sync with scrolling speed. The site celebrates MUDA’s comeback, shifting from its previous venue at Herdern Hochhaus in Zurich to the historic stone walls of Castel Grande in Bellinzona. Every element around this bouncy circle keeps things sleek and minimalist: generous white space, crisp neo-grotesque typography, and a pixel-grid header that lets each artwork shine.
Hovering or clicking the circle expands it into a massive blue disc taking up nearly half the screen. Inside, clean centered links for Index, Exhibitions, Artists, Locations, and About invite exploration, while language buttons for EN, IT, DE, and FR switch to a vibrant red on hover. A super fun visual surprise happens when the blue disc overlaps the black pixel-art MUDA logo—the overlapping area instantly flips to an electric acid lime-yellow. As scrolling continues down to the index section, the menu neatly shrinks into a compact pill shape that smoothly follows the cursor across featured exhibitions by Dirk Koy, Sabine Hertig, and Gysin-Vanetti.
Detail pages thoughtfully shift background color palettes to complement each specific artwork. Dirk Koy’s exhibition transforms into a deep pitch-black backdrop that makes metallic and emerald 3D forms pop, while photos of nighttime laser projections at Bellinzona sit elegantly centered on crisp white. Over on the artists directory, a clean three-column layout showcases portrait cards for Vera Molnar, Zach Lieberman, Raven Kwok, and Vincent Morisset, complete with sleek sans-serif labels in the lower-left corner. The About page makes quite an impression too, featuring a blue split-flap info board that captures the mechanical rhythm of the entire experience.
As Europe’s first digital art museum, MUDA originally launched with a successful crowdfunding campaign in 2015 by Etter Studio and co-director Caroline Hirt. Explore more of their work at etterstudio.com/ or experience the full interactive design over at www.hoverstat.es/features/muda-26.
MUDA ’26: Thiết kế web tương tác độc đáo từ Etter Studio
Thay vì ẩn menu vào góc như hầu hết các trang web bảo tàng thông thường, Etter Studio đã chọn một giải pháp phá cách cho Bảo tàng Nghệ thuật Kỹ thuật số Zurich (MUDA) bằng cách đặt một chấm tròn SVG màu xanh cobalt (#2A04D1) ngay trung tâm màn hình. Nút menu này có khả năng biến dạng, nảy và co giãn linh hoạt theo tốc độ cuộn trang. Trang web đánh dấu sự trở lại của MUDA từ không gian Herdern Hochhaus ở Zurich đến các bức tường đá của Castel Grande tại Bellinzona. Mọi yếu tố xung quanh chấm tròn đàn hồi này đều giữ nét tối giản: khoảng lề trắng rộng, chú thích kiểu chữ neo-grotesque sắc nét cùng phần header dạng pixel-grid giúp tôn lên vẻ đẹp của từng tác phẩm.
Khi rê chuột hoặc nhấp vào chấm tròn, nó sẽ nở rộng thành một đĩa tròn xanh lam chiếm tới nửa màn hình. Bên trong đĩa tròn chứa các liên kết căn giữa như Index, Exhibitions, Artists, Locations và About, phía dưới là các nút chuyển đổi ngôn ngữ EN, IT, DE, FR đổi sang màu đỏ khi di chuột qua. Một điểm nhấn thị giác thú vị là khi đĩa tròn xanh đè lên logo MUDA dạng pixel màu đen, phần diện tích giao nhau sẽ tự động đảo ngược thành màu vàng chanh acid lime-yellow. Khi cuộn trang xuống phần chỉ mục, menu sẽ thu nhỏ lại thành hình viên thuốc gọn gàng và di chuyển theo con trỏ chuột qua các triển lãm của Dirk Koy, Sabine Hertig hay Gysin-Vanetti.
Các trang nội dung chi tiết chủ động thay đổi tông màu nền để hòa hợp với từng tác phẩm. Triển lãm của Dirk Koy chuyển hẳn sang màu nền đen tuyền giúp các khối 3D ánh kim và ngọc bảo nổi bật, trong khi hình ảnh trình chiếu laser ban đêm tại Bellinzona được đặt căn giữa trên nền trắng thanh lịch. Ở trang danh mục nghệ sĩ, giao diện chia 3 cột hiển thị thẻ chân dung của Vera Molnar, Zach Lieberman, Raven Kwok và Vincent Morisset kèm phần nhãn sans-serif ở góc dưới bên trái. Trang About cũng gây ấn tượng với bảng thông tin kiểu split-flap màu xanh dương tái hiện nhịp điệu vận hành cơ khí của toàn bộ hệ thống.
MUDA là bảo tàng nghệ thuật kỹ thuật số đầu tiên tại Châu Âu, từng gây quỹ cộng đồng thành công vào năm 2015 bởi Etter Studio cùng đồng giám đốc Caroline Hirt. Bạn có thể xem thêm các sản phẩm khác tại etterstudio.com/ hoặc trải nghiệm tính năng tương tác đầy đủ trên www.hoverstat.es/features/muda-26.
