Ультимейт-шаблон скриншотов для стора в Figma

У меня есть небольшая команда, с которой мы частенько участвуем в различных хакатонах. Чтобы не тратить каждый раз время на разворот скриншотов для стора, я сделал гибкий шаблон в Figma на Auto Layout и оптимизировал этот процесс.

Ультимейт-шаблон скриншотов для стора в Figma

В нём можно отредактировать цвет фона, размеры шрифтов и их цвета. Остальное тоже можно изменить, но лучше потрать время на создание крутого приложения, чем на это.

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

Как его использовать

1 строка – макеты, 2 – место под экраны​, 3 – готовые скриншоты

Далее просто экспортируете в нужном вам размере (х2 или х3) и закидываете в стор. А чтобы оптимизировать скриншоты под iPhone 8 и ниже, нужно сделать три небольших шага:

  • Вставь адаптированные под восьмёрку макеты, отцентрируй их внутри заготовленной области
  • Поменять через instance маску в компоненте «Мокап телефона» с iPhone X на iPhone 8
  • Уменьшить шаблоны по высоте до 667px
​1 строка – макет, 2 – место под экран, 3 – готовый скриншот, 4 – компонент мокапа

P.S.

Заготовленный пресет скриншотов просто для примера, вы можете сменить шаблон для отдельного скриншота, если хотите.

Если у кого остались вопросы, как использовать шаблон, пишите в комментах или мне в Telegram.

Ну а если хочется ещё полезных материалов, то буду рад видеть тебя в моём Telegram-канале, там я пишу об оптимизации дизайн-процессов, системах и крутом софте


5151
36 комментариев

Комментарий недоступен

15
Ответить

Многогранный образец картин для показа на ярмарке чудес заморских *читать со старославянской интонацией*

46
Ответить

Комментарий недоступен

6
Ответить

Полный набор шаблонов иллюстраций для магазина приложений

2
Ответить

Комментарий недоступен

Ответить

Большое спасибо! Даже не думал, что напишу когда-нибудь подобное на VC

2
Ответить

На vc же много полезных материалов, не?)

1
Ответить