ТЗ верстальщику

Конечная цель:

Создать MVP версию продукта. Получить обратную связь от пользователей. Сверить предполагаемые ожидания с реальными запросами пользователей. Для этого нужно создать сервис который будет вызывать доверие у пользователя.

Ограничения:

На текущий момент в коде используются компоненты (css) Angular Material https://material.angular.io/components/categories.

Нет ресурса делать отдельно десктопную, планшетную, мобильные версии. Делаем одну единую версию с повторным использованием компонентов, игрой логики + css.

Желательно сделать дизайн как можно ближе к тому что нарисовал дизайнер.

Ссылка на макет дизайнера:

https://www.figma.com/file/EHXF1Bg34cRrosgg0pNtUz

Ссылка на сервис (demo):

https://95.183.8.128:8884

Ссылка на репозиторий:

Технологии:

Angular 7. Среда разработки WebStorm.

Задачи:

Задача: Сделать авторизацию ( вход) в CSS, заказчик пробует ее перенести в свой проект. Если получиться, делать так дальше. Уточняем проблемы.

Задача: Адаптивность - мобильная версия и десктопная должны меняться автоматически online

Задача: Компонент с тегами - Исполнитель перепишет и примент для него стили в макете. Компонент (логика) оставляем из Angular Material.

Задача: Загрузчик должен быть в центре блока данных и карты. Отдельно на каждый блок

Задача: Скролл - по дизайну. Скролл скрывать если мы его не крутим.

Задача: Поддержка браузеров - последние версии CHROME, Firefox, Opera, Safari, Edge - на 09.12.2019

Проблема: Чтобы собрать как можно больше обратной связи от пользователей (В2В В2С), сервис должен вызывать доверие и уважение.

Задача: Произвести верстку согласно макету дизайнера. Верстка должна показывать высокий уровень сервиса, чтобы у пользователя складывалось ощущение качества.

Проблема: Пользователи будут пользоваться продуктом на телефонах и на ПК

Задача: Произвести верстку мобильной и десктопной версии. Верстка должна быть “адаптивной под все устройства”. Для этого код автоматически определяет текущие разрешение экрана устройства и использует компоненты в зависимости от этого MOBILE или DESKTOP. Можно а) используем media query

• ДЕСКТОП - 1200 > 1920 - делаем по макету Figma
  
• ТАБЛЕТ - 740- 1200 - показываем мобильные версии компонентов, показываем все компоненты. Причем меню. Показываем Nav-bar, с гамбургер меню.
  
• Мобильная - <740- делаем по макету Figma
  

Проблема: Нужно иметь возможность быстро менять палитру сервиса.Мы создаем MVP версию, еще нет конечного представления об итоговой палитре.

Задача: Цвета должны быть в переменных, использоваться из одного места

Проблема: Нужно иметь возможность быстро менять шрифт сервиса.

Задача: Шрифт должен быть в переменной, использоваться из одного места

Проблема: Нет ресурса для рисования png картинки.

Задача: Используем svg картинки.

Задача: Сделать круг поверх карты чтобы всегда был в центре карты и прилегали к краям (левому и правому). Смотрел пропорционально на desktop, mobile, tablet.

Задача: Назначить контейнеру с картой id=’my-map’

Задача: Календарь - сверстать стили для календаря.

Договоренности:

Сроки:

1. Исполнитель приступает к работе на следующий день, после предоплаты.
   
2. Время на только верстку 14 календарных дней. Если исполнитель начинает работу над проектом 10.12.19 в 11.00 , то 24.12.19 23.59 только верстка должны быть завершена.
   
3. Исполнитель будет офлайн с 26.12.19 по 5.01.20.
   
4. Если ТЗ не будет выполнено полностью до 24.12.19 23.59, то с 5.01.20 исполнитель продолжает работу.
   
5. До 12.01.20 23:59 ТЗ должно быть выполнено полностью.
   

Бюджет:

1. Стоимость работы 32000 рублей.
   
2. Разбиваем проект на 4 части , по 8000 рублей.
   
3. Схема оплаты получится 25% * 4, т.е.
   
   
   1. предоплата 8 000 руб
      
   2. выполняется 18-20 часов работы - производится оплата 8 000 руб
      
   3. выполняется 18-20 часов работы -производится оплата 8 000 руб
      
   4. выполняется 18-20 часов работы (завершение) - производится оплата 8 000 руб
      

Оценка объема работ:

1. Часы общий:
   
   
   1. Подготовка – 1.5 часа
      
   2. Лейаут – 2 часа
      
   3. Сайдбар – 3 часа
      
   4. Навбар – 1.5 часа
      
   5. Карта – 3 часа
      
   6. Форма входа – 4 часов
      
   7. Поиск – 9 часов
      
   8. Подписки – 6 часов
      
   9. Пользователь – 4 часа
      
   10. Запросы – 9 часов
       
   11. Сообщения – 6 часов
       
   12. Запрос – 3 часа
       
   13. Саппорт – 1.5 часа
       
2. Первый этап работы (18 часов +\-):
   
   
   1. Подготовка – 1.5 часа
      
   2. Форма входа – 4 часов
      
   3. Лейаут – 2 часа
      
   4. Сайдбар – 3 часа
      
   5. Навбар – 1.5 часа
      
   6. Карта – 3 часа
      
   7. Запрос – 3 часа
      
   8. Саппорт – 1.5 часа
      

Последовательность действий:

1. Заказчик оплачивает аванс в размере 8000 рублей , до 9.12.19 23:59.
   
2. Исполнитель приступает к работе до 10.12.19 13:00.
   
3. Будет предоставлена ссылка закрытый репозиторий с исходным кодом верстки и preview.
   

1. Первый этап работы должен быть выполнен до 15.12.20 23:59
   

Срезы по задаче:

1. Заказчик спрашивает как происходит работа по проекту не чаще чем раз в трое суток.
   

Коммуникации:

1. Общение производим в telegram @UnreaLSnake, звонки в Skype
   
2. Технические вопросы можно писать каждый день с 11.00 до 20.00
   

Расторжение работы:

1. Заказчик:
   
   
   1. Если исполнитель не предоставляет ссылку на репозиторий в течении 24 часа после оплаты аванса , производится расторжение работы. Исполнитель обязан вернуть аванс в полном размере. В случае не возвращения аванса в полном размере заказчик пишет негативный отзыв в соц. сетях на аккаунт unrealsnake
      
   2. Если проект не будет выполнен по причине исполнителя до 12.01.20 23:59 пишется негативный отзыв.
      
2. Исполнитель:
   
   
   1. Заказчик обязуется оплачивать работу своевременно, в течении 24 часов, после выполнения работ исполнителем.
      

Реквизиты:

MasterCard (Tinkoff) – 5536 9137 9663 4422 (Антонов Александр)


Возможные проблемы:

1. С интеграцией: <div 1> <div 2> -> Angular <div 1> <ng-container> <div 2> </ng-container>