Детальная Вёрстка проекта!
20 000 UAHFigma проекта https://www.figma.com/design/O1ZFkM0Ugian1oUkMcq8qX/Untitled?node-id=1733-5461&t=uwr78V10NVNWzq6F-1
🔒 ТЕХНИЧЕСКОЕ ЗАДАНИЕ
ФРОНТЕНД-ВЕРСТКА ПО МАКЕТУ FIGMA
(БЕЗ БЭКЕНДА / БЕЗ ЛОГИКИ / БЕЗ ХРАНЕНИЯ)
1. Цель работ
Сверстать пользовательский интерфейс сайта строго по макетам Figma (pixel-perfect)
❗ Исключительно фронтенд-верстка, без реализации серверной логики, хранения данных и бизнес-процессов.
Результат работ должен быть полностью готов к последующему подключению бэкенда, но не содержать его реализации.
2. Источник дизайна
Единственный источник истины — макеты Figma
Верстка выполняется 1 в 1:
размеры
отступы
шрифты
цвета
состояния элементов
Любые отклонения от Figma запрещены без согласования
3. Границы ответственности фронтенда (КРИТИЧНО)
🚫 Фронтенд НЕ ИМЕЕТ ПРАВА:
проектировать API
реализовывать бизнес-логику
хранить данные
делать авторизацию
делать расчёты
подключать БД
эмулировать «умное» поведение
Фронтенд ТОЛЬКО отображает интерфейс.
4. Формы (ОБЯЗАТЕЛЬНО)
4.1 Поведение форм
Все формы:
верстаются строго по Figma
содержат визуальную валидацию (required, error-state)
НЕ СОХРАНЯЮТ данные
НЕ ОТПРАВЛЯЮТ данные на сервер
4.2 Отправка формы
При submit:
console.log('Form submit mock', formData);
❗ Используется JS-заглушка, без fetch / axios / API.
5. Списки, карточки, таблицы
5.1 Источник данных
Все списки верстаются статично
Данные захардкожены (mock-data)
Структура HTML должна быть готова под API
Пример:
<div class="items-list">
<!-- items from API later -->
</div>
❗ Никакой логики загрузки данных.
6. Авторизация / регистрация
6.1 Строго только UI
Верстка экранов входа / регистрации
Поля, кнопки, состояния ошибок — только визуально
Никакой проверки логина/пароля
6.2 Поведение
Кнопка «Войти»:
console.log('Auth UI only');
❗ НЕТ:
JWT
cookies
localStorage
ролей
доступа
7. Кнопки и действия
7.1 Все кнопки
Обязаны иметь hover / active / disabled (если есть в Figma)
Не выполняют реальных действий
7.2 Поведение кнопок
console.log('Button clicked');
8. Модальные окна / попапы
Открываются/закрываются локальным JS
Без загрузки данных
Без привязки к API
Состояния строго по макету
9. Адаптивность
Обязательные брейкпоинты:
Desktop
Tablet
Mobile
Верстка строго по адаптивным макетам Figma
Самовольные решения запрещены.
10. Технические требования
HTML5
CSS / SCSS
Методология классов: BEM (или согласованная)
Чистая, читаемая структура
Компонентный подход
11. Подготовка под бэкенд (НО БЕЗ ЕГО РЕАЛИЗАЦИИ)
Фронтенд обязан:
оставить комментарии:
<!-- backend: data will be injected here -->
использовать нейтральные data-атрибуты
не делать предположений о логике API
12. Критерии приёмки
Работа принимается если:
Верстка визуально совпадает с Figma
Нет сетевых запросов
Нет хранения данных
Нет бизнес-логики
Весь интерактив — заглушки
Код готов для подключения бэкенда
13. Запрещено без согласования
❌ Самостоятельно:
придумывать логику
оптимизировать UX «по своему»
добавлять поведение не из Figma
писать API-клиенты
ВСЁ ДОЛЖНО РАБОТАТЬ И ВЫГЛЯДЕТЬ КАК В ФИГМЕ!
-
📌Здравствуйте.👋
⭐️Меня зовут,Андрей.
⭐️Мой опыт работы: 12 лет+
• ➡️Могу показать работы именно по вёрстке проектов
• 🎨Портфолио:Freelancehunt
• ✅Рейтинг работ на Behance (более 500.000 просмотров)
• 💼Больше работ тут:Dribbble
-
Валерий, ваш проект – вызов, с которым я готова справиться с энтузиазмом. Мой опыт в создании адаптивных интерфейсов точно по макетам Figma гарантирует безупречное соответствие вашему видению. Я уверена, что наши технические навыки позволят создать идеально интерактивный фронтенд, готовый к бэкенд-интеграции без каких-либо отклонений. Мое понимание адаптивности и компонентного подхода позволит вашему проекту выглядеть и функционировать безупречно на всех платформах. С нетерпением жду возможности обсудить ваши ожидания в дальнейшем.
-
Добрый день
готов обсудить детали в лс
...........................................
-
Реализую pixel-perfect верстку на HTML/SCSS по БЭМ с полной адаптивностью и JS-заглушками строго по ТЗ. Гарантирую чистую структуру под дальнейшую интеграцию бэкенда. Стоимость за весь объем — $450, срок — 10 рабочих дней.
Когда планируете открывать проект, чтобы я забронировал время под ваш объем?
-
375 1 0 Добрый день!
Готов выполнить ваш проект. Работаю с веб-разработкой и дизайном, имею практический опыт и портфолио.
Работал с клиентами из Украины и Европы, соблюдаю сроки и всегда на связи.
Готов обсудить детали и предложить оптимальное решение. Могу начать в ближайшее время.
-
313 1 0 Привет, понимаю, насколько важно воспроизвести дизайн без изменений на сайте, поэтому отвечаю за качество своих услуг.
Пишите, обсудим детали и прайс.
Отвечаю быстро!
-
10857 17 2 ✌️Здравствуйте, тоже с Хмельницкого))
Предлагаю свою кандидатуру. Задача ясна и не нова
10 дней, 20,000грн и у вас реализованный пиксель перфект фронтенд 1 в 1 как на макете
✔️ Вы не отличить реальный сайт от дизайна
✔️ Логика отображения будет реализована четко по ТЗ
… Работаем быстро, четко и без затрат ваших нервных клеток
🤝 Не вижу ни одной причины, почему наше сотрудничество не состоялось бы))
-
7672 16 0 1 Здравствуйте.
Я ознакомился с заданием.
Создам качественную верстку.
Напишите, обсудим детали проекта!
----------------------------------
Частный разработчик веб-сайтов. Опыт – 10 лет.
Дизайн, верстка, разработка сайтов Wordpress.
-
10524 179 3 3 Добрый день. Есть большой опыт разработки сайтов. Сделаю качественно и быстро. Пишите, обсудим детали
Мое портфолио
Freelancehunt
-
807 6 1 Добрый день!
Готов сделать сайт по вашему дизайну из Figma. Выполню чистую HTML-верстку с адаптивными версиями под мобильные устройства и планшеты, строго по макету.
Что реализую:
• Верстка сайта на HTML/CSS по дизайну из Figma
• Полная адаптивность: desktop / tablet / mobile
• Контактная форма с валидацией пустых и некорректно заполненных полей
• Всё строго по ТЗ
… • Чистый, структурированный код
Мои работы:
https://yesoriginal.com.ua/ https://beauty-prof.com/ https://biotop-professional.com.ua/
https://heko.lt/
http://jobsfor-you.com/
https://brightsmile.masterdev36.com/
https://velustro.masterdev36.com/novabuild/
https://wall-master.artbud.pro/
https://www.cardanmash.com.ua/
http://floridagardendesigns.com/
https://sugacards.com/
https://advilion.com
http://axiomaplus.com.ua/
https://maxinstal.ch/
http://otpad.com.ua/
http://spectrum.net.ua/
Готов приступить сразу
Актуальные фриланс-проекты в категории Дизайн интерфейсов (UI/UX)
Ленлендинг на Framer на основе дизайна из Claude/Figma, с адаптивностью и анимациями фото
4000 UAH
Сайт, сделанный в Клоде, полностью адаптивный и анимированный. Но нужно перенести его во Фреймер: так, чтобы все блоки были построены во Фреймере и можно было легко редактировать контент и дизайн. То есть не html код, вставленный по секциям, а именно перестроить. (Знаю, что… Дизайн интерфейсов (UI/UX), Дизайн сайтов ∙ 8 часов 24 минуты назад ∙ 6 ставок |
Баннер под сетку 3×3 в Instagram-профиле.ВНИМАНИЕ: Пожалуйста, ознакомьтесь с описанием проекта, прежде чем кидать шаблонный запрос. О продукте Juice — Telegram mini app дляcasual оффлайн-встреч в Батуми (Грузия). Пользователи находят и присоединяются к встречам (sport, social, games, networking) или создают свои.… Баннеры, Дизайн интерфейсов (UI/UX) ∙ 16 часов 14 минут назад ∙ 18 ставок |
Okta.comНеобходимо создать макет в figma для нового сайта. В качестве основы берется старый сайт (www.okta.ua), категории товаров, каталог и другой контент остаются. Нужно упростить бизнес-логику заказа товаров, изменить структуру страниц на более удобную. Дизайн интерфейсов (UI/UX) ∙ 3 дня 21 час назад ∙ 62 ставки |
Дизайн сайтовИщу веб-дизайнеров для разработки веб-дизайна. Понадобится опыт разработки сайтов и знание UI/UX Дизайн интерфейсов (UI/UX), Дизайн сайтов ∙ 4 дня 9 часов назад ∙ 119 ставок |
Редизайн интернет-магазина на ХорошопеЗадача: Нужен дизайнер / UX/UI специалист, который имеет опыт работы с платформой Хорошоп и сможет визуально обновить сайт LightForce: https://lightforce.com.ua/ Сайт технически работает, каталог наполнен, реклама запущена, но визуально сайт выглядит мягко говоря слабо. Нужно… Дизайн интерфейсов (UI/UX), Дизайн сайтов ∙ 4 дня 16 часов назад ∙ 24 ставки |