Saltar al contenido

Directoriux

Bienvenido al directoriux, mi directorio de recursos, utensilios y herramientas UX gratuitas o con opciones gratuitas para diseñar la mejor experiencia de usuario posible. Por supuesto este directorio está en constante revisión y se actualizará con el tiempo.

** Si consideras que me dejo algún recurso con opción gratuita por enlazar, puedes sugerírmelo abajo en la sección de comentarios para que lo enlace.

Educación

Educación

Sitios webs más que recomendables en los que aprender sobre diseño de experiencia de usuario, diseño de interfaces gráficas, redacción UX, diseño centrado en el usuario o en los que practicar competencias útiles para el diseño UX /UI

Diseño UX / UI

18F Methods

Web con información muy útil sobre el método Human-Center Design

https://methods.18f.gov/

Built for Mars

Web en la que ponen estudios que han hecho de productos digitales famosos

https://builtformars.com/

Design Toolkit de la UOC

Fichas informativas con información muy valiosa

http://design-toolkit.recursos.uoc.edu/es/

Good UI

Web donde ver resultados de Tests A/B de empresas top

https://goodui.org/

Growth Design

Web para aprender UX / UI con casos de uso reales

https://growth.design/

Interaction Design Foundation

Web con artículos y cursos creados por gente top del sector

https://www.interaction-design.org/literature

Laws of UX

Web para aprender las leyes psicológicas más importantes para la UX

https://lawsofux.com/

Nielsen Norman Group

Web con artículos y cursos creados por gente top del sector

https://www.nngroup.com/articles/

Styleguides

Repositorio de recursos para aprender UX / UI

http://styleguides.io

Toptal

Plataforma para freelancers pero con un blog muy educativo

https://www.toptal.com/designers/blog

UX Colective

Artículos con información muy útil sobre el mundo UX / UI

https://uxdesign.cc/

UX Mastery

Web con artículos y podcasts para aprender de diseño UX / UI

https://uxmastery.com/

UX Movement

Artículos con información muy útil sobre el mundo UX / UI

https://uxmovement.com/

Ux Pro

Web con pocos pero interesantes artículos sobre diseño UX / UI

https://uxpro.cc/

UX Stack Exchange

Foro especializado en diseño UX / UI

https://ux.stackexchange.com/

Juegos

Can’t unsee

Juego para entrenar el ojo con buenas prácticas UI

https://cantunsee.space/

Color method

Juego para mejorar el reconocimiento de colores y sus modificadores

https://color.method.ac/

Foont.co

Juego para aprender a diferenciar entre algunas de las tipografías más famosas

https://foont.co

Is centred that

Juego para aprender a ver cuándo un elemento está centrado

https://www.supremo.co.uk/designers-eye/

Pixact.ly

Juego para aprender a visualizar áreas en píxeles

https://pixact.ly/

Shape method

Juego para dominar las tipografías

https://shape.method.ac/

The bezier game

Juego para dominar la herramienta pluma

https://bezier.method.ac/

Retos

Daily UI

Un reto al día para practicar tus capacidades UI

https://www.dailyui.co/

Sharpen Design

Web que te lanza retos de Branding, Marketing y UX /UI

https://sharpen.design/

UX Challenge

Retos de diseño UX para practicar cómo solucionar problemas

http://www.uxchallenge.co/

UX Writing

Can’t unsee

Guía de consejos documentados para escribir en web

https://readabilityguidelines.co.uk/

Facilitador

Facilitador del trabajo

Sitios webs con herramientas o micro herramientas para facilitarnos el trabajo de diseño UI y de intereacciones facilitándonos el crear animaciones o assets, gestionar el color o hasta preparar presentaciones para los stakeholders

Color

Color Slurp

Programa para generar colores, crear paletas y comprobar contraste

https://colorslurp.com/

Diseño

Bannery

Web para crear imagenes para RRSS fácilmente y con elementos 3D

https://bannery.app/

Clipdrop

Web y plugin para eliminar el foreground de una imagen

https://clipdrop.co/

Formaty

Web para conocer las equivalencias de los tamaños de papel

https://formaty.info/es

Pitch

Web para hacer presentaciones vistosas de forma simple

https://pitch.com/

Smart Upscaler

Web para redimensionar imagenes sin que pierdan calidad

https://icons8.com/upscaler

SocialSizes

Plataforma web para crear imágenes para redes sociales

https://socialsizes.io/

Watermark removers

Herramienta para eliminar las marcas de agua de las fotos de stock

https://www.watermarkremover.io/

Get Waves

Herramienta para diseñar olas en svg sin romperse la cabeza

https://getwaves.io/

Infografías

Flourish

Web para hacer infografías interactivas con las que sorprender a stakeholders

https://flourish.studio/

Producción

Whatruns

Plugin para navegadores que sirve para conocer la tecnología detrás de cada sitio web

https://www.whatruns.com/

Adobe PDFs

Plugin para navegadores que sirve para conocer la tecnología detrás de cada sitio web

https://www.adobe.com/es/acrobat/online/jpg-to-pdf.html

I love PDFs

Muchas opciones para editar y convertir PDFs

https://www.ilovepdf.com/es

Variado

Omatsuri

Webapp con varias herramientas para facilitarte el flujo de trabajo

https://omatsuri.app/

Tiny Helpers

Web con muchas herramientas para facilitar el trabajo

https://tiny-helpers.dev/

Vídeo

Unscreen

Web para eliminar el fondo de clips de vídeo

https://www.unscreen.com/

Inspiración

Inspiración

Sitios que usar como referencia para evitar bloqueos creativos, para saber cómo abordar un proyecto o simplemente para aprender y mejorar viendo lo que otros nos proponen.

Color

Coolors

Web con información muy útil sobre el método Human-Center Design

https://coolors.co/

Picular

Web en la que ponen estudios que han hecho de productos digitales famosos

https://picular.co/

UI Gradients

Fichas informativas con información muy valiosa

https://uigradients.com/

Consejos

Ask Playbook

Consejos para orientar tu carrera dentro de la industria UX / UI

https://askplaybook.com/

Diseño

Dribbble

Plataforma para inspirarse en diferentes tipos de diseño

https://dribbble.com/

Muzli

Web y plugin para inspirarse en diferentes tipos de diseño

https://muz.li/

Savee

Plataforma para inspirarse en diferentes tipos de diseño

https://savee.it/

Collect UI

Plataforma para inspirarse en diseño UI

https://collectui.com/

Mobbin

Web con pantallas de apps de marcas famosas

https://mobbin.design/browse/android/apps

Portfolios

Bestfolios

Plataforma para inspirarse en diferentes tipos de diseño

https://dribbble.com/

Case Study Club

Web que recopila cases studies de internet

https://www.casestudy.club/

Cofolios

Web y plugin para inspirarse en diferentes tipos de diseño

https://muz.li/

Tipografías

Wordmark

Web para comprobar cómo queda una palabra en distintas tipografías

https://wordmark.it/

Productividad

Productividad

Herramientas para ser más rápidos o como mínimo hacer menos tediosa la tarea de diseñar

SVG Artista

Permite simples animaciones con el trazado y el relleno de un svg

www.svgartista.net

Checklist Design

Lista de tareas de las diferentes páginas a diseñar para que no se nos pase ninguna

https://www.checklist.design/

Playbook

Web de almacenamiento en la nube con hasta 4Tb gratis para artistas

https://www.playbook.com/

Station

Programa para gestionar muchas apps y cambiarlas rápidamente

https://getstation.com/

Zeroheight

Web para publicar fácilmente el sistema de diseño. La opción gratuita está bastante capada

https://zeroheight.com/

Recursos

Recursos

Enlaces a webs menos conocidas que las archiconocidas Unsplash, Freepik o Pixabay que nos aporten recursos como fotografía, ilustraciones, iconos, vídeo, gráficos 3D o incluso música para que podamos completar cualquier proyecto UX / UI con éxito.

Gráficos

Freebies UI

Web con recursos para usar en diferentes softwares

https://freebiesui.com/

Haikei

Generador de patrones para usar por ejemplo como fondos

https://haikei.app/generators/

Rawpixel

Banco de recursos bastante completo con fotos, ilustraciones, iconos y tipografías

https://www.rawpixel.com/

Reshot

Web con ilustraciones e iconos tanto individuales como en pack

https://www.reshot.com/

Sketch App Sources

Web con recursos para usar en Sketch

https://www.sketchappsources.com/

UXcrush

Directorio de recursos de figma

https://www.uxcrush.com/

Vecteezy

Buen banco de imágenes para fotos y vectores

https://www.vecteezy.com

XD Guru

Web con recursos para usar en Adobe XD

https://www.xdguru.com/

XD Resources

Web con recursos para usar en Adobe XD

https://xdresources.com/

Gráficos 3D

3D Icons

Muchos gráficos 3D de código abierto

https://3dicons.co/

Free 3D icons

Conjunto de iconos en 3D para descargar

https://free3dicons.com/

Vertex

Respositorio open-source de gráficos 3D editables

https://vertex.im/

Wannathis

Respositorio con recursos 3D gratis y de pago

https://wannathis.one/

Iconos

Anron

600 iconos gratis en diferentes estilos

https://www.anron.pro/

Basicons

Web para descargar +300 iconos en diferentes tamaños y ancho de trazo

https://basicons.xyz/

Evericons

Repositorio de más de 460 iconos de calidad

http://www.evericons.com/

Feather Icons

Repositorio de iconos

https://feathericons.com/

Flat icons

Web para descargar iconos en formato png o también svg con cuenta pro

https://www.flaticon.com/

Heroicons

Iconos básicos muy fácilmente copiables

https://heroicons.com/

Iconic

Web con no muchas opciones gratis pero donde visualizar cómo quedan con fondos

https://iconic.app/

Iconly 2.3

Biblioteca de iconos en Figma

https://www.figma.com/community/file/876509330914541878

Iconoir

Web con muchos iconos con trazo ajustable

https://iconoir.com/

Ionicons

Repositorio de iconos en trazo y con relleno

https://ionic.io/ionicons

Keyicons

Conjunto de iconos

https://keyicons.com/

Octicons

Repositorio de iconos creado por Github

https://primer.style/octicons/

Phosphor icons

Muchos iconos con estilos y color ajustable

https://phosphoricons.com/

Pixelart icons

Respositorio con recursos 3D gratis y de pago

https://pixelarticons.com/

Radix Icons

Respositorio con recursos 3D gratis y de pago

https://icons.radix-ui.com/

Remix Icon

Web con muchas variantes de cada icono

https://remixicon.com/

SVG Repo

Web desde la que descargar más de 300.000 iconos y vectores

https://www.svgrepo.com/

Tabler Icons

Web con iconos con trazo y color ajustable

https://tablericons.com/

Icon Finder

Repositorio de iconos e ilustraciones en 2D y 3D

https://www.iconfinder.com/

Twemoji

Repositorio de emojis open-source de Twitter

https://twemoji.twitter.com/

Ilustraciones

Blush

Web con ilustraciones editables de estilo corporativo moderno

https://blush.design/es

Open Peeps

Web con ilustraciones editables de personas

https://www.openpeeps.com/

Shape

Banco de recursos con ilustraciones e iconos

www.shape.so

Mockups

Clean Mock

Web donde subir capturas de pantallas y poder bajarla metida en un mockup

https://www.cleanmock.com/

LS Graphics

Web con recursos gráficos y mockups gratis y de pago

https://www.ls.graphics/free-mockups

Mockup World

Web con mockups gratuitos

https://www.mockupworld.co/

Mockups Design

Web con mockups gratuitos

https://mockups-design.com/

UI Kits

OS Dashboard UI kit

Kit UI open source con elementos customizables

https://dashboardsdesign.com/

Free Dashboard UI kit

Kit UI con elementos para crear dashboards

https://freedesignresources.net/free-online-courses-dashboard-ui-kit/

E Learning UI Kit

Kit UI con elementos para plataformas de aprendizaje online

https://freedesignresources.net/free-e-learning-ui-kit/

Unit System

Kit UI muy completo

https://unitsystem.pro/

Untitled UI kit

Kit UI muy completo

https://www.untitledui.com/

Vídeo / Música

Coverr

Kit UI open source con elementos customizables

https://coverr.co/es

Videezy

Kit UI con elementos para crear dashboards

https://www.videezy.com/browse

Videvo

Kit UI con elementos para plataformas de aprendizaje online

https://www.videvo.net/

Mixkit

Kit UI muy completo

https://mixkit.co/

Sistemas de Diseño

Sistemas de Diseño

Los sistemas de diseño que conozco. Úsalos para aprender, para profundizar en los componentes, tokens e instrucciones y para inspirarte. Además, muchos los podrás descargar como UI kits para usarlos en tus proyectos.

Atlassian DS

Sistema de diseño de Atlassian

https://atlassian.design/

Base Web

Sistema de diseño de varias empresas como Uber

https://baseweb.design/

California DS

Sistema de diseño del gobierno de California

https://designsystem.webstandards.ca.gov/

Carbon

Sistema de diseño de IBM

https://www.carbondesignsystem.com/

Fluent

Sistema de diseño de Microsoft

https://www.microsoft.com/design/fluent/#/

Garden

Sistema de diseño de Zendesk

https://garden.zendesk.com/

GEL

Sistema de diseño de la BBC

https://www.bbc.co.uk/gel

Human Interface Guidelines

Sistema de diseño de Apple

https://developer.apple.com/design/

Lightning DS

Sistema de diseño de Salesforce

https://www.lightningdesignsystem.com/

Material Design

Sistema de diseño de Google para Android

https://material.io/resources

Plural DS

Sistema de diseño de Sngular

https://pluralds.sngular.com/

Pluralsight DS

Sistema de diseño de Pluralsight

https://design-system.pluralsight.com/

Polaris

Sistema de diseño de Shopify

https://polaris.shopify.com/

Service Manual

Sistema de diseño del gobierno de Reino Unido

https://www.gov.uk/service-manual

Spectrum

Sistema de diseño de Adobe

https://spectrum.adobe.com/

USWDS

Sistema de diseño del gobierno de los E.E.U.U

https://designsystem.digital.gov/

Visual Language

Sistema de diseño de Airbnb

https://airbnb.design/building-a-visual-language/

Wonderflow

Sistema de diseño de Wanda

https://design.wonderflow.ai/

Software

Software

Enlaces a otras potentes herramientas para completar nuestra labor fuera de Sketch, Figma y la Creative Suite de Adobe. Con ellas podrás animar, colaborar dentro de tu equipo de UX o con stakeholders, hacer UX research y mucho más.

Animación

Principle

Programa para editar interacciones y flujos de pantalla en Mac

https://principleformac.com/

Haiku Animator

Simple y gratis editor de motion graphics para Mac

https://www.haikuanimator.com/

Colaboración UX

Figjam

Webapp de Figma para colaboraciones online en directo con varias plantillas

https://www.figma.com/figjam/

Freehand

Webapp para colaborar online en directo. Tiene muchas plantillas

https://www.invisionapp.com/freehand

Mural

Webapp con whiteboard y plantillas para colaborar online en directo

https://mural.co/

Whimsical

Webapp para colaborar online en directo. Tiene plantillas de 5 formatos

https://whimsical.com/

Investigación

Hotjar

Webapp para entender mejor a tu audiencia con insights

https://www.hotjar.com/

Suzy

Webapp para entender mejor a tu audiencia con insights

http://remoteresearch.com/

User Testing

Webapp para entender mejor a tu audiencia preguntándole

https://www.usertesting.com/

User Zoom

Webapp para entender mejor a tu audiencia preguntándole

https://www.userzoom.com/es/

Otros

Balsamiq

Programa para crear wireframes de baja fidelidad y compartirlos

https://balsamiq.com/

Play

App de iOS para diseñar apps directamente en el móvil

https://www.createwithplay.com/

Spline

App completamente gratuita para crear gráficos 3D

https://spline.design/

Zeplin

Programa para tener la entrega a desarrolladores ordenada

https://zeplin.io/

Zeroheight

Web para publicar fácilmente el sistema de diseño. La opción gratuita está bastante capada

https://zeroheight.com/

5 comentarios en «Directoriux, Recursos UX UI Gratis»

  1. Excelente aporte, no soy desarrollador web, en cambio soy desarrollador Mobile y considero que me es de mucha utilidad muchas de las herramientas de UI/UX que presentas en esta web.

    Lo mejor de todo es que está todo en un solo sitio web; Gracias por eso

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *