() translation by (you can also view the original English article)
Los juegos o kits de UX y UI (Experiencia de Usuario e Interfaz de Usuario en español) ayudan a los diseñadores de varias formas y en diferentes etapas del proceso de diseño. En este resumen, te mostraré algunos de los kits de UX y UI más vendidos disponibles en Envato, para que puedas empezar a crear esquemas, elaborar prototipos y diseñar tu próximo sitio web o aplicación.
¿Qué son los juegos de UX y UI?
Los siguientes juegos o kits son una excelente forma de empezar tu proceso de diseño. Pueden servirte como inspiración, una forma de presentar rápidamente una idea a un cliente o para brindarte información básica para un diseño completo. Por lo general, están disponibles para Sketch, Adobe Illustrator y otros, y se proporcionan de una manera lógica con carteles, estilos y símbolos, para ayudarte a encontrar y trabajar con los elementos que busques.
Algunos son multipropósito y proporcionan una enorme cantidad de elementos, otros son específicamente para elaborar esquemas, otros son más especializados y atienden a categorías como comercio electrónico, redes sociales, mapas y navegación, bienes raíces, interfaces para móviles, etcétera.
SketchCómo organizar tus estilos y símbolos de Sketch como un profesional
SketchConsejos para trabajar con mesas de trabajo y capas en Sketch de forma eficiente
WireframingGuía de wireframing para principiantes
Aplicaciones de diseño soportadas
Cada kit mencionado aquí es compatible con al menos una de las siguientes, y por lo general más:
- Sketch
- Adobe Photoshop
- Adobe Illustrator
- Adobe XD
- Figma
- InVision
En la actualidad, puedes abrir un archivo de Sketch en Sketch (obviamente), Adobe XD, Figma e InVision sin ningún problema.
Adobe XD también manejará los archivos de Photoshop, manteniendo las mesas de trabajo, las capas y los activos lo más fielmente posible a los originales.
Axure es un poco menos compatible con otros formatos, pero sin importar la aplicación para la que fue creado un kit, existen bastantes posibilidades de que sea compatible con la herramienta de diseño que elijas.
¿UX y UI son lo mismo?
Los términos UX y UI con frecuencia se usan indistintamente. Si bien existen algunos cruces, y los dos trabajan juntos, no significan lo mismo
Cuando nos referimos a un kit de UI, estamos hablando de activos que se pueden usar para diseñar una interfaz de usuario. Esto significa diseñar la presentación, la estética, cómo aparece visualmente una interfaz de usuario. Los activos de un kit de UX, por otra parte, se utilizarían para diseñar la experiencia de un sitio web o una aplicación. Piensa en esquemas y prototipos. La usabilidad, el flujo, la interacción entre usuario y producto.
Los juegos de UX y UI pueden servir para ambos propósitos, por lo que a menudo se denominan colectivamente "Kits de UX y UI".
Kits de UX y UI en Envato
Tenemos cientos de kits de UX y UI en Envato Market y en Envato Elements (donde puedes descargar tantos como desees por un bajo precio). ¡Veamos algunos de los más populares!
1. Wireland (Sketch)
Su nombre lo dice todo; Wireland tiene que ver con los esquemas. Viene con más de 200 diseños predefinidos, y hay una cierta cantidad de detalles, que te ofrecen más que fidelidad, pero la estética azul tranquilizante y despejada es perfecta para wireframes.
Incluye una biblioteca de dispositivos, elementos de markup para mostrar el flujo, utiliza símbolos y se basa en el grid familiar de Bootstrap. Por último, también hay una muestra gratuita que puedes descargar y probar antes de comprar la versión con licencia completa.
2. Userflow & Sitemap (Photoshop e Illustrator)
Diseñar el flujo del usuario es una parte muy importante del proceso de diseño. Ocurre desde el principio, y sucede rápidamente. El Kit de UX de Userflow & Sitemap para sitios web tiene todos los elementos que podrías necesitar para hacer esto: una colección de pantallas y gráficos para que puedas esquematizar cómo se mueven los usuarios de una parte a otra en un sitio web.
Tiene una versión oscura y otra versión clara, dependiendo de tu preferencia, pero eso es tan complejo como las decisiones visuales. ¡Toma algunas pantallas, bájalas, enlázalas!
3. Bolder: UI para móviles (Sketch)
Bolder es un kit de interfaz de usuario que ofrece 65 diseños para móviles de muy alta calidad, que cubren una variedad de nichos como redes sociales, comercio electrónico y blogs. Bolder tiene un gran dinamismo en franjas y está organizado de manera práctica con mesas de trabajo, capas, símbolos y estilos tipográficos, lo que le facilita el trabajo a cualquier diseñador de IU para móviles.
4. Kama Kit de UI para iOS (Sketch)
Kama está diseñado específicamente para iOS. Incluye más de 120 pantallas, dándole a los diseñadores de aplicaciones bastantes opciones para chart layouts, recorridos, comercio electrónico, multimedia, perfiles de usuario, navegación y redes sociales, también contiene 60 iconos personalizados.
5. Farah (Sketch, XD, Figma)
Farah es realmente sorprendente. Tiene 15 diseños móviles de alta fidelidad, todos completamente personalizables, y todos con un estilo muy contemporáneo. Es una adición relativamente nueva en Envato Market, que refleja la demanda actual de varias aplicaciones de diseño al atender específicamente a los usuarios de Sketch, XD y Figma.
Si está buscando un estilo audaz y confiado, este es una gran opción para aplicar a tus diseños.
6. MIGO Kit de UI para app de citas (Sketch, XD, Figma)
MIGO es otro diseño audaz y enérgico creado por hoangpts. Diseñado para una aplicación de citas, le otorgará colores vibrantes a tus diseños, degradados y una cordial calidez . Contiene 22 pantallas para iOS de alta calidad (listas para iPhoneX) y es compatible con Sketch, XD y Figma.
7. Stamp (Sketch)
Stamp es otra opción de alta fidelidad que brinda a los diseñadores más de 75 "tarjetas" de diseño, creadas con más de cien componentes diferentes.
Personaliza con Stamp, en vez de crear desde cero, y rápidamente tendrás un diseño web completo y moderno.
8. Ultramarine Kit de UI (Sketch)
Me gusta este. Particularmente porque ese ultramarino realmente se ve poderoso con el verde lima. Nuevamente, esto es algo de "alta fidelidad", por lo que no es tanto para la etapa de diseño de UX de un producto, sino más bien para añadir una apariencia elegante. Dicho esto, tiene una apariencia fuerte (y muy completa) brindando más de 120 componentes para utilizar en tus diseños.
9. Next Ecommerce (Sketch, Photoshop)
Si disfrutas crear tus diseños en Photoshop, Next Ecommerce te da esa opción. Con 35 archivos en PSD y Sketch, hay abundantes elementos de interfaz móvil para experimentar.
10. Doom (Photoshop)
Otra opción para Photoshop, Doom es un kit de IU francamente enorme. Te brinda casi 100 diseños en PSD, incluyendo páginas de inicio, páginas internas, abarcando todo tipo de nichos, y es el primero de nuestros ejemplos que incluye opciones de panel de administración.
Doom también incluye bastantes diseños para sitios de criptomonedas (si eso es lo tuyo), por lo que si estás diseñando una página de aterrizaje para la próxima gran moneda, ¡este es un excelente lugar para comenzar!
11. Blokk Wireframe Kit (Photoshop)
Blokk es otro kit para Photoshop, que ofrece una interfaz de usuario simple para fines de wireframing. Desprovisto de detalles innecesarios, Blokk te ayudará a tomar decisiones fundamentales desde un principio en el proceso de diseño.
Esta es una colección muy grande, que te brinda más de 170 tarjetas UI y prueba su gama de elementos con seis páginas de muestra. Ofrece los siguientes componentes (y aún más):
- Galería de medios
- Características
- Llamados a la acción
- Blog
- Comercio electronico
- Testimonios
- Tablas de precios
- Analíticas
¡Aprovecha un kit de UX/UI hoy!
Ya sea que estés en las primeras etapas de un diseño y necesites algunos gráficos para tus esquemas, o estés puliendo la estética final de un prototipo o estés buscando inspiración para tu próximo proyecto, los juegos o kits de UX y UI pueden ser realmente útiles (¡y muy divertidos!) para cualquier diseñador web o de aplicaciones.
Todos los artículos que se enumeran aquí están disponibles en Envato Market, ¡pero no te olvides de revisar también la oferta masiva de Envato Elements!
Estaremos actualizando esta lista de manera regular
Déjanos saber en los comentarios cuáles son tus favoritos, recomienda tus propios kits y comparte cualquier consejo que puedas tener. Estaremos actualizando esta lista a medida que pase el tiempo y así mantenerla lo más actualizada y relevante como sea posible.
