Siendo un desarrollador que quiere ser diseñador, estoy realmente interesado en aprender cómo crear una interfaz de usuario de primer nivel para sitios web, aplicaciones móviles, etc. Sin embargo, no sé nada sobre PhotoShop ni nada relacionado con el diseño, excepto HTML y CSS.
¿Donde debería empezar? ¿Cómo aprendo cómo crear sitios web e interfaces hermosos y diseñados?
¿Hay algún libro, tutorial, etc. que recomiende?
¡Gracias!
Respuestas:
Para la interfaz de usuario, recomiendo usar Fireworks sobre Photoshop. Photoshop es ideal para obras de arte creativas y complejas (impresión o web), pero en mi opinión es una herramienta demasiado compleja para la interfaz de usuario relacionada con la web.
Fireworks está específicamente diseñado como una herramienta de autoría orientada a la web donde Photoshop no lo es. El conjunto de herramientas para Fireworks está orientado a la construcción de la interfaz de usuario web, no el complejo trabajo creativo que ofrece Photoshop.
Fireworks utiliza una herramienta muy similar a Photoshop, menos la hinchazón, por lo que puede hacer todo lo que necesite para crear una interfaz de usuario web.
Fireworks también forma parte de Adobe Creative Suite, por lo que si tienes Photoshop también deberías tenerlo.
Material de referencia, no específico de Fireworks pero UI en general;
http://www.jankoatwarpspeed.com/
Recomiendo encarecidamente leer sus artículos y mirar su trabajo en busca de inspiración. La interfaz de usuario tiene dos lados que cubre muy bien: la interfaz y la experiencia de usar la interfaz. También se conoce como UI y UX.
Puede aprender cómo usar la aplicación a través de tutoriales en línea. Envato tiene una gran red de tutoriales http://tutsplus.com/ , dado que su sitio principal de Tutoriales para la web está orientado a Photoshop, pero la mayoría de lo que hacen en Photoshop se hace con el mismo método, o similar, en Fireworks.
También me encuentro con bastante frecuencia en sitios de marcadores que tienen rasgos de diseño únicos o elementos de interfaz de usuario que funcionarían bien en algún escenario futuro para un proyecto. Por ejemplo, una estructura de pestañas única, un estilo acordeón o incluso un localizador.
La interfaz de usuario de diseño en un nivel básico se desglosa en áreas de visualización de datos. Dado que tiene antecedentes de desarrollador, sabe cómo presentar los datos desde una perspectiva lógica (menús, acordeones, pestañas, etc.). Ahora solo se trata de construir esa interfaz de usuario usando esos controles o módulos desde una perspectiva visual.
Algunas lecturas adicionales sobre UX:
Al tener antecedentes de desarrollador también, puedo decirte que cuando construyo mis aplicaciones, el primer paso es crear la interfaz de usuario que a su vez define la funcionalidad de las aplicaciones. Mi obra de arte creada sirve tanto para el valor artístico de la aplicación como para la definición de la función. Siempre construyo mi lógica en torno a la obra de arte completada, nunca al revés. Esto siempre significa que pongo al usuario primero.
Espero que esto te dé al menos un punto de partida.
Estás de suerte. Muchas personas han venido al mundo del diseño web haciendo la misma pregunta. Muchas veces, verá un equipo de personas, compuesto por al menos un codificador y un diseñador gráfico. Buena elección con Photoshop: eso es con lo que me quedo.
Con la versión más reciente de Adobe Photoshop, CS5, se ha vuelto intensamente avanzada: capaz de realizar tareas complejas con herramientas simples, o incluso tareas más complejas con herramientas complejas. Pero te advierto, aprender todas las características interesantes de Photoshop puede conducir a la falta de nutrientes. :)
Aquí hay un tutorial que cubre los conceptos básicos para que pueda obtener el ritmo de las cosas:
Una vez que llegue todo eso abajo, me encontré con un montón de sitios en Google que tienen algunos tutoriales de diseño realmente innovadoras.
Hay algunas técnicas que puede que tenga que aprender. Un consejo, brillante es generalmente un buen paso en estos días. Para obtener un diseño verdaderamente único, encuentre las características que le gustan de cualquier plantilla de sitio web, luego úsela a su manera.
Espero que haya ayudado. Deja un comentario si necesitas más información.