Практичний UI: Дизайн-система Figma

Практичний UI: Дизайн-система Figma
en
07.08.2024

Легка та потужна система дизайну Figma та UI kit допоможуть вам розробити практично будь-який веб-сайт або програму, яку ви можете собі уявити.

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

Створено з використанням найновіших функцій Figma та найкращих практик 2024 року. Легко та швидко налаштовуйте компоненти за допомогою оптимізованого авто-лейауту, змінних, властивостей та варіантів.

Дизайн інтуїтивний, доступний та красивий. Кожен компонент розроблений з урахуванням зручності використання та повністю відповідає стандарту WCAG 2.1 рівня AA.

Настроювані стилі

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

Змінні для квітів
Світлий та темний режими
Змінні для інтервалів
Змінні для друкарні
Тіні для рівнів
Літаут сітки з кроком 4px
Проста, але потужна колірна система

Стиснутий набір змінних кольорів, названих і організованих залежно від їх використання. Легко досліджувана, але досить гнучка для масштабування у складних системах дизайну.

Зумовлені колірні змінні дозволяють автоматично перемикатися між світлим та темним режимом миттєво.

Правильна глибина

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

Інтуїтивні компоненти

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

Сотні варіантів
Потужні властивості
Дизайн найкращих практик
Легкість використання та налаштування
Стан взаємодії для прототипування
Включено авто-лейаут
Стан взаємодії

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

Прозорі шари стану

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

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

Ідеально опрацьовані іконки

Використовуйте красивий, нейтральний і відкритий Feather набір іконок або додати свої власні.

300+ іконок з відкритим кодом
Товщина лінії 2px
Сітка 24px x 24px
Створено із Practical UI

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

На основі посібників з дизайну з книги

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

Ви не можете переглядати цей курс -