Как узнать стоимость вёрстки шаблона при его создании?


Дано:
Вы создаёте сайт и у Вас уже есть готовый дизайн (дизайн-макет), полученный от дизайнера.

Как рассчитать стоимость вёрстки готового дизайн-макета в шаблон веб-сайта со следующими требованиями:

1. кросс-браузерность
2. адаптивная/резиновая сетка
3. pixel-perfect
4. сегментация загрузки контента под различные разрешения: mobile/retina

если Вы ничего не понимаете в работе верстальщика и front-end разработчика/кодера?


Попробуем вместе детализировать и расписать составные работы, входящие в данную задачу...



Детализируем работу по вёрстке и приведём детальный список более мелких унифицированных работ, включая средние трудозатраты по каждой из них.


Список работ при вёрстке:

1. Создание "каркаса" и настройка шаблона под конкретную CMS систему (разметка по требованиям CMS), HTML5+PHP(или иное, зависит от CMS): 3 часа.

2. Создание основного кода шаблона (включая теги), основной сетки шаблона и его поведение в различных разрешениях (адаптивная вёрстка), HTML5+CSS3: 3 часа.

3. Вёрстка одного простого уникального элемента (текстовый блок, поле ввода и т.д.) с правильным позиционированием на странице, HTML5+CSS3: 20 минут.

4. "Подвязка" JS-обработчика средней сложности функционала к блоку (проверка ввода данных, "живой" поиск и т.д.), JS-код: 30 минут.

5. Создание простого микро-приложения на странице (например, калькулятор: ajax+поля значений: select, check и т.д.), JS-код: 3 часа.

6. Создание элемента (включая вёрстку) и его поведение на основе существующей библиотеки (jqueryui или подобное), HTML5/CSS3/JS-код: 30 минут.



Подсчёт стоимости (считаем сначала всё в минутах для сохранения точности):

1. Считаем общее количество элементов (информационные блоки, отдельные надписи, элементы форм: поля ввода, кнопки и т.д.) и умножаем на 20 минут (см. п.3 в списке работ): SE (static elements)

2. Считаем количество элементов, которые двигаются или реагируют на действия пользователя и умножаем на 30 минут (см. п.4 в списке работ): DE (dynamic elements)

3. Считаем элементы, которые можно взять из готовых библиотек и умножаем на 30 минут (см. п.6 в списке работ): RE (ready elements)

4. Считаем количество микро-приложений (например, калькуляторов и т.д.) и умножаем на 3*60 (см. п.5 в списке работ): MA (micro-app)

5. Суммируем полученные значения (пп. 1-4) и прибавляем к этому значению стоимость создания основного кода шаблона 3*60 (см. п.2 в списке работ): T (template)

6. Если шаблон нужен для конкретной CMS, к полученной текущей сумме прибавляем 3*60 (см. п.1 в списке работ): TCMS (template for CMS)

7. Итог - мы поделим на 60 и получаем точное количество в часах по трудозатратам: W



И, наконец, формула:

W=(20*SE+30*DE+30*RE+3*60*MA+3*60*T+3*60*TCMS)/60=[итог в часах]

или сразу в часах:

W=0.33*SE+0.5*DE+0.5*RE+3*MA+3*T+3*TCMS=[итог в часах]

Подписка на новости:

Самые полезные и признанные экспертами публикации в сферах IT-бизнеса и Web-разработки:

Сертификат

Certificate for nickname xmoonlight, is registered to: https://sitecoder.blogspot.com