Diseño Web: Diferencia entre Wireframe, Mockups y Prototype

En LiOnline, antes de comenzar a desarrollar una página/sistema web, utilizamos algunas herramientas que nos permiten “bosquejar” lo que queremos construir, estas son: “sketchs” “wireframes“, “mockups” y/o “prototipos“. Éstas nos facilitan la comunicación con el cliente pues él puede visualizar cómo quedaría el producto que desea (antes de invertir tiempo en desarrollar) y dar sus comentarios/sugerencias las cuales se traducen en mejoras y/o cambios ¡a tiempo!.

En [1] nos dicen resumidamente cuáles son las ventajas de estas herramientas:

  • Generar una lluvia de ideas (brainstroming) para definir qué expectativas tiene el cliente del producto a ser desarrollado.
  • Ahorro de dinero/tiempo en la fase de desarrollo
  • Describir claramente qué es lo que necesita ser desarrollado
  • Usado para captar inversionistas, primeros clientes y/o co-fundadores, por ejemplo a través de aceleradoras de startups.

Nuestro proceso para el diseño de una página web es el siguiente:

  • Reunión preliminar con el cliente en el que nos cuenta las necesidades de su negocio y cómo le gustaría que sea su sitio web. A mano alzada realizamos un bosquejo de la web y sus funcionalidades, tomamos apuntes y damos sugerencias (Sketch)
  • De acuerdo a los requerimientos levantados durante la reunión preliminar y a la evaluación de los sitios webs de la competencia, proponemos la estructura o esqueleto del sitio web (Wireframe). El cliente podrá evaluarlo y solicitar las modificaciones pertinentes.
  • Luego de aprobado el wireframe, éste es explicado al diseñador gráfico que ¡hará su magia! y nos entregará cómo se verá la web o mejor dicho la representación visual de la web (textos con los tipos de letras y colores que forman parte del branding del negocio, imágenes,  íconos, logos, etc.) (mockups). En este fase, los diseñadores gráficos utilizan sus conocimientos de buenas prácticas de User Interface (UI).
  • Lo siguiente es el desarrollo de un prototipo (prototype), este paso es opcional según [1] [2] y efectivamente en nuestro equipo de trabajo lo hemos aplicado en pocas ocasiones. El prototipo es nuestro mockup pero enriquecido con piezas de User Experience (UX), en donde el usuario puede interactuar por ejemplo dando clic a botones, enlaces, ver animaciones, etc. ¡Ojo! el usuario sentirá que está utilizando la versión final sin embargo aún no hay funcionalidad, pues solo son piezas conectadas entre sí [2].
  • ¡Finalmente viene lo bueno! ¡A programar! y aplicar todos nuestros conocimientos de HTML, CSS, jQuery, php, frameworks, bibliotecas, APIs o más! ya sabiendo cómo debe verse y cómo debe funcionar.

Ejemplo de nuestro cliente BYC – Grupo Inmobiliario

Seguro que hasta este punto ya tienes una idea en qué se diferencia cada término. A continuación vamos a ver más a detalle qué son y qué softwares existen para crearlos.

Leer más

¡Yo también puedo cantar!

Este 2018, surgió una actividad que nunca pensé envolverme: Participar del Coro de la Escuela Libre de Música (ELM) de la Orquesta Sinfónica de Limeira-SP. ¿Cómo llegué ahí? ¿es en serio Pamela, tú que apenas sabes do-re-mi-fa-sol-la-si?. Yo no busqué clases, simplemente pasó.

Una amiga quiso unirse a unas clases de violín del ELM y me pidió ir a preguntar por informes pues ella no estaba en la ciudad esos días. Fui y pregunté, infelizmente era necesario pasar por un test de violín en una fecha en la que ella aún estaría fuera. Bueno, cuando ya me iba a ir vi que habían más talleres disponibles entre ellos “coro”. Me detuve y pensé:

“No tengo nada que perder, si paso la audición bien y si no pues no pada nada”

Me preparé con un clásico de la música criolla peruana: “La Flor de la Canela”. Yo admito que no tengo preparación alguna de canto, pero siempre recuerdo a una compañera que hacía maestría en música (hoy ya magíster) decir “Todos podemos cantar” … hoy le doy la razón. Pasé la audición para ingresar al taller de “Coro Iniciante”. Resalto las iniciativas de cultura por parte de la Prefeitura de Limeira – SP, pues pone a disposición talleres como estos de forma gratuita a los que vivimos en esta ciudad.

Leer más

¡Alerta de Trackeadores!

Hoy me llevé un susto.

Alguien me dijo prácticamente “Sé lo que hiciste el verano pasado”. Las personas se están poniendo paranoicas con tantos plugins que para mí es una invasión a la privacidad.

Tener por cerca a una persona acosadora es realmente de temer. Alguien que sabe si leíste o no su e-mail, alguien que hace un seguimiento exhaustivo de tus movimientos en la red, no tiene otro nombre que … no lo diré mejor, cada quien coloque el adjetivo que desee.

Whatsap y Facebook poseen configuración de privacidad: Deseo mostrar mi hora de conexión? Deseo dar a conocer si leí o no el mensaje?. Bueno, Facebook no es un buen referente de seguridad de información (plop!), pero por lo menos sabemos que existe la opción.

Yo he probado Mailchimp y sí puedo hacer un tracking de los e-mails de campaña y existe un disclaimer para indicar ello. Sin embargo, que alguien sepa cuántas veces entraste a su mensaje (no necesariamente leer, porque ya estoy acostumbrada a “ver” sin leer cuando son cosas absurdas o SPAM) y que encima te diga “yo sé que me lees”: es de terror.

Alguien creó MailTrack, oh sí, alguien sin que tú lo hayas decidido (ni siquiera tener la oportunidad de aceptar o rechazar) sabe todos los movimientos que hagas sobre su mensaje

Pero se puede evitar 🙂

Leer más

Día Mundial de la Concientización del Autismo

Todo papá y mamá quiere lo mejor para sus hijos. Cuando uno es primerizo(a) muchas veces se “obsesiona” por proteger (o sobreproteger) a sus pequeños lo cual hace que actuemos sin reflexionar, llevados por nuestro incipiente “instinto paternal”. Incluso, nos hace ver una realidad distorsionada:
“Si tu hijo estornuda, no! no esta muriendo”
“Si tu hijo llora, no! no quiere decir que le han pegado”
“Si tu hijo, pone un cubo sobre otro, no! no quiere decir que es un superdotado”
“Si tu hijo tiene una pequeña cicatriz/costra/picazón, no!, no quiere decir que es el fin del mundo”
“Si tu hijo se ensucia jugando, no! no es culpa de la persona que lo esta cuidando”
“Si tu hijo pelea con otro niño, no podemos juzgar a ese otro tildándolo de ‘malcriado’.
 
Les comparto este link sobre padres primerizos, les va a sacar una que otra sonrisa 🙂
Y es así que para evitarle vivir en esa realidad:
  • Queremos encerrar al niño(a) en una burbuja
  • Reaccionamos violentamente con aquellos que han tenido algún contacto con el niño(a) como niñeras, familiares y/o amigos. Culpándolos y llamándolos de “mala influencia”
  • Asfixiamos a nuestro hijo, con la consigna de que es “por su bien”
Eso no quiere decir que tampoco nos vamos a descuidar. Solo que tomemos las cosas con calma, no seremos ni los primeros ni los últimos padres en el mundo que pasen por situaciones “difíciles”.
Narraré un poco de mi experiencia como mamá, específicamente en un tema: “Trastorno del Espectro Autismo” siendo hoy 2/4 (ayer) el día de la Concientización sobre el autismo.

Leer más