Estrategia | entradas
Clerk.im gestión en línea para servicios de alojamientos
Publicado por jbarahona el 31 de July de 2010
Sin Comentarios Categorías: Ajax, Código, Diseño Front, Diseño de Interfaces, Estrategia, Experiencia de Usuarios, Iniciativas, Ruby on Rails, Usabilidad, XHTML
El pasado viernes 30 de julio, a las 19:00 hrs. liberamos Clerk.im, servicio en línea para la gestión de hoteles o cualquier servicio de alojamiento como campings, hostales, residenciales, etc.
Con Clerk.im colocamos nuestro know-how al servicio de soluciones web-based que a la vez sean novedosos y útiles. Buscamos que nuestras aplicaciones sean sencillas, rápidas y eficientes para nichos específicos.
Al igual que Google, Salesforce o 37Signals, desde hoy AyerViernes diseña y programa aplicaciones que estén en la nube, muchas de ellas freemium y de distribución mundial.
El valor de los contenidos en los medios digitales
Publicado por kexss el 04 de June de 2010
Sin Comentarios Categorías: Diseño de Interfaces, Estrategia | Tags: contenidos información
Esto no debe ser nuevo para nadie, sin embargo es un error que se comete a diario:
De nada sirve un sitio lleno de herramientas dinámicas y de interacción, más un potente diseño gráfico, si no se puede encontrar ningún contenido de valor en él.
Fuerte es para los que diseñamos estrategias y entregamos plataformas comunicacionales, ver cómo un sitio puede cobrar vida con un buen manejo de sus contenidos, o ver cómo este mismo puede estancarse o decaer hasta perder su sentido y objetivos fundamentales.
Las empresas o instituciones deben utilizar los espacios digitales para comunicar a sus clientes o usuarios los productos y servicios que ofrecen, las investigaciones en las que participan y, mediante la conversación en espacios digitales, revelar la humanidad y la esencia de su identidad, de esta manera mantener siempre una oferta de valor coherente y transversal.
Hacerse cargo de esto, significa conformar equipos generadores de contenidos, reunir o crear material multimedial, mantener un seguimiento o trackeo de lo que ocurre en las redes y estudiar las nuevas oportunidades en el medio. Este equipo es la infraestructura básica requerida.
Los contenidos bien conformados le dan a las instituciones diferenciación en el mercado, sobre todo considerando que los consumidores son cada vez más exigentes y no dudan en buscar en otros lado si no reciben lo que esperan. Como bien dice JC Camus en su libro Tienes 5 segundos, “La paciencia no es una característica que los usuarios de computadores conectados a Internet hayan desarrollado; más bien es la impaciencia lo que les caracteriza”. La información, por lo tanto, debe ser cada vez más específica y segmentada a los usuarios y público objetivo.
Diseñar para individualidad y sentido de pertenencia
Publicado por kexss el 28 de May de 2010
3 Comentarios Categorías: Diseño de Interfaces, Estrategia | Tags: escuelas, facultades, postgrados, udd, universidad
Con la Universidad del Desarrollo nos enfrentamos inicialmente al desafío de re-crear su identidad digital mediante su sitio corporativo. En él debíamos reflejar todos los valores que como intitución defienden y venlan a diario, y relacionarlo con la imagen corporativa ya existente. La participación de alumnos en esta etapa fue fundamental para identificar otros atributos y valores de la universidad, que para ellos fueran relevantes y que debiese transmitir el re-diseño y que no estaban necesariamente relacionados a los conceptos de la institución.
Se trata de conciliar dos visiones (interna y externa) para mostrar coherencia y solidez en el mensaje. Desde los contenidos, el cambio debía llevar a mostrar argumentos concretos que den valor a los trabajos de la universidad y de sus alumnos. No sólo se destacan los logros, sino también el proceso que se recorrió para llegar al éxito. De ahí, que cada destacado en la página de inicio vincule siempre a una noticia con más información o una página interior que refuerce el contenido.
En la etapa de estrategia, se decidió potenciar el hecho de ser una Universidad que constántemente está haciendo, creando, organizando y siendo anfitrión de eventos, que es otra de sus fortalezas. Para ello, se crearon tres tipos de páginas de inicio, que re-distribuyen los contenidos con mayor o menos énfasis entorno a un tema, pudiendo ser utilizadas de acuerdo a momentos especiales “Admisión” o a un “hito” en particular. De esta manera, se destaca información y se transparenta el pulso de la Universidad.

De ese modo se fue creando la primera etapa, la identidad de la universidad como un todo.
Una vez con el sitio corporativo en marcha, se continuó con el siguiente desafío: ¿Cómo crear pertenencia en todas las facultades, carreras, postgrados sin pasar a llevar la individualidad de cada una?
Se parte entendiendo que el individuo es una unidad que es parte de algo mayor, por lo tanto para crear individualidad, debe haber pertenencia. Nuestros individuos son, en este caso, las carreras, y hay en ellas cierta esencia que distingue una de otra: su vida universitaria, su malla curricular, sus autoridades.
Por un lado, sabemos que un potencial alumno de publicidad no quiere que su futura carrera sea representada igual que derecho. Por otro lado, tampoco una carrera debe distinguirse tanto, al punto de desprenderse de la Institución. Es necesario que al entrar al sitio web se perciba la relación con la Universidad inmediatamente.
¿Cómo diseñamos pertenecia?
Bajo estructuras o grillas similares, donde sólo los módulos y sus contenidos varían. Todos los espacios de navegación son fijos, manteniendo un modo de uso constante e identificable en cada uno de los sitios.
¿Cómo diseñamos individualidad?
Todas las carreras tienen las mismas funcionalidades en su sitios, sin embargo, la visualización de estos elementos varía según los estilos diseñados.
- Los colores de cada facultad se aplicaron a sus carreras asociadas
- Existe la posibilidad de personalizar menús, fondos, imágenes y elementos de la página de inicio
Los elementos personalizables permiten que cada carrera pueda apropiarse de su nueva herramienta y ajustarla de la mejor manera, de acuerdo a sus necesidades. A la vez, la libertad controlada permite que el sitio no se exponga a quedar desequilibrado, ni con errores de diseño.
Usabilidad, accesibilidad y eficiencia ante la emergencia del terremoto
Publicado por jbarahona el 04 de March de 2010
2 Comentarios Categorías: Arquitectura de la Información, Código, Diseño Front, Estrategia, Experiencia de Usuarios, Iniciativas, Research, Usabilidad

Chile es un país de emergencias naturales, en especial de sismos. Hoy, todos estamos haciendo algo para ayudar a superar los efectos del terremoto del 27 de febrero y que afectó fundamentalmente a la zona central y sur de nuestro golpeado país.
A horas de ocurrido el terremoto varios emprendedores digitales empezamos a pensar, por separado cómo podríamos ayudar con lo que sabemos hacer. Algunos hicieron importantes sitios web que muestran distintos recursos para ayudar, donar dinero, sangre o localizar el estado de las carreteras. Otros suben fotos, muchos -casi todos- tuiteamos con #terremotochile
Es tan grande la cantidad de información que circula digitalmente que le quisimos dar sentido desde el usuario y sus intereses en localidades específicas.
Surgió entonces la idea de geolocalizar la información para ordenarla y sobre todo personalizarla desde los intereses de los usuarios en ciertas localidades aplicando, a su vez filtros de los temas más recurrentes en ésta emergencia.
Se hizo un barrido de los temas y palabras más usadas en distintos medios, como diarios electrónicos, Google, Yahoo, Facebook y Twitter para cruzarlo con las localidades más afectadas. De esta manera, un usuario puede leer todo lo que se dice de una localidad en particular sobre los keywords más usados y relativos al terremoto como son “buscapersonas”, “personas”, “perdidos”, “ayuda”, etc.
La Arquitectura de la Información nos entregó la visión de cómo indexar los contenidos para diseñar su consumo.
El Diseño Visual debía ser muy googleano, quiere decir muy usable y accesible con ciertos toques simples de interfaz pero eficiente y efectiva.
A su vez el desarrollo exigió al máximo a Front ya que había que hacerlo en 1 día, pero sobre todo exigía de los conocimientos en código y programación a Felipe y Basilio.
El resultado es un agregador que en este momento suma noticias de medios específicos, fotografías y tuits indexados en las palabras más urgentes y útiles. Cada localidad, en la medida que aparecen en internet notas o tuits específicos de ese lugar, inmediatamente se activa -si es que no está- en el índice de la home. A su vez, cada lugar tiene un RSS lo que permite llevarse ese feed a cualquier otro agregador y estar enterado específicamente de lo que se habla de esa localidad chilena.
Nos sentimos orgullosos de EmergenciaChile.info pero sobre todo nos sentimos en deuda en mejorarlo, hacerlos más efectivo y eficiente y sobre todo ayudar a vivir mejor ésta emergencia sísmica.

Tarjetas de Presentación diseñadas con Processing
Publicado por Estefanía Trisotti el 30 de January de 2010
10 Comentarios Categorías: Estrategia
Debido a la buena acogida que tuvimos con el diseño de nuestras tarjetas de presentación (y que actualmente estamos reimprimiendo ya que se nos agotaron) decidimos escribir un post acerca de cómo las hicimos, ya que al contarlo nunca nos entendieron del todo.
La idea fue hacer de algo simple -como unas tarjetas de presentación- algo innovador y personalizado. Partimos estableciendo que ninguna tarjeta fuera igual a la otra, ya que somos una empresa relativamente pequeña, donde cada uno es importante. La idea derivó a que cada tarjeta tuviera el rostro de la persona presentada, con una trama negra inspirada en el fondo del sitio de AyerViernes.
Desde un inicio, definimos graficar las caras en base a pequeños círculos de diferentes diámetros. El primer intento fue tomar una foto y aplicarle filtos en photoshop, para que quedara 100% contrastada y creada en base a círculos. Después de varias modificaciones el intento no funcionó, ya que los bordes quedaban poco definidos y la calidad era insuficiente para enviar a imprenta. Con la misma idea en mente, sumado a la dificultad de que ahora debían ser construidos con vectores, Herbert Spencer tuvo la (genial) idea de manipular las fotografías en processing. En base a un sencillo código que programó, es posible convertir una foto en una trama de círculos, ajustables según su tamaño y espacio entre ellos.
Resumimos aquel proceso por pasos:
- Conseguir una foto de la persona. Ideal que el fondo sea limpio/homogéneo.
- Descargar processing. Luego descargar el código de la trama realizado por Herbert para aplicar el filtro de los círculos, y guardar en una carpeta la cual debe tener una subcarpeta con el nombre “data”, que es donde s ubica el bitmap de entrada.
- Abres en el programa y el código. Los parámetros están comentados por lo que es fácil jugar modificándolos. (mínimo debes reemplazar el nombre del jpg y el nombre del PDF de salida). Hacer click en el ícono de “play” y el sistema genera el PDF, que posteriormente es editable en Illustrator.
- Al tener la imagen definitiva, seleccionas los puntos de la persona, y lo encajas en el archivo donde están los demás datos (en este caso las tarjetas). En el ejemplo, la capa la imagen de la persona está simulado color rojo.
- Finalmente, las tarjetas fueron impresas en papel couché de 350 gramos, Polimatte por tiro y retiro más barniz serigráfico por tiro. El polimate le da la opacidad al negro, mientras el barniz le da el brillo a la trama creada en processing.
¿Simple, no? la idea es demostrar que desde el pensamiento abstracto y matemático, el campo de desarrollo de processing es ampliamente artístico y creativo. Si estás comenzando a usar processing -que para goce de todos es código abierto- será útil que hagas click acá.
SoyDigital 2010 liberado
Publicado por jbarahona el 06 de January de 2010
Sin Comentarios Categorías: Estrategia, Research, SoyDigital 2010
Está liberado “SoyDigital 2010, reporte de Experiencia de consumo en Chile”
- Reporte SoyDigital 2010, completo (PDF 4.2 Mb.)
- Imágenes y gráficos (Flickr, imágenes individuales)
- Hazte fan en Facebook y sigue todo lo que viene
- Síguenos en Twitter (#soydigital)


















Todos los contenidos están licenciados bajo una