як же ця картинка мені асоціюється з дизайн-системами 😅 а з чим у вас?

ПРО ШРИФТИ

Хочу з вами розібрати найчастіші помилки новачків та мої рекомендації щодо шрифтів у UI/UX дизайні.

У кожному курсі по дизайну є тема шрифтів, і навіть зараз, шрифт допомагає  (чи навпаки) вам читати цей текст. Так ось, щоб шрифт допомагав, доповнював ваш інтерфейс, варто дотримуватися декілька простих рекомендацій:

1️⃣ Перша помилка - занадто складні та нечитабельним шрифти, особливо для текстів маленького розміру.

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

2️⃣  Друга помилка - занадто багато шрифтових груп для одного проекту, поєднувати багато різних типів рукописних шрифтів, тощо.

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

3️⃣ Третя помилка - використання тільки одного стилю та не робити акценти у текстах, або робити забагато акцентів.

Користуватися різними стилями одної шрифтової групи - Bold/Semibold/Medium/Regular/Light і тд. Чим їх більше у шрифті, тим краще. Це допоможе вам зробити ваш дизайн цікавішим та зробити акценти, однак не використовуйте усі одразу, гармонія у мірі!

👩‍💻 Усім привіт! Поки я в дорозі, вирішила зібрати ваші питання для ефіру про співбесіди для дизайнерів! Можете задавати їх прямо тут у коментарях, або у цій формі:

https://forms.gle/PoRPwsLfRhWiMMn19

Сам прямй ефір думаю провести у кінці наступного тижня, обовʼязково збережу запис, тож не хвилюйтеся, якщо не вийде прийти на сам ефір.

Чекаю на ваші питання 🫶

Тут зі мною поділилися дуже класною підбіркою по законам UX і я поспішаю поділитися з вами!

https://lawsofux.com/

На жаль, тут не має української чи російської мови, але якщо на цьому пості буде більше 10 лайків, зроблю вам переклад 🙌

І не забудьте поставити питання стосовно співбесід у формі вище!

Окей, я зрозуміла, перекладу бути 😅 але я сподіваюся, що ще підберу для вас якісь кейси під них, тому швидко не буде 🤗

Прийду у себе після новин і почну ❤️‍🩹 усіх обіймаю🫂

Ну що, почнемо наш марафон по законам UX! Спочатку буду вам перекладати статю про закон, а після висновки по ньому для реального дизайнерського життя.


💫 Ефект естетичної використовуваності

Користувачі часто сприймають естетично привабливий дизайн як дизайн, який є більш використовуваним.

Основні положення

1⃣ Естетично привабливий дизайн викликає позитивну реакцію в мозку людей і переконує їх, що дизайн насправді працює краще.

2⃣ Люди більш терпимі до незначних проблем використовуваності, коли дизайн продукту або сервісу є естетично привабливим.

3⃣ Візуально привабливий дизайн може приховувати проблеми використовуваності і запобігати виявленню проблем під час тестування використовуваності.

Походження

Ефект естетичної використовуваності був вперше вивчений у галузі взаємодії людини з комп'ютером у 1995 році. Дослідники Масаакі Куросу та Каорі Кашімура з Центру дизайну Hitachi протестували 26 варіацій інтерфейсу банкомату, попросивши 252 учасників дослідження оцінити кожен дизайн за його простоту використання та естетичну привабливість.

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

Ресурс - тут є більше ресурсів для детального ознайомлення з ефектом

#uxlaws

📒 Висновки

Уявіть собі, якщо б інтерфейс інстаграму би залишився таким: як у 2010 році! Чи багато людей з вас його використовували? Думаю, що ні.

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

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

Є ще декілька моментів, на які треба звернути увагу:

1. Уникайте ультра модних направлень у дизайні, як наприкрад, неоморфізм колись. Такі стилі дуже важко підтримувати у майбутньому - мода проходить, а вам дизайнерам потім з цим жити. Звісно, якщо позиціонування продукту включає незвичний стиль, то це інша справа. Однак, закликаю вас подумати перед цим.

2. Якщо ви вирішили робити редизайн продукту, підійдіть до цього процесу серйозно, особливо, якщо у вашого продукту багато користувачів. Різкі зміни можуть повпливати негативно на продуктові метрики, через те, що для ваших користувачів інтерфейс став зовсім незнайомим. Можливо, варто робити редизайн поступово у декілька етапів, щоб ваші користувачі змогли поступово звикнути дл нових реалій.

3. Гарна практика використовувати нативні елементи операційних систем для ваших дизайнів, як, наприклад, iOS Kits. Для користувачів ці елементи вже знайомі і їм очевидно як ними користуватись. Це також буде робити ваш дизайн візуально привабливим та знайомим.

Що ви думаєте про цей закон? Чи ви згодні з його важливістю?
І дуже чекаю на ваші реакції! Такі тексти займають час і мені необхідно отримувати від вас фідбек 🫶

#uxlaws

Доброго ранку) я вирішила, що ефір буде завтра о 17! Хто не зможе доєднатися, не хвилюйтеся, буде запис 🫶 (я сподіваюся, не затуплю, бо це буде мій перший ефір 😅)

Чекаю на ваші питання у цій формі, можна не тільки про співбесіди, але і про організацію роботи дизайнера теж

https://forms.gle/PoRPwsLfRhWiMMn19

А поки я занурююсь у новий продукт, Apple нарешті випустив перший офіційний Figma файл з UI Kit для ще не вийшовшої у загальний доступ iOS17 (поки Beta-версія) 🥳

Переглянути та зберегти собі можна тут:
Apple Design Resources – iOS 17 and iPadOS 17

Зʼявився новий ресурс з референсами по різним UI елементам. Я дуже часто таким користуюся, коли треба знайти специфічний приклад

Що там є:
– Форми логіну та реєстрації
- Поп-апи
- Профілі
- Порожні стани
- Нотифікації
- Таби
- Каруселі
- Візарди
– Завантаження файлів
- Кнопки
- Селекти
- Тости
- Каунтери
- Тултіпи
- Таблиці, та ін.

Зберігайте собі:

https://calltoinspiration.com/

На жаль, через технічні причини, ефір переноситься на завтра, тож у вас ще є час написати питання, які ви ще не додали)

Прямому ефіру сьогодні о 17:00 бути, але поки хочу поділитися з вами враження про нове оновлення Figma!

Я тільки закінчила дивитися Config 2023 Product Launch Keynote, і можу сказати, що я дуже вражена! Нова версія Figma точно змінить процес роботи у команді не тільки дизайнера, але і розробників.

Повний список оновлень можна глянути тут

Але давайте детальніше роздивимося, що ж там нового!

Перше, що мене дуже зацікавило, це фіча Variables

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

За допомогою Variables можна дуже швидко змінити кольорову тему, масштаби та робити більш складні прототипи. Детальніше як це працює можна глянути тут

Intro to variables

Prototype with variables

Також був презентований новий режим для розробників Dev Mode, що точно змінить процес колоборації з розробниками!

За допомогою цього спейса, розробник одразу бачить дизайни, які готові для розробки, код у різних варіаціях, різні варіанти одного компонтента, може порівняти зміни, які відбулися у дизайні і все це не відходячи від каси! 😱

Де ця фіча була рік тому? Це як раз те, що було необхідно моїй минулій команді і через що у нас було багато конфліктів. 🥲

Більше про цю фічу тут:

Intro to Dev Mode

А ще обновили такі фічі як:

- Autolayout - додали функцію Wrap (автоматичне вирівнювання плиткою)
- додали мінімальне та максимальне значення ширина та висоти для елементу - тепер робити респонсів дизайн ще приємніше
- шрифти діляться на ті, які додали ви та системні
- зробили глобальний пошук та нотіфікації

Ці всі оновлення вже є у Figma, треба тільки оновитись!

Також дали затравочку на інтерграцію AI у Figma… це має бути цікаво.

Яка вам фіча сподобалась більше? На що ви чекали? Вже встигли оновитися та спробувати? Пишіть у коментарях та не забувайте про лайки

Все, побачимось зовсім скоро у прямому ефірі о 17:00!

Ми починаємо прямий ефір, доєднуйтесь

https://www.instagram.com/jannykyr/

Друзі, дякую усім, хто був присутнім на прямому ефірі про співбесіди і хто задавав питання! Атмосфера була 🔥🔥🔥

Сподіваюся, вам сподобалося і ви отримали корисний контент🥰

Переглянути запис можна тут:

https://www.instagram.com/tv/Ct1mWzgI1QE/?igshid=MzRlODBiNWFlZA==

Дуже чекаю на ваш фідбек 🤗