С Tumult’s Hype 1.0.3, можете да създавате интерактивни HTML 5 анимации, без да въвеждате нито един ред код. Той е достатъчно прост за използване, така че дори начинаещите ще получат страхотно изглеждащи резултати бързо, въпреки че има място за подобрение. Ограничените инструменти за проектиране и негъвкавият интерфейс могат да попречат на изграждането на сложни проекти.
Проектирайте вашите сцени
Hype проектите се състоят от една или повече сцени, които функционират като слайдове в Keynote презентация. Сцените могат да съдържат текст, изображения, видеоклипове и други елементи, въпреки че импортирането на аудио файлове все още не се поддържа. Лесно е прецизното подреждане и персонализиране на елементите благодарение на водачите за прихващане и командите за автоматично подравняване. Инспекторът на Hype ви позволява да настроите фино свойства като ъгъл, цвят и непрозрачност, като същевременно ви предупреждава за потенциални несъвместимости с персонализиран списък от браузъри, докато работите.
Подобните на iWork дизайнерски инструменти на Hype са лесни за използване, но им липсват много познати функции. Елементите не могат да бъдат заключени на място или групирани, а квадратите са единствените вградени форми, налични за добавяне към сцени (въпреки че могат да бъдат променени, за да образуват правила или кръгове). Няма контекстуални менюта, няма инструменти за редактиране или маскиране на изображения и няма начин да увеличите или намалите изгледа си на работното пространство, което затруднява създаването на големи документи на Mac с малки дисплеи. Тези проблеми не са непременно прекъсвачи на сделката, но са злощастни пропуски в иначе изпипано приложение.
Добавяне на движение и интерактивност
За да анимирате елемент, вие избирате едно или повече от неговите свойства (позиция, например), след това добавяте начални и стоп ключови кадри към времевата линия на Hype и създавате различни състояния във всяка точка. Hype създава рамки „между“ за вас. Удобна функция за запис опростява процеса, като наблюдава вашите действия и автоматично създава ключови кадри и променя свойствата в движение. Можете също да създадете множество анимации, за да придадете на елементите различен външен вид в рамките на една анимирана сцена, като изображения, които светят или избледняват при преместване на мишката. Анимации, преходи на сцени (с незадължителни ефекти на разтваряне или натискане) и дори JavaScript действия може да възникне автоматично или в отговор на потребителски събития като щраквания на мишката, преминаване на мишката и клавиш преси. Можете да визуализирате проекти в Hype или във вашия браузър по всяко време, за да видите как точно ще се появят анимациите.
За фина настройка на времето на даден проект ключовите кадри могат да бъдат свободно позиционирани, а анимациите между тях да се удължават или съкращават във времевата линия. Двойното щракване върху анимациите там ви позволява да въведете точни начални времена на ключовите кадри, да зададете продължителност на анимацията и да изберете дали анимациите да се включват или изчезват, докато се възпроизвеждат. Управлението на множество анимации във времевата линия обаче може да бъде трудно в проекти с множество елементи. Свойствата на елемента се появяват в списък до времевата линия и за да видите много от тях заедно, трябва да имате голям екран - това или трябва да увеличите прозореца на времевата линия, скривайки работното ви пространство. Елементите могат да се плъзгат по-близо един до друг в списъка за по-лесно сравнение, но това също влияе върху това дали се показват над или под други елементи в сцената.
Експортирайте и споделяйте
Когато вашият проект е завършен, можете да го експортирате в публичната папка на Dropbox, за да го споделите със света, или в HTML 5 документ и папка с ресурси. Те могат да бъдат добавени към съществуващ сайт, като изберете няколко реда ясно маркиран код от експортирания HTML файл, поставите ги в съществуващ HTML документ и след това качите ресурсите. Незадължителната проверка за съвместимост при експортиране ви позволява да знаете кои браузъри, ако има такива, ще имат проблеми с възпроизвеждането на окончателния ви проект.
Ето го сайт, който създадох с Hype, експортирани в Dropbox.
Съвети за закупуване на Macworld
Въпреки пропуските и ограниченията на функциите, Hype 1.0.3 прави лесно и дори забавно създаването на HTML 5 уеб анимации или цели сайтове. Но потребителите, които търсят стабилни инструменти за проектиране, трябва да изчакат, за да видят какви са бъдещите актуализации.
[Адам Беренстайн е писател на свободна практика в щата Ню Йорк.]