Archivo para la categoría diseño web

Echamos a volar la web de ‘alviento’

Ponemos alas a la creatividad de Iana Pérez, colega, amiga, diseñadora e ilustradora sevillana radicada en Cádiz.

Iana bien podría ser parte de la familia extendida de tactilestudio. Vamos a intentar convencerla este verano en la playa de Tarifa… 😉

La web recoge una selección de sus trabajos realizados en Sevilla, Barcelona, México y Tarifa.

Anuncios

,

Deja un comentario

Creatividad solidaria para la Fundación Pare Manel

tactilestudio ha colaborado con la Fundación Pare Manel en la realización de la nueva web. El trabajo ha sido fruto de una coincidencia, de un feliz encuentro. Mientras nuestro amigo Oscar Valiente  buscaba ayuda para sacar adelante este proyecto de la Fundación, en tactilestudio decidíamos que al menos, un proyecto al año, tendría carácter solidario.  Así que cuando nos lo comentó, no dudamos ni un segundo y le dijimos…Oscar, no busques más, somos tu equipo.

Y así, disfrutando como niños, como siempre, Joan Redolad puso su arte y Jordi Valls, la programación.

, ,

Deja un comentario

www.continuara.org

Continuarà Comics es una de las tiendas emblemáticas del cómic en Barcelona. Con más de 30 años de historia en el sector, obtuvo en 2009 el premio a la mejor librería especializada en cómics, premio que concedía por primera vez el Salón del Cómic de Barcelona.

En tactilestudio hemos diseñado su web y tienda virtual que esta semana arranca su propia aventura…

, , ,

Deja un comentario

Enjoy HE (Héctor Engli)

Pasen, vean, escuchen… estamos de fiesta!

Ya está colgada la web de Héctor Engli, uno de los dj’s más cañeros de la noche barcelonesa. Un espacio para compartir con sus fans, para estar al tanto de sus próximas actuaciones o para disfrutar de sus sesiones más logradas.

Para la imagen de Héctor buscamos colores rotundos, predominio de negro (noche) y naranja (alegría, alegría) acompañada por elementos gráficos potentes y tipografía con carácter para remarcar la personalidad de este artista de los platos.

Buscamos entre los parientes “tactiles” la mano más adecuada para dibujar el logo HE. Con la propuesta de Sergi Prenafeta acertamos a la primera.

HEnjoy!

¡Bien familia!

Deja un comentario

Restaurante Romero ya tiene su web

Ya está. Otro proyecto cerrado. El Romero ya tiene su web.

Romero es el nombre que eligió Josete, José Antonio Camacaro, para pilotar desde los fogones  el  restaurant que ha abierto recientemente en el corazón del Eixample. Pensó en tactilestudio para diseñar la web. Tuvimos un par de reuniones, presentamos un proyecto, le gustó y adelante.  A trabajar. Contamos con un buen punto de partida, un local acogedor y cálido, decorado por la arquitecta Ana Páez y un logotipo estupendo creado por Paola Fornasaro, sumado al colorido de los platos de Josete. Pero para tener todos los ingredientes necesarios para hacer la web, convocamos a Maria Pujol que se encargó de la sesión de fotos que capturó perfectamente el ambiente y los detalles. Mezclamos sus imagenes con el logo, buscamos tipografías, tamaños, blancos, equilibramos puntos, comas, idiomas, lo unimos con cariño,  a fuego lento, hasta conseguir lo que queríamos junto a Jordi Valls.

Este es nuestro plato web para Romero y hoy está de estreno. ¡Qué gusto!

¡Buen trabajo familia!

Deja un comentario

Usabilidad en la tipografía

El tipo de letra y el cuerpo, la forma en la que discurre el contenido son factores que deben debe cuidarse a la hora de hacer una página más funcional para el usuario.

Hemos recogido algunos consejos que pueden servir:

  • Una tipografía “sans-serif” facilita la lectura en la pantalla. Arial, Helvética y Verdana son compatibles con todos los navegadores y muy usadas. (Google ha dispone un directorio de fuentes).
  • Un tamaño de fuente suficiente: de 9 a 16 píxel.
  • Ancho de texto fijo y de 700 px. máximo.
  • Un interlineado adecuado para una buena lectura, por ejemplo 1.65 em.
  • Frases breves y concisas. que resuman los puntos clave y vayan al grano.
  • Párrafos cortos, de menos de 5 líneas, a ser posible.
  • Corrige los textos, cuida la redacción y comprensión.
  • Resalta en negrita los conceptos principales de los textos densos.
  • Utiliza títulos y subtítulos concisos y descriptivos.

Deja un comentario

Usabilidad en los formularios

Los formularios suelen ser un auténtico quebradero de cabeza y lo menos agradecido para un diseñador web, pero no hay que perder de vista al usuario y nuestro objetivo final: hacer una página amable y funcional.

Lo ideal: minimalismo, seriedad y claridad. Hay que facilitar al máximo las cosas al usuario y hacérselo agradable para que el usuario tenga la mejor experiencia posible.

La mejora de la usabilidad de los formularios incidirá positivamente en la tasa de conversión de tu sitio web.

Algunos consejos útiles que hemos encontrado navegando por la red:

  • Flexibilidad en los requisitos: mantén los requerimientos de cómo se escribe la información lo más flexible posible. Por ejemplo, no obligues a poner los números de teléfono con un guión. Y, por favor siempre que haya algún tipo de restricción en los cuadros de entrada, añade la aclaración necesaria lo más cerca posible del cuadro.
  • Establece confianza: indica claramente qué es lo que vas hacer con la información personal del visitante. Declaraciones tranquilizadoras, como no hacer spam… Si es aplicable, puedes incluir iconos de confianza.
  • Etiquetas claras: las etiquetas de los campos de entrada deben ser claras en cuanto a cuál es la información real que se requiere.
  • Etiquetas de texto sobre el cuadro de campo: coloca cada etiqueta de texto encima del campo que presenta, en lugar de al lado.
  • Longitud adecuada de los cuadros de entrada: ddapta la longitud de los cuadros de entrada a la longitud de los datos a introducir.
  • Pide sólo la información necesaria: no requieras que los visitantes introduzcan información que no es absolutamente necesaria.
  • Permitir la tabulación entre los campos: permite a los visitantes reducir al mínimo el uso del ratón.
  • Orden de tabulación apropiada: haz que el orden de tabulación coincida con el orden en que los campos aparecen en la página.
  • Instrucciones necesarias: minimiza el uso de instrucciones. Utilízalas solamente cuando sea necesario. Cuanto más instrucciones, menos probabilidades de que sean leídas.
  • Instrucciones sobre el campo: cuando las instrucciones son necesarias, colócalas sobre el campo, no debajo.
  • Establece expectativas claras: es buena idea decir claramente a los visitantes que van a recibir, ya que hay más probabilidades de que proporcionen información adicional, si valoran lo que reciben a cambio de su información personal.
  • Mensajes de error amigables: el mensaje de error debe ser amable y educado.
  • Mensajes de error inmediatos y visibles: que los mensajes de error aparezcan inmediatamente y se puedan reconocer fácilmente. Lo ideal es que aparezcan en rojo.
  • Descripción clara del error: el mensaje de error debe describir exactamente cómo el visitante puede solucionar el problema.
  • Cursor sobre el cuadro: el cursor debe aparecer, a ser posible, en el cuadro de entrada que hay que corregir.
  • Conservar los datos con errores: cuando se cometen errores, todos los datos introducidos se deberían preservar para que el usuario no tenga que llenar el formulario de nuevo.
  • Proporciona un contacto o ayuda: es útil para los mensajes de error proporcionar medios para que los usuarios se pongan en contacto con alguien si el error persiste.
  • Elimina contenidos: puedes eliminar los elementos estándar del sitio, incluida la navegación, y dejar sólo lo imprescindible en las páginas de formulario y un en lace para volver. Todo ello también mejora la usabilidad.
  • Enlaza con la información de protección de datos: enlaza a las páginas de política de privacidad.
  • Página de verificación: proporciona una pantalla para confirmar todos los datos introducidos antes de finalizar el proceso. Los datos introducidos incorrectamente y que no se pueden modificar, suelen originar costes en la empresa, fácilmente evitables con esta opción.
  • Página de agradecimiento: una vez que el formulario está completo, devuelve al usuario una página que indica que el proceso esté completo. Esto puede ir junto con lo anterior ,en la misma página.
  • Alinea los campos verticalmente: es una buena idea apilar los campos del formulario en sentido vertical en vez de horizontalmente. Más claridad.
  • Menús desplegables, los justos: si utilizas menús desplegables en tus formularios recuerda: adáptalos al usuario y no al revés. Por ejemplo, para España, en la selección de país ofrece dos opciones: España y Spain.
  • Usa correctamente los botones de opción: no uses los botones de radio cuando hay más de una opción aceptable.
  • Campos con valores preestablecidos: ofrece a los usuarios campos con valores preestablecidos para reducir al mínimo el riesgo de recepción de datos en un formato incorrecto.
  • Suficientes opciones: las opciones deben ser lo suficientemente amplias como para que los visitantes no se quedan fuera de la gama ofrecida.
  • Señala los campos obligatorios: indica qué campos del formulario es obligatorio rellenar frente a aquéllos que son opcionales. Por ejemplo con un asterisco.

Deja un comentario

A %d blogueros les gusta esto: