Eatin
Проектирование продукта с нуля: от исследований до финального UI и сопровождения разработки
О компании
Eatin — сервис, который помогает формировать здоровые пищевые привычки через персонализированные рекомендации. Продукт объединяет каталог рецептов, каталог продуктов и персональный рацион, оставаясь при этом простым и визуально приятным.
Моя роль
Единственный дизайнер на проекте. Отвечал за весь дизайн-процесс, и все ключевые решения по продукту и интерфейсу принимались мной:
UX-исследования и формирование гипотез
Проектирование пользовательских сценариев
Визуальный дизайн и дизайн-система
Постановка задач графическому дизайнеру
Дизайн-ревью и сопровождение разработки
Задача
Команда пришла с идеей продукта, который помогает людям питаться осознанно. Нужно было решить три задачи:
01
Упростить выбор рациона
Снизить усилия, которые тратит пользователь на планирование питания.
02
Снизить порог входа в тему
Сделать питание понятным для тех, кто далёк от КБЖУ и диетологии.
03
Сделать опыт лёгким и регулярным
Чтобы возвращаться в продукт было просто и приятно.
Процесс
Проработка продукта и гипотезы
Зафиксировал цели, ключевые сценарии и первые гипотезы. Вместе с командой определил сегменты аудитории, их боли и мотивацию при составлении рациона, сгенерировал и приоритизировал гипотезы.
Исследование и бенчмаркинг
Сформировал пользовательские сценарии. Изучил foodtech-продукты и разобрал паттерны рекомендаций, рационов и трекинга — чтобы опереться на проверенные решения, а не изобретать с нуля.
Прототипирование
Спроектировал вайрфреймы всех ключевых экранов, интерактивные сценарии и логику навигации.
Дизайн-система
Разработал базовые компоненты, состояния и правила использования — для консистентности и быстрой сборки новых экранов.
Интерфейс
Задизайнил все ключевые экраны и состояния с адаптацией под Telegram Mini App. Поставил задачи графическому дизайнеру: визуальный стиль, иллюстрации, маскот.
Прод-ревью
Проверял, как интерфейс отрисовывается в боевой среде: сверял
реализацию с макетами, отлавливал расхождения в отступах,
состояниях и поведении, доводил до соответствия дизайну.
Итог
Провёл продукт от концепции до работающего запуска, единолично закрыв весь дизайн — исследования, UX, дизайн-систему и финальный UI. Eatin вышел в бой, набрал 2000+ продаж в первый месяц и продолжает развиваться: сейчас проектирую новый функционал (дневник по приёмам пищи, конструктор блюд, пользовательские ингредиенты).
Продукт получился таким, каким задумывался: простой вход в тему питания, понятный рацион и лёгкий регулярный сценарий использования.
Следующий кейс
Редизайн LMS-системы
![](data:image/svg+xml,<svg display="block" id="585695186" role="presentation" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M 14.995 1.127 C 14.786 3.412 13.886 8.954 13.429 11.512 C 13.236 12.595 12.855 12.958 12.485 12.994 C 11.683 13.071 11.073 12.439 10.296 11.906 C 9.081 11.073 8.394 10.554 7.214 9.74 C 5.85 8.802 6.734 8.285 7.512 7.441 C 7.716 7.22 11.25 3.858 11.317 3.553 C 11.327 3.514 11.335 3.373 11.254 3.297 C 11.172 3.223 11.054 3.248 10.968 3.269 C 10.845 3.297 8.903 4.64 5.141 7.296 C 4.59 7.692 4.091 7.883 3.643 7.875 C 3.15 7.863 2.202 7.583 1.496 7.343 C 0.63 7.049 -0.057 6.893 0.004 6.393 C 0.034 6.134 0.377 5.868 1.03 5.596 C 3.708 4.368 6.393 3.158 9.086 1.968 C 12.922 0.298 13.72 0.008 14.239 0 C 14.353 -0.003 14.608 0.028 14.774 0.167 C 14.885 0.267 14.956 0.407 14.972 0.559 C 14.999 0.747 15.006 0.938 14.995 1.127 Z" fill="rgb(194, 194, 194)" height="13px" id="T7ZfnslQC" transform="translate(0.5 1.5)" width="15px"/></svg>)
![](data:image/svg+xml,<svg display="block" id="506258810" role="presentation" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g d="M 0.247 4.981 L 3.356 4.981 L 3.356 15 L 0.247 15 Z M 1.802 0 C 2.795 0 3.603 0.809 3.603 1.806 C 3.603 2.803 2.795 3.612 1.802 3.612 C 0.805 3.612 0 2.803 0 1.806 C 0 0.809 0.805 0 1.802 0 M 5.306 4.981 L 8.288 4.981 L 8.288 6.351 L 8.33 6.351 C 8.745 5.563 9.759 4.732 11.271 4.732 C 14.419 4.732 15 6.807 15 9.505 L 15 15 L 11.893 15 L 11.893 10.128 C 11.893 8.965 11.873 7.471 10.278 7.471 C 8.66 7.471 8.413 8.738 8.413 10.044 L 8.413 15 L 5.306 15 Z" fill="transparent" height="15.00000012629113px" id="O1aon0Q__" transform="translate(0.5 0.5)" width="15.000000161756063px"><path d="M 0.247 4.981 L 3.356 4.981 L 3.356 15 L 0.247 15 Z M 1.802 0 C 2.795 0 3.603 0.809 3.603 1.806 C 3.603 2.803 2.795 3.612 1.802 3.612 C 0.805 3.612 0 2.803 0 1.806 C 0 0.809 0.805 0 1.802 0 M 5.306 4.981 L 8.288 4.981 L 8.288 6.351 L 8.33 6.351 C 8.745 5.563 9.759 4.732 11.271 4.732 C 14.419 4.732 15 6.807 15 9.505 L 15 15 L 11.893 15 L 11.893 10.128 C 11.893 8.965 11.873 7.471 10.278 7.471 C 8.66 7.471 8.413 8.738 8.413 10.044 L 8.413 15 L 5.306 15 Z" fill="rgb(194, 194, 194)" height="15.00000012629113px" id="wKb7EESyl" width="15.000000161756063px"/></g></svg>)
![](data:image/svg+xml,<svg display="block" id="553616452" role="presentation" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g d="M 0 0 L 16 0 L 16 16 L 0 16 Z M 7.365 9.883 L 9.886 7.362 C 10.13 7.141 10.232 6.804 10.152 6.485 C 10.072 6.165 9.823 5.916 9.504 5.836 C 9.185 5.756 8.847 5.858 8.626 6.102 L 6.104 8.622 C 5.864 8.844 5.765 9.18 5.845 9.497 C 5.925 9.814 6.173 10.061 6.49 10.142 C 6.807 10.222 7.142 10.123 7.364 9.883 Z M 10.938 0 C 9.598 -0.004 8.311 0.528 7.365 1.478 L 5.683 3.16 C 5.426 3.414 5.348 3.799 5.487 4.133 C 5.625 4.467 5.952 4.685 6.313 4.683 C 6.55 4.682 6.777 4.588 6.943 4.42 L 8.625 2.738 C 9.907 1.492 11.952 1.507 13.216 2.771 C 14.48 4.035 14.495 6.08 13.249 7.362 L 11.567 9.044 C 11.248 9.396 11.261 9.938 11.597 10.274 C 11.934 10.611 12.475 10.624 12.827 10.304 L 14.509 8.623 C 15.955 7.179 16.388 5.005 15.606 3.117 C 14.824 1.229 12.981 -0.001 10.937 0 Z M 5.053 15.984 C 6.394 15.989 7.68 15.457 8.625 14.507 L 10.307 12.825 C 10.656 12.477 10.656 11.913 10.308 11.565 C 9.96 11.216 9.396 11.216 9.047 11.564 L 7.365 13.246 C 6.547 14.107 5.326 14.456 4.176 14.159 C 3.026 13.861 2.128 12.963 1.83 11.813 C 1.532 10.663 1.881 9.442 2.742 8.623 L 4.423 6.94 C 4.772 6.592 4.772 6.028 4.424 5.68 C 4.076 5.331 3.512 5.331 3.163 5.679 L 1.48 7.362 C 0.035 8.806 -0.397 10.979 0.385 12.867 C 1.167 14.755 3.009 15.985 5.052 15.984 Z" fill="transparent" height="16.000024399718313px" id="ThbyazLrg" width="16.000370308669517px"><path d="M 0 0 L 16 0 L 16 16 L 0 16 Z" fill="transparent" height="16px" id="hoPp7UXDR" transform="translate(0 0)" width="16px"/><path d="M 1.548 4.074 L 4.069 1.553 C 4.312 1.331 4.415 0.994 4.335 0.675 C 4.255 0.356 4.005 0.107 3.686 0.027 C 3.367 -0.053 3.03 0.049 2.809 0.293 L 0.287 2.813 C 0.047 3.034 -0.053 3.37 0.027 3.687 C 0.108 4.004 0.355 4.252 0.672 4.332 C 0.989 4.413 1.325 4.314 1.547 4.074 Z" fill="rgb(194, 194, 194)" height="4.359905558653117px" id="LC1MVMCJ0" transform="translate(5.817 5.809)" width="4.361425285632996px"/><path d="M 10.938 0 C 9.598 -0.004 8.311 0.528 7.365 1.478 L 5.683 3.16 C 5.426 3.414 5.348 3.799 5.487 4.133 C 5.625 4.467 5.952 4.685 6.313 4.683 C 6.55 4.682 6.777 4.588 6.943 4.42 L 8.625 2.738 C 9.907 1.492 11.952 1.507 13.216 2.771 C 14.48 4.035 14.495 6.08 13.249 7.362 L 11.567 9.044 C 11.248 9.396 11.261 9.938 11.597 10.274 C 11.934 10.611 12.475 10.624 12.827 10.304 L 14.509 8.623 C 15.955 7.179 16.388 5.005 15.606 3.117 C 14.824 1.229 12.981 -0.001 10.937 0 Z M 5.053 15.984 C 6.394 15.989 7.68 15.457 8.625 14.507 L 10.307 12.825 C 10.656 12.477 10.656 11.913 10.308 11.565 C 9.96 11.216 9.396 11.216 9.047 11.564 L 7.365 13.246 C 6.547 14.107 5.326 14.456 4.176 14.159 C 3.026 13.861 2.128 12.963 1.83 11.813 C 1.532 10.663 1.881 9.442 2.742 8.623 L 4.423 6.94 C 4.772 6.592 4.772 6.028 4.424 5.68 C 4.076 5.331 3.512 5.331 3.163 5.679 L 1.48 7.362 C 0.035 8.806 -0.397 10.979 0.385 12.867 C 1.167 14.755 3.009 15.985 5.052 15.984 Z" fill="rgb(194, 194, 194)" height="15.984055700602884px" id="mY5tYf2B5" transform="translate(0 0)" width="15.990742272024047px"/><path d="M 15 0 L 4.687 11 L 0 6" display="none" fill="transparent" height="11px" id="UhC9FCvX_" stroke-dasharray="" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" stroke="rgb(194, 194, 194)" transform="translate(1 3)" width="15px"/></g></svg>)