Как мы прокачали визуализацию сайта за 2 месяца и небольшие деньги

Весь процесс оказался не таким уж сложным. Если у вас нет штатного веб-дизайнера - выполнение работ можно отдать на аутсорс. В этом вам помогут, например, биржи для найма фрилансеров - Fiverr и Upwork (ранее oDesk). Плюсы этих платформ в том, что можно дать исполнителям первоначальные тестовые задания с небольшой оплатой, и если исполнитель хорошо справляется, поручить ему доведение всего проекта до ума. На сайте Upwork, например, многие западные IT-компании формируют целые команды специалистов практически в любой точке мира и регулярно работают с ними.

Если вы долго имеете дело с собственным продуктом - ваш взгляд замыливается, и вы обрастаете особой картиной мира, которую потенциальные клиенты могут не сразу воспринять. Мы разрабатываем софт для пакетной печати файлов и, казалось бы, что нового здесь можно придумать? Идеи действительно стали постепенно иссякать, поэтому мы пошли на Upwork.com, Fiverr.com, в соцсети и к знакомым. Дисклеймер: для многих эта статья не станет откровением, однако для нас это был новый опыт, которым хочется поделиться.

Создаем задание и выбираем исполнителя

Сначала мы просто создавали задания на Fiverr и UpWork с малым или средним бюджетом. На самом деле, лучше так не делать. На мои предложения откликались, в основном, работяги из Индии и Пакистана, и заявок было много. Но у доброй половины кандидатов было довольно низкое качество выполненных работ в портфолио:

Сначала лучше полистать анкеты и портфолио самих исполнителей. Это займет время. Посмотрите на работы, рейтинг исполнителя, почитайте отзывы. Отберите 10-15 наиболее адекватных и разошлите им ваше задание. Это будет более точечный и эффективный подход. Благо для отбора кандидатов есть неплохие фильтры.

Фильтр исполнителей на Fiverr.com

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

Время на выполнение задания и нахождение исполнителя онлайн не так важны, а на других фильтрах остановимся подробнее.

Бюджет (Price range): мы выставили минимальную планку в $20, но вы поставьте исходя из сложности вашей задачи.

Тип иллюстрации (Illustration Type): в зависимости от вашей задачи.

Стиль (Style): рисунок в свободном стиле, векторное изображение, реалистичный рисунок, детская иллюстрация, пиксельный арт - тоже зависит от вашей задачи.

Формат файла (File Format): можно выбрать JPG, PNG, PSD, AI, PDF. Форматы JPG, PNG, PDF сложнее редактировать, поэтому лучше выбрать PSD (Adobe Photoshop) и AI (Adobe Illustrator).

Уровень крутизны исполнителя (Seller Level): думаю, не важен. Top Rated Seller - лучший исполнитель с безупречным или высоким рейтингом, ниже идут Level One, Level Two, затем New Seller. Большинство Top Rated Seller'ов - хорошие исполнители, но есть риск, что именно у вашего будет настолько мало времени на ваш заказ (нужно успеть еще несколько!), что качество может пострадать. А среди New Seller'ов - могут быть действительно восходящие звезды, которые хорошо выполнят работу и попросят сравнительно немного денег. Поэтому этот фильтр можно не выставлять.

Прочие требования к работе (Service Includes): есть смысл поставить High Resolution, Commercial Use и Source File. High Resolution - отрисовывать финальную работу нужно в большом разрешении, чтобы сохранились все детали без искажений. Это также даст возможность уменьшить изображение без потерь качества. Commercial Use - обязательно ставьте, если планируете использовать работу дизайнера в коммерческих целях. Source File - лучше попросить, исполнителю это предоставить не сложно, а вдруг вы захотите что-то слегка изменить в работе через какое-то время после выполнения заказа?

Фильтр исполнителей на Upwork.com

Заработано на сайте (Earned Amount): означает, сколько денег заработал исполнитель и, по идее, отражает его опыт на сайте. Можно поставить минимальную планку, но вряд ли это важно.

Процент успешного выполнения заданий (Job Success): чем выше процент, тем ответственнее исполнитель подходит к задаче и тем качественнее выполняет заказ, и соответственно, получает более высокую оценку. Стоит поставить планку в 80%. Почему не 90%? Отношения заказчика и исполнителя могут выстраиваться сложно, и бывают субъективные ситуации, когда в чем-то (не) прав и тот, и другой. Здесь лучше подойти гибко, так как речь о сфере, где от исполнителя нужен креатив, а не механическое выполнение работы. Rising Talent - аналог New Seller на Fiverr. Этот значок выдается новым фрилансерам, которые на 100% заполнили профиль, быстро отвечают на приглашения поработать и сами откликаются на заказы, соответствующие их специализации и навыкам.

Почасовая ставка (Hourly Rate): то, как оценивает свой труд исполнитель. Довольно субъективный показатель, можно выставить произвольно. Большинство исполнителей позиционирует себя в рамках $10-30 в час. В собственном задании или при заказе вы можете указать окончательный бюджет (Fixed price) или же нанять человека с условием почасовой оплаты. При почасовой оплате на сайте будет включаться "счетчик", и вы сможете наблюдать за процессом работы исполнителя в виде последовательных скриншотов его рабочего стола.

Оплаченных часов (Hours billed): означает, сколько оплаченных "человекочасов" было у исполнителя. По идее, говорит об опыте, но не очень важный показатель.

Категория (Category): в зависимости от вашей задачи.

Уровень владения английским (English level): важно, чтобы исполнитель понимал вас, а вы его. Среднего разговорного (Conversational) уровня, думаю, будет достаточно.

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

Последняя активность на сайте (Last Activity): показывает, насколько часто исполнитель заходит на Upwork (когда был последний раз).

В любом случае, не бойтесь нанимать исполнителей на этих сайтах, даже если не уверены в них. И на Fiverr, и на UpWork можно вернуть деньги за заказ, если вас не устроит качество выполненных работ, и попробовать снова.

Work in Progress

Полностью поменять структуру сайта (full website redesign) или сделать "косметический ремонт" (website refresh)? Отдельный вопрос. У нас уже была клиентская база, и мы решили сохранить структуру сайта, привычную для наших пользователей. Структуру решили оставить, но нам нужен был level up в плане:

• Верстки
• Навигации по сайту
• Визуализации, в т.ч. персонажа программы
• Текстовой составляющей

В общей сложности мы наняли 7 человек для верстки домашней страницы и отрисовки персонажа, символизирующего наш продукт - андроида-дирижера. В качестве тестового задания по логотипу и персонажу мы просили кандидатов присылать простейшие эскизы, не важно в каком виде - нарисованные на салфетке, в Иллюстраторе или 3D Max. Нам было важно, чтобы человек прошел хотя бы минимальный порог - зашел на наш сайт, попробовал программу и получил представление, о чем она и кому нужна. Мы получили довольно много интересных и порой неожиданных концептов!

Верстка главной страницы

Расположение элементов сайта мы также поручили стороннему дизайнеру, и его вариант мы потом дорабатывали сами. Вот несколько промежуточных вариантов верстки:

Заглавную иллюстрацию для домашней страницы мы делали сами, но с ней была отдельная история.

Что в итоге

Было

2 месяца назад наш сайт выглядел так:

Стало

Сегодня он выглядит вот так:

Все наброски и наработки фрилансеров в итоге помогли нам в формировании более интересного и цельного варианта. Наш сайт еще нуждается в доработке. Мы планируем добавить больше живых кейсов, интерактива и инфографики, кое-где добавить анимацию.

"Подбор персонала" и доведение всех вариантов состоит из нескольких этапов. В итоге наших поисков мы пришли к нескольким выводам.

Продумать ТЗ

Если вы нанимаете человека со стороны, есть две новости: хорошая и плохая. Хорошая новость в том, что человек не знает ваш продукт досконально, его взгляд не замылен, и он может привнести оригинальные идеи и свое видение. Плохая новость в том, что фрилансер не знает, что у вас в голове и что вы хотите получить в итоге.

Без толкового ТЗ результат будет, как известно, неопределенный. Поэтому стоит прописать (и дополнительно проговорить с исполнителем) абсолютно все мыслимые требования к макету, логотипу или иллюстрации. У нас получилось так:

Дайте человеку максимальную информацию о продукте. Расскажите о целевой аудитории, попросите его попользоваться вашим продуктом (если это возможно), обозначьте цвета, с которыми его будущему макету/логотипу/иллюстрации нужно сочетаться.

Собрать статистику по целевой аудитории и клиентам

Не важно, нравится ли вам флэт-дизайн, обилие градиентов или полигональный стиль. Банально, но важно лишь то, что будет в голове у посетителя вашего сайта. Выгрузите статистику Google Analytics по доменам, с которых к вам заходят, посмотрите, что это за компании. Нарисуйте портрет вашей ЦА - как выглядят эти люди, что они читают, скачивают, едят и где живут. Сжато расскажите о собранной информации исполнителю - без нее никуда.

Собрать мудборд из классных сайтов

Держа в уме информацию о целевой аудитории, каждый из нашей команды выбрал сайт, который ему нравится больше всего. Trello.com, DigitalOcean.com, Dropbox.com, Udacity.com, Atlassian.com - нам такие понравились. Мы хотели сделать более размашистый и воздушный сайт, чем у нас был, и подать продукт более серьезно.

Делать дизайн комплексно

Шрифты, их начертания, цвета и размеры элементов сайта нужно грамотно подбирать. Если есть возможность, не экономьте и наймите профессионала, который бы сделал всю визуализацию самостоятельно. Если логотип, посадочную страницу, и сам сайт будут делать разные люди - придется подгонять одно под другое. Это не очень правильно, но у нас был человек, который приводил все наработки к общему знаменателю и руководил процессом.

Использовать точечный подход

Главная проблема в найме фрилансеров для выполнения задания - найти иголку в стоге сена. Придется перелопатить немало анкет, чтобы найти достойного исполнителя. Но после того как вы его нашли, это ценный кадр, к которому можно обращаться для выполнения новых заданий! И нам показалось, что лучше не создавать открытые задания "для всех", а рассылать бриф только по интересующим вас кандидатам.

Наверняка у вас тоже есть истории на эту тему. Расскажите о том, как вы прокачивали подачу вашего продукта или о вашем опыте найма фрилансеров в комментариях! :)