All Articles Review
Revisión: 5 cosas que amo sobre Adobe Muse (nombre en clave)
David Smith on Fri, December 9th 0 comments
When developers put the word "Codename" in the title of new BETA application you might expect something exciting... You could well be correct! David Smith examines Adobe's latest piece of tech.

Con el lanzamiento de Adobe InDesign CS5 dio un giro importante hacia lo que permite a los diseñadores crear documentos interactivos fuera, y esta es la parte realmente importante, sin tener que aprender primero que cualquier código de lo que nunca. Tome el panel Objeto Estados como un ejemplo. De repente, un mundo de diseño interactivo SWF abrió sus puertas, incluso la mayoría de los diseñadores del hardcore de impresión. Y así, la revolución, si eso es lo que se continúa con el nombre en código Muse software Beta.

Muse es un paquete de edición de HTML 5 que utiliza las ventajas de diseño web de CSS3, pero que requiere que ninguno de los códigos. De hecho, el software es tan no-eso es su código de flujo de trabajo básico, el diseño y la terminología está más asociado con InDesign a Dreamweaver. Y es que la emulación de InDesign que realmente abre Muse (título provisional) a los diseñadores.

Hay un montón de características muy bonito en musa que lo convierten en una aplicación bastante simple para cualquier persona con un conocimiento básico de InDesign para poder familiarizarse con el. He escogido cinco de mis características favoritas para usted.


Característica 1 - Vista del plano

La vista en planta es en muchos sentidos el equivalente al Panel de páginas de InDesign, sólo con la característica añadida de que es un sitio web que está siendo elaborado como un mapa del sitio en lugar de un documento.

Plan View

Ver Plan.


Vamos a empezar por mirar a la estructura y el diseño en primer lugar. Junto a la primera página (este será su página de índice), verá pequeños "" botones. Al hacer clic en el botón a la derecha de la página, primero se agrega una segunda página en el sitio.

An Added page.

Una página de Alta.


Las páginas están unidas por una pequeña línea de conexión. Esta línea se utiliza para generar la navegación, como se verá más adelante. Siga haciendo clic en el botón de añadir nuevas páginas, ya sea antes o después de las páginas antiguas. Así de simple.

The bottom   button

El botón inferior


El botón en la base de cada página tiene un papel diferente. Al hacer clic en este botón para agregar páginas hermanos. Páginas entre hermanos son las páginas que sólo se puede enlazar desde la página de su agregarlos a.

The Sibling page

Una página de los hermanos.


Uso de los botones para formar una estructura del sitio significa que no se necesita mucho tiempo hasta que haya creado este tipo de cosas.

Site Map

Mapa del sitio.


No se necesita mucho esfuerzo tampoco. Al igual que en InDesign páginas seleccionadas se pueden eliminar con la basura botón también.


Con 2 - Páginas maestras

Como diseñador usted sabe lo importante en la consistencia de su diseño es para la experiencia del usuario a ser buena, independientemente del medio. Uso de páginas maestras en el Muse es una gran manera para facilitar eso. Si está familiarizado con las páginas maestras en InDesign, es que ya se entiende este concepto. Si usted es nuevo en las páginas principales de la mejor imagen que se me ocurre para que se plantillas.

A Master Page.

Una página principal.


Haga doble clic en la página principal para abrirlo. Observe que hay dos pares de guías? Estos están preconfigurados como cabecera para el par más alto y pie de página para la pareja más baja.

Header guide

Cabecera de guía.


Ajustar como lo haría con cualquier guía para conseguir que en su posición.

Coloque el contenido que debe ser coherente en más de una página pulsando Comando + D para abrir las opciones de lugar o seleccionando una de las herramientas para generar, por ejemplo, un cuadro de texto o una forma.

Content placed on master page plus tools

Contenido colocado en la página principal además de herramientas.


Trate de hacer algunas variaciones ya sea agregando más páginas maestras o duplicar (botón derecho del ratón y seleccione "Duplicar") el actual y hacer las modificaciones.

La página de Master A se aplica automáticamente a todas las páginas. Para aplicar una página maestra diferente a sus páginas, arrastre una página principal del grupo de la página principal a una página en la Vista del plano y lo liberan cuando la página se destacan.

Page with master applied and extra content

Página con el maestro aplica y el contenido extra.


La página se puede editar, donde no hay ningún contenido de la página principal, por lo que, en realidad, una página puede estar compuesta de 80% de contenido añadido en esa página y el 20% de contenido de la página principal, por ejemplo.

SUGERENCIA: las páginas principales todavía se pueden editar en el grupo de páginas principales, sólo recuerda que cualquier cambio realizado en las páginas maestras son globales y por lo tanto se verán reflejados en las páginas que tienen que aplicar la página maestra en particular.


Con 3 - Fijación de Objeto

Utilizando las opciones de formato de posición en el CSS para fijar un objeto a una posición en la ventana del navegador puede ser bastante complicado si no está seguro de lo que está haciendo. Muse sin embargo, ha encontrado una manera simple pero muy eficaz de hacer precisamente eso.

The Pin option

La opción de Pin.


Seleccione un objeto o grupo en la página que no se debe mover de su posición actual, tal vez una barra de navegación, por ejemplo.

Navigation selected and pinned

Navegación seleccionado y fijado.


En el panel de control, haga clic en una de las opciones de Pin, he elegido superior izquierda.

Haga clic en el botón Vista previa para ver la página HTML, ahora tratan de desplazarse por la página (puede que tenga que agregar más contenido a habilitar el desplazamiento).

Pinned object stays put

Objeto fijo se queda.


El objeto depositado se queda clavado en la parte superior izquierda de la ventana del navegador en lugar de la página.


Característica 4 - Personalizar la exploración de

En la vista en planta que tiene una estructura del sitio, y todas las páginas y páginas de los hermanos nombrados son.

Plan view busy

Una vista en planta ocupada.


Ahora yo uso esta estructura del sitio para crear de forma automática la navegación del sitio.

Widgets

El panel de Widgets.


Arrastre el menú en la primera página en el sitio y colocarlo en posición.

Sugerencia: las páginas maestras son un lugar ideal para este tipo de cosas.

Menu on the page

Menú de la página.


Este widget es un flash inteligente que automáticamente los nombres de cada enlace y crea un hipervínculo a la página.

The Options area

Las opciones de HUD.


Aquí puede elegir qué tipo de menú que usted desee, como el nivel de navegación que desea, o sólo las páginas que incluyen las páginas de los hermanos, por ejemplo.

The Control Panel

El panel de control.


Para el estilo del menú para que coincida con su sitio usar las opciones de color y opciones de fuentes disponibles en el panel de control, como muchas otras aplicaciones de Adobe.


Característica 5 - Botones Importar desde Photoshop CS5

Esto tiene que ser mi característica favorita de todos, ya que permite el diseño de los botones de uso de capas de Photoshop para estados del botón.

Photoshop layers

Capas de Photoshop.


Aquí tengo una imagen de Photoshop que he hecho, un botón con una capa de diseño diferente para cada estado.

De vuelta en Muse, coloque el archivo de Photoshop como un botón de Photoshop, seleccione Archivo

Button Options

El botón Opciones.


En el cuadro de opciones que aparece coinciden con cada capa de cada estado del botón, Arriba, Sobre, etc A continuación, coloque el botón en la página.

Cambiar al modo de vista previa y probar el botón. Cada capa de Photoshop se revela cuando su estado correspondiente es activada por el cursor.

The States panel

Los Estados panel.


El Grupo de Estados permite a cada estado del botón de Photoshop para ser controlados y modificados después de la colocación.


Conclusión

Así ha Adobe golpeó el camino correcto con Muse, o incluso lo que podría llamarse en el momento de su lanzamiento? Bueno, yo tendría que decir ... ¡Sí! Muse es una gran herramienta para los diseñadores puedan transferir sus conocimientos de impresión a la Web sin la participación de código. No es que yo estoy diciendo que algo está mal con la codificación, pero para muchos diseñadores HTML y CSS no son parte de sus herramientas.

Si quieres probar la versión Beta de Muse a continuación, visite el sitio web de Adobe y descargar de forma gratuita aquí .


Comments (0)

You must be logged in to comment. Login Now

Feedback
Course Advisor
Don't Know Where To Start?
Ask A Course Advisor
Ask Us!
Copy the link below and paste it into an email, forum, or Facebook to share this with your friends.
Make money when you share our links
Become a macProVideo.com Affiliate!
The current affiliate rate is: 50%
Classes Start Next Week!
Live 8-week Online Certification Classes for: