Consultoria y Formacion Adobe

En este video tutorial Flash veremos cómo vectorizar el logo de Flash utilizando herramientas de dibujo.

Hace días que se viene dando un interesante debate alrededor de la tecnología Flash y HTML 5, hemos visto diversas opiniones y a diferentes escalas inclusive algunas declaraciones de parte del CEO de Apple (Steve Jobs) y el CTO de Adobe (Kevin Lynch).

Esto no es algo nuevo, de hecho con cada nueva tecnología que sale al mercado (Silverlight, JavaFX, etc.) y/o cada que la W3C se pone las pilas sucede lo mismo, hay quiénes toman una posición a favor y hay quiénes toman una posición en contra; lo cuál es muy respetable siempre que esto vaya sustentado con argumentos y no simplemente como un factor de respuesta a todo el ruido que se genera en el medio.

Participa en un debate en vivo de Flash vs. HTML 5

La semana pasada participé con @freddier y @cvander en el programa Mejorando la Web para hablar al respecto. Los comentarios que pude ver alrededor de esta discusión fueron bastante atinados. Es por eso que al final del programa decidí comentarle una inquietud a Freddy y a Christian (quiénes se mostraron entusiasmados) misma que comparto con ustedes en este post. (Puedes ver la grabación del programa abajo)

La idea es organizar un debate con 5 invitados de cada bando (por decirlo de una manera), es decir 5 entusiastas de Flash y 5 entusiastas de HTML 5. Ya tenemos algunas personas interesadas pero no creo que fuera en realidad algo muy democrático si no le diéramos cabida a cualquier persona de la comunidad que quiera participar.

Cómo participar

Por lo que no importa que posición sea la tuya, si estás interesado en debatir, deja en los comentarios quien eres, qué piensas y tu posición (y tu cuenta de twitter o algo). Los mejores y más acertados comentaristas serán elegidos para participar en la transmisión, que esperamos vean alrededor de 2000 personas en vivo y muchas más en su grabación.

Aún tenemos que definir las fechas pero tan pronto tengamos a los participantes lo haremos de manera formal, por lo que si estas interesado en participar no dudes en dejar tu comentario en este post lo antes posible.

Desde que el iPad fue anunciado, sin Flash, mucha gente ha estado especulando su caída. Se suma el experimento de Youtube con HTML 5 y el tag <video>. Tal fue el hype generado por la supuesta muerte, que dedicamos un capítulo de MejorandoLaWeb al tema.

El mundo de Flash está cambiando. La computación está cambiando. La web está cambiando. Pero Flash no morirá y si Adobe toma las decisiones correctas, incluso puede convertirse en el líder de campos que no esperamos. Este año será decidido todo.

Flash, HTML 5, Javascript y el video

HTML 5 tiene cosas impresionantes. Drag and Drop de archivos al navegador, animaciones vectoriales en SVG, un tag para embeber video, otro tag para audio, acceso a disco y geolocalización por múltiples métodos (GPS, IP, manual, etc). Esto ha dado pie a que muchos digan que "Flash es innecesario".

Molly Holzschlag es una de las personas que más sabe de estándares en el mundo y compiló una lista de capacidades de HTML 5 y los navegadores que las implementan. No es mala la implementación, pero usarla en producción es triste.

El video es un problema "emocional". Algunos quieren OGG como formato, otros H.264 y otros algo completamente diferente. Ahora mismo, el tag <video> tiene la misma versatilidad de las epocas del Real Player.

Cosas que hace Flash que no puede hacer HTML5 o JS ni hay planes para que pueda

• Streaming: UStream, Tinychat, Livestream, incluso Youtube live, inviables con "estándares".
• Animación vectorial compleja: SVG? CSS3? Jajajaja. Si tu crees que hacer animaciones con esas tecnologías es más fácil, igual que Flash y gasta menos CPU, no has comparado a nivel técnico. La realidad es que actualmente, sólo Flash lo permite como debe ser. El resto de animaciones en SVG, CSS3 o JS gastan demasiada CPU y no hay un software del nivel de Flash para crearlas.
• Edición y manipulación de audio: AS3 es capaz de mezclar audio en tiempo real. Nadie más puede hacerlo al nivel de AS3.
• Edición bit por bit de mapas de bits: Aviary, Picnik y Photoshop Online hechos en Flash y Flex lo demuestran. ¿En HTML5 o JS? Ninguno realmente usable.
• 100% de compatibilidad a través de todas las plataformas: Si dices que es posible escribir un sólo código HTML5/CSS/JS que funcione en todos los navegadores ahora mismo, no has hecho nada profesional. En SWF es normal

Flash no es sólo el player. Flash CS5 es un entorno integrado con la capacidad de diseñar, dibujar, animar, incluir video, audio, editar todos estos componentes, agregar interactividad y programación de alta complejidad, compilar para desktops, móviles o iPhones. Ninguna herramienta del lado "estándar abierto" ofrece ese nivel de integración ahora mismo. No Dreamweaver, no Visual Studio 2010, no Aptana, ni siquiera una combinación de varias.

Flash, teléfonos móviles, Apple

El mundo móvil es diferente. El iPhone cambió el mundo y estableció una fuerte tendencia a las tiendas de aplicaciones, la integración de HTML 5 actualizado en el teléfono e ignorar a Flash. Android y otros siguieron el mismo camino.

Este mes en el Mobile World Congress, Adobe presentará el Flash Player 10.1 para todos los teléfonos móviles (excepto iPhone), un compilador especial para crear apps de iPhone con SWF desde Flash CS5 y el secreto a gritos, una forma unificada de desarrollar apps "pseudo-nativas" para Android, WebOS, Blackberry y Symbian, con un mismo código.

Flash ya era usado por el 90% de la humanidad conectada antes de Youtube. Las animaciones y los juegos en linea lograron posicionar a Flash en el principio. No hay razón para pensar que no pasará a nivel móvil. Ninguna empresa tiene un entorno tan avanzado para el desarrollo de juegos móviles como Adobe con Flash. Y pasará en todas las plataformas de teléfonos actuales (En tu Nokia 1100 puede que no)

¿Y Flex? ¿Y Adobe AIR?

Flex es líder en desarrollo de RIAs. No se nota mucho su presencia en la web, pero está en muchas intranets y empresas. Aun no tengo claro si Flex Mobile hará un impacto tan fuerte como Flash/AIR Mobile, pero su presencia como la mejor y más veloz herramienta para aplicaciones web se mantendrá, a pesar de que HTML 5 y jQuery UI son amenazas muy reales y fuertes.

Adobe AIR tiene que evolucionar. El uso de archivos .air y "badge installers" es simplemente estúpido. No está mal que los ofrezcan, pero también incluyan la opción de crear instaladores por SO. Si el rumor de AIR Mobile es cierto y cometen una cagada como la de los .air, Flash no será el sueño que esperábamos. Esperemos que Adobe tome la decisión correcta.

Flash "estándar", Flash Open Source

Flash es estándar en el mismo sentido que los .doc y .docx lo son. Es una realidad. No es algo malo de por sí, pero muchos no se sienten cómodos. Flash tiene abiertas las especificaciones del formato SWF, pero prohíben crear "players" alternativos con esas specs ¿Por qué? Según ellos, para proteger la segmentación del mercado y mantener un sólo player. Yo solía creer en esto.

Ya no lo creo más. La pésima forma en la que Adobe ha manejado las plataformas móviles (i-Mode -> Flash Lite con AS0.5 -> muerte de Flash Lite -> vacío -> ¿10.1?) , sumado a la lección de Android que se puede tener una distro oficial open source sin perder el control me lo deja claro. Adobe debería, sin duda, liberar el código del Player y permitir que la comunidad "ayude". Si Adobe no puede implementar bien Flash en Linux y Mac, la comunidad sí podrá. ¿El miedo es que Microsoft los mate como mató a Java con una maquina virtual especial? Adobe ya está grande y debe poder superar esto. Con su penetración, pueden mantener el control de un player abierto.

Si no, quizás y el 2022, cuando HTML 5 será un estándar cerrado y aprobado, será realmente el declive de Flash.

MDM Zinc 3.0 es un software que nos permite extender las propiedades usadas en Flash para crear aplicaciones robustas de escritorio. Podemos crear instaladores, leer y escribir archivos hasta crear nuestro propio navegador web.

Algo así como lo que hace AIR, pero sin complicarnos demasiado, a mi personalmente me gusta más MDM Zinc por su libertad, pero es una porquería en documentación. Intentaré resolver poco a poco los dilemas de documentación.

En este tip abordaremos los temas principales para crear un proyecto desde cero con MDM Zinc, aunque no haremos nada de código aun.

Creando Nuestro Primer Proyecto

Conceptos básicos de una aplicación con MDM Zinc

Esto rara vez lo encontrarán en la Web, por ello es bueno tener en cuenta los siguientes aspectos:

Forms

MDM Zinc trabaja con "forms", que son básicamente películas flash standalone que genera desde sus .SWF. Un "mainform" puede tener a su vez múltiples "sub-forms" para ayudarse en sus tareas. Todos los forms pueden conectarse y hasta moverse entre sí. Para este ejemplo usaremos un solo form.

Ventanas

Zinc nos permite personalizar nuestras ventanas de manera fácil. Haciendo doble click sobre nuestro form, podremos ver un menu "Window" con las siguientes opciones:

• Style: Que tipo de ventana usaremos. Puede ser Standard (Normal), Alpha (Para transparencias de 0 al 100% de alpha), Transparente (Completamente transparente) o Masked (Recortada con un BMP de recorte).
• Buttons: Que botones deseamos que contenga nuestro form. Maximize, Minimize, Close.
• State: Como queremos que abra el form ni bien ese ejecutado. Standard (Normalmente), Maximized o Mimized.

Position

Nos permite posicionar al centro nuestra ventana. Aunque desde el panel "Windows Properties" podremos configurar valores personalizados de X y Y.

Applications Tab

Nos permite configurar nuestra aplicación en los siguientes aspectos:

• Aplication Type: Podemos configurar si será una aplicación para escritorio (Desktop), salva pantallas (ScreenSaver) o para aplicaciones "Kiosk", que son las aplicaciones estilo un ATM.
• Aplication Name: Configura como se llamará nuestro .exe al ser exportador por Zinc.
• Aplications Icons: Aplication Icon y Tray Icon son los iconos que aparecerán en nuestro .exe y una vez este mimizado en el tray bar. Cuidado: Haganlo con Microangelo o similares el .ico, no renombren un .JPG a .ICO porque se morirá Zinc.
• Show in Tray/Show in TaskBar: Permite configurar si será visible la aplicación en el Tray Bar y en el TaskBar. Es útil cuando se arman aplicaciones "invisibles".
• Window Stay on Top: Configura la aplicación para que mientras este abierta se mantenga siempre sobre las ventanas. Atención: El focus se perderá aunque este al "Top" de todo.
• Versión Info: Configura los datos de versión, ideales si estamos creando una aplicación estilo software.
• Splash Screen: Permite configurar nuestro form con las propiedades de un splash screen (Una ventana de "Bienvenida" por decirlo de alguna forma).
• Screen Saver: Permite configurar nuestro form con las propiedades específicas de screen saver, en caso de haber declarado el proyecto como tal.
• Trial: Permite configurar nuestro form para que en N tiempo deje de funcionar. Incluso ponerle un Serial Number. Ideal para software licenciatario.

Forms Tab

Desde aquí podremos controlar nuestro "mainform" y los "subforms" asociados.

Extensions Tab

Zinc funciona haciendo uso de ciertas, clases por así decirlo, o extensiones. Estas extensiones solo funcionan en el caso de estar embebidas dentro del player al crear la exportación final. Para que esto funcione realmente, debemos ir al tab extensions, y "tildar" aquellas que necesitemos. Por ejemplo: Si estamos trabajando con ScreenCaptures, tildaremos "Images".

Windows properties

Desde aquí podremos configurar las bases de nuestra ventana con más precisión que antes. Tenemos básicamente los siguientes conceptos:

• Position: Posicionamiento personalizado de nuestra ventana.
• Size: Control personalizado del tamaño de la ventana.
• Window: Propiedades varias de la ventana como Estilo, botones, etc…
• Style Properties: Como lo dice, propiedades de estilo de la ventana. Desde aquí podremos "transparentar" nuestro window por ejemplo. Para usarlo hay que modificar las instancias "Type".
• Mouse: Permite controlar justamente eso, que "clicks" del mouse usaremos como inputs de nuestro form.

Saludos y espero lo encuentren de utilidad

Debido a la demanda de tutoriales de como hacer conexiones entre flash y servidores he decidido hacer este tutorial, con el fin de aportar un poco a la web con mis conocimientos. En este tip veremos cómo utilizar un servidor muy sencillo y útil "SmartFox server", cómo configurar nuestro documento de flash para que trabaje junto a Smartfox Server y aprenderemos a hacer nuestro propio script para probar la conexión entre el servidor y flash, privada o públicamente.

Como descargar y utilizar nuestro Servidor

Descargaremos el servidor SmartFox Server. Existen otros servidores para hacer conexiones entre flash y servidores pero específicamente yo recomiendo este para el tutorial. Este es el Smart Fox Server 1.6.2 version PRO, la ultima de todas. Lo descomprimimos e instalamos. Una vez instalado, se creara la carpeta:
C:\Archivos de programa\SmartFoxServerPRO_1.6.2\ O la ruta indicada durante la instalación.

Configurando nuestro documento de flash

Abrimos flash y creamos un nuevo documento en flash de ActionScript 2.0. No importan las dimensiones yo las dejo en ‘default’ que si no me equivoco, son de 550×400 pixeles. Ahora, vamos a configurar el documento para que este trabaje junto a nuestro servidor.

Pulsamos el botón settings o Configuración, se nos tiene que abrir una ventana como esta:

Luego, Pulsamos en el botón settings o configuración y se nos abre otra ventana:

Después, pulsamos el botón ‘target’ indicado en la imagen a través de una flecha, que es donde seleccionaremos el API de Smart Fox Server para poder trabajar con Smart Fox Server en flash, así que pulsamos y navegamos hasta la carpeta de Smartfoxserver, nos metemos en Flash API y seleccionamos ActionScript 2.0:

Y por ultimo, clickamos en OK y ya esta. Ya podemos trabajar con flash y Smart Fox Server.

Creando un pequeño script para probar la conexión entre nuestro servidor y flash

Vamos a crear nuestro primer script. Servirá para decir si estamos conectados a smartfoxserver.

Antes de nada, abrimos el servidor en Inicio -> Todos los programas -> SmartFoxServer_1.6.2 -> Start SmartFoxServer. En el mismo documento anterior, vamos a crear un texto dinámico que se llame estatus, de tal forma que queden así las propiedades:

Ahora nos vamos a acciones del fotograma, y empezamos a programar el ActionScript. Vamos a llamar Smart Fox Server, a los datos que recibiremos del servidor a documento de flash.

Código :

import it.gotoandplay.smartfoxserver.*

Fácil eh!? Ahora que hemos llamado a Smartfoxserver, debemos saber que cada ves que lo necesitemos, debemos llamarlo así:

Código :

smartfox.EVENTO

Vale, sigamos. Ahora, toca crear las variables del servidor tales como IP, PUERTO y ZONA, la zona es la parte del servidor configurada para utilizar el script. Como para una conexión a Smart Fox Server no se necesita una zona configurada especifica, usaremos la primera que viene por defecto: simpleChat. Vamos a ello desde arriba:

Código :

import it.gotoandplay.smartfoxserver.*

// Variables

var ip:String = "127.0.0.1"
var port:Number = 9339
var zone:String = "simpleChat"

La variable IP sera la IP del servidor, por defecto la cual seria 127.0.0.1 (local) (este podria cambiar dependiendo de tu proveedor de internet, te recomendamos revisarlo antes que todo a traves del CMD), el puerto por defecto de Smar Fox Server el cual seria 9339, y la zona que la definimos nosotros (debe existir en el servidor), que es la simpleChat.

Hasta aqui claro. Ahora tenemos que crear la variable del cliente de Smart Fox Server, es decir para utilizar la sintaxis anterior de smartfox.EVENTO, debemos crear una variable, smartfox:SmartFoxClient, seguida de sus correspondientes eventos principales: onConnecton y debug, que son igual a la funcion de cada uno, mas para delante te daras cuenta, desde arriba:

Código :

import it.gotoandplay.smartfoxserver.*

// Variables

var ip:String = "127.0.0.1"
var port:Number = 9339
var zone:String = "simpleChat"

var smartfox:SmartFoxClient = new SmartFoxClient()
smartfox.onConnection = handleConnection
smartfox.debug = true

Realizamos la conexión con smartfox.connect(ip, port), lo que hay entre paréntesis, son las dos variables ip y port que se han definido arriba.

Empezamos a crear las funciones, empezamos por la función que pide Smart Fox Server al conectarse que hemos definido arriba como onConnection, que es igual a la función handleConnection, desde arriba!

Código :

import it.gotoandplay.smartfoxserver.*

// Variables

var ip:String = "127.0.0.1"
var port:Number = 9339
var zone:String = "simpleChat"

var smartfox:SmartFoxClient = new SmartFoxClient()
smartfox.onConnection = handleConnection
smartfox.debug = true

// Conectamos al server
smartfox.connect(ip, port)

// Lo que sigue de funciones hasta el final!
function handleConnection(success)
{
if (success)
{
estatus.text = "Conectado Correctamente!"
}
else
{
estatus.text = "Imposible Conectar!"
}
}

Si seguimos todos los pasos correctamente y hay conexión con el servidor en el texto dinámico nos dirá "Conectado Correctamente" y si no hay conexión y/o esta mal configurado nos dirá "Imposible Conectar"

Haciendo nuestra conexión publica

Bien para hacer nuestra conexión publica, vamos a la carpeta:
C:\Archivos de programa\SmartFoxServerPRO_1.6.2 o a la ruta de Smartfoxserver.

Allí, cojemos y entramos a la carpeta Server. Veremos bastantes archivos y carpetas, buscamos el archivo config.xml y lo abrimos con el bloc de notas. Hacemos CNTRL+B y ponemos: <ServerIP> y le damos a buscar. Cuando lo encuentre, mostrara la linea siguiente:

Código :

<ServerIP>127.0.0.1</ServerIP>

Aquí tenemos que poner nuestra ip. Vamos a Inicio -> Ejecutar y ejecutamos CMD. Se nos abrirá la terminal del sistema y escribimos ipconfig. Y nos aparecerá toda la información de nuestro modem y/o router:

Código :

Configuración IP de Windows

Adaptador Ethernet Conexiones de red inalámbricas

Sufijo de conexión específica DNS :
Dirección IP. . . . . . . . . . . : XXX.XXX.X.XX
Máscara de subred . . . . . . . . : XXX.XXX.XXX.X
Puerta de enlace predeterminada : XXX.XXX.X.X

Adaptador Ethernet Conexión de área local :

Estado de los medios. . . .: medios desconectados

Tomamos el numero que indica en la Dirección IP, nos vamos al config.xml en el bloc de notas y sustituimos la de 127.0.0.1 por la de nuestra IP, en vuestro caso, vuestra IP. Guardamos el config.xml y cerramos. Abrimos el ejemplo que creamos antes, y vamos a las acciones del fotograma. Ahora abrimos nuestro navegador y en la URL ponemos: http://www.cualesmiip.net allí nos dice algo como:

Tu IP real es: XX.XX.XXX.XXX

Pues esos números son tu IP real que deberás poner en la variable IP de las acciones del script que hemos creado anteriormente. De esta forma todos los que abran tu pagina con ese script y tu tengas el servidor abierto, se podran
conectar.

Saludos!

Tutorial ofrecido por RamFu en www.phperos.net y modificado por Broo para su publicacion en www.cristalab.com

De todos los programas que har�n parte de la Creative Suite 5, Flash CS5 es quiz�s del que m�s se hablado al p�blico y del cual se mostraron m�s caracter�sticas durante el Adobe MAX. Precisamente entre todas grabaciones de las sesiones se encuentra una llamada “Secret Session: Flash Professional” donde Richard Galvan (Technical Product Manager for Flash) hace un interesante recorrido por esta aplicaci�n explicando caracter�sticas como las siguientes:

Perfil de exportacion a iPhone

En la ventana “Publish Settings” encontraremos la opci�n “iPhone” para publicar a este dispositivo con lo cual el archivo es compilado en un ejecutable nativo para el software iPhone 3.0 y posterior con extensi�n .ipa.

Soporte para texto TFL (Text Layout Framework)

Flash CS5 tendr� soporte nativo para texto TFL el cual hereda muchas caracter�sticas del motor de texto que maneja InDesign con lo cual se le agrega un poder enorme a las tareas de formato texto en Flash con caracter�sticas como texto bidireccional (perfecto para textos en idiomas como Hebreo, Chino, Japon�s, entre muchos otros), m�ltiples columnas enlazadas y controles tipogr�ficos avanzados (kerning, ligaduras, discretionary hyphens, etc). Puedes ver m�s informaci�n sobre TFL en el sito labs de Adobe, adem�s, si deseas empezar a usarlo puedes descargar el framework para ser instalado en Flash CS4 o simplemente interactuar con el demo online.

Code Snippets

: Los “snippets” son ejemplos de c�digo que pueden ser aplicados a un s�mbolo seleccionado con lo cual es posible agregar interactividad sin tener conocimientos de programaci�n. Tambi�n es una forma interesante de reutilizar nuestro propio c�digo.

Editor de c�digo mejorado

Al muy criticado editor de Flash se la ha agregado la capacidad de reconocer las clases personalizadas as� como sus propiedades, m�todos y eventos, por lo tanto obendremos el code hinting al instanciar una clase personalizada o al usar instancias de las mismas.

Integraci�n con Flash Builder (FB)

Para quienes el punto anterior les parece una mejora m�nima, desde Flash CS5 ser� posible crear clases en Flash Builder lo cual genera un proyecto de Flash, es decir que aunque se est� codificando en FB se compila en Flash; en pocas palabra es una forma de trabajar con Flash pero codificando en un editor externo que ser� FB. Desde FB es posible tambi�n crear un proyecto de Flash con lo cual tambi�n se sigue compilando desde Flash pero editando en FB.

Guardar como xfl

Flash CS5 tendr� un nuevo formato para guardar archivos llamado “Flash CS5 Uncompressed Document (*.xfl)” el cual genera una carpeta con un archivo .xfl y una seria de archivos xml que describen todo el contenido del archivo .xfl tales como s�mbolos, fuentes, etc. Este formato permite crear flujos de trabajo donde otras aplicaciones pueden acceder al archivo de flash para hacer ediciones como filtros, etfectos y dem�s.

Mejoras en la herramienta Decco

Esta herramienta tiene un comportamiento mucho m�s “inteligente” y cuenta con muchas m�s opciones de las que se encuentran en Flash CS4.

Mejoras en el trabajo con video

Flash CS5 permtir� reproducir el video en la l�nea de tiempo lo cual har� posible ubicarlo de manera precisa mientras se previsualiza. Tambi�n es posible agregar y editar Cue Points en la l�nea de tiempo lo cual evita tener que reimportar el video para hacer este proceso.

Simulaci�n de efectos f�sicos

Flash CS5 permitir� simular f�cilmente efectos f�sicos dentro de una interpolaci�n tales como “elasticidad de rebote”, para que me entiendan tendr�n que ver el video pues es muy complicado explicarlo. Tambi�n se incluye un panel llamado “Physics” con cuyas opciones se podr�n lograr efectos f�sicos incre�bles como los mostrados en �ste video presentado por Chewbacca (en serio…).

Como pueden ver, hay cosas muy interesantes en la nueva versi�n de Flash. Cabe anotar que Flash CS5 se encuentra a�n en estado beta de desarrollo por lo cual algunas de las caracter�sticas podr�an funcionar diferente en la versi�n final. Seg�n Adobe, la beta p�blica de �ste software estar� disponible a finales de este a�o.

Si dispones de casi dos horas libres puedes ver el v�deo completo de la presentaci�n. Vale la pena.

En este videotutorial de Adobe Flash, veremos una t�cnica para sombrear personajes utilizando la herramienta de la brocha y la opci�n de pintar selecci�n.

Descargar Archivo Flash

En éste videotutorial de Flash crearemos un fondo con un estilo de estrella y duplicaremos rectángulos con degradados para lograr el efecto deseado.

Link de tutorial en HD

En éste videotutorial veremos las nuevas herramientas para manipular y animar objetos en 3D utilizando Flash CS4

Si hay algo que siempre mola es ver nuestro nombre con el logo de algún videojuego, película o serie. Pues como dice el título haremos nuestro nombre o el de quien quieras con el logo de la serie Bleach

Este tip es para principiantes por lo tanto si eres un diseñador PRO, ten por seguro que este tip no te otorgará nuevo conocimiento y no vale la pena que lo leas.

Empezaremos creando un documento de cualquier tamaño y crearemos 4 capas las cuales llamaremos: Texto, Flamas, Base texto y Base logo. Acomodamos las capas como se muestra en la siguiente imagen.

Nos vamos a la capa Texto y elegimos una fuente que sea gorda, por ejemplo Arial Black o Tahoma Bold, escribimos nuestro texto principal en color rojo sin contorno y en itálica, recuerda que nuestra palabra no debe ser muy larga o se verá poco estética. El texto pequeño debe ir en color blanco con un contorno negro al 35%. deberá verse mas o menos así.

Copiamos solamente el texto rojo, bloqueamos la capa Texto y la ocultamos, Ahora nos vamos a la capa Base Texto damos click derecho y elegimos la opción Paste in Pleace.

Convertimos nuestro texto a forma presionando Ctrl+B dos veces seguidas. Ahora nos vamos a Modify / Shape / Expand Fill.

Lo que debemos lograr es que nuestro texto engorde un poco mas de lo que es.

Pintamos de blanco el texto y le damos un contorno en color negro al 35%, debe quedar así.

Hacemos visible la capa Texto:

Ahora seleccionamos nuestra Herramienta Rectángulo, sin contorno y las esquinas superior izquierda e inferior derecha con una redondes de 100. Dibuja un rectángulo delgado.

Elejimos la Herramienta Transformación Libre y le damos un pequeño Skew.

Escalamos y acomodamos nuestro rectángulo. Lo copiamos 3 veces y lo acomodamos de tal forma que no salga de nuestro texto principal.

Bloqueamos ambas capas de texto y nos vamos a la capa Flamas y con la Herramienta Pluma dibujamos una forma parecida a esta, Si se te dificulta dibujar el Shape lee esto que te servirá de base para poder dibujar la Flama.

Una vez dibujada nuestra flama, la duplicamos y la pegamos al otro extremo de nuestro texto. Copiamos todos los elementos que hemos dibujado hasta ahora y nos vamos a la capa Base Logo, damos click derecho y elegimos la opción Paste in Pleace y pintamos todo de azul.

Seleccionamos la Herramienta Rectángulo y cubrimos la area definida en la imagen.

Seleccionamos y abrimos nuestro Panel de Color, elegimos un Degradado Lineal, tomamos un color azul marino para el tono obscuro / oscuro.

Un azul turquesa para el tono claro.

Seleccionamos nuestra Herramienta de Transformación de Relleno y lo acomodamos de tal forma que el tono oscuro quede en la parte baja y el tono claro arriba.

Hacemos visibles todas las capas ocultas y nuestro resultado final debería haber quedado así.

¿Apoco no quedó bien PIMP ?, la parte difícil desde mi punto de vista es el trazo de la flama, aparte de eso todo lo demás es fácil.