Rivalry2

HTML Diff

0 added 0 removed

Original 2026-01-01

Modified 2026-02-21

1 <a>#статьи</a>

2 <ul><li>21 сен 2023</li>

3 <li>0</li>

4 </ul>Рассказываем о Readymag - конструкторе сайтов, лендингов и презентаций, которым пользуются медиагиганты Conde Nast и Huffington Post.

5 Иллюстрация: Полина Честнова для Skillbox Media

6 Дизайнер интерфейсов и аналитик, любительница погулять с собаками друзей и пообсуждать жизнь с книжным клубом.

7 Readymag - это визуальный инструмент для создания сайтов, кейсов, веб-зинов, портфолио и других типов страниц, которым нужна красивая HTML-упаковка. В 2012 году его запустила компания дизайнеров из Москвы, которые сумели за несколько лет сделать из него всемирно известный сервис.

8 В своей работе Readymag используют не только дизайнеры, но и фотографы, журналисты, художники и все, кому нужен стильный дизайн. С конструктором работают дизайн-студии и коммуникационные агентства, крупные и небольшие компании и медиа: BBDO, IDEO, Airbnb, Huffington Post, Al Jazeera, DTE, Headless Horse, United Colors of Benetton и другие.

9 Функционал, за который дизайнеры выбирают R/M:

10 <ul><li>Кастомные сетка, курсоры и расположение блоков.</li>

11 <li>Продвинутая web-анимация, в том числе горизонтальная, на половину экрана, переходов между страницами.</li>

12 <li>Анимация взаимодействий: функция Draggable (перетаскивание элементов), виджет<a>Shots</a>(постепенное изменение изображения во время скролла или ховера), виджет<a>Hotspot</a>(появление скрытого контента).</li>

13 <li>Возможность работать с вариативными шрифтами.</li>

14 <li>Автолейаут и работа с группами.</li>

15 <li>Удобный редактор мобильных версий.</li>

16 <li>Шаблонные страницы и блоки.</li>

17 <li>Возможность вставить свой код.</li>

18 <li>Комментарии для командной работы.</li>

19 </ul>- Мы про "короткий метр" -<a>рассказал</a>Антон Герасименко, основатель Readymag. - Лендинги, спецпроекты, презентации и так далее. Когда есть чётко сформулированная идея и нужно максимально быстро и эффектно рассказать о ней людям. Это может быть "дизайнерская картинка", полотно текста или летающие по всему экрану анимированные чёрные шары. Я считаю, полная свобода в подаче своей истории - главная крутость R/M.

20 Скриншот: сайт<a>Readymag</a>/ Skillbox MediaНа сайте есть раздел<a>Examples</a>, где можно найти подборку последних работ, отобранных редакцией. В неё можно попасть, если прислать свою работу. Также у Readymag есть официальный<a>телеграм-канал</a>, где можно посмотреть классные работы, сделанные в конструкторе.

21 Скриншот: сайт<a>Readymag</a>/ Skillbox MediaНа порталах с подборками лучших сайтов планеты Awwwards и <a>One Page Love</a>можно сделать поиск по инструменту, с помощью которого был сделан сайт. Проектов туда добавляется немного, но они однозначно заслуживают внимания.

22 Скриншот: сайт<a>One Page Love</a>/ Skillbox MediaR/M делится небольшими выдержками из кейсов<a>компаний</a>, которые используют Readymag в своей работе: Conde Nast, Mindspace, Complex Media, IDEO, Strelka Institute, Obys, Playtronica и другие. Все бренды и их задачи очень разные, поэтому в разделе можно найти и лендинги, и коммуникационный дизайн, и веб-сайты, и образовательные проекты.

23 Скриншот: сайт<a>Readymag</a>/ Skillbox MediaВ кейсах видно, какие именно фичи предлагает Readymag, какие пользуются популярностью и помогают в бизнес-задачах. Например, израильская компания<a>Mindspace</a>использует Readymag для создания креативных лендингов, поэтому ей важны такие вещи, как интеграция с системами аналитики и электронной коммерции, Open Graph и прочие.

24 Изображение: Mindspace /<a>Readymag</a>Readymag ежегодно проводит открытый конкурс на лучший дизайн в разных категориях. Обычно это визуальный сторителлинг, типографика, навигация, инновации, мобайл и прочее. Заявки на сезон-2023 уже открыты.

25 В архиве лежат работы победителей конкурса, которыми тоже можно вдохновляться и делать для тренировки что-то похожее.

26 2022Скриншот: сайт<a>Readymag</a>/ Skillbox Media2021Скриншот: сайт<a>Readymag</a>/ Skillbox MediaВ плане взаимодействия с интерфейсом, Readymag ближе всего к Figma, Adobe InDesign и Zero Block от Tilda.

27 Страница в Readymag строится как рабочее пространство, в любое место которого можно добавить любой элемент, а не по принципу блоков, которые идут друг за другом. Именно поэтому ваш дизайн точно будет отличаться от всех.

28 Со стартовой страницы личного кабинета можно начать знакомство с продуктом и пройти небольшой онбордингСкриншот: сайт<a>Readymag</a>/ Skillbox MediaРабочая область проекта выглядит как пустое поле, которому можно назначить любую сетку. Основная панель с действиями расположена в виде двух блоков внизу страницы. При выделении добавленного элемента в правой части канваса появляются его настройки.

29 Скриншот: сайт<a>Readymag</a>/ Skillbox MediaСтраницу можно собрать с нуля из базовых элементов или использовать шаблонные страницы, которые можно декомпозировать на нужные элементы или просто изменить в них контент.

30 В 2023 году в Readymag появились<a>пресеты блоков</a>, то есть небольшие шаблоны конкретных элементов и модулей: кнопки, хедеры и футеры, галереи, попапы, формы и другие. В них уже заложена адаптивность под разные устройства, поэтому они помогут быстро набросать прототип или могут стать основой будущего дизайна.

31 Изображение:<a>Readymag Help</a>В 2022 году были добавлены функции<a>групповых изменений</a>(для работы с текстом, изображениями, кнопками и формами) и продвинутая работа с <a>автолейаутом</a>. С их помощью можно не только оптимизировать работу над десктопом, но и быстро собирать и редактировать адаптивные версии задуманного дизайна.

32 Изображение:<a>Readymag</a>Оба сервиса предоставляют похожие возможности сборки веб-страниц и добавления различного сложного функционала без помощи разработчиков. Но, коротко говоря, если у вас нет дизайнерских навыков, лучше идти в Tilda. Если они есть, можно попробовать Readymag.

33 Тильда заточена на более быструю работу со строго ограниченными в вёрстке шаблонными модулями и страницами. Readymag - более дизайнерская и креативная история, в которой можно сделать примерно всё.

34 По сути, это продвинутый Zero Block с огромным количеством вариантов анимации и удобным редактором адаптива.

35 Несомненный плюс Tilda - большое количество обучающих материалов, служба поддержки и комьюнити на русском языке. У самого Readymag обучающих материалов на русском языке нет.

36 Маркетинговые инструменты в Tilda также чуть более удобны в использовании и дают большую возможность раскрутить и оформить проект по всем правилам современного продвижения.

37 Тем не менее Readymag стабильно выкатывает новые фичи, следить за которыми удобнее всего в <a>блоге</a>.

38 Скриншот: сайт<a>Readymag</a>/ Skillbox MediaВ Readymag нет возможности создать интернет-магазин с модулями карточек товаров, разделами, флоу и прочим сразу в интерфейсе сервиса. Однако в проект можно подключить e-commerce-модули и сделать<a>красиво</a>.

39 Вместо собственной CMS Readymag<a>предлагает</a>подключить сторонние сервисы. Например, Shopify, а оплату проводить через Stripe или Ecwid. С другой стороны, иногда можно и заморочиться, чтобы сделать необычный лейаут, переходы, нестандартную анимацию, ховеры.

40 Скриншот: сайт<a>all around us product</a>/ Skillbox MediaСкриншот: сайт<a>all around us*</a>/ Skillbox MediaХороший способ начать работать в каком-то инструменте - декомпозировать уже имеющийся там контент. В разделе<a>Templates</a>размещено около 70 шаблонов в разных стилях и с разным функционалом.

41 Скриншот: сайт<a>Readymag</a>/ Skillbox MediaДля тех, кто хочет начать с азов, Readymag предлагает поиграть в <a>песочнице</a>. Здесь описаны основные структуры, с которыми вам придётся столкнуться при работе: сетка, анимация, формы, текст, кнопки, изображения. Каждой структуре посвящена своя страница, на которой вам покажут, что происходит, почему, и предложат самостоятельно что-то настроить.

42 Скриншот: сайт<a>Readymag</a>/ Skillbox MediaИз основного меню также доступен раздел<a>Learn</a>. В нём собраны основные полезные ссылки: видеоуроки, центр поддержки, форум, гайды, информация по интеграциям. Также Readymag предлагает личные консультации, если у вас нет времени на самостоятельное изучение функционала или возникли неочевидные вопросы по использованию сервиса.

43 Скриншот: сайт<a>Readymag</a>/ Skillbox MediaОсновы работы с интерфейсом можно изучить на официальном ютуб-канале<a>Readymag</a>. Там доступны видеоинструкции по работе с базовым функционалом и обзоры на новые фичи. Все видео выложены на английском языке.

44 <a>Стоимость подписки</a>, как всегда, зависит от количества сайтов и доступных фич.

45 Индивидуальная подписка на один веб-сайт бесплатна. Добавление к нему своего домена, форм, кастомных шрифтов и прочего обойдётся в 270 долларов в год.

46 Стоимость для команд зависит от размера аккаунта. Публикация пяти сайтов и добавление пяти коллег будет стоить 432 доллара в год.

47 Скриншот: сайт<a>Readymag</a>/ Skillbox MediaНКО и благотворительным организациям предоставляют<a>скидку 50%</a>на выбранный тариф. Образовательные организации также могут<a>запросить</a>скидку 50% на тарифы Free и Personal.

48 Скриншот: сайт<a>Readymag</a>/ Skillbox MediaНа странице цен есть удобное сравнение доступных фич в зависимости от выбранного плана (team/personal).

49 Скриншот: сайт<a>Readymag</a>/ Skillbox Media<a>Попробуйте бесплатно 4 топовые профессии в дизайнеПройдите бесплатный курс по дизайну. Добавьте 4 крутых кейса в портфолио и решите, в каком направлении развиваться дальше. Пройти курс→</a>