Diseño de prototipos 5 aplicaciones que lo hacen mejor que Photoshop
Photoshop es una herramienta popular entre los diseñadores y sus extensiones, como CSS3Ps y FontAwesomePS, la convierten en una buena herramienta para crear prototipos de diseño web. Sin embargo, Realmente no fue creado para este propósito y a medida que las tendencias actuales avanzan con el diseño responsivo, los preprocesadores CSS, los marcos CSS y los gráficos con resolución independiente (SVG), Photoshop se está volviendo menos relevante para el diseño web.
No se preocupe, ya que hay muchas aplicaciones alternativas creadas por desarrolladores independientes para ayudar a llenar los vacíos. En esta publicación, echaremos un vistazo a estas aplicaciones y descubriremos hasta qué punto sus características sobresalen en comparación con Photoshop para crear prototipos de diseño web.
1. webflow
Webflow le permite diseñar sitios web arrastrando y soltando. Webflow crea el diseño basado en una cuadrícula Bootstrap para que el diseño de su sitio web esté listo para la respuesta. Webflow también incluye un conjunto de componentes web estándar, como bloques, listas y formato de texto que puede agregar al área de trabajo de Webflow..
Los estilos se pueden agregar fácilmente desde un panel lateral y también puede ajustar las propiedades de los elementos. Una vez que se completa el diseño, puede exportar los resultados del diseño al código HTML y CSS. También puedes compartir tu trabajo con un equipo..
2. Avocódigo
Avocode admite archivos PSD y le permite editarlo y transformarlo inmediatamente en un sitio web viable con HTML y CSS. Avocode extraerá todos los recursos de su proyecto, incluidos CSS, imágenes y SVG (si corresponde). Puede extraer fácilmente CSS, en forma de Menos, SASS o Stylus para cualquier capa seleccionada, ya que se ha integrado con CSSHat.
Además, Avocode está equipado con un control de revisión que te permite volver a tus diseños anteriores, en caso de que algo salga mal..
3. guacamayo
Macaw te permite diseñar diseños web y elementos web aas si estás trabajando en un editor de imágenes como Adobe Photoshop. Puede crear columnas o áreas de bloques, ajustar su posicionamiento y configurar la tipografía según sea necesario. La guacamaya le permite cambiar los estilos de múltiples elementos en un solo lugar. También puede utilizar la biblioteca para almacenar todos los elementos para su uso posterior.
Para crear un diseño receptivo, Macaw le permite establecer puntos de interrupción y optimizar su sitio para todos los dispositivos. Cuando se completa el proceso de diseño, Macaw puede generar HTML y CSS adecuados para usted.
4. bosquejo
Sketch es ideal para diseñar interfaces y sitios web. Crea objetos basados en vectores en lugar de en mapa de bits. Así, cuando redimensionas el tamaño del lienzo, tu diseño no pierde calidad. Las características como la 'cuadrícula incorporada' le ayudarán a organizar mejor el objeto o una ubicación de diseño web.
Además, Sketch procesa fuentes similares a las que se muestran en Webkit (piense en Chrome, Opera y Safari). Por lo tanto, no tiene que preocuparse por que los resultados del texto en la imagen no sean tan nítidos y precisos como el texto original que se muestra en el navegador. Sketch también puede exportar el CSS para cada elemento en la capa.
5. Antetipo
Antetype es una aplicación basada en vectores que se centra en el diseño visual, ideal para crear elementos de interfaz como degradado, sombra paralela, sombra interna, sombra de texto, estilo de borde y esquinas redondeadas. Antetype también proporciona cientos de widgets que puede usar directamente en su proyecto.
Para crear un diseño receptivo, puede establecer puntos de interrupción que ajustarán el tamaño de la pantalla. También puede exportar cada elemento en forma de una imagen o CSS.
