Сервисы для web дизайна — ноябрь 2015

Продолжаем знакомство с ресурсами, которые могут пригодиться веб-дизайнеру при решении разнообразных рабочих задач и вопросов. С момента публикации похожей подборки онлайн инструментов за сентябрь прошло уже более 2-х месяцев, поэтому самое время запускать новый пост. Сегодня для вас подобрал 6 сервисов web дизайна по следующим направлениями: цветовые палитры, шрифты, сжатие изображений, проверка адаптивности и т.п. Кстати, некоторые из данных проектов могут пригодиться и верстальщикам.

Gridulator

Gridulator – инструмент для создания пиксельной сетки. Достаточно задать ширину макета изображения и ввести желаемое количество колонок, программа автоматически рассчитает все возможные варианты колонок, состоящих из пикселей разных размеров. Ширина элементов выражается в целых числах и рассчитывается с учетом того, что их будут разделять узкие или широкие «желобки», либо они будут располагаться вплотную друг к другу.

Доступен предварительный просмотр результатов (активируется клавишей P в английской раскладке). Можно создавать документы формата PNG и переносить данные в CSS, Фотошоп. Сервис Gridulator располагает горячими клавишами — работать с ним можно даже без клавиатуры.

Lavish Bootstrap

Lavish Bootstrap – инструмент, совместимый с платформами Bootstrap и Foundation. Позволяет разложить любое изображение на составляющие цвета, доработать полученную цветовую схему, внося изменения на свой вкус, а затем генерировать код для CSS или SASS.

Полученные цвета можно использовать для разных элементов дизайна сайта – фона, текста, кнопок, таблиц, панелей навигации, управления, наборов инструментов. На сайте представлена подборка фотографий и созданных на их основе палитр, которые можно адаптировать под свои нужды, также есть возможность загружать свои изображения. Проект будет отличным дополнением этим сервисам.

Compress Jpeg

Compress Jpeg – инструмент для сжатия графических файлов разного формата – JPG (jpeg), PNG, PDF. Дополнительно предусмотрена возможность взаимной конвертации JPG и PNG документов, преобразования файлов PDF в ряд других форматов и наоборот. Ранее я уже рассматривал прохожие сервисы TinyPNG и TinyJPG однако, насколько я помню, конвертации там не было.

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

Bubbler

Bubbler от ilikepixels.co.uk позволяет создавать специфические блоки в форме «пузырьков». На сайтах их можно заполнять пояснениями, комментариями. Бабблер объединяет 3 инструмента настроек:

Первый предназначен для работы с «клювиком» блока и позволяет задавать его расположение – сверху, снизу, справа или слева, ближе к краю или по центру, а также размеры.
Второй управляет собственно «пузырьком», его размерами (можно сохранять соотношение сторон или менять длину и ширину независимо друг от друга), кривизной углов, цветом заливки.
С помощью последнего можно задать цвет и толщину рамки.

Deviceponsive

Deviceponsive – ресурс, позволяющий проверить адаптивность дизайна сайта. С его помощью можно увидеть, как сайт будет смотреться на экранах устройствс разным разрешением,взглянуть на него глазами их владельцев.Для этого нужно ввести в поле Type URL / Domain адрес главной или любой другой интересующей вас страницы и нажать GO.

Ниже расположены изображения экранов 9 различных девайсов (Macbook, iPad, iPhone), каждый оснащен двумя полосами прокрутки. На каждом виртуальном экране появится исследуемая страница. Также можно работать с фоном, логотипами, поделиться превью с клиентом. В новом Вебмастере Яндекса, кстати, также появилась проверка поддержки мобильного дизайна — поисковики уделяют этому фактору все больше внимания.

Online Font Converter

Online Font Converter – бесплатный онлайн-конвертер шрифтов, используемых на сайтах, поддерживает 22 формата. Можно также подписаться на платный пакет услуг, позволяющий пользоваться без ограничений аналогичным сервисом Mashape.

Первый шаг – определение нужного формата из списка (нужно поставить галочку). Второй – переход к конвертации посредством нажатия кнопкиSelectFonts. А дальше – выбирать файлы среди хранящихся на вашем устройстве или в интернете (по URL), отменять неверный выбор можно кнопкой Clear, после выбора нужного нажать Done для конвертирования.

Вот такие интересные сервисы web дизайна подобрал для вас в ноябре. Не уверен что успею опубликовать еще одну похожу подборку в 2015 году, возможно, встретимся с данной рубрикой уже в январе 2016. В комментариях можете оставлять ссылки на полезные сервисы, с которыми вы работаете.