World1000 - Как добиться прозрачности в битовых картинках во Flash?
Баннерная сеть

Личный кабинет

Имя

Пароль

Запомнить меня


Забыли пароль?
Зарегистрироваться

  2008-11-04 11:36
Есть три способа.




Flash поддерживает формат PNG, в котором имеется свой 8-битный альфа-канал (256 цветов). В Adobe Photoshop создается маска и сохраняется в канал. В Corel PhotoPaint при сохранении должна быть видна маска. В канал не сохраняется. (Какой бы способ сжатия Lossles (без потерь) или jpeg мы не выбирали, во Flash-е альфа-канал будет сохраняться со сжатием Lossles. Поэтому при создании картинки нужно позаботиться об уменьшении цветов в альфа канале). Например, выделить канал в отдельный файл присвоить режим Index Color (то, что вы делаете при переводе в Gif) и полученное изображение обратно вставить в канал подготавливаемого изображения.




Делаем с импортированной картинкой Break (CTRL+B). Картинка характерно окрасится. Накладываем сверху контур. Щелкаем на картинку за контуром. Выделяется лишнее. Удаляем.




Делаем с импортированной картинкой Break (CTRL+B). Выбираем инструмент "пипетка" щелкаем на картинке. Появится инструмент Fill. Заливаем нужный контур. Если картинка легла в контур не так, как нужно, редактируем заливку (Transform Fill).


Как делать анимационные gif-ы во Flash



Flash лучший инструмент для создания впечатляющих баннеров и т.д. Дело в том, что при экспорте Flash создает палитру цветов, основываясь на первом кадре ролика. Поэтому, нарисовав анимацию во Flash вам нужно сдвинуть всю анимацию на один кадр и просто покидать в первый кадр используемую графику из других кадров. Экспортировать лучше в 256 цветов со сглаживанием и без прозрачности.



При оптимизации gif-а (советую Adobe Image Ready или Macromedia Fire Works) удалите первый кадр и пустые кадры и оптимизируйте палитру. Для создания нужных пауз в клипе советую воспользоваться редактором анимационных gif-ов Gamani GIF Movie Gear.



Добавлю, что при создании анимации во Flash нельзя пользоваться анимационными клипами. При экспорте в анимационный gif анимация в клипах игнорируется.


Как делать текстуры



Делаем с импортированной картинкой Break (CTRL+B). Выбираем инструмент "пипетка" щелкаем на картинке. Появится инструмент Fill. Заливаем нужный контур. Если картинка легла в контур не так, как нужно, редактируем заливку (Transform Fill).


Как делать текстуры, которые стыкуются (Tile). Например, для html



Мы использовали такие текстуры в качестве фонов html-страниц на предыдущем сайте нашей студии.
Flash наиболее удобный и простой инструмент для решения такой задачи. Скачайте этот исходный файл. В нем вы найдете один символ, дублированный так, чтобы верхние и нижние края символов точно стыкуются. Вам нужно зайти в средний символ двойным щелчком с нажатой кнопкой Alt (Edit in Place). И рисовать. Какой простор для творчества! Вы увидите всю картину в целом, как текстура "проникает" из одного символа в другой. Потом экспортируете в gif, указав нужный размер.



Еще совет: все, что нарисовали в символе, поверните на произвольный угол - это может улучшить "совмещаемость" текстуры.



Естественно эту текстуру вы можете использовать и во Flash. Но лучше экспортировать в PNG.


Работа с символами (symbols)





Здесь я дам пару советов, которые позволят вам работать с символами более эффективно.




Для редактирования символов удобно пользоваться режимом Edit in Place. Редактирование вызывается двойным щелчком на символе с нажатой кнопкой Alt. Повтор действия с символом, внутри символа, где вы находитесь, приведет к "входу" в следующий символ. Двойной щелчок за пределами символа приведет к "выходу" на уровень выше.




Вы можете существенно сократить размер готового файла, пользуясь одним символом, но в разных режимах. Например, символ по умолчанию кнопка, но вы хотите использовать графику кнопки в другом месте клипа, но не как кнопку. Скопируйте в нужное место символ и, войдя в меню свойств символа (двойной клик) выберете нужный режим. В этом случае Graphics.


Векторная графика


Импорт векторной графики



Самый проверенный способ. Нарисовав графику в другом редакторе, экспортировать ее в Adode Illustrator. Текст лучше не переводить в кривые.


Проблемы с прозрачностью



Используемая во Flash графика может содержать прозрачность. Это может быть и битовая и векторная графика. При просмотре при 16 мил. цветов (режим видеокарты 16 бит.) иногда проявляется такая ошибка. Объекты с полной прозрачностью отображаются чуть другим цветом (dithering) чем фон, на котором они "лежат". Графика при таком режиме выглядит неряшливо и общее впечатление портится.



Лечится наложением объекта размером со всю видимую область и с полной прозрачностью.



Автор: Eвгений Потапенко
Быстрый переход
  • Company
  • Overview
  • Facts and Figures
  • Why Us
  • Testimonials
  • Careers
  • Capabilities
  • Technology Centers
  • Microsoft .NET
  • Java EE
  • PHP
  • AJAX
  • Skill Set
  • Domain Expertise
  • Web 2.0
  • Rich Internet Applications
  • Business Continuity
  • Quality Management
  • Methodology
  • Services
  • Advanced Web Development
  • Web Application Development
  • Web and Enterprise Portal Development
  • Website Design and Development
  • Web-based Database Programming
  • Web-enabling Legacy Applications
  • Opensource Software Customization
  • Business Application Development
  • Content and Document Management
  • Secure Intranets / Extranets
  • Customer Relationship Management
  • Workflow Management
  • Supply Chain Management
  • Interactive Learning
  • Independent QA and Testing
  • Application Security Consulting
  • Graphic Design / Multimedia
  • Maintenance and Support
  • Outsourcing
  • Outsourcing Overview
  • Dedicated Teams
  • Security and IP Protection
  • Engagement Models
  • Portfolio
  • By Business Domain
  • Corporate / Info Websites
  • Communities and Networks
  • B2B / B2C Internet Portals
  • Retail / Ecommerce
  • Media Distribution
  • Workflow Management
  • Customer Management
  • Enterprise Collaboration
  • Supply Chain Management
  • eLearning / Online Training
  • By Technology Focus
  • Microsoft .NET
  • Java EE
  • PHP
  • By Solution Type
  • Websites
  • Web Applications
  • Enterprise Solutions
  • Contact
  • Contact Form
  • Get Free Evaluation
  • Call Me Back
  • Contact Info
  • Map