Design.Hub: все про UI/UX та графічний дизайн


Гео и язык канала: Украина, Украинский
Категория: Дизайн


Приєднуйся до інших напрямків:
Новини: https://t.me/designhub_news
Складчина сервісів: https://t.me/designhub_sklad
Реклама — @TeLeAds
Купити рекламу: https://teleads.com.ua/?r=nxa4mpne:775
Питання, пропозиції, реклама: https://t.me/erikts7

Связанные каналы  |  Похожие каналы

Гео и язык канала
Украина, Украинский
Категория
Дизайн
Статистика
Фильтр публикаций


Розробляємо дизайн карток: детальний посібник

Картки — це універсальні компоненти інтерфейсу, які організовують інформацію у зрозумілому форматі.

Анатомія картки:
- Header: Заголовок або зображення для контексту (напр. у картках товарів).
- Body: Основний текст із лаконічним описом, тегами чи іконками.
- Footer: Кнопки дій (наприклад, «Купити»), які не виходять за межі картки.

📓Детально

#Стаття

Підписатись на канал | Design.Hub:чат дизайнерів


Репост из: Ерік Цуриков: про UI/UX дизайн, фріланс, гроші, розвиток
🔥Сьогодні розкрию цінність та важливість першого модулю безкоштовного курсу по UX.

Нагадаю, що курс буде виходити на моєму YouTube каналі: https://www.youtube.com/@chronicwebdesign
Всі новини та деталі по курсу краще за все стежити тут: https://t.me/eric_uiux

В перший модуль будуть входити 4 безкоштовні та 1 закритий (платний) урок:
1. Що таке UX дизайн?
2. Інструменти для роботи з UX
3. Використання UX в E-Commerce
4. Основні дії UX дизайнера на початковому рівні
5. Аналіз сфери замовника/компанії та визначення сильних та слабких частин бізнесу [Закритий урок]

Тепер детальніше по модулю:
💎Що таке UX дизайн?
Урок розкриває поняття UX дизайну, його важливість та основні принципи: корисність, зручність і бажаність. Ви дізнаєтесь про процес UX-дизайну, різницю між UX та UI, а також основні ідею UX по цьому курсу. Початківці отримають поради для старту та розвитку практичних навичок.

💎Інструменти для роботи з UX
Урок знайомить із базовими інструментами для UX-дизайну, які допомагають у дослідженнях, брейнштормінгу та створенні прототипів. Розглядаються як прості засоби, так і цифрові рішення, з акцентом на їх застосування в командній роботі та аналізі даних.

💎Використання UX в E-Commerce
Цей урок пояснює, як правильний UX-дизайн може збільшити прибутковість інтернет-магазинів. Ви дізнаєтесь ключові принципи UX для E-Commerce. Наприкінці — перше практичне завдання із фідбеком у закритому чаті!

💎Основні дії UX дизайнера на початковому рівні
Цей урок розповідає про основний алгоритм роботи UX-дизайнера: від аналізу аудиторії та конкурентів до створення прототипів і тестування. Ви дізнаєтесь, як зрозуміти задачу, побудувати зручний user flow та отримати результати UX-досліджень для створення якісного продукту.

💎Аналіз сфери замовника/компанії та визначення сильних та слабких частин бізнесу [⚠️Закритий урок]
Урок присвячений оцінці бізнесу перед початком UX-досліджень. Ви дізнаєтесь, як аналізувати тип замовника, сильні та слабкі сторони продукту, конкурентоспроможність і філософію компанії. Також розглядається алгоритм підготовки до досліджень для створення ефективного дизайну.

В кінці модулю проведемо стрім, де половину часу приділю цікавим рішенням в домашній роботі учнів, а іншу половину - для відповіді на питання.


Picjumbo — це ресурс для безкоштовного завантаження якісних стокових фотографій для особистих та комерційних проєктів.

Особливості:
🔺 Категорії: фото природи, їжі, технологій, бізнесу тощо.
🔺 Підходить для професійного використання.
🔺 Преміум-пакети — доступ до ексклюзивних фотографій і колекцій.

Тарифні плани:
- Безкоштовний доступ — завантаження стандартних фото без оплати.
- Преміум-доступ — від $10/місяць для розширеного вибору зображень та ексклюзивних матеріалів.

#Корисне

Підписатись на канал | Design.Hub:чат дизайнерів


Репост из: Ерік Цуриков: про UI/UX дизайн, фріланс, гроші, розвиток
🚀Нове відео на каналі

Зробив для вас детальний гайд, як зробити правильно працюючий Dropdown у Figma, щоб можна було і анімацію замовнику показати, і перед іншими дизайнера покрасуватись 😎

🍌 https://youtu.be/EqD-IMhWrHE?si=SGhepyq_yofLWbme

Обовʼязково чекаю від вас коментаря під відео!

А поки сів писати опис першого модулю курсу по UX, та все, що вас очікує в цьому модулі 🤫


Бренди

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

- https://www.generategroup.se/
- https://betterstack.com/enterprise
- https://global-c.nl/

#Натхнення

Підписатись на канал | Design.Hub:чат дизайнерів


Який з цих логотипів Acer актуальний?
Опрос
  •   А
  •   Б
180 голосов


Актуальне лого

🔍 Який з цих логотипів Acer актуальний?

1️⃣ Логотип A
2️⃣ Логотип Б

Цікавий факт: Acer створив технологією ColorPlus, що забезпечує максимально точне відтворення кольорів — настільки, що її використовують у кіностудіях для монтажу блокбастерів.

Відповідь ставити в опитування⬇️

#АктуальнеЛого

Підписатись на канал | Design.Hub:чат дизайнерів


Helvetica Neue

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

- https://www.therounds.co/
- https://www.suzywelch.com/
- https://hona.ai/

#Натхнення

Підписатись на канал | Design.Hub:чат дизайнерів


Color Calculator — інструмент для створення та тестування кольорових схем. Він дозволяє експериментувати з різними кольорами, перевіряти їх комбінації та створювати гармонійні палітри з урахуванням теорії кольору.

#Корисне

Підписатись на канал | Design.Hub:чат дизайнерів


Вступ до анімації, керованої прокручуванням CSS

Анімація, керована прокручуванням, тепер доступна на чистому CSS, без JavaScript або сторонніх бібліотек, що забезпечує високу продуктивність завдяки прискоренню GPU. Ці анімації виходять за межі стандартного потоку HTML, дозволяючи створювати ефекти, такі як 3D-обертання та анімація обкладинок.

Підтримка:
- Chrome (з грудня 2024) та Firefox (з вимкнутими налаштуваннями).
- Safari поки не підтримує, але є можливість використовувати polyfill.

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

📕Детально

#Стаття

Підписатись на канал | Design.Hub:чат дизайнерів


Savee — платформа, яка дозволяє зберігати, організовувати та ділитися референсами.

Можуть налаштувати стрічку, вибирати розмір зображень, регулювати відстань між ними та створювати колекції за темами.

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

#Корисне

Підписатись на канал | Design.Hub:чат дизайнерів


Репост из: Ерік Цуриков: про UI/UX дизайн, фріланс, гроші, розвиток
Всім привіт! 👋

Десь в середині лютого 2025 стартує безкоштовний курс по UX!
Це великий проєкт, у який я вклав багато часу, і впевнений — воно того варте.

Сьогодні ділюсь коротким описом модулів курсу:

1. Основи UX дизайну
Базові принципи та інструменти UX для всіх проєктів. Буде домашка та стрім для закріплення знань.

2. Патерни UX
Огляд ключових патернів для створення зручних інтерфейсів.

3. Дослідження та аналіз UX даних

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

4. Від теорії до практики

Практичний модуль: від ідеї до прототипу. Після кожної домашки — стрім для фідбеку🚀

5. Правильний підхід до UX
Фінальний модуль про вміння презентувати UX частину проєкту та важливі поради.

В кінці всіх 30 уроків буде великий стрім, де я відповім на питання та підкажу, як рухатись далі.

Пізніше розкажу про кожен модуль окремо і як приєднатись до закритого чату для фідбеку.

🌭Є питання? Пишіть в чат або в особисті!

395 0 5 10 57

Медичні заклади

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

https://goodcells.com/
https://my.clevelandclinic.org/
https://www.hopkinsmedicine.org/

#Натхнення

Підписатись на канал | Design.Hub:чат дизайнерів


Шрифт Univermag

Univermag – шрифт, натхненний стилем букв на фасадах магазинів 70-х років. Автор створив його, досліджуючи типографічні архіви й адаптуючи традиційний вигляд до сучасних потреб дизайнерів.

#Корисне

Підписатись на канал | Design.Hub:чат дизайнерів


Оптимізація зображень для вебдизайну: 5 порад та 3 інструменти

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

- SVG: ідеально для логотипів, іконок і тексту. Малий розмір і чіткість на будь-яких екранах.
- WebP/AVIF: чудові для адаптивних зображень і слайд-шоу. Значно менші, ніж PNG та JPEG, без втрати якості.

📚Детально

#Стаття

Підписатись на канал | Design.Hub:чат дизайнерів


Прайс

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

- https://www.openlayer.com/pricing
- https://www.perspective.co/pricing
- https://copyui.com/pricing

Сподобалось? Став ❤️


#Натхнення

Підписатись на канал | Design.Hub:чат дизайнерів


20 актуальних трендів графічного та вебдизайну

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

Деякі з них:
— AI-сюрреалізм
— Необруталізм
— Ретрофутуризм
— Геометричні патерни

✏️Більше тут

#Стаття

Підписатись на канал | Design.Hub:чат дизайнерів


Прайс

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

- https://www.openlayer.com/pricing
- https://www.perspective.co/pricing
- https://copyui.com/pricing

Сподобалось? Став ❤️


#Натхнення

Підписатись на канал | Design.Hub:чат дизайнерів


21 стратегія для підвищення залучення та утримання користувачів

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

Ось кілька найпопулярніших фреймворків поведінкового дизайну:

1. Модель гачка: тригер, дія, змінна винагорода, інвестиції — формує звички користувачів.
2. Петля звички: сигнал, рутина, винагорода — цикл для формування звичок.
3. Фреймворк EAST: поведінка має бути простою, привабливою, соціальною, своєчасною.
4. Модель COM: поведінка залежить від здібностей, можливостей та мотивації.
5. Модель поведінки Б. Дж. Фогга FBM: мотивація, можливість, тригер — для виникнення поведінки.
6. Теорія підштовхування: малопомітні зміни, які сприяють бажаним діям без обмеження вибору.

📘Читати тут

#Стаття

Підписатись на канал | Design.Hub:чат дизайнерів


Pantone обрав колір року 2025

Цього року Інститут кольору Pantone представив PANTONE 17-1230 Mocha Mousse — теплий коричневий відтінок, що символізує комфорт і гармонію. Натхнений насиченими тонами шоколаду й кави, він відображає глобальне прагнення до затишку та зв’язку.

Подобається колір?

Підписатись на канал | Design.Hub:чат дизайнерів

Показано 20 последних публикаций.