Ви щось збудували чи помітили чудову функцію і хочете її показати. Тож ви робите скріншот, кидаєте його в допис — і він просто лежить: плаский сірий прямокутник із різкими кутами, притиснутий до вашого тексту. Поруч із відшліфованим дописом він читається як щось другорядне. Гарна новина: різниця між «сирим захопленням» і «продуктовим скріншотом» — не майстерність і не дорогий інструмент. Це три невеликі коригування і вибір правильної форми для платформи.
Чому сирий скріншот виглядає пласко
У скріншота різкий край з усіх чотирьох боків і жодного зв'язку з тим, на що він потрапляє. У стрічці він зіштовхується з фоном допису й текстом навколо. Немає поля, тож ніщо не каже оку «це самодостатня річ»; немає глибини, тож він виглядає наліпленим, а не розміщеним. Відшліфовані скріншоти, повз які ви щодня гортаєте, тихо виправили саме ці дві проблеми.
Рецепт із трьох частин
Кожен скріншот «як вони зробили його таким чистим» робить ті самі три речі:
- Відступ — смуга простору навколо скріншота, щоб він не був утиснутий край до краю. Уже саме це робить більшу частину роботи.
- Заокруглені кути — пом'якшення чотирьох гострих прямих кутів на самому скріншоті, що миттєво читається як спроєктоване.
- М'яка тінь плюс фон — ледь помітна тінь підіймає зображення над поверхнею, а ніжний градієнт (чи суцільний колір бренду) заповнює відступ, щоб усе виглядало навмисно.
Це весь вигляд «продуктового скріншота». Вам не потрібна рамка пристрою чи анотації, щоб це працювало — це інша робота.
Киньте скріншот, оберіть градієнтний чи суцільний фон, підштовхніть відступ і радіус кутів і задайте тінь на смак. Попередній перегляд оновлюється наживо, і ви експортуєте PNG, коли виглядає правильно. Усе компонується на полотні у вашому браузері, тож скріншот — який може показувати особисте повідомлення, панель чи лист — ніколи нікуди не завантажується.
Оберіть співвідношення сторін для платформи
Одне й те саме прикрашене зображення має бути різної форми залежно від того, куди йде, і інструмент фіксує вивід у Авто, 16:9, 4:3, 1:1 чи 3:4:
- 16:9 — широкі соціальні картки й слайди. Чисто заповнює альбомний слот.
- 1:1 — квадратний допис для Instagram чи LinkedIn, де високі чи широкі зображення обрізаються в сітці.
- 3:4 — високе зображення, що займає більше екрана телефона, коли хтось гортає.
- Авто — коли ви просто хочете, щоб кадр обгорнув скріншот плюс його відступ, без нав'язаної форми.
Зафіксуйте потрібне співвідношення, і відступ дозаповнить решту кадру навколо скріншота, тож експорт лягає в слот без незручного обрізання.
Кілька зауважень щодо смаку
Тримайте тінь ледь помітною. Важка тінь виглядає як кепський drop-shadow із 2009 року; легка просто додає глибини. Не переборщіть із заокругленням кутів — малий радіус читається як відшліфований, величезний починає виглядати як бульбашка. І підбирайте фон під настрій: спокійний суцільний колір для чогось серйозного, м'який градієнт, коли хочете, щоб воно відчувалося як запуск.
Висновок
Вам не потрібне дизайнерське ПЗ, щоб скріншот виглядав так, ніби йому місце в справжньому дописі. Додайте поле, трохи заокругліть кути, покладіть його на м'який фон із ледь помітною тінню і експортуйте у формі, якої хоче платформа. Це займає менше хвилини, нічого не залишає ваш браузер, і результат перестає виглядати як сире захоплення і починає виглядати як щось, чим ви хотіли поділитися.