Что такое UX и UI — разбираем на пальцах

Приветствуем в курсе «UX/UI Дизайн с Нуля: Первые Шаги»! 🎉

Вы только начали путь в дизайн — и это замечательно. Многие начинают с мыслью: «Я ничего не понимаю в дизайне». Но на самом деле вы уже сталкивались с ним каждый день. Каждый раз, когда открываете приложение, заходите на сайт или пользуетесь смартфоном — вы взаимодействуете с дизайном.

Сейчас вы — как новичок в кулинарии, который ещё не знает, чем сковорода отличается от духовки. Но уже точно понимаете, когда еда невкусная. Так и в дизайне: вы чувствуете, когда что-то неудобно, даже если не можете объяснить почему.

Именно это мы и будем учиться понимать — и улучшать.


Что такое UX и UI — разбираем на пальцах

Давайте начнём с простого: вы решили заказать еду через приложение. Открыли, выбрали блюдо, добавили в корзину, перешли к оплате. Всё прошло быстро и понятно — вы довольны.

А теперь представьте: вы не можете найти, куда добавить еду. Кнопка «Корзина» едва видна. А когда переходите к оплате — приложение зависает. Вы раздражены.

Оба случая — про дизайн. Но разные его части.

UX — это то, как вы чувствуете себя, пользуясь приложением

UX (произносится как ю-икс) — это пользовательский опыт (User Experience).

Он отвечает на вопросы:

  • Удобно ли пользоваться?
  • Легко ли найти нужное?
  • Быстро ли получается решить задачу?
  • Не возникает ли стресса?

Если вы долго ищете кнопку, теряетесь в меню или не понимаете, что произошло после нажатия — это проблема UX.

UX — это логика, путь пользователя, плавность взаимодействия. Это не про красоту, а про то, чтобы всё работало понятно и без лишних усилий.


UI — это то, как выглядит приложение

UI (произносится как ю-ай) — это визуальный интерфейс (User Interface).

Он отвечает за:

  • Цвета
  • Шрифты
  • Иконки
  • Кнопки
  • Анимации

Если интерфейс яркий, современный, с приятными иконками и чётким шрифтом — это работа UI.

Но если, например, кнопки тусклые, текст мелкий, а цвета сливаются — даже при отличной логике UX, пользоваться будет некомфортно.

UI — это внешний вид, стиль, визуальная ясность. Это не про функцию, а про то, как всё выглядит и воспринимается глазами.


UX и UI: как они работают вместе?

Давайте сравним:

UX (пользовательский опыт)UI (визуальный интерфейс)
Отвечает за удобство и логикуОтвечает за внешний вид и стиль
Помогает пользователю решить задачуПомогает пользователю понять, что происходит
Пример: вы быстро нашли нужное блюдо и оформили заказПример: кнопки яркие, шрифт читаемый, иконки понятные
«Почему я не могу перейти к оплате?» — это UX-вопрос«Почему кнопка выглядит как обычная надпись?» — это UI-вопрос

Пример: один и тот же процесс — разный результат

Представим, что в приложении для заказа еды:

  1. Хороший UX + плохой UI

    • Всё логично: меню понятное, путь к заказу короткий.
    • Но: шрифт мелкий, цвета серые, кнопки не выделяются.
      → Вы понимаете, что делать, но напрягаетесь, чтобы разглядеть.
  2. Плохой UX + хороший UI

    • Всё красиво: яркие цвета, анимации, стильные иконки.
    • Но: кнопка «Заказать» спрятана, нет подсказок, после оплаты неясно, принят ли заказ.
      → Вы восхищаетесь видом, но теряетесь в процессе.
  3. Хороший UX + хороший UI

    • Путь простой, всё понятно, подсказки есть.
    • Визуально — чисто, читаемо, приятно глазу.
      → Вы заказываете еду за минуту и даже не задумываетесь о процессе.

Именно это и есть цель хорошего дизайна.


Практическое задание: найдите UX и UI у себя в телефоне

Откройте любое приложение, которое используете часто — например, банковское, доставку еды или соцсеть.

Посмотрите внимательно и ответьте:

  1. Что относится к UX?

    • Где вы чувствуете удобство или, наоборот, сложность?
    • Легко ли найти нужный раздел?
  2. Что относится к UI?

    • Как выглядят кнопки?
    • Удобно ли читать текст?
    • Нравится ли цветовая гамма?

Напишите 1–2 примера для каждого. Это поможет закрепить понимание.

💡 Подсказка: UX — про что вы делаете, UI — про как это выглядит.


Что дальше?

Теперь вы знаете, что UX — это про логику и удобство, а UI — про визуал и стиль.

Но возникает вопрос: зачем вообще всё это нужно?

Многие думают, что дизайнер — это тот, кто «делает красиво». Но это заблуждение.

Дизайн — это не про красоту. Это про решение задач.

В следующей теме **«Почему дизайн — это не про красот游戏副本