Комплект представляет собой набор файлов, которые используются для разработки шаблонов лендингов для любой ниши. С помощью этого комплекта вы сможете быстро и недорого создать в Photoshop хорошие шаблоны лендинг пейдж Премиум-уровня.
Папка Вase Complect из набора для разработки шаблонов лендингов
В этой папке лежит базовая версия пакета для разработки шаблонов лендингов.
Design Complect Dark.psd — файл с тёмным бекграундом, все блоки адаптированы под тёмный цвет фона
Design Complect Light.psd — файл со светлым бэкграундом, все блоки адаптированы под светлый тон фона
Blank page Bootstrap Grid.psd — файл-шаблон с размеченной сеткой под фрейморк Bootstrap. Используйте его как базу для начала разработки любого макета, не обязательно Landing Page.
Вообще настойчиво рекомендую ознакомиться с этим фреймворком:
http://bootstrap-ru.com/ — о фреймворке на русском
http://getbootstrap.com/ — о фреймоворке на английском
Design Complect Colors.aco — файл для панели Swatches в Photohop. Он включает в себя все цвета, которые используются для типовых элементов дизайн-комплекта.
Папка Addons
В этой папке находятся дополнительные блоки и элементы для разработки макетов landing pages.
Clients.psd — блоки вывода списка клиентов.
Contacts.psd — блоки вывода карты с контактами компании.
Flat Icons.psd — набор из 60 иконок в стиле flat на базе Awesome Font, в двух цветах.
Forms.psd — набор форм call-to-action и счетчиков для обозначения дедлайнов акций.
Prices.psd — дополнительный вариант вывода таблицы цен.
Product Guarantee and Scheme.psd — дополнительные блоки описания схемы заказа и гарантий для продуктовых лендингов и инфо-продуктов.
Sertificate.psd — блок вывода сертификатов и лицензий. Можно так же использовать для вывода отзывов клиентов (если они отсканированы).
Team.psd — вывод команды компании.
Папка Fonts
Содержит 3 шрифта, необходимых для работы с комплектом
Ubuntu
https://www.google.com/fonts/specimen/Ubuntu
Roboto
http://www.google.com/fonts/specimen/Roboto
Font Awesome
http://fontawesome.io
Шрифт «Font Awesome» является шрифтом иконок. Все иконки в одном списке можно увидеть на этой странице
http://fontawesome.io/cheatsheet/
Как пользоваться шрифтом бесплатных иконок?
1. Устанавливаешь шрифт, который лежит в архиве fontawesome-4.0.3.zip
2. Находишь нужную иконку на этой странице http://fontawesome.io/cheatsheet/
3. Выделяешь и копируешь иконку (только иконку без текста справа от ней) так, как если бы это был текст
4. В фотошопе создаешь новый текстовый слой и вставляешь скопированный символ. Получится что-то вроде этого
5. Выделяешь наш символ, в панели шрифов находишь установленный ранее FontAwesome и получаешь иконку
Иконку можно трансформировать в Shape или оставить как есть. Инструкция по подключению шрифта для HTML-верстки есть на сайте Font Awesome http://fontawesome.io/get-started/
Сервис автоматической верстки PSD2HTML.COM
Сервис русскоязычный, расположен по этой ссылке http://psd2htmlconverter.com/ru/
Вся документация описана на этой странице, там всё более чем понятно http://psd2htmlconverter.com/ru/documentation/
Основные моменты, которые нужно соблюдать
— Группируй слои, собирай верную структуру документа
— Сливай изображения в один слой
— Сервис не умеет верстать изображения 100% в ширину
— Сервис не понимает нестандартные шрифты. Поэтому перед отправкой на верстку все шрифты в макете можно заменить на Arial, а затем после верстки подключить нужный шрифт.
Папка LP Samples
В ней находятся PSD-файлы двух примеров шаблонов лендинг пейдж, собранных на базе дизайн-комплекта. Возможно любое использование, кроме их прямой продажи как шаблонов.
