Какой минимальный размер изображения можно задать для фона сцены

Знакомство со средой Scratch. Поиск, импорт и редактирование спрайтов и фонов из Интернета

В данный момент вы не можете посмотреть или раздать видеоурок ученикам

Чтобы получить доступ к этому и другим видеоурокам комплекта, вам нужно добавить его в личный кабинет.

Получите невероятные возможности

Конспект урока «Знакомство со средой Scratch. Поиск, импорт и редактирование спрайтов и фонов из Интернета»

· Поиск спрайтов и фонов в Интернете.

· Редактирование спрайтов и фонов в Scratch.

Ранее мы узнали, как сохранять и загружать спрайты и фоны для сцены. Однако в роли спрайтов и фонов можно использовать не только файлы Scratch. Также в качестве спрайтов можно использовать файлы изображений. Они могут уже находиться на компьютере или их можно загрузить из Интернета.

Запустим среду Scratch. Удалим спрайт Царапки со сцены. Для этого в поле спрайтов нажмём правой кнопкой мыши по иконке Царапки и в появившемся меню выберем пункт «Удалить». Сейчас наша сцена пуста. Найдём для неё декорации и персонажа в Интернете. Начнём с фона сцены. Важно, чтобы размер изображения для фона был не меньше чем 480 × 360 пикселей. Пиксели – это отдельные точки разных цветов, из которых состоит изображение.

Для поиска изображения запустим браузер – программу-обозреватель веб-сайтов. Для поиска картинки можно воспользоваться одной из поисковых служб. Например, нам понравилась эта картинка лесной поляны. Стоит убедиться, что её размер не меньше указанного ранее. В браузерах Microsoft Internet Explorer и Microsoft Edge для этого можно нажать на картинку правой кнопкой мыши и в появившемся меню выбрать пункт «Свойства». На экране появилось окно свойств изображения. В нём нужно найти пункт «Размеры». Как видим, размеры выбранной картинки – девятьсот пятьдесят пять на пятьсот тридцать два пикселя. Это больше, чем четыреста восемьдесят на триста шестьдесят пикселей. Мы можем использовать эту картинку в качестве фона. В других браузерах размер картинки можно определить иначе.

Теперь нам нужно загрузить эту картинку из Интернета на компьютер. Для этого нажмём на неё правой кнопкой мыши и в появившемся меню выберем пункт «Сохранить изображение как…». На экране появилось уже знакомое нам окно сохранения файла. Сохраним изображение в нашей рабочей папке под именем «Лесная поляна».

Нам нужно импортировать загруженное изображение в Scratch. Для этого, не закрывая окно браузера, вернём на экран окно среды Scratch. Выделим иконку сцены. Как мы помним, она находится слева от поля спрайтов. После этого в верхней правой части окна перейдём на вкладку «Фоны». Далее нажмём на кнопку «Загрузить фон из файла», находящуюся под вкладками. В появившемся окне выбора файла выберем файл «Лесная поляна» из нашей рабочей папки.

Наша лесная поляна появилась на сцене, однако сверху и снизу от неё остались пустые белые промежутки. Чтобы это исправить, перейдём к области рисования в правой части экрана. Выберем инструмент с названием «Выбрать». Он используется для выделения участков изображения. Установим курсор мыши в одном из углов изображения поляны. После этого, удерживая левую кнопку мыши, переместим курсор в противоположный угол изображения поляны. Таким образом мы выделили участок сцены, на котором изображена поляна. Как видим, по краям изображения появились границы синего цвета и точки на ней. Наведём курсор на нижнюю точку границы. Он принял вид двунаправленной стрелки. Теперь перетащим эту точку в нижний край сцены. При этом растягивается изображение поляны. Поместим выделенную точку на нижний край сцены.

Теперь наша поляна занимает всю сцену. Нужно населить её разными лесными жителями, то есть добавить на сцену спрайты. В качестве спрайта можно использовать любое изображение. Как и в случае с поляной, воспользуемся браузером и найдём картинку медведя, например, такую… Точно так же, как мы это делали с лесной поляной, сохраним картинку медведя в нашей рабочей папке под именем «Медведь».

Теперь в среде Scratch загрузим спрайт нашего медведя. Для этого в верхней части поля спрайтов нажмём на кнопку «Загрузить спрайт из файла». В появившемся окне выберем из нашей рабочей папки файл «Медведь». Мишка появился на поляне. А в поле спрайтов появился спрайт и с именем «Медведь». Наш мишка как-то великоват для маленькой лесной полянки. Однако это не беда, ведь мы можем его уменьшить. Для этого над вкладками нажмём на кнопку «Уменьшить». Переместим курсор мыши на мишку, который находится на поляне, и будем нажимать на него до тех пор, пока размер мишки не станет достаточно маленьким для нашей лесной поляны. Перетащим нашего медведя в нужное место поляны.

Поэкспериментируем немного над нашим мишкой. Для этого перейдём на вкладку Костюмы. Обратим внимание на область рисования. Как видим, наш мишка окружён маленькими шахматными клетками, при этом на сцене вокруг него таких клеток нет. Эти клетки означают прозрачный фон. Проверим это. В области рисования выберем инструмент «Заполнить цветом» и укажем белый цвет. Теперь нажмём левой кнопкой мыши по области вокруг медведя. Она стала белой. При этом на сцене мишка также попал внутрь белого прямоугольника. Нужно это исправить. Вернёмся к полю рисования и зальём область вокруг мишки прозрачным фоном. Чтобы его выбрать, найдём на палитре цветов белый квадратик, перечёркнутый красной линией, и выберем его. Дальше нажмём левой кнопкой мыши по свободной области вокруг медведя. Фон вокруг мишки снова стал прозрачным, и на сцене исчез белый прямоугольник.

Мишка говорит, что ему скучно и одиноко в лесу. Исправим это. Добавим к нему соседей, например ёжика и зайца. Найдём в Интернете ёжика. Например, вот такого… Сохраним картинку с ним в нашей рабочей папке под именем «Ёжик».

Перейдём к окну среды Scratch и загрузим нашего ёжика. Он появился на сцене, а в поле спрайтов появилась иконка спрайта с именем «ёжик». Уменьшим его и разместим напротив мишки. Теперь найдём зайца и сохраним картинку с ним в нашей рабочей папке. Загрузим спрайт с ним в среде Scratch, уменьшим его и разместим рядом с мишкой. Мы можем ещё немного украсить нашу картинку, положив ёжику на спину яблоко. Спрайт яблока можно без труда найти в библиотеке Scratch.

Какой замечательный рисунок у нас получился, просто лесная сказка… Сохраним его. Для этого в меню «Файл» выберем пункт «Сохранить как…». Сохраним рисунок в нашей рабочей папке под именем «Лесная сказка».

· В качестве фона сцены или спрайта можно использовать любое изображение.

· Изображение для фона сцены должно иметь размер не меньше, чем 480 × 360 пикселей.

· Как загружать изображения для спрайтов и фонов сцены из Интернета, импортировать их в Scratch и редактировать.

Какого размера должна быть шапка, превью и аватарка для YouTube.

Вопрос про размеры для ютуба часто вызывает сложности. Это связано, во-первых, с тем, что нет единого названия этим элементам оформления канала. Шапку называют баннером, фоном, фоновым изображением, аву называют то логотипом, то значком и т.д. И, во-вторых, разработано три вида размеров для графических элементов оформления: минимальный, рекомендуемый и максимальный.

Размер шапки ютуб

Баннер занимает одну треть часть экрана в браузере стационарного компьютера и посетители блога рассматривают шапку в первую очередь.

Конечно, YouTube смотрят на самых разных устройствах, не только на настольных компьютерах. И то, как будет отображаться изображение канала (или баннер), будет меняться в зависимости от устройства.

В браузере стационарного компьютера и на мобильном телефоне шапка отображается в виде узкого горизонтального баннера с соотношением сторон 6,2:1.

Если зритель смотрит телевизор, это полноэкранное фоновое изображение с соотношением сторон 16:9. Но так как хостинг разрешает загрузить только одно изображение в качестве шапки, то нужно убедиться, что картинка правильно отображается для всех устройств.
Для этого в размеры для ютуба добавили определение «безопасная зона».

Это прямоугольник 1546*423 px. в самом центре. Сюда помещают наиболее важную информацию о канале, которая гарантированно будет видна пользователям, независимо от того, с какого устройства зритель зашел на канал.

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

Теперь становится понятно, почему так важно сохранять название канала в пределах безопасной зоны 1546 x 423 пикселей. Настольная и мобильная версии выглядят по — разному. Обратите внимание, что изображения на компьютере и на телефоне отображаются с одинаковой высотой, но картинка на десктопе намного шире.

Рекомендуемые размеры для ютуба

Разрешение, которое YouTube рекомендует в качестве идеального для баннера, составляет 2560 пикселей в ширину и 1440 пикселей в высоту. Готовый фон для шапки ютуба 2560×1440 пикселей можно скачать на нашем сайте.

Минимальная картинка

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

Минимальный размер шапки канала на ютубе — не менее 2048 пикселей в ширину и 1152 пикселей в высоту.

Не пытайтесь установить в качестве баннера изображение с низким разрешением, и если вы попытаетесь загрузить картинку, то получите сообщение об ошибке, которое выглядит так:

Максимальный размер баннера

Максимальный размер шапки ютуб не ограничен количеством пикселей, но ограничен объемом файла — до 6 МБ. Это значит, что можно загружать изображения с высоким разрешением.

Хотя большинство камер и даже смартфонов создают файлы JPG, которые намного больше этого. В таких случаях, уменьшайте файл до 6 МБ перед загрузкой. Вес файла делают меньше уменьшив разрешение или увеличив сжатие. Лучше уменьшать разрешение, но, конечно, стремиться к рекомендуемому размеру.

Разрешение у аватарки на YouTube

Аватарка — это небольшая миниатюра, которая отображается рядом с названием канала под вашими видео. Аву ещё называют «иконка» или «изображение профиля». Кроме этого, тот же значок будет использоваться во всех сервисах Google, включая почтовый ящик.

Лучший размер аватарки для ютуба – 800px * 800px, но обратите внимание, что это квадрат, который при загрузке обрежется под круг.

Поэтому старайтесь не располагать важные элементы авы по краям квадрата – детали будут скрыты.

Готовые к установке шаблоны аватарок для ютуба в стандартном разрешении 800 х 800 пикселей скачивайте на нашем сайте.

При создании значка следуйте этим пяти рекомендациям:

• Упрощайте картинку. Аватарка маленькая, а при просмотре на мобильном устройстве будет ещё меньше. Поэтому это не место для мелких деталей. Даже если ава предполагает текст, постарайтесь сократить надпись, например, взять только одну первую букву.
• Делайте значок в соответствии с вашим брендом. В этом случае автор блога будет более узнаваем, и канал станет проще найти.
• Делайте аватарку с учетом аудитории. Здесь ответьте себе на вопрос: какое изображение больше понравится вашим зрителям на YouTube.
• Обратите внимание на цвет фона. Среди блогеров распространен логотип, расположенный на белом фоне, который загружают в качестве аватарки. Не используйте белый фон, который сливается с фоном экрана. Посмотрите на эти две картинки – первая обращает на себя внимание за счет цветного фона:

• Делайте значок в одном стиле с шапкой. Когда будете создавать миниатюру, не забывайте, что аватарка и шапка отображаются рядом друг с другом. Каждая картинка — элемент оформления вашего канала. Цвета, тон и эмоциональные элементы (такие, как юмор) дополняют друг друга.

Размеры превью

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

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

Чтобы миниатюра работала на 100%, делайте обложки для канала youtube правильного формата.

Идеальное разрешение обложки youtube канала:

• Разрешение: 1280 × 720 (при минимальной ширине 640 пикселей).
• Соотношение сторон: 16: 9.
• Максимальный размер превью для YouTube составляет 2 МБ.
• Допустимые форматы изображений: JPG, GIF и PNG.

Обратите внимание: скачать обложку видео youtube стандартного формата можно в разделе «шаблоны».

Как добавить обложку на видео

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

Значки выбираются случайным образом из ролика и отображаются внизу страницы загрузки:

Автоматически сгенерированные значки не отражают содержание видео, поэтому нажмите на кнопку «Загрузить значок» и добавьте заранее созданную заставку.

Пять правил кликабельного превью:

1. Привлекайте внимание текстовыми оверлеями. Добавление текста привлечёт зрителей и даст представление о чем будет видео. Это полезно, если вы хотите добавить больше контекста, чем в заголовке.
2. Изображение на заставке должно быть релевантным ролику. Никто не любит кликбейт. Превью должно быть приманкой, а не обманкой!
3. Добавьте аватарку. Разместив значок или логотип на обложку видео, вы повысите шансы на то, что зрители запомнят название вашего бренда или канала. Это не только пригодится, когда зрители захотят найти автора на YouTube. Но, также, поможет вам сгенерировать сарафанное радио, если зрители расскажут о канале друзьям.
4. Не нагромождайте. Превью маленькие, поэтому следите за тем, чтобы на картинке оставалось свободное пространство. Куча-мала на обложке скорее отобьёт желание смотреть ролик.
5. Интригуйте зрителей. Задача заставки – побудить людей посмотреть видео. Если вам удастся с помощью обложки разжечь любопытство в зрителях, то, они нажмут на просмотр ролика.

На этом закончим обзор про размеры для ютуба для картинок и фото, пишите вопросы в комментариях.

Размер макета сайта

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

Разрешение экрана (монитора) – это размеры получаемого на экране изображения в пикселях. Например, разрешение экрана 1920 x 1080 означает, что ширина изображения на мониторе равна 1920, а высота 1080 пикселей.
Популярные разрешения мониторов (стационарные компьютеры и ноутбуки):
1920 х 1080 (full HD)
1600 х 900
1440 х 900
1366 х 768
1280 х 1024
1280 х 960
1024 х 600
Когда мы разрабатываем прототип для десктопа, то нам важно понимать, что мы не должны рисовать варианты для всех существующих компьютеров, нам нужно выбрать оптимальный размер макета сайта, который позволит отображать будущий сайт корректно на всех десктопах.
Универсальной шириной для прототипа на компьютер и ноутбук является 1920 пкс, также может использоваться ширина 1440 или 1280 пкс. Универсальной высоты нет, т.к. у каждого проекта она своя и зависит от количества разделов.

Когда мы создаем макет сайта шириной 1440 пкс, но открываем его на мониторе 1920 пкс, то по бокам появляются белые или серые полосы, которые заполняют пустое пространство. Если же мы создаем прототип шириной 1920 пкс, а открываем его на мониторе шириной 1440 пкс, то прототип (или макет) “обрезается” по бокам, и мы видим содержимое сайта только в пределах 1440 пкс. В таком случае дизайнеру нужно учесть следующий момент — важный контент (тексты, кнопки и небольшие фотографии) не должны выходить за пределы контейнера определенной ширины. За такую ширину чаще всего принимается значение 1170 или 940. Таким образом, дизайнер создает прототип (или макет) шириной 1920 пкс, но весь важный контент умещает на ширине 1170 или 960 пкс.

Сегодня мы подробно рассмотрели размер макета сайта только для десктопов (компьютеров и ноутбуков), а разрешения портативных устройств (планшетов и смартфонов) мы рассмотрим в другой раз. Подписывайся на блог по веб-дизайну.

Требования к печати баннера

Макет для широкоформатной печати можно подготовить в разных графических редакторах. Мы принимаем файлы следующих форматов:

• tiff (Tagged Image File Format);
• psd (Photoshop Document);
• pdf (Portable Document Format);
• ai (Adobe Illustrator Artwork);
• eps (Encapsulated PostScript);
• crd (CorelDRAW).

Какое разрешение нужно для печати баннера

Разрешение файла

Сколько dpi нужно для печати баннера? Это зависит от площади рекламной поверхности, информации, которую она содержит, и места размещения.

• 60-70 dpi — достаточно для наружной конструкции площадью больше 5 квадратных метров.
• 70-100 dpi — это норма для рекламы площадью в 2-5 м2.
• 100-150 dpi — хватит для печати баннера размером до 2 кв. м (для текста нужно 100 пикселей, использование фотографий требует 150 пикселей).
• 300 dpi — показатель для печати интерьерных плакатов.

Разрешение печати для баннера

Качество печати тоже подбирают в зависимости от особенностей рекламной конструкции.

• 360 dpi — это стандарт для изготовления баннеров.
• 540 dpi — подходящий размер в пикселях для печати баннера в улучшенном качестве.
• 720 dpi — используется для создания интерьерной рекламы.
• 1440 dpi — разрешение для печати в фотокачестве.

• для создания уличной рекламы с качеством печати в 360-540 dpi достаточно разрешения файла в 72-100 dpi;
• для интерьерных изделий с качеством печати в 720-1440 dpi потребуется разрешение макета в 150-200 dpi.

Какую цветовую модель используют в макетах

Макеты баннеров для широкоформатной печати готовят в палитре CMYK.
Следует учитывать следующие особенности:

• черный цвет должен быть составным (примеры — M68, Y67), иначе оттенок уйдет в темно-серый с горизонтальными полосами;
• для черно-белых изображений задается только черный, другие цветовые каналы должны быть нулевыми, иначе добавятся посторонние оттенки (синий, красный или желтый).

Чтобы проверить передачу тонов, рекомендуется провести цветопробу. Тестовую печать выполняют на том же оборудовании, что и весь будущий тираж, и на том же материале. Образец покажет, насколько корректно подобраны цвета CMYK.