ALTERNATIVE VERSIONS

Phân tích và ý nghĩa biểu tượng

Tỉ lệ đồ hoạ biểu tượng

Hệ thống tỉ lệ là một tiêu chuẩn đồ họa để đảm bảo hiển thị của biểu tượng không bị thay đổi và được sử dụng bằng cách phóng  to hay thu nhỏ các chi tiết như quy định theo một tỷ lệ cụ thể để tránh làm biến dạng biểu tượng khi sử dụng. Tuy  nhiên trong trường hợp kích thước quá lớn hay máy tính không thể  xử lý được thì hình vẽ phải được thực hiện đúng như hệ thống kẻ ô này. 

Biểu tượng cần được thể hiện 1 cách chính xác, chi tiết và thống nhất tuyệt đối. Chỉ nên tăng hoặc giảm kích thước của biểu tượng theo đúng tỷ lệ nguyên bản. Những đường chỉ dẫn khoảng cách và kích thước của từng thành tố trong biểu tượng cần được đảm bảo luôn rõ ràng và dễ nhận biết. 

Quy ước tỉ lệ (x) cho tương quan kích thước của các phần tử của biểu tượng với nhau. 

Kiểu chữ logo

Trang này miêu tả kiểu chữ và các dàn chữ trong logo Tokyo Homes. Phần chữ logo Tokyo Homes là một phần quan trọng trong nhận diện logo tổng thể và cách sử dụng nên tuân theo hướng dẫn đã được thiết lập.

Kiểu chữ cấu thành phần chữ là Bento Sans Black và Bento Sans Regular.

Tỉ lệ đồ hoạ logo

Hệ thống tỉ lệ là một tiêu chuẩn đồ họa để đảm bảo hiển thị của  Logo không bị thay đổi và được sử dụng bằng cách phóng to hay thu nhỏ các chi tiết như quy định theo một tỷ lệ cụ thể để tránh làm biến dạng logo khi sử dụng. Tuy nhiên trong trường hợp kích thước quá lớn hay máy tính không thể xử lý được thì hình vẽ phải được thực hiện đúng như hệ thống kẻ ô này. 

Logo cần được thể hiện 1 cách chính xác, chi tiết và thống nhất tuyệt đối. Chỉ nên tăng hoặc giảm kích thước của logo theo  tỷ lệ nguyên bản. Những đường chỉ dẫn khoảng cách và kích thước của từng thành tố trong logo cần được đảm bảo luôn rõ ràng và dễ nhận biết.

Quy ước tỉ lệ (x) cho tương quan kích thước của các phần tử của biểu tượng với nhau.

Khi kết hợp phần biểu tượng và phần chữ logo, tỉ lệ kích thước và khoảng cách giữa các phần được tính như sau. 

Kiểu chữ thương hiệu

Kiểu chữ là một yếu tố quan trọng trong nhận diện hình ảnh của Tokyo Homes. Kiểu chữ nói lên thông điệp từ thương hiệu, thể hiện cả nội dung và cách chúng ta truyền tải. 

Bộ chữ Montserrat tương thích với tính cách thương hiệu Tokyo Homes, có tính hiện đại và dễ đọc. Hệ kiểu chữ này thích hợp sử dụng ở kích cỡ lớn cho tiêu đề chính và tiêu đề phụ. Cho các tiêu đề lớn mang tính gây ấn tượng, Montserrat Medium là lựa chọn hợp lý.

Bộ chữ Roboto tương thích với tính cách thương hiệu Tokyo Homes, có tính gọn gàng và dễ đọc. Hệ kiểu chữ này thích hợp sử dụng ở kích cỡ nhỏ hơn cho phần nội dung. Cho các nội dung bình thường không nhấn mạnh, Robuto Regular là lựa chọn hợp lý.

Thương hiệu sử dụng các kiểu chữ sau trong truyền thông quảng bá và các sản phẩm UI

Bộ màu chính

Dưới đây là bảng màu chính.  

Sử dụng giá màu RGB hoặc giá trị màu HEX khi hiển thị trên màn hình.   

Sử dụng giá trị màu CMYK hoặc PANTONE cho thiết kế in ấn.

Dải màu Grayscale

Sắc thái đen, trắng, xàm được sử dụng làm màu nền trên diện tích hiển thị lớn hoặc/ và khi logo màu đầy đủ không thể hiển thị do màu nền hay do các giới hạn kĩ thuật.

 

Bộ màu thứ cấp

Hệ thống màu chính của Tokyo Homes có thể được kết hợp với bảng màu thứ cấp để cung cấp khả năng thiết kế rộng hơn. Bảng màu thứ cấp bao gồm:  đỏ, xám, xanh kim loại, cam nhạt và vàng. Các màu thứ cấp giúp truyền tải đặc điểm/tính cách thương hiệu.

Bộ màu thứ cấp là gợi ý của chúng tôi khi thực hiện công đoạn pha màu, kết hợp màu chính và màu thứ cấp để tạo ra dải màu sinh động và klinh hoạt hơn.

Bộ màu chuyển sắc

Hệ thống màu chính của Tokyo Homes có thể được kết hợp với bảng màu thứ cấp để cung cấp khả năng thiết kế rộng hơn. Đây là một số gợi ý kết hợp màu để tạo ra dải chuyển màu cho hiệu ứng chuyển màu và màu nền.

App icon và bố cục icon

App icon, thông số kĩ thuật, và chi tiết icon của Tokyo Homes được trình bày như sau. Icon chỉ nên được sử dụng trong môi trường thiết bị hoặc cho các quảng cáo liên quan và không được sử dụng sai quy cách hay thay đổi thông số app icon Tokyo Homes.

Cấu trúc - Shape icon​

Tất cả icon nên được vẽ dựa trên khung lưới 24×24 px. Mỗi khung chứa các đường keyline và phần lề 1 pixel ở tất cả các cạnh như hướng dẫn. Tuy nhiên, vẫn có thể vẽ ra khỏi lề hoặc ra khỏi các đường keyline nếu làm vậy có thể tăng cân bằng thị giác của mỗi icon.

Khung chứa​

Trong trường hợp icon được đặt bên trong một khung tròn, đường kính của đường tròn là 2 lần chiều rộng của icon. Các icon nên được cân bằng về thị giác bên trong khung chứa.

Cấu trúc - Line icon​

Tất cả icon nên được vẽ dựa trên khung lưới 24×24 px. Kích thước các nét là 3 px. Mỗi khung chứa các đường keyline và phần lề 1 pixel ở tất cả các cạnh như hướng dẫn. Tuy nhiên, vẫn có thể vẽ ra khỏi lề hoặc ra khỏi các đường keyline nếu làm vậy có thể tăng cân bằng thị giác của mỗi icon.

Khung chứa​

Trong trường hợp icon được đặt bên trong một khung tròn, đường kính của đường tròn là 2 lần chiều rộng củaa icon. Các icon nên được cân bằng về thị giác bên trong khung chứa.

Hoạ tiết Mái nhà - Cảm hứng​

Họa tiết “Mái nhà” của Tokyo Homes lấy cảm hứng từ hình ảnh mái những ngôi nhà tiếp nối nhau. Họa tiết lấy một phần từ biểu tượng, và bằng cách lặp lại nhiều lần, thể hiện đặc tính kinh doanh của Tokyo Homes: xây dựng dựa trên những mẫu nhà có sẵn.

Hoạ tiết Hoa - Cảm hứng​

Họa tiết “Hoa” của Tokyo Homes lấy cảm hứng từ loài hoa anh đào, được thể hiện đồng nhất với các vẽ của biểu tượng. Họa tiết này thể hiện nguồn gốc của thương hiệu Tokyo Homes

Hoạ tiết Mái nhà & Hoa - Cốt lõi hoạ tiết

Họa tiết, thông số kĩ thuật, và chi tiết họa tiết của Tokyo Homes được trình bày như sau. 

Showcase

Dự án liên quan

Bạn có điều thắc mắc?

LIÊN HỆ VỚI TELOS NHÉ!

    Zalo

    Điền form và TELOS sẽ liên hệ

    Rất mong chờ đón chào bạn ở lớp học Figma lần này nhé!

      Điền form và TELOS sẽ liên hệ

      Rất mong chờ đón chào bạn ở lớp học Code for Designer lần này nhé!

        Điền form và TELOS sẽ liên hệ

        Rất mong chờ đón chào bạn ở lớp học UI Design lần này nhé!

          Điền form và TELOS sẽ liên hệ

          Rất mong chờ được đón chào bạn ở lớp học figma lần này nhé

            Điền form và TELOS sẽ liên hệ

            Rất mong chờ đón chào bạn ở lớp học UX Design lần này nhé!

              Điền form và TELOS sẽ liên hệ ENĐiền form và TELOS sẽ liên hệ

              Rất mong chờ được đón chào bạn ở lớp học lần này nhé

                Điền form và TELOS sẽ liên hệ

                Rất mong chờ được đón chào bạn ở lớp học figma lần này nhé

                  Điền form và TELOS sẽ liên hệ

                  Rất mong chờ đón chào bạn ở lớp học Mobile Design lần này nhé!

                    Điền form và TELOS sẽ liên hệ

                    Rất mong chờ đón chào bạn ở lớp học Web Design lần này nhé!

                      Điền form và TELOS sẽ liên hệ

                      Rất mong chờ được đón chào bạn ở lớp học Business Analysis cơ bản lần này nhé!

                        Điền form và TELOS sẽ liên hệ

                        Rất mong chờ được đón chào bạn ở lớp học Business Analysis luyện thi ECBA lần này nhé!

                          Điền form và TELOS sẽ liên hệ

                          Rất mong chờ được đón chào bạn ở lớp học Business Analysis thực chiến lần này nhé!