31/03/2022

Oye, designer.

 

¿Tú te consideras designer?

Y digital además.

No pasa nada, somos tus fans. Necesitamos gente como tú para que navegar por internet sea una experiencia inteligente, bonita, intuitiva, and why not, elegante.

Pero además nos gustaría que tuvieses en cuenta que intentamos desarrollar productos digitales responsables con el medioambiente, así podemos conectar lo hacemos con lo que nos preocupa.

Ahora bien, podemos plantar todos los arbolitos que queramos pero si no hacemos un trabajo fino y lo entregamos a tiempo de nada servirá tener un bosque con nuestro nombre en él.

Hablamos WordPress, Woocommerce, Invision, Sketch, Adobe, Vanilla js, Laravel, Json, Lumen, Responsive, Media query, Javascript, JQuery, React JS, MySQL, Mongo DB, OOP, CSS, CMS, SEO, PHP, etc.

Pero también hablamos Figma. Y Figma.

(Si todavía diseñas webs con Photoshop haznos un favor y vete a la sala donde se reúnen los fans de Macromedia Freehand, ellos te ayudarán).

Ahora sí, te invitamos de todo corazón a revisar los siguientes puntos, son claves para que tu trabajo cumpla las expectativas que están puestas en él.

 

1. Usamos Odoo.

Si no te gusta, nos parte el corazón.

Hay un montón de empresas fantásticas donde puedes usar tu herramienta favorita o abrazar el caos en ellas.

Si trabajas con Gold, no tendrás más remedio que pasar por el aro. Nosotros lo utilizamos para organizar todo lo que hacemos, y nuestros clientes también.

Allí se apunta el tiempo que le dedicas a cada proyecto, es donde están las tareas repartidas, las fechas importantes y espacio para todo el material necesario.

Márcalo como favorito y entra cada día, sisplau.

 

2. Somos perfeccionistas. Mucho.

No te imaginas cuánto.

Por eso no competimos con gente que hace webs por 500€.

Esto significa que cogemos una página y la redimensionamos hasta la saciedad. Desde pantallas 4K hasta un Apple watch.

Así nos aseguramos de que el trabajo que hacemos se ve perfecto en cualquier resolución. Incluso en la pantalla del portátil del cliente, que suele tener la peor de todas las resoluciones del mercado. C’est la vie.

Si no fuéramos tan perfeccionistas nos tendríamos que llamar Silver o Aluminium.

 

3. Chá. chá chá.

Nos hemos estrellado muchas veces en la pista de baile y ya tenemos un método que nos funciona. Queremos que funcione para ti también.

No empieces a diseñar si Óscar o David no te explicado el contexto, las herramientas y la forma en la que vamos a abordar cada proyecto. Luengo con todo el equipo de Gold revisarás el brief, las referencias, las propuestas creativas y feedbacks de clientes. Hay un momento para cada cosa que te permite hacer mejor la siguiente.

Por ejemplo: no wireframes, no game.

Luego buscaremos referencias juntos, se las enseñaremos a cliente en un Moodboard para que opine sobre el territorio que estamos buscando. Y finalmente hacemos una propuesta de Diseño.

Wireframes, Moodboard, Diseño. Chá, chá, chá.

Ok?

 

4. Módulos. Módulos. Módulos.

Y los montamos en Wordpress como piezas de lego.

Trabajamos creando módulos reaprovechables, escalables, que funcionan bien en desktop y mobile, la idea es que puedan cambiar de orden, quitar o repetir y el diseño siempre debe responder de forma eficiente sin romperse.

Para conseguirlo sigue estas simples instrucciones:

A_ Cuando trabajas en un módulo, no pases al siguiente hasta que ese módulo funcione bien en todas las resoluciones de pantalla.

B_ Asegúrate de seguir las instrucciones del punto A.

C_ Asegúrate de seguir las instrucciones del punto B.

D_ Asegúrate de seguir las instrucciones del punto C.

 

5. ¿Responsive? Nah, liquid.

Los templos se construyen sobre columnas, pero una web necesita algo más.

Las columnas sostienen, pero no encarcelan, úsalas para diseñar webs, pero sobre todo usa tu imaginación para proyectar el comportamiento de las imágenes o el texto al aumentar y reducir la ventana del navegador, y también al usar el dedo o el ratón para interactuar.

No dejes que un programador se invente los breakpoints que te ha dado pereza diseñar, bastante trabajo tendrá en hacer realidad tu proyecto.

Mira estos ejemplos de webs mega flexibles:

https://manoverboard.com/hello/

https://wearedigitalfreelancers.com/

A continuación tienes unos puntos a tener en cuenta.

 

Strict

Este diseño tiene su forma fija y no se ajusta al cambiar el tamaño de la pantalla. Optamos por formatos fijos cuando queremos garantizar que tu experiencia sea consistente, sin importar en qué dispositivo estés interactuando. Esta elección es ideal para mantener la uniformidad y asegurar que la presentación siempre sea clara y efectiva.

En particular, esto es crucial para las tablas de datos y los gráficos. Estos elementos requieren un diseño firme para asegurar que todo se mantenga legible y funcional, incluso en diferentes tamaños de pantalla. Así, aunque el diseño no se adapte, es para preservar la calidad y la facilidad de uso de la información que te proporcionamos.

Adaptive.

Un diseño adaptativo es aquel que cambia completamente según el formato en el que se presenta. Por ejemplo, ofrece experiencias diferentes dependiendo de si accedes desde un ordenador de escritorio, una tableta o un dispositivo móvil. Esta flexibilidad permite que el contenido se ajuste perfectamente a cada pantalla, mejorando tu experiencia de usuario.

Sin embargo, esta capacidad de adaptarse a diferentes dispositivos puede incrementar los costos, ya que requiere reconstruir la misma funcionalidad para múltiples formatos. A pesar de ello, el beneficio de ofrecer una experiencia más personalizada justifica la inversión para asegurar que cada usuario disfrute de la mejor versión posible del contenido.

 

Responsive.

Un diseño adaptable es fluido y capaz de ajustarse a diferentes tamaños de formato. Esta práctica es muy común en la web y se ha vuelto indispensable también en las aplicaciones nativas, especialmente ahora que las variaciones en el tamaño de las pantallas son cada vez mayores. Esta flexibilidad permite desarrollar una característica una sola vez y esperar que funcione bien en cualquier tamaño de pantalla.

Sin embargo, hay un inconveniente importante: las interacciones con el tacto y el mouse son muy diferentes, y adaptar una aplicación para que funcione bien en todos los dispositivos y casos de uso puede resultar costoso. A pesar de esto, el esfuerzo suele merecer la pena para asegurar una experiencia de usuario coherente y accesible en cualquier dispositivo.

 

Breakpoints.

Trabaja sobre 360px (mobile) y 1280px (desktop y tablet) con dos breakpoints: Uno entre 360px y 768px. y otro entre 768px en adelante (hasta 3840px)

Por lo tanto comprueba que el diseño se vea bien en:

360px

1280px

1440px

Más de 2560px hasta 3840px

Si te parece exagerado siempre podemos añadir un Watch de apple a la ecuación.

#justsaying

 

7. ¿Y las fuentes?

Usa fuentes variables, porque si quieres un diseño flexible mejor que empieces eligiendo bien la tipo.

Un ejemplo: https://fonts.studiofeixen.ch/

Cuantas menos fuentes tenga un diseño, más eco friendly es.

(Si tu creatividad acaba de sufrir un colapso, recuerda que hay una sala de fans de Macromedia Freehand donde se resuelven estos problemas).

En Gold desarrollamos proyectos responsables con el medio ambiente, y si una tipo menos significa un árbol más pues ya sabes. Go green!

Por cierto, nos gustan los textos grandes porque la tipografía también es un recurso gráfico. Titulares grandes, cuerpo de texto de 16px para arriba. Sin miedo.

 

8. No todo es coser y cantar, hay que saber bordar botones.

Diseñar botones es un arte  y es muy fácil hacerlo mal.

Basta en hacerlos como los hace todo el mundo y listo, ya tienes botones pequeños, con mala legibilidad y con un UI que da pena. Hay que currárselo un poco más, tu abuela estará orgullosa de ti.

 

9. Diseño y Desarrollo son dos pedales de una misma bicicleta.

Trabajamos en equipo, en una carrera por hacer el mejor trabajo posible dentro del timming que tenemos.

 

10. La distancia más corta entre dos puntos distantes es una sonrisa.

¿Estás de acuerdo?

Genial.

Anda, sé amable y ayúdanos a crear un ambiente positivo y respetuoso, entre nosotros y con los clientes.

Love is in the air, has como los developers... just breath deep.