Реализация лендинга на React js, Tailwind (уже есть код, его нужно доработать до макета в Figma)
880 UAH
Успешный результат = успешно пройденный Speed Test сайта и полное соответствие макету.
Доступ к макету в Figma, Google Drive со всеми фото и иконками (их желательно делать через код иконки, но как получится), zip файл с существующим кодом (который нужно либо доработать, либо переделать - как Вам удобнее) - все я предоставлю в личных сообщениях.
Не пугайтесь, здесь довольно много описано, но в целом основная цель - сделать как в макете, физика уже реализована, просто нужно сделать много ПРАВОК в коде. Если где-то будут проблемы с текстом - я сама смогу исправить в коде, потому что я учусь на программиста, мне это просто не нравится и я не знаю React js. Главное, чтобы макет был адаптивным. Обращайте внимание на отступы, используется 3 шрифта (Lexend Exa, Lexend Mega, Lexend Zetta). Поэтому, пожалуйста, просто кликайте в макете, смотрите отступы, по бокам везде 80 пикселей от экранов (каждый блок разделен на экраны), все централизовано по этим экранам. Все неоновые элементы - это просто дубликат одного элемента с разным Layer Blur (50, 25, 15, 10, 5 (почти везде), в некоторых отличается градиент по цветам. Я оставлю Вам очень крутой отзыв и вы сможете использовать мою работу в портфолио.
Дополнительное описание:
1. Анимация раздела Tools: Я бы хотела, чтобы иконки в разделе Tools были анимированы как «стеклянные шарики». Они должны реалистично падать вниз под действием гравитации, накапливаться там и слегка перекатываться с боку на бок при взаимодействии или столкновении. Убрать рамку, которая есть в существующем коде. В идеале было бы сделать их более стеклянными, но можно оставить и как в макете. (сама физика уже реализована)
2. Просмотр Case Studies (PDF Modal): При нажатии на кнопку «Full Project» должно открываться модальное окно с просмотром моей PDF-презентации. (!!!!!но это уже реализовано)
Функционал: возможность листать страницы внутри окна.
Дизайн: лаконичная анимированная кнопка-крестик в верхнем правом углу для закрытия (это также уже есть)
3. Дополнительные сертификаты: В разделе с сертификатами при нажатии на кнопку должно появляться модальное окно.
Стилистика: эффект матового стекла (glassmorphism) с градиентом.
Контент: там должны быть еще 2 сертификата, которые не вошли в основную сетку, с возможностью легко добавлять новые через код в будущем. (когда кликаешь на сертификат он открывается (как презентации))
4. Функция «View Explanation» в Tools: При нажатии на «View Explanation» круглые иконки инструментов должны трансформироваться (или заменяться) на карточки с названием и коротким описанием. Описание должно быть под каждую иконку, поэтому в этом всплывающем окне можно листать вниз.
Примеры текстов: * Speed Test: «Высокая скорость сайта может снизить стоимость клика (CPC)».
GTM: «Помогает настраивать аналитику без привлечения программистов».
GA4: «Помогает анализировать данные и не сливать рекламный бюджет».
5. Валидация и логика лид-формы:
Ошибка: Если обязательные поля не заполнены, форма не должна отправляться. Нужно добавить визуальный эффект (свечения/glow) вокруг незаполненных полей. (это уже реализовано!!!)
Успех: После успешной отправки должно появляться PopUp с текстом: «Request sent. Let’s see how we can scale your results soon!». (я могу сделать это или сразу, или как дойдете до этого пункта, вообще логика простая - форма сзади становится пустой и затемняется - а PopUp выскакивает посередине формы и выглядит так же как окно с сертификатами)
Поле телефона: Рядом с вводом номера (там где +00) добавить небольшой квадратик с закругленными углами для выбора кода страны в АЛФАВИТНОМ порядке (Dropdown).
Приложения 1
Результаты работы
Отзыв заказчика о сотрудничестве с Пайкаром Аветісяном
Реализация лендинга на React js, Tailwind (уже есть код, его нужно доработать до макета в Figma)Очень довольна работой Пайкара. Он профессионально доработал существующий код и сделал верстку действительно pixel perfect. Все отступы, шрифты и адаптивность под мобильные устройства выполнены безупречно. Также он грамотно настроил валидацию форм и модальные окна. Код чистый, легко поддерживается. Рекомендую как ответственного специалиста!
Отзыв фрилансера о сотрудничестве с Маріною Шклярською
Реализация лендинга на React js, Tailwind (уже есть код, его нужно доработать до макета в Figma)Приятный клиент, быстро отвечает и четко ставит задачи. Сотрудничество прошло легко, рекомендую.
-
4 дня5000 UAH
4 дня5000 UAH
Здравствуйте, могу сверстать по макету,
в портфолио есть проекты на React, обращайтесь
-
3 дня5500 UAH
3 дня5500 UAH
Привет!
Посмотрел описание - да, могу вам с этим помочь.
Работаю с сайтами уже более 3 лет, поэтому хорошо понимаю, как аккуратно дорабатывать готовый код, не ломая то, что уже работает. Если где-то лучше просто внести правки, а где-то быстрее и чище переделать отдельный блок - без проблем, смотрю по ситуации.
Из того, что вы описали, здесь для меня главное - довести сайт до точного соответствия макету, нормально доработать адаптив, отступы, шрифты, поведение элементов и общую целостность интерфейса. React для меня ок, поэтому смогу спокойно разобраться в коде и внести все необходимые правки.
Также обращаю внимание не только на внешний вид, но и на структуру кода и скорость сайта, чтобы после правок ничего не сломалось и сайт нормально проходил speed test.
… Вот несколько моих работ:
https://www.alytic.sa/
https://www.tornix.ai/
https://www.leagueit.org/
-
1 день10 000 UAH
1 день10 000 UAH
Вытаю. Готов доработать вам сайт и начать прямо сейчас. Имею опыт в разработке сайтов на коде.
-
Победившая ставка3 дня880 UAH
1066 7 0 Победившая ставка3 дня880 UAH
Добрый день!
Ознакомился с описанием задачи. Понимаю, что основная работа — это доработка существующего кода, адаптация под макет и аккуратная проработка всех деталей (отступы, шрифты, адаптив, UI).
Готов реализовать:
— правки верстки с полной адаптацией под все устройства
— доработку модальных окон (PDF, сертификаты)
— корректную работу формы (валидация, success popup)
— реализацию логики блоков (включая View Explanation)
… — аккуратную интеграцию анимаций и интерактивных элементов
Также сейчас активно изучаю React, поэтому при необходимости смогу разобраться в текущем коде и доработать логику без проблем.
Работаю внимательно к деталям, ориентируюсь на pixel perfect и удобство дальнейшей поддержки кода.
Готов обсудить детали, посмотреть макет и предложить оптимальный вариант реализации.
-
4 дня5000 UAH
328 0 1 4 дня5000 UAH
Добрый день!
Готова доработать ваш сайт под макет Figma с акцентом на адаптивность, точные отступы, шрифты, модальные окна, блок Tools, форму и прохождение Speed Test.
Могу аккуратно доработать существующий React-код или переделать отдельные части, если так будет чище и надежнее. Для меня здесь понятен приоритет: максимальное соответствие макету + корректная работа на всех экранах.
-
4 дня9000 UAH
1014 6 0 4 дня9000 UAH
Привет, посмотри мой последний проект, он написан на реак, есть усилие.
Speed Test 98%
Могу реализовать проект в пиксель перфект.
-
5 дней6000 UAH
686 2 0 5 дней6000 UAH
Здравствуйте! Проект выглядит просто невероятно — очень стильный и современный дизайн. Я с большим удовольствием помогу довести его до идеала. Мне нравится ваш подход к мелочам (неоновые эффекты, шрифты Lexend, стеклянный морфизм).
Мой план действий по вашему ТЗ:
Tools Animation (Стеклянные шарики): Настрою физику так, чтобы шарики ощущались «тяжелыми», и добавлю визуальной глубины (градиенты, размытие, блики), чтобы они выглядели как настоящее стекло.
View Explanation: Реализую плавную трансформацию иконок в карточки с описанием. Это будет выглядеть как естественная часть интерфейса.
Сертификаты и Case Studies: Отполирую модальные окна, настрою стеклянный эффект (glassmorphism) и сделаю структуру кода такой, чтобы вы могли легко добавлять новые сертификаты через один массив в коде.
Форма и валидация: Добавлю выпадающий список стран по алфавиту и настрою логику успешной отправки с вашим PopUp сообщением.
Адаптивность и Speed Test: Проверю каждый отступ (80px по бокам) и оптимизирую загрузку, чтобы сайт летал.
… У меня глубокие знания React.js и опыт работы с анимациями, поэтому результат будет максимально соответствовать макету.
С вашей стороны потребуется только код и ссылка на Figma. Готов начать «магии» над вашим сайтом прямо сейчас!
-
3 дня4000 UAH
9972 117 0 3 дня4000 UAH
Здравствуйте.
Я разработчик NodeJS. Готов взяться. Пишите, обсудим.
-
1 день1111 UAH
9004 69 0 1 день1111 UAH
Добрый день, у меня есть опыт с react + tailwindcss. Это не все правки? Можете предоставить больше информации по правкам и какой ваш бюджет на проект? 880 - это окончательная сумма?
-
4 дня2800 UAH
764 5 1 4 дня2800 UAH
Добрый день, Марина! Внимательно прочитал всё описание — задание объёмное, но чёткое. Опыт с React + Tailwind есть, с Figma тоже работаю.
По каждому пункту:
1. Анимация Tools (стеклянные шарики) — реализую реалистичное падение с гравитацией + столкновение через CSS/Framer Motion, убираю лишнюю рамку из текущего кода
2. PDF Modal (Case Studies) — модальное окно с пролистыванием страниц внутри, анимированная кнопка-крестик, соответствие макету Figma
3. Сертификаты (glassmorphism) — 2 карточки с эффектом матового стекла + градиент, клик открывает как презентацию, легко масштабировать через код
4. View Explanation в Tools — трансформация иконки → карточка с названием и описанием, всплывающее окно с пролистыванием вниз
5. Лид-форма — валидация с glow-эффектом на пустых полях, PopUp «Запрос отправлен» после успеха, Dropdown выбора кода страны (+00) в алфавитном порядке
Адаптивность, отступы 80px от краёв, 3 шрифта (Lexend Mega, Lexend Exa, Lexend) — всё сверю по макету Figma. Сдам чистый код, который можно сразу показывать в портфолио.
-
1 день1000 UAH
13013 67 0 1 день1000 UAH
Здравствуйте! Выполню вашу задачу быстро и качественно.
Мое портфолио: https://freelancehunt.com/ua/freelancer/romas6ka.html#portfolio
Пишите, начну сегодня работать. Буду рад сотрудничеству с Вами!
Актуальные фриланс-проекты в категории Javascript и Typescript
Поддержка и развитие сайта клининговой компании
919 UAH
Ищу веб-разработчика / веб-мастера для долгосрочной поддержки и развития сайта клининговой компании. Сайт: https://donely.ca О проекте DoneLy Home Services — компания по предоставлению услуг уборки в Канаде, которая активно развивается и расширяет географию работы. Ищу… Javascript и Typescript, Веб-программирование ∙ 1 день 10 часов назад ∙ 59 ставок |
Разработка сайта по ТЗ на FramerНеобходимо сделать сайт по этим параметрам, что в ТЗ https://docs.google.com/document/d/1ODO2C9Krb4AaMiJz9wfbNzWlAyA2FwCCHL8r0biajUY/edit?usp=sharing Назовите реальный рейд на основе этого дизайна HTML и CSS верстка, Javascript и Typescript ∙ 2 дня 11 часов назад ∙ 26 ставок |
Разработка интерактивной карты Palworld для сайтаНеобходимо разработать интерактивную карту Palworld по примеру: https://palworld.gg/map Нам нужна не просто статическая картинка, а полноценная интерактивная карта, где пользователь может смотреть локации, включать / выключать категории объектов, искать нужные точки и… HTML и CSS верстка, Javascript и Typescript ∙ 4 дня 2 часа назад ∙ 32 ставки |
Разработка платформы AM Mobility (автосервис, парковка, страхование, аренда автомобилей)
259 653 UAH
Ищем команду или опытного Full Stack разработчика для создания MVP платформы AM Mobility. AM Mobility — это единая цифровая экосистема для автомобилистов, объединяющая в одном приложении и веб-платформе: парковку; автосервис; шиномонтаж; автомойку; аренду автомобилей;… Javascript и Typescript, Веб-программирование ∙ 9 дней 9 часов назад ∙ 119 ставок |
Gsap анимации
1000 UAH
Добрый день. Нужно внести правки в текущем проекте. Нужен специалист, который хорошо работает на gsap/lenis Нужно сделать анимацию карточек. Подробное ТЗ здесь: https://www.figma.com/design/5bLEJudN5LPpB9ZSoJa2Eb/Untitled?m=auto&t=qwyluUctL1lrMNvh-6 Нужно… Javascript и Typescript, Веб-программирование ∙ 9 дней 14 часов назад ∙ 21 ставка |
Киев