Как скопировать изображение из Unsplash в любом размере и качестве

1️⃣ Выбираем нужную картинку из unsplash.com

2️⃣ Жмём правой кнопкой мыши и выбираем Open in New Tab

3️⃣ Вписываем нужные цифры в конце адресной строки:

👉 ...w=1280&q=80
Где width — ширина, а quality — качество после сжатия. Нажимаем Enter и ждем, пока прилетит картинка

4️⃣ Копируем ее через правую кнопку и Copy Image

5️⃣ Вставляем в Фигме через Ctrl + V

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

Если нужно вставить в конкретный контейнер
После вставки можно Ctrl + C заливку с картинкой и Ctrl + V в нужный контейнер.

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

Картинки на серверах Фигмы хранятся в нескольких размерах, максимальный — 4096px
Это позволяет оптимизировать скорость загрузки файла. Но, если вдруг вам нужно будет экспортировать файл из Фигмы, все изображения она отдаст в их максимальном разрешении. Что может значительно увеличить объем файла. Поэтому нам лучше подумать про оптимизацию заранее, и сразу закидывать картинки в необходимом размере.

Когда нужно уменьшать изображения
В десктопных интерфейсах допустимо использовать картинки в оригинальном размере. Но при работе над мобильными интерфейсами картинки в 4K точно не нужны, поэтому я всегда пользуюсь этой методикой оптимизации. Обычно хватает 1280px в ширину.

#техники_работы