ui/ux design
March 20, 2020

8 правил, що допоможуть створювати іконки правильно!

20.03.2020. Час прочитання - 5 хв

Зображення часом може краще розповісти, ніж тисяча слів. Зокрема іконки, вони зчитуються швидше тексту, їх легше помітити, вони займають менше місця і вимагають менше зусиль при перекладі. Стіна з тексту зливається в купу, а іконки розрізняються за формою і добре виглядають навіть в групах. Але "наплужити" з ними також цілком можливо, тож ловіть декілька рекомендацій по створенню ефективних іконок.

1. Уникайте подібних форм для різних іконок

Іконки схожих форм виглядають так, ніби пов'язані одна з одною або виконують схожі функції. Пам'ятайте, коли створюєте чергову квадратну іконку для Вашого UI, що це може заплутати користувача.

2. Мінімізуйте складність іконок

Чим більше елементів у іконки, тим більше часу потрібно для її розпізнавання. Іноді потрібно зробити іконку унікальною і додати до неї свою «родзинку», але переконайтесь, що це не буде шляхом відсутності чіткості. Зберігайте форму простою і чистою.

3. Створюйте всі іконки в одному стилі

Не можна, щоб UI-елементи порушували загальні правила встановленого стилю. Навіть невеликі зміни можуть привести до того, що іконки будуть виглядати, ніби зібрані з різних додатків.

4. Не покладайтесь на текст

Текст робить іконку неясною при малих розмірах і обмежує її до однієї мови. До того ж напис може знижувати чіткість зображення. Якщо дуже необхідно включити текст, то зробіть це у вигляді лейбла під іконкою.

5. Не варто винаходити колесо

Повірте, дуже і дуже багато годин було витрачено на створення і тестування вже встановлених іконок. Навіть якщо Ви бачите де їх можна покращити — подумайте двічі. Найімовірніше, користувачі вже знають їх значення, тому що часто стикалися з ними.

Не потрібно винаходити колесо заново, тільки заради того, щоб справити враження. Ключовий момент — зручність використання. Дизайн повинен його покращувати, а не заважати.

6. Зробіть меседж послідовним

Ніщо так не гальмує роботу і не викликає роздратування користувача, як неправильно використана іконка. Цю помилку легко допустити, якщо змішувати неактивні та активні іконки, щоб дати юзеру можливість відрізнити їх одну від одної.

7. Враховуйте маленькі розміри

Красива деталізована іконка втрачає всю свою чарівність, коли її вліпити в невеликий простір. Всі дрібні деталі перетворюються в кашу. Тому пам'ятайте, що іконки не є головними, хоч як би Ви не хотіли показати ними свій скіл. Спочатку вони повинні бути корисними, а вже потім красивими.

8. Не покладайтесь на колір

Подумайте про людей з дальтонізмом, вони скажуть Вам дякую за це. Колір стане прекрасним доповненням до іконки, але форма — це те, на що люди звертають увагу в першу чергу.


Більше корисної інформації можна отримати на повноцінному курсі UI/UX.EDUCATION!