Дизайн и разработка

Coolors — генератор цветовых палитр с выбором цветов из изображений, проверкой контраста, градиентами и библиотекой общих палитр.

Iconoir — открытая библиотека из более чем 1600 SVG-иконок на сетке 24×24 под лицензией MIT, без регистрации; на собственном сайте иконки можно просматривать и скачивать.

Open Peeps — нарисованная вручную библиотека иллюстраций Pablo Stanley под лицензией CC0, в которой персонажи собираются из рук, ног, причесок, одежды, выражений лица и поз.

Accessibility Insights for Web — инструмент Microsoft в виде расширения для Chrome и Microsoft Edge: FastPass для быстрой проверки и Assessment для пошаговой оценки по WCAG 2.1 AA.

Carrd — сервис, позволяющий без кода создавать и публиковать одностраничные сайты, адаптированные под мобильные, например профили, промостраницы и лендинги; начать можно бесплатно, до трех сайтов на аккаунт.

iconmonstr — сайт иконок: более 4784 бесплатных иконок в 316 коллекциях, с поиском; скачивание после принятия лицензионного соглашения.

Jitter — веб-инструмент моушн-дизайна, который создаёт анимацию из бесплатных шаблонов или с чистого холста и экспортирует результат в видео, GIF или Lottie.

Галерея ManyPixels — галерея иллюстраций: более 20 000 бесплатных иллюстраций в пяти стилях и 17 категориях; лицензия разрешает коммерческое использование без указания авторства.

Mockuuups Studio — редактор мокапов, в котором вы перетаскиваете свой дизайн на тысячи мокапов устройств и печатной продукции; он доступен в браузере, как настольное приложение и через плагины для Figma, Sketch, Penpot и Adobe Express.

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

Notepad++ — бесплатный редактор исходного кода для Windows, заменяющий Блокнот; он основан на компоненте Scintilla и распространяется по лицензии GPL.

Что нужно знать: Нужна установка на компьютер.

Rive — инструмент для проектирования интерактивной анимации и интерфейсов с помощью машин состояний (state machines); есть редактор в браузере и настольное приложение, а результат работает в рантаймах, таких как iOS, Android, веб, Flutter, React и игровые движки.

Spline — инструмент 3D-дизайна для создания 3D-сцен с совместной работой в реальном времени в браузере и в настольных приложениях для Mac и Windows, добавления интерактивности и анимации и экспорта в веб, React и другие форматы.

Storyset — сайт иллюстраций Freepik Company с редактируемыми и анимированными иллюстрациями; бесплатное использование зависит от указания авторства.

The Noun Project — большая библиотека векторных иконок и фото от авторов, которые можно скачать в SVG и PNG; есть бесплатные загрузки и платные роялти-фри лицензии.

unDraw — сайт бесплатных SVG-иллюстраций, цвета которых можно сразу подстроить под бренд; лицензия разрешает коммерческое и некоммерческое использование без указания авторства.

Visual Studio Code — редактор кода от Microsoft для Windows, macOS, Linux и браузера (vscode.dev) с расширениями, Git, встроенным терминалом и отладкой.

Что нужно знать: Нужна установка на компьютер.

Zed — редактор кода от Zed Industries, написанный на Rust и рассчитанный на скорость и совместную работу с людьми и ИИ, для macOS, Windows и Linux.

Что нужно знать: Нужна установка на компьютер.

Adobe Color — инструмент Adobe, который строит палитры на цветовом круге по правилам гармонии, извлекает палитры и градиенты из изображений и проверяет контраст и вид для дальтоников.

Awwwards — галерея наград и вдохновения в веб-дизайне, где отмеченные наградами сайты показаны по категориям и технологиям; просмотр бесплатный, а Pro-членство даёт преимущества при подаче работ и для профиля.

Color Hunt — каталог палитр, где дизайнеры и художники просматривают готовые цветовые палитры по цвету, настроению или теме и сортируют их по новизне, популярности или случайно.

Dribbble — дизайн-платформа, где дизайнеры делятся своими работами, где вы можете находить лучших дизайнеров и их работы и где компании ищут креативные таланты.

Figma — дизайн-инструмент для проектирования интерфейсов и создания прототипов на одном холсте, командной работы и преобразования дизайна в код с помощью Dev Mode; им пользуются через figma.com и настольные приложения.

Fontjoy — веб-инструмент, который предлагает сочетания шрифтов с помощью глубокого обучения, позволяет менять пару вручную кнопками «Создать», «Закрепить» и «Изменить» и берет шрифты из библиотеки Google Fonts.

Google Fonts — коллекция шрифтов Google на fonts.google.com; большинство шрифтов распространяется по SIL Open Font License, часть — по Apache 2 и Ubuntu Font License.

Google Sites — инструмент Google, интегрированный с Google Workspace, для создания без кода сайтов команд, проектов и мероприятий перетаскиванием элементов.

Leonardo — открытый инструмент Adobe, который строит цветовые шкалы и адаптивные темы по целевому коэффициенту контраста и с самого начала учитывает доступность.

LottieFiles — платформа моушн-дизайна с библиотекой из более чем 800 000 бесплатных и премиум-анимаций, веб-редактором Lottie Creator и форматами Lottie и dotLottie.

Mobbin — библиотека дизайн-референсов: экраны мобильных и веб-приложений, сквозные сценарии вроде онбординга и оплаты, шаблоны интерфейса и разделы сайтов; бесплатный аккаунт даёт ограниченный доступ.

PageSpeed Insights анализирует адрес страницы для мобильных и компьютеров и показывает полевые данные реальных пользователей вместе с лабораторными данными Lighthouse.

Penpot — платформа для дизайна с открытым исходным кодом, предназначенная для проектирования интерфейсов, вайрфреймов и интерактивных прототипов; ею можно пользоваться в облаке или установить на собственный сервер, а работает она с открытыми стандартами, такими как SVG, CSS, HTML и JSON.

Phosphor Icons — семейство иконок под лицензией MIT для интерфейсов, диаграмм и презентаций: 1248 иконок и шесть начертаний (тонкое, легкое, обычное, жирное, заливка, дуотон).

Placeit — веб-инструмент для дизайна от Envato, который предлагает мокапы для одежды, цифровых устройств, печатной продукции и товаров с печатью по требованию, а также конструктор логотипов, шаблоны дизайна и видеоинструменты; безлимитные загрузки доступны по подписке.

Rotato — генератор мокапов, который помещает ваш собственный дизайн приложения или сайта на экраны более чем 30 готовых 3D-устройств и превращает его в анимированное видео или изображение; есть приложение для macOS и веб-версия в публичной бета-версии.

Что нужно знать: Нужна установка на компьютер.

Shots.so — веб-приложение для мокапов, которое превращает скриншоты продуктов в изображения для презентаций или короткие видео с рамками устройств, фонами и анимированным движением.

Squarespace — платформа для создания сайта без кода с шаблонами, редактором перетаскиванием и ИИ-конструктором сайтов, где хостинг, домены и инструменты торговли собраны в одном месте.

Sublime Text — платный текстовый редактор от Sublime HQ для Windows, macOS и Linux, делающий упор на производительность при работе с кодом, разметкой и текстом, с плагинами через API Python 3.8.

Что нужно знать: Нужна установка на компьютер.

Uizard — инструмент для проектирования интерфейсов с поддержкой ИИ, который по текстовому запросу создаёт редактируемые многоэкранные прототипы, а скриншоты и рисунки от руки превращает в редактируемые дизайны.

WAVE — инструмент WebAIM, который отмечает значками ошибки доступности и WCAG прямо на веб-странице; доступен как онлайн-инструмент и как расширение для браузера.

Webflow — платформа для создания сайтов, позволяющая визуально проектировать сайт без кода и публиковать его с CMS, хостингом и электронной коммерцией.

WhatTheFont — инструмент распознавания шрифтов от MyFonts: ищет в своей базе шрифты, похожие на текст в изображении, и показывает список совпадений с превью текста.