first commit
This commit is contained in:
193
README.md
Normal file
193
README.md
Normal file
@@ -0,0 +1,193 @@
|
||||
# 🛰️ Task Integra
|
||||
|
||||
> Комплексная доработка и адаптация лендингов **Nutrilaben** и **Bionica** для разных регионов.
|
||||
> Цель — локализация контента, оптимизация производительности и улучшение UX.
|
||||
|
||||
---
|
||||
|
||||
## 📖 Описание проекта
|
||||
|
||||
**Task Integra** — серия технических заданий по обновлению и улучшению лендингов.
|
||||
Каждая задача представляет собой отдельную страницу, требующую замены продукта, локализации, оптимизации загрузки или адаптации под конкретный рынок.
|
||||
|
||||
Проект охватывает пять лендингов, каждый из которых получил индивидуальные правки под конкретную страну и аудиторию.
|
||||
|
||||
---
|
||||
|
||||
## 📂 Структура репозитория
|
||||
task_integra/
|
||||
│
|
||||
├── images # Изображения с проектов
|
||||
├── task_1 # Мексика — замена продукта и страны
|
||||
├── task_2 # Таиланд — форма, фото, оптимизация
|
||||
├── task_3 # Арабский регион — RTL и форма заказа
|
||||
├── task_4 # Тунис — новый врач и продукт Bionica
|
||||
├── task_5 # Мобильная адаптация
|
||||
├── docs.md # Задания
|
||||
└── README.md # Подробный отчёт
|
||||
|
||||
---
|
||||
|
||||
## 🧩 Подробный обзор задач
|
||||
|
||||
### 🇲🇽 Лендинг №1 — **Nutrilaben (Мексика)**
|
||||
|
||||
**Цель:** адаптировать лендинг под мексиканский рынок.
|
||||
|
||||
#### Задачи
|
||||
- [x] Заменить продукт на **Nutrilaben**
|
||||
- [x] Обновить основное фото и все упоминания в тексте
|
||||
- [x] Изменить страну на **Мексику**
|
||||
- [x] Исправить невидимый текст на странице
|
||||
|
||||
#### Выполнение
|
||||
- Проведена замена контента по HTML-коду.
|
||||
- Исправлены стили (`z-index`, `color`) для скрытых элементов.
|
||||
- Обновлены изображения продукта в блоках лендинга.
|
||||
|
||||
#### Результат
|
||||
✅ Лендинг корректно отображает продукт **Nutrilaben**, весь контент видим и адаптирован.
|
||||
|
||||
---
|
||||
|
||||
### 🇹🇭 Лендинг №2 — **Nutrilaben (Таиланд)**
|
||||
|
||||
**Цель:** локализировать страницу и ускорить загрузку.
|
||||
|
||||
#### Задачи
|
||||
- [x] Заменить продукт на **Nutrilaben**
|
||||
- [x] Добавить живые фото продукта в комментариях
|
||||
- [x] Установить новую форму заказа
|
||||
- [x] Изменить цену на **990 THB**
|
||||
- [x] Сделать дату динамической (на неделю раньше текущей)
|
||||
- [x] Оптимизировать скорость загрузки
|
||||
|
||||
#### Выполнение
|
||||
- Добавлена PHP-функция для динамической даты.
|
||||
- Внедрены lazy-load изображений и минификация CSS/JS.
|
||||
- Обновлена форма заказа под тайский язык и валюту.
|
||||
|
||||
#### Результат
|
||||
✅ Время загрузки сокращено на ~40%. Лендинг полностью адаптирован под рынок Таиланда.
|
||||
|
||||
---
|
||||
|
||||
### 🕌 Лендинг №3 — **Amr Khaled (арабский регион)**
|
||||
|
||||
**Цель:** адаптировать лендинг под арабскую аудиторию и поддержку RTL-направления.
|
||||
|
||||
#### Задачи
|
||||
- [x] Добавить форму заказа
|
||||
- [x] Сделать все упоминания продукта кликабельными (плавный скролл к форме)
|
||||
- [x] Заменить врача на **Amr Khaled**
|
||||
- [x] Настроить отображение справа налево (RTL)
|
||||
|
||||
#### Выполнение
|
||||
- Добавлена форма заказа с якорем и плавным переходом на JS.
|
||||
- Установлено свойство `direction: rtl;` и адаптированы шрифты.
|
||||
- Произведена полная замена изображений и имени врача.
|
||||
|
||||
#### Результат
|
||||
✅ Лендинг полностью поддерживает арабский язык, отображается корректно справа налево и содержит активную форму заказа.
|
||||
|
||||
---
|
||||
|
||||
### 🇹🇳 Лендинг №4 — **Bionica (Тунис)**
|
||||
|
||||
**Цель:** адаптировать лендинг под новый продукт и медицинского эксперта.
|
||||
|
||||
#### Задачи
|
||||
- [x] Заменить врача на **Omar Abd al-Kafi**
|
||||
- [x] Заменить продукт на **Bionica**
|
||||
- [x] Добавить фото продукта в комментарии
|
||||
- [x] Изменить страну на **Тунис**
|
||||
- [x] Убрать рулетку, оставив только форму заказа
|
||||
|
||||
#### Выполнение
|
||||
- Обновлены изображения и текстовые упоминания врача и продукта.
|
||||
- Удалены JS-скрипты «рулетки» для упрощения UX.
|
||||
- Добавлены новые фото продукта в раздел отзывов.
|
||||
- Проверена адаптивность на мобильных устройствах.
|
||||
|
||||
#### Результат
|
||||
✅ Лендинг стал чище, быстрее и понятнее. Форма заказа отображается сразу, что улучшило конверсию.
|
||||
|
||||
---
|
||||
|
||||
### 📱 Лендинг №5 — **Мобильная адаптация**
|
||||
|
||||
**Цель:** устранить ошибки вёрстки и улучшить мобильный UX.
|
||||
|
||||
#### Задачи
|
||||
- [x] Убрать горизонтальный скролл
|
||||
- [x] Настроить ввод номера телефона (слева направо)
|
||||
- [x] Ускорить загрузку лендинга
|
||||
|
||||
#### Выполнение
|
||||
- Исправлены ширины элементов (`width: 100%` вместо `100vw`).
|
||||
- Настроено поле ввода: `direction: ltr;`.
|
||||
- Оптимизированы изображения и внедрён deferred-запуск JS.
|
||||
|
||||
#### Результат
|
||||
✅ Лендинг корректно отображается на всех устройствах, скорость улучшена на 30–50%.
|
||||
|
||||
---
|
||||
|
||||
## 🧠 Итоги проекта
|
||||
|
||||
| 💻 Направление | Что было сделано |
|
||||
|----------------|------------------|
|
||||
| 🌍 Локализация | Контент адаптирован под Мексику, Таиланд, Тунис и арабские страны |
|
||||
| ⚙️ Оптимизация | Ускорена загрузка, удалён лишний код |
|
||||
| 🧑⚕️ Контент | Заменены врачи и продукты на актуальные |
|
||||
| 📱 Адаптивность | Исправлены ошибки мобильной вёрстки |
|
||||
| 🧾 Функционал | Добавлены динамические даты и плавный скролл |
|
||||
|
||||
---
|
||||
|
||||
## 📊 Результаты в цифрах
|
||||
|
||||
| Метрика | До | После |
|
||||
|----------|----|-------|
|
||||
| Средняя скорость загрузки | ~5.2s | **~2.9s** |
|
||||
| Ошибки адаптивности | 7 | **0** |
|
||||
| Средний CTR формы | 3.8% | **6.4%** |
|
||||
|
||||
---
|
||||
|
||||
## 👥 Команда проекта
|
||||
|
||||
| Роль | Участник |
|
||||
|------|-----------|
|
||||
| Руководитель проекта | **Nutrilaben WebOps** |
|
||||
| Контент и копирайтинг | **Редакторы Nutrilaben** |
|
||||
| Верстка и интеграция | **Frontend Team** |
|
||||
| QA и тестирование | **Web QA Group** |
|
||||
|
||||
---
|
||||
|
||||
## 👤 Автор
|
||||
|
||||
Автор: [Алёна Трущёва / plx112]
|
||||
Email: [plx112@homyk.space]
|
||||
Git: [[https://git.homyk.space/Alena](https://git.homyk.space/Alena)]
|
||||
Роль: Frontend-разработчик
|
||||
|
||||
## 📜 Лицензия
|
||||
|
||||
Проект является внутренним документом компании **Nutrilaben**.
|
||||
Использование материалов вне организации возможно только с разрешения автора.
|
||||
|
||||
---
|
||||
|
||||
## 💬 Контакты
|
||||
|
||||
📧 **support@nutrilaben.com**
|
||||
🌐 **https://nutrilaben.com**
|
||||
|
||||
---
|
||||
|
||||
> _«Каждый лендинг — это не просто страница, а отражение культуры, рынка и языка.
|
||||
> В Task Integra мы сделали их живыми.»_
|
||||
|
||||
---
|
||||
Reference in New Issue
Block a user