Esperamos que se animen a adquirir sus basureros y demostrar sus habilidades artísticas y de diseño, y que sobre todo, este evento sirva para ayudar a difundir un poco más la cultura ecológica y este tipo de concursos con fines sociales.

Página web anterior al rediseño

Los objetivos principales del rediseño eran:

• Cambio de imagen ya que la emisora inauguraba su nueva radio frecuencia en FM.
• Reflejar una imagen más alegre dado que el giro de la emisora es bastante popular.
• Esta nueva imagen, a pesar de tratar de ser más alegre, no podía reflejar falta de seriedad o profesionalismo dado que uno de los fuertes principales de esta emisora es el generar noticias exlusivas para la ciudad.
• Mantener un enfoque principal en las noticias y permitir que el usuario escaneara los contenidos con más facilidad.

Qué acciones se llevaron a cabo para lograr los objetivos de rediseño:

• Se rediseñó el logotipo para reflejar una imagen más moderna y activa, se mantuvieron los rasgos y colores esenciales.
• Se cambió el diseño del menú principal sustituyendo las tipografías por algo más fuerte. Este nuevo menú invita al usuario a explorarlo más que el anterior.
• Se crearon nuevos banners para la parte superior. Estos banners reflejan gran parte de la actitud musical y alegre de la emisora. Mientras el usuario está viendo la página rotan cada cierto tiempo.
• Se eliminaron los bordes redondeados del cuerpo de la página para darle un look más moderno.
• Se rediseñaron los botones (llámanos y escucha la radio) para coincidir con la nueva imagen.
• Se cambió el fondo azul sólido por un gradiente utilizando color para darle mayor profundidad a la página.
• Las notas tienen nuevos encabezados que facilita su separación entre una y otra, de esta forma el usuario puede navegar entre ellas más fácil.
• Se cambiaron las tipografías de todos los encabezados para servir mejor como separadores y también ayudar a la nueva imagen.
• Se reorganizaron las secciones de las barras laterales para que obedecieran a las prioridades de los usuarios al usar la página.

A pesar de que varios cambios que se mencionan pueden parecer bastante sencillos, en conjunto brindan una imagen fresca y un cambio considerable que renueva efectivamente a la marca.

Página Web rediseñada:

Esperamos que este ejemplo de uno de nuestros proyectos haya sigo de su agrado. Si desea que Infotipos trabaje con usted para rediseñar algún material o página web, no dude en contactarnos a través de nuestro correo contacto@infotipos.com o por medio de nuestra forma de contacto en nuestra página web.

En Infotipos somos fanáticos de estas historias y decidimos hacer una infografía que recopilara información para aquellos cinéfilos que estén algo despistados en lo que respecta este magno proyecto. Tratamos de mantener la información simple y directa para que el usuario se pueda dar una idea rápida y efectiva de algunos aspectos generales de la película, los personajes, actores y el director/escritor. Vean la infografía a continuación y denle click para agrandarla.

Esperamos que esta infografía haya sigo de su agrado. Si desea que Infotipos trabaje con usted para generar algún material parecido al que ve en este artículo, no dude en contactarnos a través de nuestro correo contacto@infotipos.com o por medio de nuestra forma de contacto en nuestra página web.

Destacamos de estas imágenes la forma en que una infografía puede compilar hechos históricos y otros datos interesantes sobre un tema y además mostrarlos de una forma clara y comprensible.

Last.fm MJ por Anil Bawa-Cavia

Una buena cronología en behance.net

15 cosas curiosas de Michael Jackson por MBA

Descripción del “moonwalk” por La Vanguardia

Infografía sobre el efecto especial de ‘Smooth Criminal’ por ‘El Universal‘

Repaso de discografía y otros datos interesantes por El Mundo

Esperamos que esta compilación haya sigo de su agrado. Si desea que Infotipos trabaje con usted para generar algún material parecido al que ve en este artículo, no dude en contactarnos a través de nuestro correo contacto@infotipos.com o por medio de nuestra forma de contacto en nuestra página web.

Sobre el Diseño editorial

Leyendo a Lakshmi Bhaskaran en su libro ¿Qué es el Diseño Editorial?, se pone de manifiesto el hecho de que el poder de las publicaciones impresas (textos literarios, revistas, historietas coleccionables, diarios, etc.) no había sido tan fuerte como lo es hoy en día ya que como menciona el autor “vayamos donde vayamos y hagamos lo que hagamos, las publicaciones nos rodean”. Sumado a este fenómeno, en la actualidad encontramos infinidad de documentos electrónicos cuyo objetivo principal es exactamente el mismo que cualquier impreso: Comunicar.

¿Qué hay que preguntarse al momento de iniciar un proyecto editorial?

Con la comunicación como principio básico, los diseñadores de publicaciones se las ingenian día a día para captar la atención del lector a nivel estético y emocional. En este punto, es importante que el diseñador comience a responder a las siguientes preguntas antes de iniciar un proyecto editorial:

• ¿Cuál es el propósito y objetivos del proyecto editorial?
• ¿A quién va dirigida la publicación que estoy diseñando?
• ¿Qué hace bien la competencia de mi producto editorial?
• ¿Qué hace mal la competencia de mi producto editorial?
• ¿En qué se diferencia mi diseño de la competencia?
• ¿Qué recursos gráficos voy a emplear para diferenciar mi diseño de otros?

Resueltas estas dudas, el diseñador obtendrá herramientas conceptuales con las cuales podrá planear la correcta aplicación y distribución de los textos (siendo estos la ‘materia prima’ de toda publicación editorial) y otros elementos como fotografías, ilustraciones, gráficos, infografías, etc.

Sobre Visualización de datos

Una disciplina que comparte el mismo principio de comunicar es la visualización de datos. Según Medialab-Prado (http://medialab-prado.es), espacio orientado a la producción, investigación y difusión de la cultura digital, la visualización de datos “utiliza el inmenso poder de las imágenes para explicar de manera comprensible las relaciones de significado, causa y dependencia que se pueden encontrar entre las grandes masas abstractas de información”.

La definición anterior nos lleva a pensar en el gran papel que podría cumplir la visualización si se usa de manera correcta dentro de cualquier diseño editorial, inclusive, se podría plantear la hipótesis de que un producto editorial que emplea visualizaciones es más fácil de entender que uno que no las utiliza. Con los ejemplos que les hemos mostrado en este post ya ustedes juzgaran por sí mismos.

Por último, si usted señor lector, está pensando en diseñar un producto editorial y/o en emplear visualizaciones para sus documentos con el objetivo de comunicar claramente una idea o concepto, no dude en contactarse con nosotros a través de nuestro correo electrónico contacto@infotipos.com o por medio de nuestro formulario de contacto ingresando a nuestra página web www.infotipos.com

Imágenes obtenidas de:

El caso que trataremos en esta ocasión es el de la nueva consola de videojuegos de la compañía Nintendo. La consola se llama Wii U y se caracteriza por tener un nuevo control con muchas funcionalidades interesantes, ya que éste es la parte principal del producto, decidimos hacer una infografía que detallara a profundidad cada componente del mismo. También incluimos datos generales de la consola y formas de uso.

En general dándole un vistazo rápido a esta infografía el usuario puede darse una idea de todo lo que propone este nuevo dispositivo y encuentra concentrado en un solo material toda la información oficial que se ha liberado hasta el momento (La primera imagen es en español y la segunda en inglés, dar click para ampliar las imágenes):

Infographic of the features of the new Nintendo gaming console: Wii U

Esperamos que este caso de ejemplo haya sido de utilidad para ejemplificar un excelente uso de las infografías en el ámbito comercial y publicitario. Si desea que Infotipos trabaje con usted para generar algún material parecido al que ve en este artículo, no dude en contactarnos a través de nuestro correo contacto@infotipos.com o por medio de nuestra forma de contacto en nuestra página web.

La ilustración científica como todo buen trabajo de diseño lleva consigo un método lógico y dedicado que a primera vista no se ve, solamente se refleja en un excelente resultado. Para los ilustradores profesionales este proceso puede llegar a ser tan estructurado como cualquier otro proyecto.

En la ilustración científica es muy importante la precisión y la calidad en los detalles (textura, color, dimensiones, etc.), por esta razón es recomendable establecer un proceso o método en el que pasos como la documentación, el bocetaje y la finalización por medio de una técnica específica, se conviertan en aspectos indispensables para lograr un trabajo ilustrativo de calidad.

Proceso y tips para realizar ilustración científica

Paso 1 – Documentación: Lo ideal sería desplazarse al lugar donde se encuentra el elemento a ilustrar y tomar fotografías. En caso que lo anterior no sea posible otra alternativa sería consultar en fuentes como internet, libros, revistas especializadas, etc., en donde se pueda obtener suficiente información (teórica y visual) de dimensiones, contexto, y otras características que nos recreen una idea de las condiciones en las que normalmente se encontraría ese elemento.

Paso 2 – Bocetos: Una vez obtenidos todos los datos, se debe comenzar el bocetaje. En este paso siempre recomendamos emplear lápiz y papel para probar texturas, perspectivas y proporciones.  Un aspecto a tener en cuenta es el espacio compositivo, es decir, el área de trabajo que va a estar destinada para ubicar la ilustración. Por lo general la ilustración científica se emplea para complementar información dentro de proyectos editoriales (artículos científicos, infografías, libros de texto, etc.), por lo que  es fundamental que el ilustrador sepa con qué área cuenta para trabajar y de esta forma pueda decidir cuál sería la mejor manera de integrar la ilustración al resto de la composición.

Paso 3 – Definir técnica: ¿Cuál es la técnica más adecuada para finalizar la ilustración? Hay ilustradores que todavía emplean técnicas tradicionales como la acuarela, la tinta china e inclusive el lápiz de color y eso es muy respetable. Nosotros en Infotipos preferimos emplear técnicas digitales ya que nos permiten trabajar en grandes formatos y corregir cualquier detalle de una manera más rápida, sin el contratiempo de tener que volver a comenzar desde ceros la ilustración.

Paso 4 – Composición: Al final la ilustración debe ser integrada en el material en el que será empleada. Esta integración debe verse natural y adaptarse perfectamente a las técnicas y estilo gráfico utilizado en la composición final.

Esto es a grandes rasgos la forma en que realizamos ilustración científica en Infotipos, si quieres saber más detalles de cómo hacemos nuestro trabajo o requieres de nuestros servicios en esta área, no dudes en contactarnos a la dirección contacto@infotipos.com o directamente contestando a este correo electrónico.

Muy pocas veces el diseñador es claro en el proceso que se seguirá para llegar al resultado final y esto puede repercutir en una falta de comunicación y estancamiento de las fases del proceso. Es importante que tanto el cliente como el diseñador estén claros en los pasos a seguir para que así el proceso se de sin problemas.

En Infotipos nos hemos dado a la tarea de resumir el proceso ideal que llevaría el diseño de una página web. Decimos ideal porque no siempre se dispone del tiempo o los recursos para llevar a cabo cada uno de los pasos sugeridos (a veces no se pueden hacer tantas pruebas con usuarios, o tantas correcciones o bocetos iniciales por ejemplo). En este caso tomamos como ejemplo los pasos que seguimos para realizar la página web de Infotipos. A continuación puede ver el proceso que hay detrás del diseño de páginas web (haga click para verlo en grande):

Esperamos que haya quedado claro y que tome en cuenta estos pasos para el momento en que se decida a tener su propia página web. Aprovechamos para invitarlo a que nos contacte (visite nuestro formulario de contacto o conteste este mismo correo) si necesita que colaboremos con usted para el diseño de su página web o para realizar una infografía como la mostrada aquí.

Por lo general el diseño gráfico se ve como un servicio netamente utilitario que está enfocado a comunicar mensajes comerciales. Pocas veces se toma en cuenta para otras áreas que no necesariamente están destinadas al consumo de productos y servicios, como por ejemplo en campañas desarrolladas por organizaciones sin ánimo de lucro cuyo objetivo es fomentar la responsabilidad social ambiental y ecológica.

¿Qué aporta el Diseñador en una campaña de responsabilidad social para el medio ambiente?

El aporte del diseño en campañas sociales, ambientales y ecológicas puede ser de gran utilidad para lograr una comunicación efectiva. Gracias al conocimiento del diseñador en el manejo de estrategias visuales, una organización no solamente podrá comunicar de manera adecuada sus campañas, sino que logrará administrar mejor sus recursos económicos. Para conseguirlo es necesario que los integrantes de la organización trabajen en conjunto con el diseñador en una correcta planeación de las piezas gráficas que se van a elaborar. Esta planeación involucra procesos de investigación, análisis y clasificación de la información y además la implementación de una metodología de trabajo en donde todos puedan aportar ideas.

¿Qué pasa si no se involucra el diseño en estas campañas?

El no involucrar al diseñador en la planeación y desarrollo de una estrategia de comunicación, puede traer como consecuencia una serie de resultados no deseados.

¿Imaginan una situación en la cual se escribe un informe muy denso sobre el impacto ambiental que tiene la basura y luego se muestra en una presentación de PowerPoint (sin ningún tipo de normas de diseño) a un grupo de estudiantes de colegio?; lo más probable es que los estudiantes no retengan toda esa información y el objetivo buscado de generar conciencia ecológica y ambiental se haya perdido. En cambio, si en esta misma situación si se emplean piezas gráficas adecuadas (guías ilustradas, presentaciones multimedia, infografías, etc.) para mostrar de una forma más “digerible” y didáctica todos esos datos, los estudiantes posiblemente demuestren más interés y entiendan mejor lo que se les está comunicando.

Folletos, Plegables, libros, postales e infografías para campañas ambientales sobre los humedales de Bogotá en Colombia. (Crédito: fotos postales Thomas McNish)

Beneficios de involucrar al diseño en la responsabilidad ambiental:

En resumen, aprovechar las habilidades y el conocimiento de un diseñador no solo beneficiaría a la organización que realice las campañas de responsabilidad social ambiental, sino que sería un beneficio general para todos los grupos y/o comunidades a los que estén dirigidas esas actividades porque podrán entender mejor las temáticas que se aborden, adquirir conocimiento en factores que afectan al medio ambiente y descubrir posibles soluciones para aportar a la preservación de su entorno. Los beneficios puntuales son:

• Mayor comprensión de los materiales
• Facilidad de lectura
• Facilidad de explicar conceptos complejos o extensos
• Los materiales se hacen mucho más llamativos
• Se pueden generar soluciones adaptadas a los medios de distribución (por ejemplo interactivos para museos, carteles para exposiciones, infografías para dar clases, etc.)
• Se generan materiales que pueden ser compartidos fácilmente por diversos medios (email, redes sociales, mano a mano, etc.)

Ejemplo de una infografía creada por Infotipos sobre los humedales de Bogotá (click para ampliar)

¿Cómo me puede ayudar Infotipos en una campaña de este tipo?

En Infotipos nos preocupamos sobre el tema de la responsabilidad social ambiental y ecológica, por eso parte de nuestra filosofía de empresa es apoyar campañas que estén destinadas a generar conciencia con respecto al manejo adecuado de los recursos naturales. Ofrecemos nuestra experiencia en comunicación visual con el objetivo de enviar mensajes directos y entendibles a través de materiales gráficos (impresos y digitales). Por esta razón, si perteneces a una asociación, fundación u organización que participa en procesos sociales y ambientales o ecológicos, puedes comunicarte con nosotros (da click aquí para ir a nuestra forma de contacto, o manda un mail a contacto@infotipos.com) para que te brindemos consultoría en tus proyectos y te diseñemos las piezas gráficas que necesites asegurándote un manejo adecuado de la información para que llegue efectivamente a los usuarios que requieres.

Para este artículo nos enfocamos en analizar los portales o páginas web del Gobierno Federal de México. Este caso es curioso ya que se puede tratar como si fuese un mega portal y que cada subsección del mismo es la dependencia de una página de gobierno (SCT, Telecomm, CAPUFE, etc). A pesar de las dimensiones del proyecto, la imagen del gobierno federal, está claramente estipulada y definida, cada secretaría tiene su propio color e identidad, pero en conjunto mantienen una uniformidad bastante clara en cuanto a tipografías y estilos gráficos.

Uniformidad en títulos

Sin embargo el caso de las páginas web o portales es bastante curioso ya que parece como si cada página hubiera sido elaborada por gente distinta tratando de emular la imagen general. Esto resulta bastante obvio al hacer una comparación lado a lado de las páginas, incluso el simple hecho de abrir varios de estos portales en un navegador, puede delatar los errores en los que han caído:

No hay uniformidad en títulos ni favicons

Como se puede ver en la imagen de arriba, no hay uniformidad en los títulos de las páginas, ni en los favicons (pequeñas imágenes que se muestran al lado del nombre). Algunas no tienen título (y se puede ver solamente la dirección web), otras no tienen favicon, y en general todas están redactadas de diferente forma.

Análisis del cuerpo de las páginas web

En el caso del cuerpo de las páginas las inconsistencias son mucho más obvias, a continuación las analizaremos brevemente por medio de la imagen que hicimos (dar click para verla en completa en grande):

Análisis de los portales del Gobierno de México

1. Encabezados: Si se ponen lado a lado los encabezados, se puede notar de inmediato que intentan seguir una misma línea pero que cada uno lo hace a su modo. Algunos cambiando la tipografía que usan para el título, otros moviendo el formulario de búsqueda (y poniendo el botón de búsqueda de diferentes colores), y algunos otros colocando un logotipo mal proporcionado o que se sale del tamaño que debería tener.
2. Imagen de portada: La imagen principal que se usa como destacada en cada portada tampoco es consistente entre los portales, en algunos casos está mal su tamaño y queda desproporcionada, en algunos otros ocupa más o menos espacio del que debiera.
3. Últimas noticias: En este apartado al parecer cada portal le dio el estilo que quiso a las noticias. Algunos con fondo en degradado, otros con divisiones, cada portal eligió, las tipografías en colores diferentes.
4. Subsecciones del portal: Esta pequeña sección varía tanto en estilos que no pareciera que se tratara de la misma en ningún caso. Algunas usan íconos, otras simplemente son listados, cada portal le dio los márgenes que quiso.
5. Íconos de seguimiento y sociales: Cada portal tiene una sección en la que enlistan de qué forma el usuario puede seguirlos en redes sociales. Ponen unos pequeños íconos que en cada portal resultan ser diferentes aunque lleven a los mismos servicios. Y no hay consistencia en cuanto a los servicios ofrecidos.

Conclusiones

Tal como se mencionó, se trata de un proyecto bastante grande, pero por lo mismo debería llevar muchísimo cuidado en esos detalles. Sobre todo tratándose de la cara que le da el gobierno a sus ciudadanos. Lo que más extraña en este caso es que seguramente se tenía una plantilla bien definida para que cada sitio fuera diseñado así, pero es muy probable que al momento de desarrollarlos, no se haya tomado en cuenta o se hayan pasado por alto estas revisiones. Todos estos errores sin duda le quitan profesionalismo y credibilidad a los portales del gobierno, y por ende afectan la imagen que los ciudadanos tienen sobre el mismo.

Esta mini consultoría con estos portales de gobierno, es un ejemplo de lo que Infotipos podría hacer por su empresa, para ayudarle a mantener una imagen que refleje el verdadero valor de su negocio y sobre todo para generar la confianza necesaria para que sus clientes consuman sus productos y servicios. No dude en contactarnos (medios de contacto) si desea que colaboremos con usted realizando una revisión o consultoría del estado actual de su página web o cualquier otro producto de diseño.