Кейс UI/UX: Кастомний інтерфейс для Me4Hik Safe Site Audit Local
Задача: Упакувати складний функціонал технічного SEO/Security-аудиту в зручний локальний Windows-додаток.
Зазвичай подібні утиліти виглядають як стандартні сірі вікна з десятками незрозумілих налаштувань або як гола консоль. Я пішов іншим шляхом: створив інтерфейс, який не тільки інтуїтивно зрозумілий, але й має яскраву, преміальну візуальну ідентичність.
Візуальна концепція: Gothic Tech / Dark Fantasy
Додаток виглядає як елітне ПЗ або артефакт. Я повністю відмовився від нативних елементів Windows на користь кастомної графіки.
Глибока темна палітра з неоново-фіолетовими акцентами.
Декоративні рамки та статусні блоки, намальовані вручну.
Абсолютний фокус на головному цільовому дії (світлова кнопка запуску).
UX-архітектура: Правило одного кліка
Інтерфейс спроектований так, щоб не відволікати користувача. Ніяких перевантажених меню та зайвих чекбоксів. Сценарій лінійний і безвідмовний:
Вставив URL.
Натиснув Run Safe Audit.
Дочекався відповіді в статусному вікні.
Вся панель додаткових дій (відкриття Markdown-звіту, перехід у папку, копіювання промпта для GPT) згрупована внизу і не відволікає увагу до завершення основної задачі.
Технічна реалізація UI (Рівень Hard)
Найбільша складність проекту — обмеження технології. Інтерфейс зібрано на базі WinForms (.NET класи) поверх логіки Windows PowerShell 5.1.
Щоб це виглядало сучасно, я реалізував:
Складну роботу з ассетами: Підготовка PNG-елементів, ювелірне видалення фону, збереження прозорості та ручна підгонка розмірів для коректного рендеру в вікні WinForms.
Інтерактивні стани: Прописана логіка для станів normal, hover і disabled для всіх кнопок (головної та вторинних), щоб інтерфейс був чутливим.
Безшовну інтеграцію: Вирівнювання шарів і графіки без використання сучасних CSS-фреймворків — чистий хардкор у коді.
Результат: Авторський інструмент, який під капотом працює як швейцарські годинники, а зовні виглядає дорого і нестандартно. Доказ того, що навіть суто технічні утиліти заслуговують крутого UI.
Зазвичай подібні утиліти виглядають як стандартні сірі вікна з десятками незрозумілих налаштувань або як гола консоль. Я пішов іншим шляхом: створив інтерфейс, який не тільки інтуїтивно зрозумілий, але й має яскраву, преміальну візуальну ідентичність.
Візуальна концепція: Gothic Tech / Dark Fantasy
Додаток виглядає як елітне ПЗ або артефакт. Я повністю відмовився від нативних елементів Windows на користь кастомної графіки.
Глибока темна палітра з неоново-фіолетовими акцентами.
Декоративні рамки та статусні блоки, намальовані вручну.
Абсолютний фокус на головному цільовому дії (світлова кнопка запуску).
UX-архітектура: Правило одного кліка
Інтерфейс спроектований так, щоб не відволікати користувача. Ніяких перевантажених меню та зайвих чекбоксів. Сценарій лінійний і безвідмовний:
Вставив URL.
Натиснув Run Safe Audit.
Дочекався відповіді в статусному вікні.
Вся панель додаткових дій (відкриття Markdown-звіту, перехід у папку, копіювання промпта для GPT) згрупована внизу і не відволікає увагу до завершення основної задачі.
Технічна реалізація UI (Рівень Hard)
Найбільша складність проекту — обмеження технології. Інтерфейс зібрано на базі WinForms (.NET класи) поверх логіки Windows PowerShell 5.1.
Щоб це виглядало сучасно, я реалізував:
Складну роботу з ассетами: Підготовка PNG-елементів, ювелірне видалення фону, збереження прозорості та ручна підгонка розмірів для коректного рендеру в вікні WinForms.
Інтерактивні стани: Прописана логіка для станів normal, hover і disabled для всіх кнопок (головної та вторинних), щоб інтерфейс був чутливим.
Безшовну інтеграцію: Вирівнювання шарів і графіки без використання сучасних CSS-фреймворків — чистий хардкор у коді.
Результат: Авторський інструмент, який під капотом працює як швейцарські годинники, а зовні виглядає дорого і нестандартно. Доказ того, що навіть суто технічні утиліти заслуговують крутого UI.
Київ 
Вільний для роботи
Запропонувати роботу