Ok chicos, éste tuto no es mío, obvio
sólo lo traduje...
Interfaz de Audio
Tutorial hecho por Robouk
Traducido x Luis Daniel (The-Dander)Resultado:
1. Vamos a comenzar. Desearás comenzar con una imagen bastante grande para trabajar con esto. Una buena eleccion sería 500x50px, con una resolución de 72 pixeles/pulgada y un fondo blanco. Podemos dejar el fondo blanco pero porqué no tu fondo preferido, no molesta, solo con la opacidad baja.
2. Comencemos con la forma principal. para esta clase particular será bastante simple, basado en un telecontrol del jugador del mini-disco. Seleccionar un gris claro como tu primer plano: #E5E5E5 y elijan la herramienta redondeada del rectángulo.
Debe quedar algo asi:
Ahora crear una nueva capa y dibujar hacia fuera una barra formada píldora grande, sobre el tamaño del ejemplo abajo.
Para manipular la forma, elegir la herramienta directa de selección y cliquear el centro de tu forma para destacar la trayectoria. Ahora cliquear a lo largo de la trayectoria para poder considerar todos los puntos de anclaje.
Ahora con la herramienta directa de la selección otra vez, seleccionar el punto de anclaje superior que acaba de agregar cliquear en ella, y apretarlo en el teclado 4 veces de nudge abajo de 4 pixels. Hacer igual con el punto de anclaje inferior que acaba de crear, pero nudge los 4 pixels para arriba en vez de abajo.
Si hiciste eso correctamente, parecerá esto.
Presionar CTRL + H para ocultar la trayectoria y para mirar tu forma lisa.
Ahora nos hacen que crean nuestra forma principal, pero puesto que la hicimos como una trayectoria nosotros podemos modificarla fácilmente más adelante si necesitamos que sea siempre una buena prima.
TIP: intentar crear como mucho de tu interfaz usando las trayectorias/las herramientas de la forma, puesto que vector-se basan y pues tal será siempre una calidad mejor y podrás siempre ir detrás y corregirlas.
3. La forma principal es completa, ahora deseamos hacerte el soporte hacia fuera y parecer realistas. Una cosa importante que puedes hacer que acelerará sumamente tu trabajo debe ahorrar todos los estilos de la capa creas al usar la versión 6.0 de Photoshop y más adelante. Por ejemplo, en el ejemplo de esta clase particular, un estilo liso de la capa del cartabón del metal fue creado para la forma principal… si el resto del interfaz fue terminado, el mismo estilo de la capa se podría aplicar inmediatamente a la forma principal de eso también. Te ahorra CARGA del tiempo comparado a incorporar los mismos ajustes repetidamente otra vez, y parece grande.
en tu capa de la forma, ir a Capa>>Estilo de capa>>Posicion de granulado
Incorporar estos ajustes:
Si guardas tu estilo de la capa cliqueando el botón del estilo de la paleta de colores de los estilos, entonces cliquea “nuevo estilo”, puedes utilizarlo repetidas veces después. Una vez que hayas acabado, cliquear Ok.
Como puedes ver, hemos creado nuestra forma principal para todos nuestros elementos para sentarnos ensencialmente usando solo 2 herramientas: pluma y las herramientas de la forma y estilos de la capa. ¿No hay interfaz completo sin una ciénaga de botones y de adminículos de lujo sin embargo, a la derecha? … en la página siguiente aprenderás cómo agregar una lengüeta de la inserción, una pantalla brillante del LCD, los botones, y abundancia más.
4. La adición siguiente será una lengüeta plástica negra que es inserción en la superficie, que contendrá más adelante la pantalla del interfaz (para los detalles adicionales, considera
la clase particular de los botones de la inserción). Seleccionar la herramienta redondeada del rectángulo otra vez con las mismas opciones que antes:
Esta vez sin embargo, utiliza blanco como tu color del primer plano. Crear una nueva capa y dibujar otra forma más pequeña de la píldora sobre la tapa de tu forma del interfaz así que parece el ejemplo abajo. Ir a Capa>>Estilo de capa>>Posicion Granulado y a utilizar estos ajustes:
El paso anterior creó la inserción, y en este paso es hora de hacer la lengüeta plástica sí mismo. La lengüeta plástica consistirá en otra forma (negra) de la píldora levemente más pequeña que la que está creada en el paso anterior. Arrastrar la capa con la forma de la píldora del gradiente en ella “crean al icono de una nueva capa”
para duplicarlo. Enderezar chascan encendido la capa nuevamente duplicada y eligen “estilo claro de la capa”. Chascar encendido la nueva capa para cerciorarse de que es la capa activa y presiona D entonces X (reajustar tu gama de colores del color), entonces golpean CTRL+Retroceso para llenar la nueva forma de negro. Ahora necesitamos hacer esta forma levemente más pequeña, así que presionar CTRL+T para entrar transforman modo.
ostener el ALT y arrastrar el lado inferior para arriba levemente (sostener el ALT refleja cualquier cosa hecha al lado inferior sobre el lado superior así que sigue siendo igual). Ahora hacer igual con el lado derecho. Una vez que seas feliz con él, el golpe ENTRA para confiar lo o salida a la cancelación y al intento otra vez.
Si fueron todos bien, deben mirar algo similar:
Ahora es hora de agregar un poco brillo al área plástica negra.
Ir a Capa>>Estilo de capa>>Bisel y Relieve y a realzarlo
y utilizar estos ajustes:
Ahora agregar un estilo de la capa del contorno con estos ajustes:
Y pasado, puede ser que desees agregar un resplandor interno:
Una vez más puede ser que desees ahorrar este estilo antes de ti AUTORIZACIÓN del tecleo.
Debe parecer similar al ejemplo abajo a este punto:
5. Ahora para la diversión por horas para agregar la pantalla del LCD. Crear una nueva capa, y seleccionar #86B7E7 como tu color del primero plano. Con la herramienta redondeada del rectángulo con las opciones siguientes, dibujar tu pantalla del LCD sobre la lengüeta plástica negra, como se muestra abajo.
Y parecerá esto:
¡Hora para… mí sé sí que no estás contando con esto… otro estilo de la capa!
Ir a capa>>Estilo de capa>>Sombra paralela a utilizar estos ajustes:
Ahora agregar un resplandor interno con los ajustes siguientes:
y esto:
y x ultimo:
Como de costumbre, debes considerar el ahorrar de tu nuevo estilo de la capa para un uso más último. Cuando has terminado los ajustes, chascar MUY BIEN y comparar tus resultados con el ejemplo abajo.
Ahora, la parte siguiente es opcional, pero hacer que el LCD parece más realista (er aceptable, quizá apenas Haha más fresca), puedes simular la luz que refleja de la superficie agregando un toque de luz. Aquí es cómo:
Esto puede conseguir un poco difícil, y mientras que hay algunas maneras más fáciles de conseguir un efecto similar, esta manera es más realista. Duplicar la capa que contiene tu pantalla azul del LCD arrastrándola sobre “crea el icono de una nueva capa” Crear una nueva capa. Enderezar chascan encendido esta nueva capa y eligen “estilo claro de la capa”, después presionan X entonces D en el teclado para reajustar tus colores. Ahora golpear CTRL + tecla de retroceso para llenar la forma de blanco.
Con la herramienta directa de la selección, chascar la forma ahora-blanca, y presionar CTRL + T para transformar la forma.
A la barra de las opciones en la tapa, incorporar estos ajustes (véase destacado):
El golpe entra en tu teclado para confiar los cambios.
Debe ahora parecer esto:
Bajar la opacidad del terraplén (en la gama de colores de las capas) hasta el 0% así que la forma blanca es invisible:
Ahora, prensa D entonces X para reajustar tus colores.
Ir a acodar” el recubrimiento del gradiente del estilo de la capa” y a utilizar estos ajustes: El recubrimiento del gradiente
Entonces chasca MUY BIEN. Debes tener un toque de luz apuesto ahora, pero es realmente poco un demasiado perfecto.
En la gama de colores de las capas, agregar una máscara de la capa a tu capa del toque de luz de la pantalla presionando “agregan el icono de la máscara de la capa”
Agregar la máscara de la capa. Ahora seleccionar la herramienta de la pluma (te cercioras de tener el correcto).
En las opciones barrar, fijar las opciones a éstos:
Ahora, en tu lona, dibujar una trayectoria que contenga todas las partes del toque de luz que deseas guardar (véase la imagen abajo)
Ahora enderezar el tecleo DENTRO de la trayectoria y elegir “hacen la selección” (debes inmóvil tener la herramienta de la pluma como tu herramienta activa). Dejar todos los ajustes como AUTORIZACIÓN del defecto y del tecleo en el diálogo que hace estallar para arriba.
Presionar X entonces D para reajustar tus colores (si es necesario) y para golpear CTRL + tecla de retroceso en el teclado para llenar la selección… de la prensa CTRL + D a deselect, y tus resultados deben parecer similares al ejemplo.
La pantalla del LCD es completa ahora; todo que permanece es agregar tu texto a él. Puedes descargar LCD-como fuente
aqui].
6. Ahora desearás agregar tus botones al interfaz. Como de costumbre, debes intentar utilizar estilos de la capa tanto cuanto sea posible para crear tus botones.
El proceso de crear y de agregar los botones no será cubierto en esta clase particular, sino mirada hacia fuera para las clases particulares del botón del interfaz que vienen pronto. Al lado de este punto ahora tienes un arsenal de útil interfaz-diseñas absolutamente técnicas debajo de tu correa - ver con lo que puedes subir.
