Уважаемые пользователи Голос!
Сайт доступен в режиме «чтение» до сентября 2020 года. Операции с токенами Golos, Cyber можно проводить, используя альтернативные клиенты или через эксплорер Cyberway. Подробности здесь: https://golos.io/@goloscore/operacii-s-tokenami-golos-cyber-1594822432061
С уважением, команда “Голос”
GOLOS
RU
EN
UA
orezaku
7 лет назад

Как мы делали сайт. Мини-гайд по разработке.



Как многие знают, хотя и не все, я занимаюсь веб-дизайном. Конечно, я не Артемий Лебедев, но что-то все же умею :) И, наверное, стоило бы показать хоть что-то, что я сделал, а то попахивает пустозвонством, мол кричу, что делаю дизайн сайтов, а так ли это? Еще и уроки начал по этому делу, да статьи всяческие пишу. Хочу показать последний проект, который был сдан буквально на днях.


Собственно в чем суть кейса: сделать сайт компании ООО “Уральская торговая компания” (не реклама), которая занимается производством и установкой перил, ограждений лестниц из разных материалов, преимущественно из нержавеющей стали по УрФО. Задача: особо не заморачиваться, просто сделать некий инструмент для продаж. У директора на тот момент уже были созданы ресурсы компании, но на различных платформах-каталогах и уникального дизайна там, конечно же не было. Сделать сайт, с адаптивным дизайном, с неким каталогом, с возможностью оставить заявки. Сайт функционирует под управлением CMS Wordpress.

Дизайн

Собственно, сначала задача была создать логотип. Заказчик сам подобрал вариант, и его просто надо было доработать в нужном стиле.

Старый логотип


Новый логотип


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

Прототип главной (картинка кликабельна)


postimage

С помощью прототипа можно начинать прорисовывать дизайн главной страницы. 100% по прототипу не получилось, как можно будет заметить в итоговом варианте. Но это то, от чего можно оттолкнутся.

Отрисовав главную и согласовав ее с заказчиком, я принялся за второстепенные страницы. Самая сложная из них была страница с блоками продукции, так сказать product_page. Выглядело это так:

postimage

В итоге, дорисовав и согласовав второстепенные страницы, я начал отрисовку сначала версии для планшета, а затем и мобильной версии. Общий срок разработки дизайна: 15 рабочих дней.

Чтобы я хотел сказать дополнительно для тех, кто заказывает сайты: будь понимающим и прислушивайся к совету разработчиков, а не придумывай свой велосипед. Как показала моя практика, когда заказчик диктует как лучше, получается очень плохо. Да, у меня есть такой проект, который мне даже показывать стыдно.

Верстка

Версткой занималась @mamasetta и мне что-то сложно сказать об этом процессе. Конечно, приходилось много моментов пояснять, и доделывать не сделанное в дизайне, в итоге после 2 недель работы, Варя предоставила сверстанные макеты для последующей интеграции в систему управления.

Программирование

Программированием занимался наш общий друг @imelstorn. На адаптацию шаблонов под Wordpress ушло около трех недель. Мне так же сложно что-то сказать про процесс, но получилось изнутри довольно понятно и логично, за что ему огромный респект.
Собственно ссылка на сам сайт:

http://utk96.ru/


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


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


Если ты до сих пор не вкурсе, что я делаю уроки по созданию веб-дизайна в фотошопе (кстати, полезно не только для дизайнеров, а просто даже изучить как работать в нем). После создания макета дизайна @mamasetta заверстает его с тобой!
Если подпишешься, то будешь получать еще чуточку хорошего контента! :)

0
1.999 GOLOS
На Golos с April 2017
Комментарии (7)
Сортировать по:
Сначала старые