- - Създайте дизайни за уеб анимация и взаимодействие в HTML 5 с Adobe Edge

Създайте дизайни на уеб анимация и взаимодействие в HTML 5 с Adobe Edge

Най-новите уеб стандарти, HTML5 и CSS3 ввзаимодействието с JavaScript наистина намалиха времето и усилията, свързани с създаването на богати на графични, текстови и анимационни уеб сайтове. Използвайки правомощията на HTML5, вече не е необходимо ръчно да пишете код за вграждане на мултимедийно съдържание, докато CSS3 прави елементите на вашия уеб интерфейс по-гъвкави, здрави и най-важното по-лесни за работа. Ако търсите инструмент за уеб дизайн, който ви позволява да извлечете максимална полза от най-новите уеб стандарти, без да ви принуждавате да въвеждате ръчно код за всеки UI елемент, току-що стартираният Adobe Edge вероятно е точно това, от което се нуждаете.

Adobe Edge е специално писана задизайнери за визуални, уеб и взаимодействия, които често се борят със създаването на уеб движение и анимирано съдържание с помощта на уеб стандарти HTML5, CSS3 и JavaScript. Това е основно инструмент за дизайн на движение в интернет и взаимодействие за създаване на анимирано съдържание с помощта на HTML5, CSS3 и JavaScript. Въпреки че включва всички основни инструменти за създаване, редактиране, настройване и проектиране на уеб интерфейс елементи, той предлага интуитивен анимационен хореограф за лесно създаване и настройка на анимирано съдържание във вашата уеб страница. Освен това, това не ви принуждава да започнете нов проект от нулата, можете да импортирате HTML файла си в него, за да включите нови UI композиции и тинкер наоколо със съществуващи UI елементи, като таблица, текстови стилове, нюанси на изображения, позиция, шрифт, подравняване на контейнери и др.

Основният интерфейс е разделен на 3 секции. Лявата странична лента съдържа избрани инструменти за композиция на UI елементи, дясната странична лента има всички основни списъци с елементи на уеб интерфейса, включително сенчести ефекти, изображения, текст, докато долната част съдържа редактора на времевата линия за анимации на хореографа.

Главен ръб 2

Прозорецът "Елементи" ви позволява да показвате / скривате избранотоелемент и го заключете, за да предотвратите по-нататъшно редактиране. Когато изберете елемент от главния екран, той веднага го подчертава в панела „Елементи“, което го прави по-лесно да го скриете или заключите. Когато задържите курсора на мишката върху елемент, изброен в Elements, той ви казва инициалите на класа с име, така че можете лесно да го идентифицирате в CSS файл.

елементи основни

Прозорецът на свойствата отляво показваинструменти за композиция за избран потребителски интерфейс елемент на вашата уеб страница. След като изберете, можете да промените размера на местоположението му, непрозрачността, семейството на шрифта на текста, размера и стиловете на текста, да зададете произход на трансформацията, завъртане на изображението и така нататък.

ръб 3

Редакторът на времевата линия ви позволява да преглеждате времевата линияна всеки анимиран елемент. Ако имате работа с един огромен CSS файл, щракнете върху бутона за филтриране, за да се показват само анимирани елементи в панела с елементи за бързо редактиране на техните позиции, цветове, размер и т.н. В долната лява част на прозореца имате бутон за увеличение, за да увеличите времевата линия за проверка на разпределеното време и преходния ефект на всички анимирани елементи.

анимирани елементи

Освен създаването на съвместим крос-браузъранимирано съдържание за всички широко популярни уеб браузъри, включително Firefox, Chrome, Internet Explorer 9, уеб съдържание, създадено чрез този инструмент, ще работи безпроблемно и на iOS и Android платформи. Според официалната общност Edge Preview е в активно развитие и скоро ще бъде актуализиран с множество функции. Adobe Edge работи на Windows Vista и Windows 7.

Изтеглете Adobe Edge

Коментари