Содержание
- 01. Репо "Дизайн-системы"
- 02. PixelSnap
- 03. Эскиз. Потрошитель
- 04. Стэксвелл
- 05. Вариативные шрифты
- 06. Stripe Billing
- 07. CreativeGuild
- 08. Моббин
- 09. HueSnap
- 10. Эгградиенты
- Получите свой билет в Generate New York
Тема нашего обзора в этом месяце - скорость и эффективность: некоторые из них инструменты веб-дизайна сделает потрясающие вещи для вашего рабочего процесса, исключив утомительные, утомительные задачи, не имеющие ничего общего с дизайном. Возьмем, к примеру, Stackswell - он автоматизирует все раздражающие моменты создания адаптивного дизайна в Sketch. Другой наш инструмент ускоряет процесс, извлекая и систематизируя все ресурсы из файла .sketch.
Вдобавок к этому есть новый классный платежный продукт от Stripe, отличный сетевой инструмент для креативщиков от Тины Рот Айзенберг и фантастический инструмент для измерения объектов на вашем экране в пикселях.
01. Репо "Дизайн-системы"
Если вам было поручено поработать над некоторыми составляющими дизайн-системы вашей организации или, возможно, даже создать или кодифицировать саму систему, вы захотите ознакомиться с последними ресурсами по этой теме.
В этом вам поможет Design Systems Repo. Это собрание книг, статей, выступлений, веб-сайтов, инструментов, систем дизайна, библиотек шаблонов и руководств по стилю, которые вы можете использовать, чтобы понять, как ведущие организации и ведущие мыслители делают что-то.
02. PixelSnap
PixelSnap - очень отличное приложение, которое делает измерения на экране гораздо менее раздражающими. Поместите курсор между двумя элементами, такими как изображение и заголовок, и он автоматически сообщит вам количество пикселей между ними. Нарисуйте прямоугольник вокруг элемента, он обхватит его и сообщит вам его размеры. Да. Вы можете очень быстро измерить вещи.
Посмотрите видео на главной странице, чтобы получить представление. Стоимость приложения составляет 15 долларов, а единственным недостатком является то, что пока оно доступно только как приложение для Mac. Но если вы пользователь Mac, это здорово.
03. Эскиз. Потрошитель
Экспорт и подготовка ассетов из Sketch для передачи другой команде может быть настоящим препятствием, поэтому перспектива инструмента, который сделает это за вас одним щелчком мыши, довольно увлекательна. Sketch.Ripper извлекает и организует экраны, копии и растровые изображения со всех монтажных областей в файл .sketch и представляет их в удобном виде. Здесь вы можете увидеть пример вывода скопированного файла.
Этот инструмент является веб-интерфейсом, поэтому он работает в любой ОС, что может устранить некоторые затруднения в вашем рабочем процессе, если люди используют разные системы. Он создан компанией Icons8, и вы можете узнать о нем подробнее здесь.
04. Стэксвелл
Stackswell ускоряет рабочий процесс адаптивного дизайна, добавляя медиа-запросы в Sketch и автоматизируя процесс обновления стилей шрифтов и символов для каждой точки останова. Вместо того, чтобы выполнять эту работу вручную, когда вы настраиваете ширину монтажной области, стили автоматически обновляются.
Stackswell также избавляет вас от необходимости проверять ваш вертикальный интервал для каждой точки останова, поэтому вы получаете постоянный интервал с минимальными хлопотами. Подробнее об этом вы можете прочитать в этой статье.
05. Вариативные шрифты
Переменные шрифты позволяют использовать множество шрифтов различной толщины и ширины без необходимости включать для каждого отдельный файл: вы включаете один файл, а затем изменяете шрифт с помощью CSS. Это отличная ситуация, потому что она позволяет вам наилучшим образом использовать типографику в дизайне, не увеличивая вес страницы.
Однако не все вариативные шрифты одинаковы; некоторые из них более гибкие, чем другие. Этот инструмент позволяет вам находить разные шрифты и экспериментировать с ними, чтобы увидеть, подходят ли они вашим потребностям. Чтобы получить дополнительную информацию о вариативных шрифтах и понять, чего можно достичь, попробуйте эту демонстрацию.
06. Stripe Billing
Новый биллинговый продукт Stripe для онлайн-бизнеса предлагает третий способ для компаний, рассматривающих дилемму: создавать или покупать биллинговую систему (подробнее об этом читайте в нашей статье о решениях для интернет-магазинов). Stripe Billing API легко интегрируется в существующий сайт и позволяет использовать стандартные блоки для создания гибкой системы, адаптированной к вашим потребностям.
Когда ваша система настроена, все управляется с панели управления, где вы можете следить за подписками, счетами и финансовыми отчетами. Вы также получаете мощные функции, такие как глобальная платежная система Stripe, которая обрабатывает разные валюты и кредитные карты, и гибкие компоненты биллинга, которые позволяют экспериментировать с ценообразованием.
07. CreativeGuild
CreativeGuild - это ответвление CreativeMornings, серии бесплатных ежемесячных лекций, основанной Тиной Рот Айзенберг в Бруклине десять лет назад. Эта концепция стала хитом, и теперь отделения CreativeMornings открываются в более чем 185 городах по всему миру, каждая из которых имеет свое яркое сообщество, которое питает и вдохновляет своих членов.
CreativeGuild призван сделать некоторые аспекты сообщества онлайн доступными для большего числа людей. Вы можете думать об этом как о LinkedIn, но только для креативщиков. Есть каталог творческих компаний, частных лиц и вакансий, и вы можете выполнить поиск по местоположению, чтобы найти возможности в своем городе.
08. Моббин
Mobbin - это галерея дизайнов мобильных приложений, которые вы можете использовать, чтобы черпать идеи для своих собственных проектов - вместо того, чтобы устанавливать множество приложений, вы можете просматривать их в одном месте, чтобы увидеть, как другие решают проблемы дизайна. Отображаются шесть экранов для каждого приложения, чтобы вы могли получить представление о пути пользователя и шаблоне дизайна для каждого из них. Также есть боковая панель со списками вакансий.
09. HueSnap
Никогда не знаешь, когда придет вдохновение; возможно, декор отеля или свет в парке подойдут для вашей работы. Если это произойдет, вы можете сделать снимок и использовать HueSnap, чтобы извлечь цвета из изображения и превратить их в палитру.
Приложение предназначено для мобильного использования, поэтому лучше всего работает на вашем телефоне, и вы можете сохранять свои палитры и делиться ими с другими. Существуют различные функции, которые помогут вам изменить палитру, например параметры для выбора дополнительных и составных цветов. В каждой палитре может быть до шести цветов.
Чтобы узнать больше, ознакомьтесь с нашим обзором лучших цветовых инструментов для веб-дизайнеров.
10. Эгградиенты
Тот, кто собрал эту коллекцию красивых градиентов, обладает отличным цветовым чутьем и интересным чувством юмора. Каждый градиент отображается в контейнере в форме яйца, и ему дается имя, которое может как-то относиться к цветам, а может и не иметь. Если есть связь, мы не смогли ее расшифровать.
Примеры названий включают «Успешный иммигрант» для бирюзового градиента, «Разбитое сердце Возняка» для бледно-голубого и «Милосердный враг» для перехода от желтого к зеленому.
Получите свой билет в Generate New York
Ведущее мероприятие по веб-дизайну Создать Нью-Йорк вернулся. На мероприятии с 25 по 27 апреля будут выступать Дэн Молл из SuperFriendly, консультант по веб-анимации Вэл Хед, разработчик полного цикла JavaScript Уэс Бос и многие другие. Есть также день семинаров и лучших возможностей для нетворкинга - не пропустите его. Получите свой билет Generate сейчас.
