- Web
- |
- Alex Montejo
Herramientas para el diseño web y móvil que todo diseñador debe conocer
Publicado el 20-11-2020Conoce las herramientas que pueden ayudarte para tus proyectos de diseño web y móvil.
El mundo del diseño gráfico es inmenso pero cuando se junta con el diseño web puede ser mucho más, ¿y sabes por qué? Porque tienes que comunicarte con un programador y ambos deben estar en la misma sintonía para así crear un gran proyecto.
En Crunar usamos ciertas herramientas que nos ayudan a trabajar de la mejor manera el diseño web y móvil.
¡Te queremos compartir ese conocimiento!
Vamos allá entonces.
Herramienta número 1, ja, seguro ya la conoces, es tu pan de cada día.
Photoshop

Como todo buen diseñador sabes que esta herramienta es fundamental para el diseño gráfico y se complementa perfectamente para el diseño web.
¿Pero de qué manera podemos usarla a nuestro favor?
¿Conoces los grids?
¡Me imagino que sí!
Bien, en el desarrollo web hay una tecnología que se llama getbootstrap.com, la estructura de bootstrap para la maquetación de páginas web se basa en dividir la pantalla en 12 grids.

Ejemplo bootstrap división de pantalla en 12 grids.
Esto se ha convertido en un referente para la maquetación web, básicamente todo programador debe conocer esto, entonces como diseñadores es perfecto adaptarse a esta forma de trabajo, nos ayudaría mucho a hablar el mismo lenguaje de ellos y avanzar de una forma práctica y sencilla.
¿No sabes como hacer el grid en photoshop?
¡No te preocupes!
Aquí puedes descargarlo => Descargar PSD Bootstrap 4
Número 2
Adobe Color CC

¿Y qué es Adobe Color CC?
Así lo expresa Adobe
Color es una aplicación sitio web y una comunidad creativa en la que tú y otros artistas podéis crear y compartir temas de colores e inspiración
Con eso podemos darnos una idea que podemos realizar con la herramienta.
De igual manera la aplicación de Adobe Color CC mejora el color de tus fotografías, ya que analiza el tono de las ilustraciones y busca soluciones armónicas. Así, ayuda a la combinación de paletas cromáticas de forma armoniosa para cada uno de tus proyectos.
Imagina cuanto te ayudará para todos tus proyectos.
¡Además es completamente gratis!
Eso la hace aún mejor :)
Visitar => Adobe Color CC
No podría faltar esta herramienta.
Número 3
Google Fonts

Me imagino que ya la conoces y la has usado, es una herramienta muy completa y poderosa, no puede faltar para tu diseño web.
Es muy fácil de usar y muy intuitiva, si nunca la has usado ¡no te preocupes! la misma página te enseña cómo usarla.
Visita su página web Google Fonts
Número 4
Sketch

Sketch es actualmente es una de las aplicaciones de prototipado que mejores críticas recibe por parte de los diseñadores y profesionales de usabilidad.
Nos ayuda a crear prototipos de diseño web, iOS y Android. Solamente pesa alrededor de 41 MB, en comparación con 1.6GB de Photoshop, es decir, no consume recursos.
Tiene una interfaz de usuario familiar con una barra de herramientas, Navigator e Inspector, al igual que las aplicaciones OS X nativas.
Como resultado, los nuevos usuarios encontrarán a Sketch como una herramienta muy simple y fácil de usar.
Visita su página web Sketch
Para finalizar y como número 5 tendemos a
Adobe XD
 10_33_38.png)
Diseña como siempre imaginaste hacerlo
Esas son las palabras de Adobe XD y con mucha razón, la herramienta es completamente gratis y puedes conectarla fácilmente con Photoshop u otra herramienta de adobe.
En ella podrás crear prototipos, diseños de interfaces y diagramas para web o móvil.
Podrás implementar paneles de diseño y autoanimaciones, agregar estilos y elementos tipográficos.
Podrás optimizar tu trabajo en un 100%.
No esperes más y empieza a usar esta herramienta.
Visita su página web Adobe XD
¿Ya conocías estas herramientas?
Lo importante es utilizar la que mejor se adapte a tus necesidades.
Alex Montejo
¿Qué te inspira?
Blog relacionados
Nuevo blog
- Marca
- |
- Aylin
La nueva generación de marcas ya no piensa solo en logos
Durante mucho tiempo, en el diseño gráfico se nos hizo creer que una marca comenzaba y terminaba con un logo. Para muchas empresas, tener un símbolo atractivo era suficiente para “tener identidad”. Sin embargo, el panorama actual del diseño y el marketing digital cambió completamente esa idea. Hoy las marcas viven en múltiples espacios al mismo tiempo: redes sociales, aplicaciones, sitios web, videos, anuncios, empaques, presentaciones, contenido animado y experiencias interactivas. En medio de todo ese ecosistema visual, un logo por sí solo ya no puede sostener toda la personalidad de una marca. Aquí es donde aparece una diferencia fundamental que muchos clientes (e incluso diseñadores principiantes) todavía confunden: un logo no es lo mismo que un sistema de marca.
Nuevo blog
- Percepción
- |
- Jenny
Sobre evolución de marca: el caso Freepik y Magnific
No todos los rebrandings se perciben de la misma forma. Algunos entusiasman desde el primer momento, otros generan conversación. El paso de Freepik hacia Magnific no es simplemente un rebranding más dentro de la ola de la inteligencia artificial. Es un caso interesante y polémico de lo que sucede cuando una marca intenta evolucionar, pero en el proceso rompe la continuidad que había construido durante años.
Nuevo blog
- Identidad
- |
- Aylin
¿Cómo saber que es momento de un rebranding?
A veces no es tan obvio. Tu negocio sigue vendiendo, tienes clientes y todo “funciona” … pero algo no termina de encajar. El problema es que muchas marcas crecen, evolucionan o cambian, pero su imagen se queda en el pasado. Y ahí es cuando empieza el ruido: no conectas con público nuevo o simplemente no transmites lo que realmente eres hoy.
Nuevo blog
- Identidad
- |
- Jenny
El branding que no se ve: cómo las marcas están conquistando tus sentidos
Durante años, el branding fue un juego visual. Logos, colores, tipografías. Todo giraba en torno a lo que podíamos ver. Pero algo cambió. Hoy, en un entorno saturado donde todas las marcas “se ven bien”, la diferencia ya no está en lo visual… sino en lo que hacen sentir. Bienvenido al branding multisensorial digital.