Người đứng ra mời cỗ ở Hà Nội luôn gánh những áp lực ngầm. Họ trả tiền cho cả bàn và phải chịu trách nhiệm nếu khách chê mâm thiết đãi thiếu tươm tất. Thay vì ép khách chọn bừa món theo danh sách dài, trang web Mộc Quê lật ngược vấn đề bằng cách dẫn người xem đi theo quy tắc sắp mâm. Khách được dạy cách xếp mâm cỗ Bắc Bộ chuẩn mực, sau đó tự tay điền món vào những ô còn trống. Cách làm này vừa giúp tiệm ăn bán trọn mâm cỗ, vừa giúp người mời yên tâm rằng mình đang thiết khách đúng lề lối.
Bố cục dẫn dắt: Dạy luật chơi để chốt đơn hàng
Ngay khi vừa mở trang, người xem được đón bằng lời chào ăn cơm quê, số điện thoại, điểm đánh giá 4,8 sao và 186 lượt khen để xác lập uy tín tức thì. Cuộn xuống dưới, lưới món đặc sản hiện ra với thẻ giá rõ ràng, mỗi thẻ đính kèm nhãn ghi rành mạch đó là món bát hay món đĩa. Đến giữa trang, dải màu mỏng cắt ngang màn hình để giảng về luật xếp 4 bát 6 đĩa của cỗ Bắc Bộ xưa. Nhịp cuộn trang được tính toán nhằm buộc khách học luật chơi trước khi nhìn thấy toàn bộ thực đơn. Khi đã hiểu cách đếm, khách mới bước vào kho 37 món gọi lẻ để bắt đầu nhặt từng món bỏ vào mâm.
Ở phần dưới của trang, mọi thao tác hướng thẳng tới việc ra đơn thực tế. Các mâm cỗ dọn sẵn không chỉ liệt kê tên món mà còn tự động đếm số lượng bát đĩa, kèm theo gợi ý đổi món hoặc điền nốt phần còn thiếu. Khối đặt mâm hoạt động giống hệt như việc chọn ghế ngồi xem phim ngoài rạp. Người mời chọn số lượng khách, sau đó nhấp chọn món cho kín các ô bát đĩa đang trống. Chốt xong, khách lấy thông tin chuyển khoản và chờ bếp giao mâm cỗ đến tận nhà, hoàn thành luồng mua hàng mà không cần hỏi lại quán.
Ánh sáng và màu sắc cho bữa tối tử tế
Giao diện không dùng nền trắng sáng kiểu quán ăn nhanh, mà trải lớp nền màu xanh rừng thẫm. Phối lên đó là những điểm nhấn màu vàng champagne, màu mật ong và mặt chữ màu kem nền nã. Bảng màu này tái tạo lại không khí của không gian dùng bữa riêng tư. Mọi bức ảnh món ăn đều được chụp cận cảnh dưới ánh sáng ấm như đèn bàn ăn buổi tối. Thị giác của người xem bị ép tập trung hoàn toàn vào độ mọng của thịt hay váng mỡ trên bát canh, kích thích trực tiếp vào cảm giác thèm ăn.
Cách trình bày chữ viết cũng phục vụ riêng cho việc đọc lướt tìm món. Phông chữ không chân gãy gọn giúp tên món và giá tiền tách bạch hẳn khỏi phần nền tối. Để trang không bị tĩnh lặng và nhàm chán, mỗi khối thông tin lại mang kiểu chuyển động hiện hình riêng biệt. Không khối nào lặp lại hiệu ứng của khối ngay trước nó. Mọi chi tiết đồ họa đều làm nền để tôn thức ăn lên làm nhân vật chính.
Kỹ thuật tĩnh giải quyết bài toán vận hành
Mộc Quê là trang tĩnh hoàn toàn do tay tôi tự dựng từ đầu. Tuy không gắn với bất kỳ kho quản trị hay hệ thống quản lý nào phía sau, trang web vẫn có khả năng tự đếm số ô bát đĩa cho từng mâm. Thuật toán chạy ngầm trên trình duyệt đọc trực tiếp danh sách món đang in trên màn hình để cộng dồn số lượng. Cách xử lý này giúp con số in ra không bao giờ lệch với hàng chữ đang bày. Người làm nghề bán đồ ăn giảm được hẳn rủi ro khách cãi nhau với quán vì thông tin mâm cỗ hiển thị sai lệch.
Dù chứa nhiều ảnh cận cảnh và trang giới thiệu riêng dài 10 khối, website vẫn tải ngay lập tức. Điểm tốc độ đánh giá bằng công cụ của Google trên thiết bị di động đạt mức 95. Thời gian hiện hình khối lớn nhất chỉ mất 2,7 giây, đi kèm độ xê dịch bố cục khi tải bằng 0, giúp khách không bao giờ bấm nhầm nút lúc trang đang mở. Trên màn hình điện thoại, thanh dính chặt ở đáy gom đúng 4 nút để gọi điện, nhắn Zalo, xem đường và đặt bàn. Thiết kế này chặn mọi đường thoát, buộc khách phải liên hệ quán khi có nhu cầu.
Kéo chuột trong khung để xem toàn bộ chiều dài trang, màn hình máy tính và điện thoại chạy đồng bộ.