X Course Advisor FREE Course Advisor
(Close)
Watch Tutorials
macProVideo.com
Close

Acceso Premium gratis

Acceso a toda nuestra biblioteca de artículos Hub Premium, los archivos del proyecto y el primer 10% de cada uno-Video Tutorial de la Biblioteca Tutorial en línea .

Crea tu cuenta gratis!

Revisión: 5 cosas que amo sobre Adobe Muse (nombre en clave)
Traducido por Google Translate

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í .


David Smith

David Smith | Articles by this author

David Smith is Scotland's most qualified Apple and Adobe certified trainer. Having completed his education at Edinburgh College of Art's BAFTA winning Film School, David moved straight into TV production, first as a Vision Mixer then quickly becoming, at the age of just 24, a director of live TV studio productions. In 2001 he moved into Higher Education where he became a lecturer in TV Production, specializing in post-production and live studio production. During this time, and working with the support of the BBC, Channel 4 and independent production companies, David was instrumental in the design, development and implementation of industry-approved vocational courses across Scotland's Colleges. In 2006, after working closely with Apple Computers to create a unique multimedia studio for education at the Music and Media Centre in Perth, David became Scotland's first Apple-Certified Trainer for Pro Apps. This led on to David forming the first Apple Authorized Training Centre for Education, north of Manchester. In 2008 David made the move to full time training and joined the ranks at Academy Class, Ltd. where he continues to train industry professionals as a certified trainer across the Adobe Creative Suite and Apple Pro Apps range.

Comments

You must be logged in to post a comment.
Create an Account  Login Now

What is macProVideo.com?

macProVideo.com is an online education community featuring Tutorial-Videos & Training for popular Audio & Video Applications including Adobe CS, Logic Studio, Final Cut Studio, and more.
© 2018 macProVideo.com
a division of NonLinear Educating Inc.
Link