В настоящее время существует множество программ, позволяющих создавать веб-публикации, будь то презентации, журналы, сайты или лендинги. Среди популярных онлайн-платформ можно выделить Readymag, которая предназначена для разработки контента с анимационными элементами и эффектами.
Для того, чтобы работать в программе, нужно иметь базовые знания в графическом дизайне. На основе популярной платформы было разработано множество сайтов и веб-публикаций. Какими возможностями обладает платформа и как ее можно освоить?
Что это за платформа
Софт пользуется спросом у дизайнеров, журналистов, блогеров, а также всех тех, кто любит публиковать контент и делиться своими историями в сети. Пользователей привлекает простой и удобный интерфейс программы, что дает возможность освоить платформу, не обладая какими-либо специальными навыками и познаниями.
Платформа Readymag предназначена для созданий публикаций и контента в Интернете. Посредством программы можно создавать целые сайты, лендинги, презентации, цифровые журналы и многое другое. Одной из особенностей приложения является экспорт кода с целью переноса созданного макета на собственный хостинг.
Readymag. Полный обзор конструктора сайтов Редимаг
Есть несколько возможностей работы с платформой: посредством бесплатного тарифа и подключив платные услуги. Преимуществом платного тарифа является создание и опубликование неограниченного количества контента и проектов. В редакторе имеется набор шаблонов и виджетов для оформления и создания веб-страниц. Помимо стандартного набора фигур и кнопок, в редакторе есть уникальные возможности добавлять анимацию, настраивать видео-фон и многое другое.
История создания
Онлайн-редактор Readymag был разработан молодыми дизайнерами: Антоном Герасименко, Дианой Новичихиной и Кириллом Данченко. Создатели популярной платформы Диана Новичихина и Антон Герасименко познакомились в 2005 году, поскольку все работали в студии Артемия Лебедева. В 2010 году молодые люди познакомились с Кириллом Данченко, который на тот момент владел студией веб-разработки Astroshock.
Идея создать удобный редактор для верстки сайтов возникла у дизайнеров в 2012 году. Уже в 2013 году основатели и разработчики сервиса запустили закрытое тестирование приложения. Надо отметить, что приложение было протестировано успешно пятью тысячами пользователей.
Официальный релиз и выпуск Readymag в «жизнь» состоялся в октябре 2013 года. Новый сервис сразу же полюбился многим пользователям. К концу 2013 года приложением активно пользовались более семи тысяч человек.
На сегодняшний день онлайн-редактор Readymag пользуется огромным успехом у дизайнеров, фотографов, журналистов и обычных обывателей. Сервис подкупает простотой своего интерфейса, а также возможностью создавать различные типы мультимедийных файлов. С каждым годом сервис все более усовершенствуется, становится лучше.
Функции редактора
Многофункциональный редактор Readymag предназначен для создания цифрового контента, который может быть представлен в виде статьи, фотоальбома, презентации. Пользователи могут начать создание уникального контента с нуля или воспользоваться одним из заготовленных шаблонов, в зависимости от того, какого плана контент необходимо создать.
Возможности сервиса впечатляют. При желании можно создать целый сайт с элементами анимации. Следует отметить, что возможности сервиса во многом зависят от трафика. Предусмотрен как бесплатный трафик, так и платный с еще большими функциями.
Набор стандартных функций редактора:
- возможность создать презентацию, портфолио, альбом и другой цифровой контент;
- большая база шаблонов;
- доступны фотографии и прочие изображения;
- возможность встроить видео;
- можно корректировать фоновые изображения;
- можно регулировать громкость аудиоматериалов;
- возможен формат совместной работы, вплоть до десяти пользователей;
- можно отслеживать статистику с помощью Google Analytics;
- кроме текста, фигур и видео, можно разместить на сайте элементы Facebook, а также любой другой контент, воспользовавшись кодированием;
- существуют готовые модули для Vimeo, Youtube;
- можно загружать собственные шрифты.
Следует отметить, что бесплатный тариф предполагает создание десятистраничного сайта. Есть приобрести платную версию редактора, то появится возможность создавать и публиковать неограниченное количество контента и сайтов.
Разработчики позаботились о пользователях сервиса и дополнительно разработали мобильную версию приложения. Функции в мобильном приложении все те же, что и в обычном.
Сервис не русифицирован, поэтому при работе с ним нужно либо знать английский язык, либо пользоваться услугами онлайн-переводчиков. Однако, если потребуется задать какой-либо вопрос в техподдержку, сделать это можно на русском языке.
Как работать на платформе
Прежде, чем приступить к работе в редакторе Readymag, нужно ознакомиться с функционалом инструментов программы, а также научиться соблюдать правила пользования сервисом. Узнать об особенностях использования можно в разных видео и статьях. Также можно обратиться в службу техподдержки сервиса.
Весь процесс создания контента и сайта происходит в редакторе. Экран редактора появляется в случае, когда нужно создать новый проект или отредактировать уже имеющийся. Для того, чтобы воспользоваться виджетами (инструментами для создания контента), следует нажать на иконку «Add widget», которая располагается в левом нижнем углу редактора. Поблизости от иконки «Add widget» находится кнопка, с помощью которой можно выбрать фон проекта, а также настроить сетку.
Работать в редакторе не сложно, достаточно обладать базовыми знаниями в графическом дизайне. Можно создать новый проект с чистого листа или воспользоваться одним из множества предложенных программой шаблонов.
Обучение
Далеко не каждый пользователь может освоиться в редакторе, тем более, что сервис не имеет русифицированной версии. Новичкам может показаться сложным и непонятным интерфейс. Существуют разнообразные спецкурсы и видеоматериалы, ориентированные для начинающих пользователей и помогающие освоить работу в редакторе Readymag.
Список бесплатных обучающих курсов и материалов:
- Уроки об основах Readymag.
- Обучающие бесплатные видеоуроки от Skillbox.
- Бесплатное занятие, посвященное Readymag, от Нетологии.
- Онлайн-курсы «READYMAG. ДИЗАЙН БЕЗ КОДА».
Помимо онлайн-уроков существуют разные занятия и курсы, которые можно посетить на фестивале современного искусства «Здесь и сейчас», а также в многочисленных школах дизайна. Преподаватели готовы поделиться тонкостями работы в редакторе Readymag, а также дать советы начинающим дизайнерам.
Примеры сайтов, созданных на конструкторе
Конструктор Readymag известен всему миру и пользуется спросом у дизайнеров и разработчиков сайтов разных стран. Благодаря сервису было создано множество цифровых публикаций и сайтов.
Примеры сайтов:
- https://peterelima.com;
- http://nicolasleite.com.br;
- https://aminto.co.
Это лишь немногие из примеров, которые были созданы с помощью популярного редактора. Каждый из сайтов наполнен уникальным контентом, на некоторых можно увидеть анимационные элементы.
Плюсы, минусы и отзывы пользователей
Дизайнерский сервис Readymag имеет множество аналогов и предназначен для создания цифровых публикаций и сайтов. Как и любой сервис, Readymag имеет свои преимущества и недостатки.
Преимущества:
- довольно простой и удобный в использовании интерфейс;
- предусмотрена возможность создания практически любого контента;
- возможность обратиться в техподдержку;
- широкие возможности по созданию анимационных эффектов;
- есть бесплатная версия, предназначенная для создания сайтов до десяти страниц.
Недостатки:
- нет русифицированной версии;
- начинающим пользователям без дополнительного обучения будет сложно работать в конструкторе;
- высокая стоимость сервиса;
- многие пользователи жалуются на однотипные шаблоны.
Если посмотреть на отзывы пользователей, то чаще всего можно увидеть положительные отзывы. Особо отмечается функционал программы, большой набор инструментов, возможность работать над одним проектом совместно. Загружать видео и фотоматериалы можно как с компьютера, так и находить в сети.
Негативные отзывы, к сожалению, также имеются. Отмечается высокая стоимость приложения. Пользователи недовольны однотипностью и небольшим количеством шаблонов. Также многие пользователи отмечают, что без дополнительной инструкции тяжело разобраться с особенностями работы в Readymag.
Полезное видео
Видео по обучению от Skillbox:
Заключение
Многофункциональный редактор Readymag позволяет создавать цифровой контент, различного вида публикации (фотоальбомы, презентации, лендинги, журналы).
Также с помощью конструктора можно создавать целые сайты. Сервис имеет массу преимуществ, доступен как в платной, так и в бесплатной версии (с некоторыми ограничениями). Прежде, чем начать работу в Readymag, желательно изучить обучающие материалы, посетить специальные занятия или пройти онлайн-курсы.
Источник: junior3d.ru
Readymag: как российские дизайнеры создали инструмент для интернет-паблишинга, которым пользуются по всему миру
Диана Новичихина, Антон Герасименко и Кирилл Данченко хотели изменить мир онлайн-публикаций — и придумали Readymag (R/m), универсальный сервис для создания веб-журналов, сайтов, лендингов без кода. R/m получил более $500 тыс. инвестиций (в том числе от фонда Романа Абрамовича), открыл офис в Нью-Йорке и стал прибыльным. Среди клиентов сервиса — крупные компании, сервисы и медиа вроде Al Jazeera, Huffington Post и AirBnb. На массовый рынок компания выходить не собирается, но в долгосрочной перспективе хочет, чтобы Readymag пользовались все дизайнеры мира. Диана Новичихина — сооснователь и операционный директор R/m — рассказала Inc., как сделать «немассовый продукт» для 300 тыс. человек по всему миру и куда двигаться после пика бешеного роста.
В 2010 году дизайнер и основатель студии «Сила» Антон Герасименко решил придумать простой и красивый инструмент для создания цифровых журналов. Полтора года он рисовал макеты — как хобби после работы над заказами. Герасименко раздражало, что программы с похожими задачами выглядели как Adobe inDesign — с большим количеством панелей, кнопок и с многостраничными мануалами.
Весной 2011 года он рассказал об идее другу и основателю студии web-разработки Astroshock Кириллу Данченко. «Мы с Антоном пытались что-то сделать, но на тот момент интерфейс выглядел сложно. Задача казалась неподъемной, и спустя месяц мы свернулись», — говорит Данченко.
В то же время Герасименко встретился с Дианой Новичихиной, которая периодически руководила проектами в «Силе». Идея ей понравилась, и к 2012 году трое друзей решили всерьез заняться веб-инструментом для верстки онлайн, не требующим знания кода. Собрав около $230 тыс. по родственникам и знакомым, они стали формировать команду.
Сделай сам
По словам Данченко, было сложно найти архитектора всего продукта: «Я перебрал тысячи профилей на «Моем круге», Хабре и других точках притяжения программистов. Написал около сотни писем, опросил всех знакомых. Но все опытные разработчики были при деле, а нас не воспринимали серьезно».
Собеседования — около двадцати — шли в дневном кафе клуба «Солянка». Первый нанятый человек не проработал и месяца — не справился. В итоге дизайном занялся сам Герасименко, разработкой — Данченко, Новичихина — юридическими и финансовыми вопросами, было еще два фронтенд-разработчика и один архитектор (full-stack-разработчик).
— Наш офис постоянно мигрировал: сначала был в квартире Кирилла, потом у знакомой (она была в длительной командировке), затем — на малюсеньком чердаке у Китай-города, — вспоминает Новичихина. — Деньги на зарплату и аренду поступали очень постепенно и очень постепенно тратились. Мы брали личные кредиты — иногда занимали денег, чтобы отдать старые долги. Но сотрудникам платили вовремя.
Основатели первые два года зарплату не получали, уточняет Данченко.
Новый самиздат
В 2010 году Apple выпустила первую модель iPad и у мировых СМИ появилась
надежда, что новый гаджет спасет печатную прессу от медленной «смерти», переведя в цифровой вид. Тогда же по всему миру развивался «самиздат»: профессиональные дизайнеры, журналисты и обычные пользователи верстали и выкладывали в сеть свои «журналы». Это были обычные интернет-страницы — веб-вёрстка только начинала соперничать с печатной, постепенно расширяя возможности визуальных решений.
Америка и ее тонкости
Зимой 2013 года партнеры зарегистрировали (из России, дистанционно) компанию Readymag в штате Делавер, США (доли не раскрываются, но, по словам основателей, они «примерно равные»).
— Мы сразу делали международный продукт. На Западе больше творческих людей используют новые технологии в своей работе. Мы задумывались об инвестициях и хотели защиты Законом об авторском праве в цифровую эпоху (DMCA) от недобросовестных действий пользователей, — говорит Новичихина.
Технические сервисы — платёжный Stripe, иконки The Noun Project, JavaScript-библиотека TinyMCE ( база текстового виджета), шрифты Adobe Typekit, — которые использует R/m, не работают с российскими юрлицами и банками (зато работают с американскими). «Мы лично устанавливали связь с компаниями-партнерами, заключали договоры, переводили отчисления, — рассказывает Данченко. — Мне кажется, российской компании это было бы в разы сложнее, а то и вовсе невозможно».
Погружение в юридическую и финансовую терминологию, работа с документами требуют усилий. «Русскоязычные юристы, которые работают в США, могут помочь, но внутри компании, в любом случае, кто-то обязан разбираться — вычитывать бумаги, задавать юристам правильные вопросы. У нас это Диана». «Так получилось, что наш юрист была знакома с менеджером из американского Citibank. Нам удалось договориться о собеседовании по скайпу. Такое обычно не практикуется», — уточняет Новичихина.
Мешала нестабильная работа банков: они не пропускали оплату сервисов, которые интегрировались в Readymag, блокировали счета из-за «подозрительных» платежей. «Я много бессонных ночей провела в скайпе, общаясь с банковскими сотрудниками, — вспоминает Новичихина. — Но в последнее время такого нет. Мы получили достаточный ресурс доверия».
Что нужно сделать перед регистрацией юрлица в США (по версии Дианы Новичихиной)
1
Найдите хорошего юриста.
2
Наймите хорошего бухгалтера.
3
Выберите онлайн-банк с удобным интерфейсом, в котором можно вводить зарубежные и российские реквизиты, а одноразовый пароль не привязан к смс.
4
Поймите точно, зачем вам юрлицо именно в США. Необходимость присутствия в Америке никак не связана с необходимостью регистрации юрлица в стране.
Универсальный продукт для узкой аудитории
Запустив весной 2013 года закрытое бета-тестирование на 5 тыс. пользователей (с помощью сервиса Beta List, который собирает заявки от энтузиастов, желающих первыми узнать о новых интернет-проектах), основатели наладили функционал, убрали ошибки и с удивлением обнаружили: R/m пользовались для создания не только цифровых журналов, но и сайтов, презентаций и фотоальбомов.
«Многогранность» R/m создавала проблемы. «Люди понимали, что такое конструктор сайтов или инструмент для презентаций. Но когда им говорили, что R/m делает и то и другое, это вызывало вопросы», — говорит Данченко.
Концепцию переосмыслили. Продукт не вписывался в рамки какой-то одной категории, и предприниматели определили его как Design anything on the Web. На рынке сервисов web-publishing было достаточно конкурентов (Squarespace, Wix), но партнеры считали, что найдут своих пользователей.
— Мы не делали ставку на масс-маркет. Наш продукт — универсальный и гибкий. С R/m дизайнеры могут реализовать свои идеи, как они их видят. Это похоже на Adobe inDesign, только в браузере и без контакта с разработчиком. Остальные сервисы (Tilda, Wix, Squarespace) сфокусированы в первую очередь на шаблонах, — объясняет Новичихина.
Ее словам вторит Антон Герасименко:
— Мы про «короткий метр» — лендинги, спецпроекты, презентации и так далее. Когда есть четко сформулированная идея и нужно максимально быстро и эффектно рассказать о ней людям. Это может быть «дизайнерская картинка», полотно текста или летающие по всему экрану анимированные черные шары. Я считаю, полная свобода в подаче своей истории — главная крутость R/m.
Другие платформы не предлагают этого (основатель российского сервиса для создания публикаций Tilda Никита Обухов отказался комментировать работу Readymag. На момент публикации материала ответ из Wix и Squarespace не пришел — Inc.).
Как работает Readymag
1
Сверстать собственный микро-сайт, интерактивный журнал, фото-историю, портфолио или презентацию может любой предприниматель.
2
Есть готовые шаблоны для начинающих пользователей.
3
Профессиональный дизайнер может создать любой контент — ограничений по верстке почти нет.
4
Пользователь работает с блоками — текстом, изображениями и другими элементами; разбираться в коде не обязательно.
Свой проект можно выложить на отдельное доменное имя (работы хранятся на серверах Amazon, связанных с RM), включить статистику посещений, выбрать шрифты для работы, пригласить коллег в одновременную работу над проектом.
Продвижение через просвещение
В конце осени 2013 года к инструменту открыли доступ, а через год им пользовалось более 16 тыс. человек, — о проекте узнали из соцсетей и по «сарафанному радио». R/m — работающий инструмент, приносящий доход (суммы не раскрываются).
Хотелось расти по выручке. Основатели собирали метрики, строили воронки и пробовали различные маркетинговые каналы — рекламу, публикации в прессе, специальные акции со скидками, — но лучше всего работала «органика». «Выпускаешь обновление, сообщаешь своей аудитории. Люди сами делают крутые проекты, они становятся популярными, и уже другие люди узнают, что есть Readymag», — объясняет Данченко.
В 2015 году запустились образовательный проект Rm Design school и журнал Enso.
R/m периодически участвовал в мероприятиях, связанных с дизайном (например в фестивале шрифтового дизайна Typetersburg), как спонсор — деньгами и скидками, а также сотрудничал с разными компаниями, сервисами и сайтами (институтом «Стрелка», Moscow Coding School, рекламным агентством Bang Bang). «Мы дружим с R/m уже давно и часто проводим совместные кросс-промо, — говорит соосновательница Bang Bang Наталья Климчук. — Полгода назад в рамках нашей образовательной программы запустили онлайн-курс по Readymag. Студентам предоставили месяц бесплатного пользования продуктом».
Инструмент для дизайнеров и домохозяек
В конце 2014 года основатели отправились в Нью-Йорк и Сан-Франциско — предлагать продукт потенциальным инвесторам, искать полезные знакомства и посмотреть, как устроен бизнес в США. Общение с десятками фондов (в России и в Америке, в том числе удалённо) принесло свои плоды. Весной Readymag получил $500 тыс. «посевных» от двух фондов — Impulse VC (связан со структурами Романа Абрамовича) и Vestor.in.
Деньги выделялись на новый функционал, пополнение команды (product-направление и контент-маркетинг для развития собственных медийных проектов) и офис в Нью-Йорке.
«Мы вкладывали деньги в отличную команду и продукт с международными клиентами», — говорит управляющий партнер Impulse VC Кирилл Белов.
«Задача Readymag — дать любой домохозяйке инструмент сверстать журнал со своими рецептами или любителю рыбалки поделиться красивым каталогом своих фото с уловом», — говорил три года назад Павел Черкашин, партнер Vestor.in (на запрос Inc. не ответил). Впрочем, Новичихина утверждает, что инвесторы не ставили конкретных задач: «Они вкладывались в наше видение и профессионализм. Фокус компании многократно менялся и будет меняться. Может быть, лет через пять лет нами будут пользоваться домохозяйки или дошкольники».
Сейчас большую часть клиентов стартапа составляют представители творческих индустрий — дизайнеры, фотографы, журналисты. Стартап стал популярен и среди крупных СМИ. Например, английская Al Jazeera делала на основе Readymag интерактивные журналы о городах, The Huffington Post — мультимедийные истории, а Inc.
оформлял исследование бизнеса Артемия Лебедева. «Huffington сами нам написали, что делают какие-то спецпроекты и процесс идет неэффективно, потому что на каждый выпуск тратится около месяца работы отдела из шести разработчиков, — говорит Данченко. — Мы созвонились по Google Hangouts, я им показал, как один из их спецпроектов делается на R/m за час-два. Они были в восторге». Сколько компании заплатили за пользование сервисом, не разглашается. На момент публикации представители этих медиа на запросы Inc. не ответили.
Как зарабатывает RM
Источник: incrussia.ru
Readymag — инструмент для работы с контентом, создания презентаций и анимации
С каждым годом появляется все больше интересных паблишинг платформ, позволяющих создавать полноценные веб-проекты без каких-либо навыков программирования и верстки. От вас лишь требуется умение работать с компьютером и творческий подход. Данные сервисы можно использовать для сайтов разных тематик: от персональных страниц, портфолио, до продающих сайтов. При этом их функциональность также не стоит на месте: добавляются оригинальные инструменты и дизайнерские фишки, улучшается юзабилити. Есть даже сервисы, позволяющие реализовать анимацию на сайте, например, Readymag, о котором сегодня и пойдет речь.
Учитывая то, что анимация и разного рода дизайнерские эффекты для веб-страниц сейчас являются актуальным трендом, думаю, полезно будет познакомиться с подобным сервисом. Разработчики Readymag характеризуют его как дизайн-инструмент для представления контента в сети. В зависимости от имеющихся у вас материалов вы можете создавать:
- лонгриды;
- микросайты и персональные страницы;
- интерактивные онлайн-журналы;
- фотосайты и проекты-портфолио;
- онлайн презентации.
Если просмотреть шаблоны в сервисе, то уклон идет больше на имиджевые эффектные проекты, где обычно используется много качественных фото, нестандартных шрифтов и оригинальной типографики. По формату местами напоминают журналы, отлично подойдут для портфолио в направлениях: дизайн, музыка, искусство, мода, СМИ и т.п. Как бы там ни было, вы ограничены лишь своей фантазией, все остальное для работы предоставит дизайн-инструмент readymag.com. И никакого программирования!
Функции Readymag и пример использования
Управлять элементами в Readymag можно обычным перетаскиванием – drag and drop. Изменение размеров текста или блоков контента, выбор шрифтов, загрузка изображений, добавление видео, — все это делается достаточно легко и быстро. Вот, например, настройка адаптивного дизайна.
Созданная презентация или сайт будут отлично выглядеть на планшетах, смартфонах и корректно работать в современных браузерах.
Проект, созданный на readymag.com полностью соответствует всем требованиям поисковых систем и имеет необходимые функции:
- подключение собственного домена;
- отслеживание статистики через Google Analytics;
- SEO Friendly (добавление заголовка и описания, индексация всех текстов на сайте);
- размещение на собственных серверах сервиса (нет необходимости приобретать хостинг).
Меня лично больше заинтересовали функции, которые я не встречал у других платформ:
- Во-первых, это совместная работа над проектами. Вы можете приглашать других пользователей-коллег для участия в разработке сайта. Допустим, сотрудничаете с фотографом/дизайнером и открываете ему доступ для создания страницы портфолио и т.п.
- Во-вторых, поддержка Retina дисплеев. Кто сталкивался с версткой под ретину, наверняка оценит эту фишку.
- Вы можете встраивать проекты Readymag через Embed-код, например, в другие блоги. Выглядит весьма круто.
Чтобы начать работать в Readymag, нужно выбрать один из имеющихся шаблонов, либо открыть пустую страницу для редактирования. Для создания презентаций есть специальная категория макетов + допускается использование своих наработок.
В некоторые темы включены сразу несколько дизайнов страниц, например, отдельно страница с фотографиями, отдельно с текстами, контактами и т.п. Ненужные вы потом можете удалить. Советую выбирать вариант максимально приближенный к вашим требованиям/задачам, дабы потом меньше пришлось менять.
Интерфейс редактора для отдельной страницы выглядит приблизительно так:
В правом верхнем углу располагаются иконки просмотра и настройки проекта. В последних можете добавлять стрелочки навигации, менять метаданные, подключать свой домен и т.п. Снизу — элемент, позволяющий в один клик задать вопрос команде продукта, если возникнут какие-то вопросы.
В левом нижнем углу находятся основные элементы управления:
- настройки мобильных версий страницы;
- кнопка отмены/повтора действия;
- установка размеров страницы;
- вспомогательные линии: сетки и направляющие;
- работа с фоном (можете ставить картинки и видео);
- созданные элементы (в данном примере это форма, текст и фото).
Для создания нового объекта просто кликаете по иконке «+».
Вариантов добавляемого контента хватает. Кроме обычных картинок, форм и текстов можно вставлять на страницу аудио, слайдшоу, кнопки, карты, виджеты из соц.сетей, а также iframe коды виджетов сторонних сервисов (например, редакторов форм).
Как сделать анимацию в Readymag
Как я уже сказал выше, анимация в веб-проектах (особенно лонгридах) сейчас встречается достаточно часто. Разработчики стараются таким образом выделить определенный контент или просто реализовать эффектную подачу информации. Подобные фишки подойдут как онлайн-журналу, так и креативному дизайнерскому портфолио.
В Readymag анимация появилась относительно недавно. Я бы выделил 3 основных направления для нее:
- При загрузке страницы. Вы можете создавать последовательность всплывающих элементов на странице, будь то эффект плавного появления объекта или увеличение изображения. Такое часто можно увидеть в разных онлайн презентациях.
- При наведении. Отличный пример взаимодействия контента и посетителя — используйте вращающиеся блоки, масштабирование изображений и т.п. Сюда же, в принципе, можно отнести эффекты при клике. Все это добавляет сайту некой интерактивности.
- При прокрутке страницы. Наиболее необычный пример анимации на сайте, с помощью которого можно придумать весьма интересные решения (не только параллакс-эффект). На сайте readymag.com имеется отличный пример данного варианта.
Создание анимации на сайте, по сути, состоит из трех шагов:
- Определение условия для срабатывания (загрузка, наведение, клик, прокрутка);
- Выбор эффекта;
- Добавление шагов для более сложной анимации.
Например, я хочу добавить масштабирование фотографии на своей персональной странице при наведении. Для этого первым делом кликаю по соответствующему объекту.
Затем в меню инструментов справа выбираю триггер для запуска анимации (On hover — эффект при наведении). Далее потребуется задать тип эффекта и определить для него разные параметры. Для удобства здесь же располагается кнопка Preview с демонстрацией работы эффекта.
По следующему видео процесс создания анимации на сайте вам будет более понятен.
Главное, что при этом не используется никакого кодинга, все предельно просто и интуитивно понятно. Из эффектов здесь есть:
- move — перемещение;
- opacity — прозрачность;
- rotate — поворот;
- scale — масштабирование.
Также при создании анимации появляется блок предустановленных эффектов (Presets). В нем есть парочка заранее настроенных вариантов: затухание картинки, исчезновение и перемещение, мерцание.
Можете попробовать их установить и посмотреть, как именно эффекты будут проявляться на сайте. После этого просто меняете настройки на те, которые вам нужны.
В целом, добавление анимации на сайте с помощью Readymag — это реально что-то новое для подобных платформ. Однако и без нее у проекта есть ряд весьма уникальных фишек: поддержка Retina, совместная работа, анимация. Мне сервис понравился.
Я пробовал разные конструкторы сайтов: для обычных проектов, флешевых веб-страниц, специально заточенные под лонгриды и т.п. Выбирать тот или иной инструмент следует исходя из поставленных перед вами задач. Делать блог в Readymag определенно не стоит, а вот для онлайн-журналов, сайтов-портфолио или создания презентаций он идеально подходит. Наличие разных эффектов и той же анимации позволит подчеркнуть вашу индивидуальность и поразить посетителя нестандартным подходом.
Источник: dsgnmania.com