amorales

Diseño visual para medios digitales

Interfaz



Strict Standards: Only variables should be assigned by reference in /home/amorales/amorales.cl/wp-includes/post.php on line 115
Emailing icons set

Emailing icons set


Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Set de 12 √≠conos dise√Īados para el env√≠o de emailing.
Ver el set completo en Flickr.



Strict Standards: Only variables should be assigned by reference in /home/amorales/amorales.cl/wp-includes/post.php on line 115
Dise√Īo de Video Player para Sofatutor

Dise√Īo de Video Player para Sofatutor


Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Dentro de todo el trabajo que fue dise√Īar completamente la plataforma Sofatutor, hubo una faena en particular que fue muy interesante. Se trataba de dise√Īar la interfaz del Player de los Videos de la plataforma. El desaf√≠o se volvi√≥ interesante porque era la primera vez que me tocaba investigar y dise√Īar en torno a esta interfaz que como primera complejidad trae el tama√Īo. En una reducida √°rea de 650 x 370 px se deb√≠a diagramar todos los elementos gr√°ficos de la interfaz: botones de acciones b√°sicas (play, pausa, tiempo, volumen); botones de acciones auxiliares (full screen, on-off de comentarios); comentarios hechos por otros usuarios en el timeline; y, por supuesto, […]



Strict Standards: Only variables should be assigned by reference in /home/amorales/amorales.cl/wp-includes/post.php on line 115
10 Ejemplos para potenciar tu marca en home pages

10 Ejemplos para potenciar tu marca en home pages


Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

La semana pasada fu√≠ gentilmente invitado por Multiplica (empresa a la cual asesoro en dise√Īo de interfaz) a dar una charla a gerentes de marketing de distintas empresas chilenas. El tema era el “dise√Īo de interfaz” que tal vez para la audiencia pod√≠a sonar muy t√©nico o incluso fome. Sin embargo trat√© de que el dise√Īo lo vieran como una oportunidad de potenciar sus marcas a partir de debilidades que presentan muchas interfaces en el medio chileno y enfocado solamente a las homes. La charla se dividi√≥ en tres partes: la primera para generar un contexto donde expliqu√© qu√© es el dise√Īo de interfaz; la segunda enumer√© conceptos a proyectar […]



Strict Standards: Only variables should be assigned by reference in /home/amorales/amorales.cl/wp-includes/post.php on line 115
Sofatutor: progresi√≥n de dise√Īo de contenedor de temas (F√§cher)

Sofatutor: progresi√≥n de dise√Īo de contenedor de temas (F√§cher)


Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

A continuaci√≥n describo y muestro la progresi√≥n para el dise√Īo del contenedor de temas implementado para Sofatutor. Para la mayor√≠a puede sonar muy t√©cnico pero para los dise√Īadores de interfaz es de todos los d√≠as Pueden ver y descargar la imagen tambi√©n en mi Flickr.
01 Propuesta Wireframe

Forma: Contenedor cl√°sico de temas desplegables/colapsables con ancho fijo y alto indeterminado.
Tipografías: Uso de familia tipográfica que permita mostrar cantidad de videos de los temas.
Color: Construcción cromática para diferencia de contenido e interacción.
Interacción: Acción para desplegar/colapsar segundos niveles.

02 Propuesta Inicial

Forma: Contenedor de contorno mixto (cabecera curva con brillo y pie recto a 1 pixel), bordes a 1 pixel e interior blanco con l√≠neas […]



Strict Standards: Only variables should be assigned by reference in /home/amorales/amorales.cl/wp-includes/post.php on line 115
Sofatutor: II Etapa

Sofatutor: II Etapa


Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Mientras espero el lanzamiento oficial de la versi√≥n 2 de Sofatutor, trato de ordenar y listar en mi cabeza los temas que m√°s adelante escribir√© a prop√≥sito de esta experiencia. Porque es harto lo que puedo compartir en cuanto al trabajo que hice para el dise√Īo de esta segunda parte que no tan solo consider√≥ una evoluci√≥n natural del “look&feel”, sino que se enriqueci√≥ con distintos elementos (nuevos para m√≠ desde el punto de vista del dise√Īo de interfaz) como videos con interfaces propias de navegaci√≥n e interacci√≥n con usuarios o visualizaciones de notas de videos, que responden a una variable muy importante del dise√Īo para pantallas: la usabilidad. Ahora […]



Strict Standards: Only variables should be assigned by reference in /home/amorales/amorales.cl/wp-includes/post.php on line 115
Dise√Īo de Interfaz: Exportaci√≥n no Tradicional

Dise√Īo de Interfaz: Exportaci√≥n no Tradicional


Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

(Vuelvo a retomar mi blog despu√©s de tanto tiempo y despu√©s de de un intenso fin de a√Īo que concluy√≥ con la organizaci√≥n de mi memorable matrimonio).
Hace mucho tiempo quer√≠a compartir esta experiencia laboral que me ha tra√≠do bastante feliz durante este √ļltimo tiempo. A mediados de agosto de 2007 estuve chateando con Andreas Spading, un amigo (ex-ayerviernino) que est√° en Berl√≠n (Alemania) y aparte de contarme coloquialmente de su vida me cont√≥ que estaba gestando, junto a otros amigos, un proyecto web 2.0 que lo ten√≠a muy ocupado. Al avanzar la conversaci√≥n me fu√≠ llevando una incre√≠ble sorpresa pues empez√≥ a preguntarme si estar√≠a interesado en dise√Īar la interfaz […]



Strict Standards: Only variables should be assigned by reference in /home/amorales/amorales.cl/wp-includes/post.php on line 115
Sobre la representación y discreción de un ícono

Sobre la representación y discreción de un ícono


Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Cuando part√≠ dise√Īando interfaces en AyerViernes fu√≠ asumiendo poco a poco la necesidad de destinar m√≠nimas √°ereas de pixeles de la interfaz a unas unidades muy discretas que complementaban espec√≠ficas entregas de informaci√≥n: √≠conos. S√≠, pueden reirse de mis primeros intentos a 1 bit, pero de a poco fu√≠ incorporandoles color
Pero estas peque√Īas unidades, que son representaciones gr√°ficas que nos ayudan a reconocer ciertos objetos, comandos o cualquier acci√≥n que un usuario necesite desplegar en una interfaz, no s√≥lo complementan una acci√≥n, sino que construyen un reconocimento por parte del usuario de determinadas acciones a realizar. Por ejemplo, un usuario podr√° reconocer r√°pidamente que una noticia tiene […]



Strict Standards: Only variables should be assigned by reference in /home/amorales/amorales.cl/wp-includes/post.php on line 115
Mini íconos para Blog Cocha Joven

Mini íconos para Blog Cocha Joven


Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/amorales/amorales.cl/wp-includes/formatting.php on line 74

Me llam√≥ mucho la atenci√≥n cuando hicimos el proyecto del Blog para la agencia de Viajes Cocha Joven, porque por primera vez sent√≠ que un cliente mostraba tanto √©nfasis e inquietud por el dise√Īo de la iconograf√≠a en el proyecto a emprender. Debo aclarar que en AyerViernes asumimos, por defecto, en el dise√Īo de interfaz de un sitio web, intranet, blog u otro, una cantidad m√≠nima de √≠conos para ayudar a los usuarios en m√≠nimas, pero no menos importante, acciones como “ir al inicio”, “contactar”, “ir al mapa de sitio”, etc.. Con much√≠simo m√°s gusto desarrollamos este set de mini √≠conos basado en cl√°sicas met√°foras para el Blog:
Estos […]