DentaFlow: UI-кіт для стоматологічної клініки у Figma

DentaFlow - це повний UI-кіт у Figma для програмного забезпечення стоматологічних клінік. Він містить адміністративну панель, мобільний застосунок для пацієнтів і маркетинговий сайт клініки, усе на основі єдиної дизайн-системи. Якщо ви проєктуєте для стоматологів, ортодонтів або клінік з кількома кріслами, цей кіт дає готові до виробництва екрани, щоб вам не доводилося починати з чистого аркуша.

Чим він відрізняється
Більшість UI-кітів для сфери охорони здоров’я створені для універсальних медичних застосунків. DentaFlow створений саме для стоматологічних робочих процесів. В його основі повністю редагована зубна формула (одонтограма, Tooth Chart) з нумерацією FDI, для дорослих і дітей. Кожен зуб має 5 поверхонь, які можна заповнювати окремо, і 10 станів, зокрема карієс, пломба, коронка, лікування каналів, імплант, відсутній зуб і міст.

Що входить до набору

• Адмінпанель клініки (1440 px): огляд панелі, календар прийомів за кріслами та лікарями, список пацієнтів, картка пацієнта із зубною формулою, плани лікування, рентген-знімки й документи, оплати та рахунки, персонал, склад, звіти та налаштування

• Мобільний застосунок пацієнта (390 px): знайомство, вхід, головна, запис на прийом у 4 кроки, перебіг лікування, відстеження елайнерів і брекетів, нагадування, платежі, чат, сімейні профілі та сповіщення

• Сайт клініки (десктоп + мобільна версія): головна сторінка з галереєю усмішок до/після, послуги, профілі лікарів, онлайн-запис і контакти

• Стоматологічні компоненти: зуб, зубна формула, елемент плану лікування, блок розкладу крісла, картка рентген-знімка та рядок пародонтальної карти

• Базові компоненти: кнопки, поля введення, вибір дати й часу, таблиці, картки, бейджі, модальні вікна, бокові панелі, навігація, тости, порожні стани та інше

Ключові особливості

• Повністю створений на Figma Variables: кольори, відступи й радіуси, без жорстко заданих значень

• Світлий і темний режими, що перемикаються одним кліком

• Auto layout скрізь, охайні назви шарів і компоненти з назвами через скісну риску

• Компоненти з варіантами та властивостями (булеві, текстові й заміна екземпляра)

• Контраст кольорів WCAG 2.1 AA і мобільні зони дотику 44 px

• Екрани RTL арабською для проєктів клінік у країнах Перської затоки та на Близькому Сході

• Реалістичні приклади даних для вигаданої клініки, готові для презентацій клієнтам

• Використовує безкоштовні шрифти Google: Inter та IBM Plex Sans Arabic

Чудово підходить для

• Програм для керування стоматологічними клініками (SaaS)

• Застосунків запису на прийом для мереж стоматологій

• Застосунків ортодонтичного лікування та елайнерів

• Сайтів стоматологів і клінік

• Презентацій клієнтам, MVP і прототипів

• Дизайнерських портфоліо у сфері охорони здоров’я

Як це працює

1. Завантажте файл і відкрийте його у Figma. Підійде безкоштовний акаунт Figma.

2. Почніть зі сторінки Read Me, яка пояснює, як працюють змінні, режими й компоненти.

3. Змініть кольори бренду у змінних, і весь кіт оновиться.

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

Деталі файлу

• Формат: Figma (.fig)

• 1 файл Figma, розділений на сторінки: Foundations, Components, Dental Components, Dashboard, Mobile App, Website і RTL

• Шрифти: Inter та IBM Plex Sans Arabic (безкоштовні, Google Fonts)

• Зображення в превʼю є заглушками й не входять до набору