MockuptopВсе руководства

Осознанное использование 3D-мокапов

Плоский мокап — это изображение устройства, в прямоугольник которого вклеен ваш скриншот. 3D-мокап — настоящая модель, освещённая и снятая виртуальной камерой: вокруг неё можно ходить, её можно анимировать и получать настоящие отражения на рёбрах. Это дополнительное измерение мощное и его легко переусердствовать.

Что реально даёт 3D

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

Перспектива — это бюджет, который вы тратите

Каждый градус поворота стоит читаемости. Экран, повёрнутый на 30 градусов, теряет около трети видимой ширины и сжимает текст на дальней стороне. Практическое правило: если интерфейс должен читаться, оставайтесь в пределах примерно 15 градусов от фронтального положения и используйте угол только как намёк на глубину. Драматичные три четверти берегите для кадров, где устройство — форма в композиции, а содержимое экрана декоративно.

Угол обзора — скрытый регулятор

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

Частые вопросы

3D-мокап лучше плоского?

Не по определению. Он лучше, когда нужен конкретный угол, согласованный свет между устройствами или движение. Для фронтальной главной картинки плоский проще.

Работает ли 3D в браузере?

Да. Современные браузеры тянут 3D в реальном времени достаточно хорошо для полноценного редактора со светом и экспортом на стороне клиента, без отправки ваших скриншотов на сервер.

Почему мой 3D-мокап похож на снимок фишаем?

Слишком широкий угол обзора. Сузьте его и отодвиньте камеру, чтобы сохранить тот же кадр.

Сделайте это прямо в браузере. Положите скриншот на 3D-устройство, подвигайте камеру, выгрузите кадр или видео. Без установки и без аккаунта.

Открыть 3D-редактор Открыть фоторедактор
Язык: EN TR DE ES FR IT PT AR RU JA KO