Icons là gì? Ý nghĩa, cách sử dụng icons trong thiết kế web

Với những người dùng có niềm đam mê với các nền tảng mạng xã hội Facebook, Zalo, Instagram,… thì chắc đã không còn xa lạ với các Icon mình sử dụng hàng ngày. Ngoài ra chúng cũng xuất hiện nhiều trên các giao diện website hay app của màn hình điện thoại, máy tính, bảng chỉ dẫn biển hiệu,… Vậy icons thực chất là gì và có ý nghĩa như thế nào? Hãy cùng theo dõi bài viết dưới đây để hiểu rõ hơn nhé.

Định nghĩa Icon

Icon được biết đến và xuất hiện lần đầu tiên năm 1981 trên nền tảng Xerox Star với 3 biểu tượng là thùng rác, máy in và thư mục. Đến năm 1984, các thiết kế Icon bắt đầu xuất hiện rộng rãi hơn với nhiều người dùng nhờ vào Apple. Dựa trên “Design System Grammar” của Daniel Eden, Icon được định nghĩa là một thành phần dùng để tạo nên button, link, navigation, description. Cấu tạo của Icon sẽ bao gồm line, shape, space, meaning.

Phân loại Icon như thế nào?

Với sự tăng trưởng can đảm và mạnh mẽ của công nghệ tiên tiến như lúc bấy giờ, Icon Open nhiều hơn với nhiều hình thức, mẫu mã và ý nghĩa khác nhau. Nhìn chung, Icon có 3 cách phân loại như sau :

Phân loại icon theo chức năng

  • Decorative icon : dùng để trang trí

Phân loại icon theo hình thức

  • Lineal icon : chỉ dùng nét
  • Glyph icon : chỉ dùng mảng

    Phân loại Icon như thế nào?

  • Flat icon : dùng nét, mảng, nhiều chi tiết hơn và tạo cảm xúc minh họa nhiều hơn

    Phân loại Icon như thế nào?

Phân loại icon theo ý nghĩa

  • Iconic Icon : nghĩa hoán dụ ( có nét thân mật )

Ví dụ như bạn phong cách thiết kế icon để ám chỉ số điện thoại cảm ứng, bạn không hề vẽ chi tiết bàn phím vì có quá nhiều chi tiết, khó phân biệt, thay vào đó bạn sẽ vẽ ống nghe ? của máy bàn và người nhìn hoàn toàn có thể thuận tiện liên tưởng tới việc gọi điện, ngoài những hoàn toàn có thể thay bằng hình ảnh điện thoại di động đơn thuần .

  • Symbolic Icon : hiểu theo nghĩa ẩn dụ ( có nét tương đương )

Ví dụ như dấu tick ✔ không tương quan trực tiếp đến việc check mark, cũng không sống sót ngoài đời thật nhưng đây lại là một hình tượng được quy ước và mang ý nghĩa hoàn thành xong việc gì đó ; nên dấu tick được sử dụng để hình tượng cho icon check mark .
Tùy thuộc vào nhu yếu cũng như ngữ cảnh, bạn hoàn toàn có thể tích hợp nhiều loại icon để diễn đạt được nội dung một cách rõ ràng và nhanh gọn nhất .

Icon được sử dụng như thế nào?

Icon biểu tượng cho các phần mềm

Icon được sử dụng để hình tượng hiển thị cho những ứng dụng cũng như những ứng dụng trên thiết bị điện thoại cảm ứng, máy tính, .. nhằm mục đích giúp người dùng thuận tiện phân biệt những ứng dụng khác nhau. Mỗi ứng dụng sẽ có một hình tượng icon độc lạ và liên hệ trực tiếp đến tên ứng dụng, nhờ vậy mà bạn chỉ cần nhìn qua cũng hoàn toàn có thể biết được đây là ứng dụng hay ứng dụng nào .

Icon biểu tượng cho cảm xúc

Trên những nền tảng mạng xã hội lúc bấy giờ, icon được sử dụng rất nhiều để bộc lộ cảm hứng và truyền tải những thông điệp khác nhau đến người nhận. Với bất kể hoạt động giải trí hay trạng thái cảm hứng nào của con người trong đời sống, icons cũng hoàn toàn có thể bộc lộ được chúng mà không cần phải nhắn bằng text thường thì. Có đến hàng nghìn icon khác nhau để bạn hoàn toàn có thể thuận tiện lựa chọn và sử dụng nhằm mục đích tăng tính mê hoặc cho cuộc trò chuyện của mình .

Icon giúp tạo điểm nhấn cho người đọc

Ngoài ra, icon cũng được sử dụng để ghi lại được những dòng đầu trong một văn bản. Điều này giúp văn bản dễ nhìn và có điểm nhấn hơn tới mắt người đọc. Bạn hoàn toàn có thể thuận tiện xác lập được đâu là phần chính cần chú ý quan tâm và đâu là những chi tiết nghiên cứu và phân tích nhỏ hơn. Trong những bài viết trên FAcebook, Zalo hay những bài quảng cáo, icon tượng trưng được sử dụng rất nhiều để lôi cuốn người xem nhiều hơn thay vì chỉ để những đoạn text thường thì .

Vai trò của icon trong thiết kế web

Icon trong thiết kế web là yếu tố nhỏ về kích thước và không mang ý nghĩa quá sâu sắc. Tuy nhiên chúng lại đóng vai trò quan trọng để chỉ ra thông tin và là điểm nhấn giúp thu hút sự chú ý của người dùng đồng thời hướng họ thực hiện hành động được nhắm mục tiêu.

Nhìn chung, sự Open của Icon trong phong cách thiết kế web giúp :

  • Thu hút sự chú ý quan tâm
  • Hiểu ý nghĩa của phong cách thiết kế
  • Điều hướng giao diện
  • Tiết kiệm khoảng trống trực quan
  • Tạo liên kết với người dùng

Các nguyên tắc quan trọng để tạo icon trong thiết kế web

Tính đơn giản – Simplicity

Các điều tra và nghiên cứu đã chỉ ra rằng, người dùng website thường không thích những thứ phức tạp. Bởi vậy, icon được nhìn nhận là tốt và hữu dụng phải cung ứng điều kiện kèm theo đơn thuần và dễ “ đọc ”. Điều này có nghĩa là icon của bạn không cần phải lý giải bằng văn bản. Để hoàn toàn có thể kiểm tra tính đơn thuần của icon, bạn hãy hiển thị nó cho một người không chuyên về phong cách thiết kế, nếu như họ chưa thể hiểu được đại khái ý nghĩa của nó thì hoàn toàn có thể icon này chưa được phong cách thiết kế đúng .
Nguyên tắc này sẽ hướng bạn đến việc phong cách thiết kế icon không có chứa những yếu tố dư thừa và chi tiết không thiết yếu bởi chúng dễ làm cản trở nhận thức, mất tập trung chuyên sâu và gây nhầm lẫn cho người dùng. Icon chứa càng ít thành phần càng tốt, một icon có nhiều hơn 3 màu không còn là một hình tượng đơn thuần nữa mà sẽ được coi là hình minh họa. Một hình tượng với quá nhiều yếu tố hay điểm nhấn sắc tố sẽ khiến chúng khó phân biệt và không rõ ràng về mặt trực quan .
Ngoài ra, những chi tiết của icons cũng phải hài hòa và hợp lý. Các hình tượng sẽ trở nên phức tạp và khó nhận dạng hơn nếu có quá nhiều chi tiết. Tuy nhiên, sẽ hài hòa và hợp lý nếu như chi tiết bạn đưa vào tương thích với sáng tạo độc đáo phong cách thiết kế và được làm chuyên nghiệp .

Trí tuệ và tính thông tin

Ngoài việc không thích những thứ phức tạp thì người dùng cũng không thích những thứ họ không hiểu. Một hình tượng không rõ ràng đồng nghĩa tương quan với việc user sẽ mất thời hạn và công sức của con người để giải thuật chúng và họ trọn vẹn không thích điều này. Tuy nhiên nếu icon của bạn không mang bất kể ý nghĩa nào thì cũng chưa đạt nhu yếu. Mục đích chính của hình tượng là truyền tải nội dung / thông tin ngay lập tức. Nên trách nhiệm của những designer là vô hiệu đi những thứ không thiết yếu khiến nó không triển khai được điều này .
Người dùng không thích những yếu tố giao diện và thậm chí còn khó hiểu khi nhìn thấy chúng. Do đó, việc quan trọng là khiến những hình tượng trở nên dễ “ đọc ”. Bởi vậy để nhận dạng được những hình tượng sẽ nhờ vào vào tính đơn thuần, dễ hiểu và tính ẩn dụ của chúng. Kích thước của những thành phần trong icon cũng ảnh hưởng tác động đến việc nhận dạng chúng. Càng có nhiều chi tiết nhỏ trong hình tượng sẽ càng làm người xem khó “ đọc ” được ý nghĩa tượng trưng của icon .
Ngoài ra hình tượng cũng cần thông dụng so với mọi người thuộc những nền văn hóa truyền thống, độ tuổi và nguồn gốc khác nhau. Tuy nhiên bạn nên triển khai điều tra và nghiên cứu đối tượng người dùng nhận tin tiềm năng và từ đó lựa chọn sắc tố và phép ẩn dụ tương thích và dễ hiểu nhất cho nhóm này. Nếu trong trường hợp cần bộc lộ nội dung phức tạp mà không hề chỉ sử dụng icon, bạn hoàn toàn có thể thêm văn bản nếu cần để người xem dễ tưởng tượng hơn nhờ việc tích hợp icon và text .

Sự thống nhất của phong cách

Sự thống nhất của phong thái cho thấy phong cách thiết kế hình tượng tương thích với phong thái tên thương hiệu và sáng tạo độc đáo phong cách thiết kế. Biểu tượng phải phản ánh được thực chất và giá trị tên thương hiệu, đồng thời là bộ phận hữu cơ của tên thương hiệu về cả mặt trực quan và tâm ý. Các designer thường sử dụng những hình tượng từ những bộ sưu tập làm sẵn trên web hoặc lấy chúng làm cơ sở để phát minh sáng tạo những phong cách thiết kế mới .
Sự thống nhất về phong thái cũng là một phần của việc tôn vinh tính nghệ thuật và thẩm mỹ và tương hỗ cho phong thái của tên thương hiệu. Đồng thời, sự đồng nhất về phong thái cũng giúp nhận thức những hình tượng thuận tiện hơn, đơn giản hóa việc điều hướng và mang lại thưởng thức tốt hơn cho người dùng .

Tính độc đáo

Tinh duy nhất và độc đáo của biểu tượng được hiểu là sự khác biệt của nó so với các biểu tượng khác trong tập hợp. Một bộ icons đẹp với hình ảnh không thể phân biệt bằng mắt thường sẽ không được người dùng đánh giá cao hoặc thậm chí là không hiểu. Tính độc đáo của biểu tượng cũng góp phần quan trọng làm nên tính độc đáo của thương hiệu. Người dùng hoàn toàn không muốn giải mã các câu đố nên việc mà các designer cần làm là sử dụng phép ẩn dụ quen thuộc nhưng đồng thời thay đổi cách triển khai hình ảnh theo hướng lạ mắt và thu hút hơn.

Như vậy, bài viết đã đưa ra những thông tin cơ bản về Icons cũng như ý nghĩa của chúng so với việc phong cách thiết kế web. Nếu như bạn đang chăm sóc đến những khóa học phong cách thiết kế đồ họa thì đừng quên truy vấn ngay website FPT Arena để được tư vấn và tương hỗ nhé .

Viện Đào Tạo Quốc Tế FPT

FPT Arena Multimedia – https://final-blade.com