Transcripciones
1. Avance: A veces me sale esa pregunta, ¿cómo encuentro clientes? O aún mejor, ¿cómo me encuentran? Mi respuesta es, crear un gran portafolio de UX mostrando tu trabajo y asegúrate de que realmente destaque el caso de estudio. Hola. Mi nombre es Patricia Reiners. Soy diseñador de UX/UI con sede en Berlín. Trabajo como diseñador freelance de UX/UI, creando experiencias interactivas para el futuro, para online, pero también para aplicaciones móviles. He podido trabajar con muchas empresas, como Google o Adobe. Pero también con start-ups, agencias, y negocios corporativos de todo el mundo. Mi trabajo está en constante búsqueda de nuevas formas de explorar, diseñar, y también de resolver problemas para el futuro. Me encanta compartir conocimientos a través de charlas, talleres sobre el futuro del diseño de experiencias. También estoy haciendo entrevistas para mi podcast llamado Futuro de UX. Lo que realmente me impulsó hacia adelante en mi carrera fue crear grandes casos de estudios de UX que realmente se defienden y atraen a los clientes con los que quiero trabajar. Me destacaron varias veces en Behance, lo que realmente me ayudó a promocionar mi trabajo. Yo estoy 100 por ciento cómodo de que tú puedes hacer exactamente lo mismo. Esto es lo que aprenderás en esta clase. Cómo diseñar impresionantes casos prácticos que atraigan a los clientes con los que quieres trabajar. Te guiaré a través de todos los pasos para crear un impresionante caso práctico de UX, cual estará listo para subir en tu sitio web, o Behance, o cualquier otra red social. Como material de bonificación, te compartiré consejos sobre dónde
promocionar tu trabajo y cómo promocionar tu trabajo en redes sociales, y cómo ser visto. También voy a compartir algunos secretos sobre cómo conseguir clientes. Esta clase es ideal para diseñadores de UX/UI que están construyendo su cartera y quieren conseguir clientes o conseguir un trabajo en experiencia de usuario. Este curso viene con un e-book digital, que es un PDF interactivo, o puedes imprimir y que te
guía a través del curso y a través de las diferentes tareas. También hay plantillas para ti que te ayudan a crear tu caso práctico de UX. Este curso viene también con dos maquetas las cuales están listas para acostumbrarse a tu caso de estudio. Estoy muy emocionado de que te estés uniendo a esta clase. Empecemos.
2. ¿Qué necesitas hacer?: Hola y bienvenidos a este curso: cómo crear impresionantes casos prácticos de UX. Me alegro súper de que te apuntes a este curso. Antes de empezar, me gustaría compartir algunas informaciones que te serán de gran ayuda. En primer lugar, lo que realmente necesitas tener para crear esos casos prácticos, y lo segundo es lo que realmente obtienes. Entonces todos los recursos que ya preparé para que sigas todos los pasos a lo largo. Integré diferente tarea en el curso por lo que te será fácil seguir y también crear tus casos prácticos en el sitio de este curso. El primero que necesitas es algún tipo de programa de diseño con el que podrás diseñar los diferentes pasos de tu caso práctico de UX. Usa el programa que quieras. Te puedo recomendar Photoshop, Illustrator o será XD. También creé una plantilla en Adobe XD la cual puedes descargar de forma gratuita y utilizarla. Esto te ayudará a empezar. El segundo que vas a necesitar es un proyecto para exhibir y accionar también, cual vas a integrar en el estudio de caso. Preparé una hoja de trabajo, un libro de estudio de caso para ti, por
lo que te será fácil seguir los pasos. También es un eBook digital, por lo que realmente no necesitas imprimirlo. Por supuesto, siéntete libre de imprimirlo si quieres pero no tienes que hacerlo. Simplemente puedes usar la versión interactiva porque todos los campos de entrada son interactivos. Usa eso como eBook. Descarga todo lo que necesites; el software o los recursos que estás obteniendo de mi lado y entonces estás listo para iniciar este curso.
3. Resumen: ¿ Qué vamos a hacer en este curso? Permítanme compartir algunas cosas antes de que empecemos. En primer lugar, vamos a hablar de casos prácticos de UX. ¿ Cuáles son los estudios de caso UX? ¿ Qué es importante y cómo integrar la narración en tus casos prácticos? Entonces vamos a hablar del contorno. Cómo podemos realmente crear contornos y buscamos de todas las cosas que hemos hecho en un proyecto UX. Después de eso, hablaremos muy a fondo sobre los pasos individuales y cómo presentarlos en su cartera en sus casos prácticos. Al final, vamos a hablar del diseño. Cómo realmente arreglar eso, cómo crear visuales, cómo llegar a maquetas, podría ser todavía así un PNG o también algunas maquetas animadas y animaciones y videos, así que vamos a hablar de eso también. Al final, voy a compartir alguna información extra sobre realmente cómo proporcionar o
cómo integrar las redes sociales en tus casos prácticos de UX. Cómo crear contenido para redes sociales, cómo sacar tu trabajo allá afuera, cómo conectar red, y cómo conseguir clientes.
4. Introducción: A menudo, pensamos que el trabajo de grado es sinónimo de sí mismo. Pero a partir de mi experiencia mostrando el proceso por el que pasaste, mostrando tus habilidades únicas, y creando un estudio de caso convincente realmente hace la diferencia de tener éxito y trabajar con los clientes con los que estás soñando en este momento. Tener un portafolio pasó de un agradable a tener a un imprescindible en el último par de años. Tu portafolio en línea puede ser visto como tu marca personal. Los clientes te encontrarán a través de tu trabajo en línea y muestra
tu estilo, tus éxitos, y te pueden ayudar a conseguir el trabajo que quieres hacer ahora. Todo lo que realmente necesitas para esta clase es un proyecto que terminaste, porque vamos a utilizar este proyecto para crear un estudio de caso. Paso a paso, te guiaré por las diferentes etapas y al final de esta clase, estará lista para poner en tu portafolio. Si no tienes un proyecto que terminaste ahora mismo, no te preocupes. Esta clase seguirá siendo muy beneficiosa para ti, pues al aprender a construir un estudio de caso, sabrás construir en el futuro y te será más fácil documentarlo desde el principio y reunirte la información correcta desde el principio cuando estés haciendo tu próximo proyecto. También preparé una hoja de trabajo para ti, que te guiará por la clase y te ayudará con los ejercicios que creé en esta clase. ¿ Cuáles son los estudios de caso? Generalmente son muy esenciales para conseguir que te contraten, porque los estudios de casos son una ventana a tu práctica profesional, y al mostrar cómo piensas, adaptas,
cooperas y, en última instancia, resuelves retos. Un caso práctico de UX tiene que contar una historia sobre ti. Al igual que todas las buenas historias, estudios de
casos se benefician enormemente de una estructura sólida que guía al lector a través de su pensamiento y sus experiencias, y sus problemas y cosas por el estilo. En esta clase, exploraremos cómo elaborar la estructura perfecta para un estudio de caso UX. Esta clase es generalmente para cualquier persona, principiante a avanzado, todo el que quiera aprender a crear casos prácticos que realmente se destaquen entre la multitud y te ayuden a conseguir clientes. Esta clase está especialmente diseñada para diseñadores de UX/UI, pero los investigadores de UX o diseñadores gráficos todavía la encontrarán muy beneficiosa también. Poner un poco de esfuerzo en tu cartera ahora mismo
hará una diferencia muy enorme a lo largo de tu carrera. Aquí hay algunas cotizaciones que encontré en el sitio web del Grupo Nielsen Norman de reclutadores de empresas tanto grandes como pequeñas. Veamos muy rápido lo que están diciendo, porque eso es realmente interesante. El primer presupuesto es de Melissa Perri. Es Gerente de Producto y Diseñadora de UX en Produx Labs. “ Quiero ver cómo piensas estratégicamente, cómo conectaste los puntos para aterrizar en la solución correcta. ¿ Cómo es tu proceso? ¿ Qué pasos tomaste para conocer más sobre tus usuarios?” El segundo presupuesto es de Rebecca Levi. Es Diseñadora de Productos UX/UI, Gerente
de Reclutamiento en Joanne Weaver Group. “ La narración es importante. El entrevistador quiere entender tu proceso, tu contribución al equipo, y cómo funciona tu mente”. Realmente me encanta esta tercera cita de Tom Cotterill. Es Reclutador de UX en Source FL. “ Tener un portafolio fuerte donde puedas hablar a través de todo tu proceso, no solo mostrando investigación, flujos de
usuarios, wireframes, etc., sino convirtiéndola en una historia, por ejemplo, por qué te mudaste a cada parte del proceso para que un gerente de contratación realmente puede meterse dentro de su proceso de pensamiento”. Definitivamente hay algunos patrones aquí. Reclutadores tanto de grandes como pequeñas empresas están súper interesados en lo mismo; tu pensamiento y tu proceso personal. Quieren que cuentes una historia sobre cómo abordaste los retos y problemas
previos de UX y cómo en realidad se te ocurrió toda la solución. Los casos prácticos de UX en tu portafolio son tu primera oportunidad para
contar a los reclutadores tus historias y explicar cómo piensas y solucionas problemas. Estas historias tienen que ser tangibles para que los reclutadores quieran conocer más sobre tu trabajo y tú también. El segundo realmente importante es el medio. Generalmente puedo recomendar un sitio web, para que la gente pueda encontrarte en línea. En cualquier situación que
estés, siempre lo tendrás contigo y es realmente fácil para la gente encontrar eso. Puedes usar un sitio web común llamado tú mismo o preguntarle a un desarrollador. También puedes subir eso en redes sociales como Behance, usar Adobe Portfolio, por ejemplo, y luego tenemos algunos otros proveedores como Squarespace o Wixx, por ejemplo, y no olvidar Wordpress donde tienes algunas plantillas para usar. Vamos a hablar un poco más de eso al final de esta clase. Generalmente, las carteras son muy diferentes, depende de qué tipo de diseñador seas,
cuáles son tus fortalezas, y lo más importante, cuáles son tus objetivos. Eso es realmente importante tener en cuenta. Antes de empezar, debemos estar 100 por ciento seguros nuestras metas y de lo que nuestra cartera realmente debe lograr. Mi recomendación es, revisa las descripciones actuales de los puestos que quieres obtener. ¿ Qué quieren? ¿Qué tipo de requisitos tienen? Los puedes encontrar realmente fácilmente en LinkedIn. Asegúrate de saber qué incluir en tu cartera, que sea más fácil para ti crear esos casos prácticos. Es lo mismo si buscas trabajo de tiempo completo o
buscas trabajo como freelancer en diseñador de UX/UI. Aquí viene la tarea. Antes de empezar con el estudio de caso, trate de responder a estas preguntas. ¿ Cuál es tu trabajo ideal? ¿ Qué tipo de trabajos te conseguiría la experiencia que deseas? ¿ Qué puedes traer a una empresa? ¿ Qué tipo de requisitos tienen realmente en este momento? Empecemos.
5. ¿Qué es un caso de estudio?: ¿ Qué es un estudio de caso? Generalmente, un portafolio consta de varios proyectos y se muestran aquellos proyectos trabajados a través de estudios de casos, donde se explica un poco más sobre todo el proceso por el que se pasó. Un estudio de caso puede ser visto como algún tipo
de proyecto o algún tipo de historia de ese proyecto. Muestra los detalles de tu proyecto desde el punto A, que suele ser el inicio, hasta el punto B, que en realidad es el resultado final. Especialmente para proyectos UX, el proceso es super, super importante. Un estudio de caso te da la oportunidad de mostrar el proceso, los requisitos que tienes, las metas, los retos, pero también la investigación que hiciste. ¿ Por qué todos necesitan eso? Si quieres conseguir un empleo,
podría ser un puesto de tiempo completo o incluso trabajar como diseñador freelance de UX, los gerentes de
contratación esperan que tengas un portafolio de casos prácticos. Entonces para clientes o gestores de contratación, es realmente importante entender cómo resuelves problemas, cómo piensas, cómo resuelves retos, y ese tipo de cosas. Especialmente hoy en día, es realmente importante destacar
como diseñador porque hay tantos diseñadores por ahí en todas las redes sociales, en tantos sitios web. Los estudios de casos también son realmente útiles para las entrevistas de trabajo. Cuando necesitas hablar de proyectos que hiciste hace unos años, no
tienes que recordar todos los demás pequeños detalles pero tienes todo ya estructurado en un caso de estudio, por lo que puedes guiarlos apenas a través de tu caso práctico y explicar un poco. ¿ Qué necesitas ahora para un estudio de caso? En primer lugar, necesitas un proyecto, y en segundo lugar, necesitas activos. Consulta qué tipo de recursos ya tienes. Eso podrían ser bocetos o imágenes o wireframes, todo, también fotos, cualquier cosa que nos ayude a mostrar el proceso por el que pasaste. Por supuesto, esto variará del proyecto que hiciste; los diferentes pasos por los que pasaste. Generalmente, los estudios de casos vienen en muchos formatos, cartera viene en muchos formatos y muchos tamaños. Eso podría ser un PDF, eso podría ser una página web o un sitio web u otras redes sociales. Por lo que es realmente útil tener una idea sobre el formato por adelantado. Es realmente diferente si creas eso como un PDF o un sitio web, así que asegúrate de que ya
pienses en cómo quieres exhibir esos estudios de caso por adelantado. Vamos a resumir esto realmente brevemente lo que es importante destacar en un estudio de caso UX. En primer lugar, piense en lo que realmente quieren los reclutadores. Necesitan apoyo para un equipo para un problema específico, y así están buscando
a alguien que sea capaz de resolver problemas y pueda apoyar al equipo. Entonces piensa en la experiencia que tienes. Tendrás que contar una historia sobre tus propias experiencias, tu propia carrera profesional, y dónde estás ahora mismo en tu carrera también. Punto muy importante es resolver problemas. Escaparate de que eres capaz de resolver los problemas para el equipo. Vamos a hablar un poco más en profundidad sobre cómo hacerlo en los próximos videos. Pero ese es un punto muy, muy importante a tener en cuenta. Otra cosa que realmente puedo recomendar es que pienses también en las otras redes sociales, o en crear visuales para otras redes sociales también. Esto es lo que vamos a hacer en esta clase también. Vamos a crear visuales para otras redes sociales, lo que podrás difundir la voz en diferentes canales sociales y poder vincularlos todos a tu portafolio.
6. Elegir el trabajo a exponer: Mi recomendación es solo mostrar el trabajo del que realmente estás orgulloso, así que no pongas todo en tu portafolio. Si quieres hacer más de un estilo específico, asegúrate de resaltar realmente ese estilo ahí. Es realmente importante tener en cuenta que los clientes o reclutadores juzgarán tus habilidades en función del trabajo que estás mostrando en tu caso que está en tu cartera. Me encanta esa cotización de Anton e Irene, “No pongas basura en tu cartera, lo contrario los clientes te contratarán por basura”. Eso es 100 por ciento cierto, también por mi experiencia. Ahora cuando estás eligiendo un proyecto, quieres construir tu caso de estudio, elige el que esté más cerca de tus clientes soñados o del que realmente estás orgulloso. Al final, tener alrededor de cinco proyectos es una cantidad realmente correcta, así que mejor tener unos cuantos grandes proyectos que una docena de proyectos simplemente bien o mediocres. Asegúrate de que solo estás poniendo tu mejor trabajo en tu cartera. Una pregunta realmente importante; ¿qué puedes hacer si no tienes un proyecto en este momento? A continuación te presentamos algunas recomendaciones. En primer lugar se puede rediseñar una aplicación o servicio web existente. Podría ser Spotify, podría
ser una app de entrega de alimentos, cualquiera que sea la app que estés teniendo en este momento, así que solo rediseña algo. Podrías crear un nuevo producto, un nuevo proyecto de un problema que estás teniendo todos los días por ejemplo, y pensar un poco en el futuro, por lo que resolver un problema para el futuro. También podría usar un proyecto escolar. Si estás justo fuera de la escuela o de la universidad, simplemente usa el proyecto que diseñas ahí o podrías diseñar algo
gratis para una organización sin fines de lucro por ejemplo y apoyarlos con tus habilidades de diseño.
7. Ejemplos: Echemos un vistazo a algunos ejemplos. Creo que es súper,
súper útil consultar portafolios que te gustan y obtener algo de inspiración. Hay algunos sitios que te puedo recomendar para que compruebes. Primero, Mejores folios, luego Awwwards con tres Ws, y Behance. Echemos un vistazo realmente brevemente sobre lo que están ofreciendo. Tengamos Best folios, y están teniendo un montón de carteras diferentes. Incluso puedes buscar áreas específicas. Vamos a buscar UX UI y diferentes carteras, y revisarlos donde indicaron, tal vez incluso cómo se les ocurrió lo visual también. Lo que puedes ver aquí es que la gente está compartiendo mucha información. Mucha información sobre la investigación que hicieron sobre las diferentes etapas y wireframes, incluso algunos bocetos tempranos lo cual es interesante, y también algunas animaciones en el medio. Además, un poco de texto donde están explicando las cosas un poco más en profundidad, por lo que es más fácil para el usuario entender lo que está pasando. También, algunos videos así con algunos wireframes tempranos, diría yo. Como se puede ver, al final
hay algunos lugares para llevar, por lo que realmente bonito estudio de caso, aunque el enfoque no es tanto en el área visual exterior. Echemos un vistazo rápido a Behance. Este es un lado realmente genial para todo tipo de proyectos. Allí encuentras una inspiración impresionante. Simplemente puedes desplazarte por el sitio web o ir a Descubrir, y luego buscar tus XI casos prácticos. En la parte superior, puedes buscar áreas específicas. Adobe XD, por ejemplo, o vamos a buscar interacción porque ahí se pueden encontrar todos los proyectos móviles, y esta área ya son las áreas promovidas. Algunas personas se destacan ahí, algunos proyectos se destacan ahí. Cuanto mejor esté su proyecto en Behance, son estudios de caso, mayores serán sus posibilidades de que se presenten. Lo que puedes ver en Behance es que todos esos estudios de casos
suelen estar diseñados de manera muy visual con muchos detalles, y es súper atractivo para el ojo solo mirar eso. Se puede ver que esta persona integró todos los pasos individuales del proceso, pero todo el texto, es muy, muy visual lo cual es útil. Se puede ver que también hay algunas animaciones, videos integrados entre el estudio de caso, o aquí al final para ver el producto final. Se puede ver la interacción, y aquí también se vinculan los sociales. Ahí en la parte inferior, se pueden ver los otros proyectos también. Echemos un vistazo a otro proyecto. Aquí, se puede ver que está estructurado súper bien sobre las responsabilidades o el papel de esta persona realmente tuvo, el componente de diseño, el proceso de diseño. Muy, muy visual y super bien estructurado sobre la investigación de mercado y el roadmap y wireframes. Otros pasos diferentes, también diseña sistemas y experiencias de interfaz también. Muchas aplicaciones simuladas. Se puede ver aquí un montón de texto que es super agradable e interesante. Ambos proyectos se destacaron ahí. Lo grandioso es que cuando te presentas ahí, tienes una posibilidad realmente alta de que los clientes te encuentren, y obtienes mucho [inaudible] Eso es lo bueno en el caso práctico de Behance. Es más fácil para los clientes encontrarte. Otra cosa es la página web de Awwwards. Eso es realmente genial que puedas encontrar sitios web impresionantes para obtener algo de inspiración,
pero también algunos sitios web de portafolio. Me ha gustado mucho comprobar eso de vez en cuando. Por lo general, allí encuentras carteras súper sofisticadas. Pero nos vamos a centrar un poco más en el caso de estudio, así que no tanto en todas las animaciones geniales de JavaScript que estás viendo ahí, sino realmente en los diferentes proyectos, y ahí están. Empecemos con el primero. Se puede ver super agradable. Están empezando con visual realmente grande, explicando todo, teniendo un área de introducción realmente agradable ahí. Más visuales, compartiendo también lo breve, y también integrando diferentes visuales, y manteniéndolo súper, súper conciso lo cual creo que es realmente impresionante también. Entonces al final, se ve el resultado, los resultados del negocio. Aquí hay otro caso de estudio, es muy similar. Se puede ver aquí escogemos imágenes lo cual es bonito. Algunos videos también para apoyar las interacciones. Es realmente agradable ver eso también. Alguna pista sobre el reto y más visuales también. Algunos se mezclan entre texto y video. También tenemos chequear eso. Te puedo recomendar que solo te pongas en línea,
echa un vistazo a algunos portafolios, sitios web hechos de gente que te gusta, y obtén algo de inspiración antes de que empecemos.
8. Poder de la narración: El poder de la narración. posible que te preguntes qué es tan interesante acerca de la narración, y de qué se trata en realidad, el caso de estudio de UX. Pero lo interesante de contar historias que, si miras hacia atrás en nuestra historia de nuestra especie, las historias siempre han jugado un papel realmente importante en nuestra sociedad. Escoge en cualquier momento y cualquier lugar poblado del planeta
y haz alguna investigación sobre esa cultura durante esa época, lo
demostrará como un hecho. Lo interesante es que la gente entiende y recuerda información mucho mejor si está organizada en algún tipo de historia. Esto es algo que nuestros grandes, grandes antepasados realmente hicieron. Estaban sentados alrededor de un incendio, contaban historias para recordar ciertos hechos o para contar historias tipo de. Entonces para nosotros, a través de la narración de cuentos, pasamos información y lecciones de generación en generación. Algunas de esas historias son ficticias, otras son algún tipo de hechos verdaderos. No sólo utilizamos historias sólo para aprender, son también para ejercer en la especulación y la exploración de posibilidades. Son una gran manera de preguntarte qué pasa si cuestiona la vida y encontrar posibles respuestas a éstas. De hecho, si nos fijamos en algunos métodos UX, tenemos historias de usuario o storyboarding, lo cual es bien conocido y también es algún tipo de métodos de narración de cuentos. Veamos realmente rápido cómo las historias se estructuran en general. La mayoría de las historias están estructuradas así. Tienen algún tipo de introducción. Entonces, en realidad, el problema ocurre. Tienes una acción ascendente. Tienes algún tipo de clímax y luego tienes la resolución. Entonces la solución realmente viene siguiendo la acción y luego el final. Podemos integrar este tipo de patrón, realidad, también en nuestros casos prácticos de UX, o en casi todo lo que estamos haciendo por los clientes o donde queremos integrar también historias. Creo que lo que realmente es importante entender de la historia es, que siempre tienen algún tipo de comienzo, tienen una parte media, y también tienen algún tipo de final. En términos generales, las historias tienen la capacidad de provocar respuestas emocionales fuertes. Se trata de una herramienta inmersivamente poderosa que puede conectar a las personas entre sí y también explicar ciertas cosas sobre los métodos, sobre la forma en que piensas, sobre la solución de problemas, y ese tipo de cosas. Si estás buscando un trabajo de UX en un futuro cercano, echemos un vistazo a quién te va a estar contratando probablemente. Probablemente una empresa o un cliente, y ambos tienen en mente una necesidad muy específica e inmediata. Para encontrar un nuevo miembro para unirse a su equipo de UX, están buscando a
alguien inteligente, alguien que traiga una inspiración
y talento, y que sea capaz de trabajar duro y será un gran ajuste en el equipo, y ayudará al equipo a producir mejor trabajo. Lo que es realmente importante para ellos es sobre todo todo todo en torno a la resolución de problemas. Sencillamente, al pasar por las carteras de los aplicantes, los reclutadores se están haciendo inconscientemente algún tipo de pregunta. ¿ Y si esta persona se uniera al equipo? ¿ Cómo sería trabajar con este equipo? ¿ De verdad ayudará al equipo? Para ti, contar una gran historia sobre tu propia experiencia como
profesional de UX les da algún tipo de creencia o puntos destacados tener algo que les ayude a
entender realmente la forma en que piensas y si serías un gran ajuste en esto Equipo UX. También les ayuda a ver la forma en que trabajas a través de tus ojos, por lo que el proceso. Esperemos que reconozcan a alguien que fue realmente inteligente y
capaz de luchar contra desafíos difíciles y poder integrarse realmente bien en el equipo. Entonces un diseñador realmente genial que es capaz de resolver problemas malvados. Eso es realmente importante para mostrar eso en tu portafolio y resaltar que a lo largo de la historia que estás contando con tus casos prácticos de UX.
9. Convertir en una historia: Ahora, hemos hablado de la narración y de lo que es tan interesante para integrar eso en tus casos prácticos. La pregunta ahora es en realidad, ¿cómo podemos convertir nuestros estudios de caso UX en alguna historia? Ahí, se pone realmente interesante. Encontré esta cotización realmente impresionante de Orson Scott Card. Es un escritor estadounidense de ciencia ficción. “ Las historias de ideas son sobre el proceso de buscar y descubrir nueva información a través los ojos de personajes que se ven impulsados a realizar los descubrimientos. El estructura es muy simple. El relato de ideas comienza levantando una pregunta; termina cuando se responde a la pregunta”. Mantengamos eso como inspiración y veamos la estructura de una narración. Ya hablamos de esa estructura entonces ¿cómo
podemos integrar eso ahora en un caso de estudio UX? Al comenzar con un principio, un proceso, y un fin. Al principio, vamos a hablar un poco sobre el contexto, los objetivos, y esas cosas y la parte media sería sobre el proceso, los diferentes métodos, bocetos, wireframes para todo. De lo que necesitábamos para llegar al final, y vamos a hablar del producto final y las lecciones aprendidas en nuestros resultados también. Generalmente, ahora estamos tratando de combinar esas cosas, la narración en el caso de estudio de UX y el estudio de caso UX [inaudible]. También tenemos un inicio de un estudio de caso UX que explica el contexto, y lo que está pasando, y toda la información básica. Todas las cosas que un reclutador básicamente quiere saber cuál es como las metas, y visiones, y retos desde el principio y también tal vez alguna información de fondo. Entonces también tenemos que procesar, ha
sido la parte principal del estudio de caso UX. la parte de proceso se explican los pasos que tomaste para llegar desde las preguntas desde el principio hasta la solución al final. Destaca todas las actividades que tomaste e ilustra esas actividades, prueba de todos los activos que tienes. Podrían ser bocetos, podrían ser fotografías, podrían ser diagramas o cualquier otro artefacto de diseño o entregar reglas que usted produjo. Ten en cuenta que realmente mostrar el proceso. Porque eso es lo que realmente marca la diferencia y realmente te ayudará a destacar. Porque a muchos diseñadores realmente no les va mal bien. Enfatiza en las interacciones, y los retos, y las alternativas, y las iteraciones, y el punto de decisión y tal vez algunos conflictos que quizá tengas. Siempre debes empezar con algunos, por supuesto, hacer la investigación que [inaudible] un problema, por ejemplo. Un punto realmente bueno para empezar es, podrías mostrar persona y usar un mapa de viaje aquí para ilustrar, cosas como esa, y que te das cuenta por ahí. Por supuesto, todos esos pasos dependen mucho del proyecto que hiciste y de la parte que tomaste y del papel que tomaste. Vamos a hablar a fondo de todos los diferentes pasos y cómo explicarlo. Qué debes integrar y también cómo explicar eso de una manera muy condensada. Pero creo que lo que realmente es útil para los reclutadores es también resaltar y asegurarme de que resaltes las lecciones que aprendiste sobre tu experiencia, algunos para llevar, que es algo que personalmente encuentro súper útil también. Al final, un estudio de caso UX es algún relato de evento que te llevó
al descubrimiento de algún conocimiento nuevo por lo que la respuesta al problema de UX. Ten en cuenta que los reclutadores necesitan responder a su pregunta de “qué pasa si”. ¿ Y si esta persona te puso en el equipo? ¿ Sería útil? ¿ Qué traería esta persona en realidad a nuestro equipo? Generalmente, estructura tu caso de estudio UX. Te afeitas algún principio, la idea, y luego expandes el proceso y luego al final. No olvides recordar que es importante que el reclutador vea el proceso a través tus ojos y que realmente subrayes tus habilidades únicas y lo que sabes y lo que realmente te hace único como diseñador. Tu estudio de caso muestra cómo resuelves problemas, cómo pensamos, es un demostrador del proceso y la reflexión crítica en
lugar de solo mostrar el producto final y visuales perfectos, por ejemplo. Vamos a hablar muy brevemente sobre qué
contenido es realmente apropiado para cada parte y cómo se puede estructurar eso en la próxima semana o así. Será fácil para ti producir el contenido tú mismo en el sitio. Vamos a resumir esto realmente brevemente. Ten en cuenta que los reclutadores necesitan responder a su pregunta de “qué pasa si”. ¿ Y si esta persona se uniera al equipo? ¿ Cómo sería trabajar con esta persona? Esas son las preguntas que los reclutadores o las personas que te están contratando realmente tienen en mente. El punto número 2 es la estructuración. Asegúrate de que el enfoque esté realmente en la idea por lo que es fácil para los reclutadores entender realmente la forma en que piensas y ver el mundo a través de tus ojos. Entonces la solución de problemas. UX es tanto sobre la resolución de problemas. Tu caso práctico debería mostrar cómo resuelves los problemas, cómo piensas. Eso puede demostrarlo mostrando su proceso y cómo realmente se le ocurrió su solución. Entonces la estructura. Hay tres partes de cada estudio de caso. Es el inicio del proceso, y la conclusión, y el fin. Es realmente importante saber qué cosas integrar ahí y vamos a
hablar mucho a fondo sobre eso en los próximos videos. Toma notas, anota todas las cosas para tu estudio de caso y usa una hoja de trabajo que preparé para ti.
10. Resumen: Crear un esquema es un primer paso realmente importante, que te ayudará a estructurar el estudio de caso y a construirlo estratégicamente sin demasiado estrés porque sabes exactamente lo que quieres integrar y lo que realmente necesitas. Entonces el animal actúa como una estrella del norte creando esos estudios de caso. Al final, tomará mucho trabajo, así que a veces es realmente importante dar un paso atrás y asegurarte de que no estás perdido en los detalles, pero en realidad sabes lo que quieres crear. Un contorno bastante básico se ve así. En primer lugar, se empieza con el principio, por lo que la intro, la breve. Declaras el resumen del proyecto, qué fue en lo que realmente trabajaste. Incluyes alguna información sobre el papel que desempeñas y también la declaración del problema. Cuál en realidad fue el problema que tratas de resolver ahí y qué fue lo que realmente trataste de lograr. Lo que es realmente importante ahí para integrar también es
el reto así que lo que era un reto, lo que era un problema o reto muy bonito que estabas enfrentando. Alguna información de antecedentes también; podría ser el alcance o el grupo objetivo. Entonces siempre comienzas con la parte de proceso, que es la parte más importante. Ahí puedes pensar qué tipo de cosas has hecho. Podría ser primero, la investigación, así que habla de la investigación
que hiciste, qué métodos, cuáles fueron los principales resultados. También sobre los conceptos o incluir algunos bocetos tempranos, algunos alámbricos de baja fidelidad, algunos alámbricos de alta fidelidad, y también otros conceptos que hiciste ahí. También algunas iteraciones de diseño que hiciste, las pruebas. Incluya allí sus pruebas, tal vez incluso múltiples rondas de pruebas, y por supuesto, los resultados o el producto final. La tarea para ti ahora es tomar algunos Post-its y anotar todos los elementos que quieras integrar en tu caso de estudio, y también pedirlos ya y que tengamos alguna historia. Entonces el siguiente video, te
voy a mostrar cómo estoy estructurando un esquema para uno de mis proyectos que puedas ver y ver cómo estructuré eso y eso probablemente te sea de ayuda. Después de eso, hablaremos los pasos individuales realmente en profundidad por lo que será fácil para ti entender qué realmente integrar ahí y llegar
a la entrada correcta en cada una de esas áreas.
11. Resumen: Mírame trabajar: Me pidieron diseñar una aplicación para un lugar de convivencia en Finlandia. Estuve involucrado en varias etapas del proceso;
en el concepto de fase de investigación y también en la fase de diseño. Te voy a mostrar cómo hice el esquema para este proceso,
para el proceso de
este caso de estudio de UX que subo en las manos y en mi página web también. Por lo general cuando estoy diseñando mi contorno, tomo post-its, diferentes colores, un color para el titular. Ya hablamos del esquema. Esta es la introducción. Entonces empezando por lo primero, esbozar y todos los diferentes pasos. Por supuesto, el resumen del proyecto, mi papel, cronología, y clientes y también los retos. Todas las cosas que generalmente necesitas integrar en la introducción. Entonces el segundo punto será toda la información de antecedentes la cual será interesante para que la gente entienda el tema y otras cosas que descubrí a lo largo de la investigación que hice. Sí. Algunas cosas interesantes como la pirámide de necesidades del Maslow, que es algo realmente importante a considerar sobre todo ese proyecto. Ahora el proceso, por supuesto, dividí esto en las cuatro partes. Empecé con la investigación que el concepto, diseño y al final de las pruebas. Lo que puedes ver aquí es que volví a elegir los mismos colores, por lo que es un poco más fácil obtener una visión general. Entonces la investigación, hice entrevistas a usuarios, así que quiero mostrar eso. También, las preguntas
que he preparado para esas sesiones de entrevista y los insights después de la investigación. Para la fase conceptual, quiero mostrar la arquitectura de la información que se me ocurrió. Quiero mostrar mis primeros bocetos. Realmente el proceso, sobre todo sobre el área de eventos. También quiero compartir mis alambras-frames porque empecé con alambras-frames e hice algunas pruebas logradas de los wire-frames en la etapa inicial. Tan inteligente en el diseño, me gustaría, por
supuesto, mostrar el branding, así el color, la topografía, las imágenes y esas cosas. También muestra algunas cosas para el diseño de la app también, especialmente el área de eventos. Entonces las cosas de diseño de aplicaciones, la comunidad, y tal vez también el área de mensajes. Para las pruebas al final, quiero mostrar cómo las pruebas fueron bastante de las pruebas y sobre los resultados. Al final, también quiero compartir ideas sobre el resultado, lo que realmente sucedió después de eso y las lecciones aprendidas. Para el resultado, quiero integrar mi producto final. Conseguiremos las maquetas finales, cómo se ven,
cómo son interactivas, cómo están funcionando, luego enfatizar en realidad los diferentes puntos sobre los diseños que se me ocurrió. Las siguientes cosas son, por supuesto, los aprendizajes de las pruebas y las lecciones aprendidas después de terminar el proyecto. Los siguientes pasos quizá, y también realmente importantes, las ideas que están más allá de eso. Entonces otra recomendación y punta es conseguir todos los post-its, ponerlos en la pared, para que tengas alguna visión general. Vamos a utilizar eso en el proceso posterior. Tienes una visión general y sabes lo que realmente
quieres integrar qué textos necesitas escribir, y qué imágenes y maquetas y cosas así necesitas preparar.
12. Introducción: Espero que todos hayan creado un esquema con las diferentes fases del proyecto UX por el que pasamos. Después de terminar el esbozo, ahora es un momento realmente bueno para hablar las diferentes fases cómo diseñarlas realmente para tus casos prácticos. Lo que va a ser realmente útil es en realidad usar tu hoja de trabajo que preparé para ti
la cual te guiará a través de las diferentes fases y puedes anotar el texto y los pasos individuales en tus hojas de trabajo para empezar realmente con el texto. Después de crear el texto para todas las diferentes fases y lo que queremos poner ahí, vamos a hablar de los visuales y también del diseño. Empecemos con el primer paso. Ya hablamos de las diferentes fases del estudio
de caso UX y del proceso a inicio. Eso es realmente importante para integrar la introducción. Empieza con tu título, tu rol, y también el breve que recibiste y la declaración del problema. Aquí hay un ejemplo de introducción. Estaba trabajando para un espacio de convivencia en Finlandia y aquí está el ejemplo de introducción para el proyecto. Puedes encontrar todo el proyecto en [inaudible], puedes checar eso. La introducción, integré el título que es la aplicación comunitaria para un espacio de convivencia, mi papel fue la investigación y el diseño de UX/UI. El tiempo fue de septiembre a noviembre de 2019. El cliente, aquí se integraría también el nombre del cliente. El breve de la declaración problemática fue. Durante mi tiempo como residente creativo en Adobe, me pidieron rediseñar una aplicación para la comunidad en un espacio Coliving en Finlandia, que informa a la gente de ese espacio sobre toda la información que necesitas, eventos, las salas de renta, conocer gente. La comunidad es una de las cosas más importantes en un espacio Coliving, por lo que nos propusimos diseñar una experiencia que ayude a la gente a conectarse entre sí y aún así sería súper fácil de usar. Si formabas parte de un equipo de UX más grande, también
deberías declarar tu papel en el proyecto por ejemplo escribes algo así como, “Mi papel en este proyecto era emprender como investigación y evaluación de prototipos”. O bien, “Mi papel era diseñar la interfaz de usuario y el prototipado”. Ese tipo de cosas. También asegúrate de que el punto número 2 sea definir el problema, por lo que articular bien el problema ayudará a contar la historia del caso de estudio. Asegúrate de que realmente declaras el problema e identificas los objetivos del proyecto. ¿ A qué pretendía lograr el proyecto? Sé lo más detallado que puedas. Algunos ejemplos, especialmente los objetivos de negocio están ganando suscriptor de correo electrónico específico, podrían ser ganar 5,000 suscriptores de correo electrónico o aumentar la conversión en un
10 por ciento para una cosa específica o disminuir los retiros en un 50 por ciento, cosas así. Esto es realmente interesante, sobre todo para las personas que te están contratando y para la gente. Estos son algunos ejemplos que serán interesantes para mirar realmente brevemente. El primer ejemplo es del caso de estudio de Bluewave. Lo que es realmente bueno aquí es que los objetivos del proyecto están alineados muy bien. Consigue que los usuarios escriban más reseñas y que los usuarios vean el valor en sus contribuciones con un texto realmente corto, por lo que es fácil de entender. Se puede ver la exploración y el concepto de enfoque estrecho y las pruebas
así como algunas soluciones de diseño como la creación de un sistema sistemático de tarjetas, así
como resultados finales de entregadores, y también algunos aprendizajes. En este segundo ejemplo, el problema se define súper bien también. Se ve nuestro enfoque así como la combinación de muchos visuales y mucho enfoque en la estrategia de contenido combinada con los wireframes, e información adicional sobre la interactividad y así se puede ver mucha información sobre el alcance, tantas informaciones de fondo.
13. Información: La introducción es un lugar realmente genial para compartir todas las cosas que ya sabes cuando inicias el proyecto. Este podría ser el alcance, o el público objetivo, y también alguna investigación de fondo que probablemente hiciste. Puedes compartir más sobre el público objetivo cuando ya sabes más, ¿quiénes son? ¿ Cómo les afecta realmente el problema? ¿ Qué insights clave tienes sobre ellos? Ese tipo de información, así
como los alcances y contestar las preguntas sobre ¿qué debe lograr realmente el proyecto para el negocio? ¿ Cuál era el plazo? ¿ Qué tipo de subproyectos necesitas que diseñe? ¿ Qué contenido se utilizará para el proyecto? A lo mejor algún análisis sobre productos similares también. Aquí, ves un ejemplo sobre un proyecto que hice para el espacio Coliving donde
empecé realmente con mucha información de fondo sobre qué se trata en realidad, ¿qué tiene de interesante eso? Tenía que entender realmente un poco sobre el objetivo de los espacios de Coliving, los problemas. Muchas cosas fueron algún tipo de razones psicológicas. Eso fue realmente interesante integrarse en el principio mismo.
14. PROCESO: Hablemos del proceso. En realidad es la parte más importante de tu caso práctico. Después de explicar la información de antecedentes, las metas, los retos y todas las cosas que sabíamos antes de iniciar el proyecto, vamos a compartir todos los pasos que pasamos a lo largo de nuestro proceso que es, como ya dije, la parte más importante. Asegúrate de que realmente enfatizas las habilidades y todos los aprendizajes que tuviste. Vamos a identificar los diferentes pasos que dio en el proyecto, por qué los hizo y por supuesto, el valor de esas acciones, y los resultados del proyecto. Veamos realmente rápido el proceso de diseño centrado en el ser humano. Por lo general comienza con algo de empatía, que suele ser investigación. Se define eso al sintetizar la investigación, idean, se
le ocurre un concepto y un diseño, prototipa eso y luego se prueba eso. Desde mi experiencia es realmente útil, especialmente para clientes y reclutadores entender tu proceso, si usas todos esos pasos, integrándolos en tu caso práctico de UX. Una fase de investigación yendo al concepto, diseño, y luego a las pruebas. Por supuesto, esto depende mucho del proyecto que hiciste, qué métodos usaste y cuándo estuviste realmente involucrado en el proceso también. Aquí es realmente importante que muestres tus fantásticas habilidades UX y el objetivo es mostrarte un enfoque y contribución específicos. Adicionalmente, comparte algunas de las decisiones que has tomado, las compensaciones o ideas, lo cual es realmente importante. Cada proyecto es muy diferente por supuesto, así que describiendo el proceso que tomaste lo mejor que puedas pero por supuesto esto se verá muy diferente de proyecto a proyecto. Algunas cosas que podrías incluir se enumeran aquí por un lado, revisa la investigación, diferentes métodos de investigación de usuarios, algunos métodos de ideación por supuesto, luego marcos bio, maquetas, prototipos. Por supuesto, usuario probando la escritura X, tal vez, diseño de
interfaz de usuario, también diferente tipo de pruebas y prototipos. Después pasa por esos diferentes pasos y explica en realidad por qué hiciste eso, lo que aprendiste y además comparte muchos visuales. Si tienes visuales para alguno de esos pasos, compártalos, eso es realmente importante. También comparte algún diminuto texto donde hablas súper conciso sobre el aprendizaje y las cosas que realmente sacaste de este paso específico. El apartado de procesos es como también realmente gran lugar para mencionar cualquier colaboración que pudieras haber hecho también. Demostrar que puedes colaborar con un equipo es realmente importante para contratar directivos, así que exponga tu rol y lo que otros hicieron también. Si alguien más fue responsable de la investigación, eso no es un problema en absoluto, solo mencione eso. Por supuesto, puedes demostrarlo porque pertenece a todo el proyecto, pero solo afirmar que alguien más lo hizo. A lo mejor has hecho trabajo como redactor, otra vez, ¿cómo colaboraste? ¿ Cómo manejaste la entrega a desarrolladores,
a crossovers, las pruebas y ese tipo de cosas, lo cual es realmente importante. Lo que vamos a hacer ahora es que vamos a pasar por diferentes pasos del proceso y hablar un poco sobre cómo mostrar eso, cómo integrar y luego es más fácil
para ti integrar eso también en tu portafolio.
15. Investigación de usuarios: Lo primero
con lo que probablemente vas a empezar es algún tipo de investigación adicional si hiciste investigación. Mi recomendación personal es, por supuesto, compartir los diferentes métodos que hiciste ahí, podrían ser pruebas A/B o mapeo de viaje del usuario o técnicas de entrevista, podría ser cuantitativamente investigación del usuario. Técnicas como encuestas o análisis o investigación de mercado
también son métodos cualitativos de investigación de usuarios que son más acerca de la calidad. Entonces sobre el porqué, podrían
ser entrevistas o grupos focales o investigación de carrera o lo que sea que hicieras. Compártelos, comparte también tus aprendizajes clave. Realmente bueno entender eso en el principio mismo. Entonces también comparte un poquito de texto donde
hablas de los aprendizajes y las cosas que realmente
sacaste de las entrevistas o de las encuestas de usuarios, todo ese tipo de insights y lo que realmente empezaste a hacer después de eso. Asegúrate de mantenerlo conciso, que también muestres fotos si se te permite, y no compartas demasiados detalles. Si lo tienes, asegúrate de integrar algunos bocetos tempranos o en notas que tomaste en la sesión de investigación, por ejemplo. Por supuesto, sólo si se te permite compartir eso. Asegúrate de que siempre estás resumiendo los aprendizajes. Aquí tienes un ejemplo. Analizamos los eventos que asistieron las personas de 40 personas que viven en un espacio colicin edades entre 18-40 años por un periodo de dos semanas y descubrimos que alrededor del 30 por ciento de su evento se inicia por recomendaciones de amigos. A partir de este análisis, hicimos cuatro personas de usuario y definimos sus experiencias en las listas de tareas de mapeo con un mapa de viaje del usuario. Otro ejemplo aquí, dejé algunas partes fuera. Tal vez sea útil para ti solo llenarlo. Para dar inicio al proyecto, iniciamos con un taller de partes interesadas del cliente. Queríamos asegurarnos de que x. Como segundo paso, realizamos entrevistas con, y aprendimos eso. Empezamos a utilizar esta información para construir un mapa de empatía o algo más y mejor que. Tenemos ese tipo de insights. Estructurar así suele ser muy útil. Una herramienta que puedo recomendar, sobre todo si las cosas que hiciste antes no se ven tan bien, y si necesitas diseñar un poco mejor, puedes usar el plug-in de pizarra para Adobe XD. Esto es algo que es súper útil. Tienen muchos preajustes realmente geniales que puedes usar para diferentes métodos que tengas, tienen maquetas para diferentes cosas, mapeos de
afinidad, o cualquier tipo de cosas que quieras integrar. Tienen algún tipo de diseño el cual puedes reutilizar. Todo el asunto es gratis, así que lo puedo recomendar absolutamente. Puedes integrar franqueo, puedes cambiar los colores a los colores de tu marca o los colores
corporativos y ajustar todo a tus necesidades para que se vea realmente bien cuando estás publicando eso en tu cartera también. Puedo ver que tienes otros presets aquí a un lado, así que simplemente elige lo que quieras o ve a las secciones Elementos y elige los elementos individuales, y construye tú mismo. Eso ahorra mucho tiempo y estás 100 por ciento seguro de que se verá realmente genial al final. Con eso, algunas otras herramientas que puedo recomendar, por supuesto, ya hablé de Adobe XD, que es gratis, el plugin de pizarra, que es gratuito y fácil de descargar. Otra herramienta que es super agradable es Miro, tienen un montón de activos realmente cool así que puedes usar para tus estudios de caso. Podría ser cualquier flujo de usuario o cualquier tipo de elementos de diseño que desee integrar también. Aquí hay un ejemplo para la investigación de usuarios que hice para el espacio colicin, se pueden
ver muchas imágenes, las
imágenes son de las sesiones y también de la fase de síntesis. Se pueden obtener algunas ideas sobre las entrevistas, las preguntas que hago, y también las personas o las personas a las que me entrevistaron, y los principales problemas o las ideas que realmente obtuve de la investigación que hice allí. Aquí te dejamos algunos consejos generales, y al final, asegúrate de mantenerlo conciso. No muestres demasiado, solo la información más importante,, y en los aprendizajes que tienes, integre algunos gráficos e imágenes así para mantener esto realmente bonito y un poco atractivo, y no compartas demasiados detalles. Asegúrese de lo que realmente se le permite compartir en los estudios de casos, así que por favor tenga en cuenta cualquier cosa también.
16. concepto: Rondas de iteraciones, empezaste la vista previa para la fase conceptual, y es realmente importante que estructures eso realmente bien. Por supuesto, comienza con algunas ideas que obtuviste y después de algunas rondas de interacciones, probablemente
comenzaste con las pruebas AB, empezaste con wireframes, así que asegúrate de que realmente demuestres que son visuales y espacio para diminuto texto y todos los aprendizajes que tuviste. También, cosas como fuera de la ronda final de pruebas de usuario, aprendimos que, por ejemplo, los usuarios tienen problemas para encontrar la función de evento en nuestra aplicación, o que necesitabas rediseñar estas áreas y por ejemplo, resultó que el área de eventos es más útil para las personas. Podría ser algo, y este es un ejemplo que hice por el espacio Coliving. Se puede hablar de la diferente ronda de iteraciones, por ejemplo, se puede hablar de la retroalimentación que se tiene, y también es realmente gran lugar para hablar o para mostrar las maquetas que hizo, algunos bocetos tempranos desde baja fidelidad hasta alto- fidelidad, más detallada, y compartir los retos que tuviste, los aprendizajes que tuviste, y además asegúrate de integrar algo de texto con visuales también. Lo que también es interesante para las personas es, si compartes retos ya en la fase conceptual, porque esto ayudará a clientes y directivos de contratación que, eres capaz de lidiar con situaciones difíciles. Si no tuviste situaciones difíciles, eso es genial. Eso es realmente impresionante. Pero otra cosa que puedes integrar ahí también son
algunos aprendizajes a tener, así que la progresión comparte, un reto notable al que te enfrentaste, comparte algunos aprendizajes clave también, y cómo en realidad se te ocurrió las ideas y el concepto. Rellena todas esas cosas en la hoja de trabajo, y busca los wireframes y maquetas que tienes, y otras formas de integrarlo en tu fase conceptual.
17. Diseño: Ahora podemos hablar del diseño. Especialmente si te integraste en el área de diseño o en la interfaz de diseño, entonces es importante que también muestres mucho en tu caso práctico y pongas todos los diferentes elementos que realmente pertenecen a un diseño. Esto podría ser, por ejemplo, la topografía, los colores que eligió, también explicando por qué eligió una topografía tan específica, tal vez también tenga dos, los diferentes colores que eligió, el primario, secundario, y tal vez incluso otros colores, el conjunto de iconos que diseñaste para elementos específicos. Eso podría ser un elemento específico para una tarjeta, para un pop-up, elementos
específicos que diseñas y también las ideas detrás de eso. Si hubiera alguna razón detrás de diseñar esos elementos, eso es realmente útil apuntar ya eso y pensar en los diferentes elementos que se quieren mostrar ahí. Consigue tu hoja de trabajo, justo en todas las diferentes cosas que quieras integrar, ya piensa en los visuales que puedes integrar ahí también. Especialmente para el diseño digital, es realmente útil crear maquetas o animaciones donde puedas integrar tu diseño de interfaz y demostrarlo de una manera muy atractiva y visual y agradable. Cómo puedes hacer eso es algo de lo que hablaremos en el próximo video. Mantente atentos para eso. Ahora, empieza con un elemento de diseño diferente también. Te voy a mostrar un ejemplo que creo que fue realmente bien hecho, sobre todo desde el lado del diseño. Lo que realmente me encanta de este caso de estudio de Netguru para ResumeLAB es que integraron todos esos elementos visuales en todo el estudio de caso. Se ve realmente hermoso. Pero también ponen un enorme foco en la guía de estilo y la entrega verdaderamente documentación,
lo cual es súper interesante, lo cual es súper interesante, sobre todo para los clientes porque se trata de un área donde la mayoría de los problemas ocurren realmente. También mostraron la capacidad de respuesta. Los diferentes elementos a todos los diferentes tamaños, para el portátil, smartphone, y iPad, lo cual es realmente genial. Otra cosa que creo que es realmente impresionante en esos estudios de caso es cómo presentaron las ilustraciones. Realmente mostraron el proceso de que las ilustraciones se unieran. Aquí, por ejemplo, con el software de diseño y cómo integraron todos los diferentes elementos, lo cual es súper impresionante. Lo que puedes ver aquí son las cosas que puedes integrar. Sólo unos pocos, así que primero, por supuesto, integran todas las cosas que pertenecen a alguna interfaz adicional de branding. Además de la topografía y todos los diferentes elementos de diseño que integraste, esto podría ser una vista de carro,
o una barra de pestañas , o elementos específicos que se te ocurrió también; iconos, etc. También
puedes integrar colores y las diferentes interacciones. En animado, porque elementos de interfaz.
18. Pruebas: Las pruebas son el último paso
del proceso de diseño centrado en el ser humano o del proceso de pensamiento de diseño, aunque es un proceso iterativo y se empieza de nuevo desde el principio con las lecciones que aprendimos. Es realmente importante poner mucho énfasis en la fase de prueba en su caso práctico de UX. Las pruebas a menudo se realizan al mismo tiempo
que los prototipos y se realizan bien, pueden proporcionar muchas oportunidades de aprendizaje para ayudarle a aprender más sobre el usuario y oportunidades para refinar su prototipo e incluso la declaración del problema. Es realmente importante que compartas los aprendizajes que tuviste durante la prueba. Aquí te dejamos algunos consejos. En primer lugar, en su caso práctico de UX, explique el proceso. ¿ Dónde hiciste las pruebas? ¿ Cómo fue? Esas cosas podrían estar en un laboratorio y en el cargo, también explicaron los métodos. Entonces también ¿qué probaste? ¿ Probaste un área específica? ¿ Un escenario de caso de uso específico? ¿ Qué tipo de tarea le diste realmente al usuario? ¿ Qué aprendiste al final? Asegúrate de hablar de los métodos porque eso es realmente importante. Aquí te presentamos algunos métodos que probablemente utilices. Podría ser pruebas de guerrilla, pruebas de usabilidad de laboratorio. Podría ser también algunas pruebas de usabilidad remota sin moderar a través de Zoom, por ejemplo. Podría hacer indagación contextual, entrevista telefónica, alguna clasificación de tarjetas, grabación de sesiones, o también pruebas A/B. También hay más métodos de prueba de UX. Pero esos son los fundamentos, casi comunes. Así que asegúrate de que realmente compartas eso, y comparte los aprendizajes hasta donde tuviste haciendo eso.
19. Resultado: Por lo que ya llegamos al último paso del proceso del esbozo
que es el desenlace o lo que realmente sucede después de que termines el proyecto. Eso es súper interesante para que los clientes o las partes interesadas
entiendan realmente lo que lograste referencia o proyecto con tus diseños, qué tipo de metas tenías y cómo realmente los alcanzas o si realmente llegas a algunos. Este es un momento realmente genial para compartir
también un poco sobre por supuesto los objetivos que alcanzas, pero también sobre las lecciones que aprendiste que son súper, súper, súper importantes y así si no te enfrentaste a ningún problema difícil, retos o algo así, las lecciones aprendidas son algo realmente bueno para integrar al final de cada caso de estudio de UX. Un ejemplo sobre un posible resultado podría ser algo así. Encontramos que el 15 por ciento de los eventos que asistieron las personas iniciaron porque alguien más en el grupo que salió de la llamada los invitó a unirse. No teníamos el presupuesto ni el tiempo para abordar el reto de las invitaciones personalizadas, pero en un futuro podríamos volver a visitar el proyecto y enfocarlo. Vamos a resumir esto realmente brevemente. ¿ Cuáles son los entregables y cuál es el resultado? ¿ Golpeaste, perdiste o superaste el gol? Eso es realmente importante señalar aquí, qué resultado tuvo realmente este proyecto. ¿ Puedes compartir algún otro resultado de negocio, algún tipo de insights de negocios que obtuvieras a lo largo del proceso? ¿ Disminuyó las tasas de retiro en un 50 por ciento o las quejas de
atención al cliente en un 30 por ciento si este era su objetivo en el principio? Lo mismo con la tasa de conversión, si tuvieras un objetivo sobre la tasa de conversión, el tono de aprendizaje digital, llegar a esa fantástica tasa de conversión a la que estabas apuntando, o tal vez mejoraste el valor de por vida de los clientes o cosas como eso? Esto se remonta a los objetivos que te fijaste en el principio mismo. Cuáles son algunos puntos para llevar sobre diseñar un esquema, crear un esquema, y diseñar los pasos únicos. Generalmente, asegúrate de incluir siempre visuales y documentar todo el proceso a lo largo de los estudios de casos, contar historias lo que realmente sucede para que sea más fácil para la gente entender, respetar los NDA que has firmado, así que asegúrate de que solo muestras las cosas que te permiten, si estás cien por ciento seguro,
asegúrate preguntarle a tu cliente y no
olvides tratar el estudio de caso y
el proceso de solicitud de empleo como cualquier otra UX desafío de diseño, por lo que realmente especie de bocetos, pensar en el concepto y la indagación, integrar los visuales también.
20. imágenes/visuales: Una de las cosas más importantes en cada caso de estudio de UX son definitivamente la parte visual. Incluso si eres solo un diseñador de UX o investigador de UX, asegúrate de integrar siempre los visuales. Eso es súper importante guiar realmente la vista de la persona que ve tu portafolio, podría ser un reclutador o un cliente, así que asegúrate de integrar siempre los visuales. Empezamos escribiendo el texto para las diferentes etapas del proceso. Lo que puedes hacer ahora es pensar en todos los visuales que ya tienes para apoyar las cosas que estás diciendo en el texto en las diferentes etapas. Los escribiste en tu hoja de trabajo. Lo que puedes hacer ahora es integrar el texto o los visuales que ya estás teniendo o quieres crear, porque también vamos a crear visuales en los próximos videos. Pase por los diferentes pasos del proceso, y anote los visuales que desee integrar. Lo que realmente es útil es reunir ya todos los visuales que estamos teniendo. Esto podrían ser fotografías, o wireframes, o tal vez maqueta que ya creaste para el cliente o para tu trabajo, luego ponlas todas en una carpeta, por lo que te será más fácil encontrarlas. Entonces es un momento realmente bueno para hacer también una lista de los maquetas que aún quieres crear, los visuales que aún quieres crear. Lo que es realmente, realmente útil para mí es
anotar todos los visuales que quiero integrar en Post-its, diferentes colores para diferentes tipos de visuales. azul son para cualquier gráfico, rosa son para cualquier imagen o visual, y el rosa realmente neón es para maquetas animadas. Entonces después de escribirlos todos, todos los visuales que quiero integrar, anclé justo al lado del Post-its. Escribimos y creamos nuestros contornos. Al lado del tema, estoy anclando el Post-it, así que sé qué tipo de visuales aún quiero integrar. Después terminan, se ve como algo así. Al ver otros visuales, aún necesito crear los diferentes tipos, y luego hacer una lista, y preparar todo lo que necesito para eso antes de que realmente me ponga en marcha. Pero también puedes usar tu libro, el e-book. A veces estoy haciendo ambas empezando por los Post-its, y luego escribiendo todas las cosas abajo comenzando con el texto, así que depende mucho de cómo realmente te guste preparar eso, y qué tipo de persona eres, y cómo realmente haces [inaudible] Ahora, vamos un paso atrás, hablemos generalmente de qué tipo de visuales podemos integrar, y también, de unos pocos ejemplos. Quiero mostrarles algunos estudios de caso con visuales realmente hermosos, donde los visuales están integrados super, super bien. ¿ Qué tipo de visuales se pueden crear allí realmente? Ya hablamos de bocetos, podrían ser también algunas fotografías que tomaste a lo largo del proceso, el proceso de investigación o talleres, por ejemplo. Pero también hay imágenes que puedes integrar, crear tus propias maquetas por ejemplo, o crearlas en tu caso práctico de alguna manera. Hay dos lados que puedo recomendar cuál es Pexels, y el segundo es Unsplash. Proporcionan gratuitamente el uso de fotografías de alta calidad. Si quieres integrar algunos maquetas, lo que puedo recomendar son algunos sitios de maquetas, aunque normalmente soy solo asociado en Google con maqueta específica de formulario. Yo lo estoy buscando. Esto podría ser realmente útil para el principio. Ahora, echemos un vistazo a algunos ejemplos que son realmente hermosos. El primero se muestra Alice Lee. Diseñó las ilustraciones para Slack. Aquí lo que puedes ver es cómo integró sus visuales con el texto. Se ve super, super visual y muy bonito, sobre todo viendo el proceso y las diferentes posibilidades cómo usar eso. Lo que hace súper bien es que combina el texto para sus visuales, aunque su enfoque es más en la ilustración y menos en el proceso UX. Pero pone mucho esfuerzo y enfatiza los diferentes pasos por donde guía al usuario a través. Es súper atractivo e interesante de ver. Son pocas las cosas que podemos inspirarnos incluso como un UX/UI diseña con los titulares realmente grandes con los grandes visuales, con los textos a los lados y presentando los diferentes elementos de diseño paso a paso. El segundo ejemplo es de Moment Brew, es una aplicación de realidad aumentada. Lo que puedes ver aquí es todo el proceso. Nuevamente, se crean muchas ilustraciones y diseños para este caso de estudio, sobre todo todos los diferentes flujos de usuarios y se crean
los diferentes visuales para esta presentación. Lo que realmente me gusta aquí es que también integró Post-its y presentando el proceso, o cómo en realidad pasó de los primeros bocetos, los primeros wireframes hasta el cartón final, y sobre todo el enorme énfasis en el prototipado es super importante aquí e interesante de ver también. Integrar animaciones y videos suele ser realmente útil para que
diferentes etapas entiendan un poco mejor de cómo funcionan las cosas en la interacción. Como se puede ver aquí, sobre todo la investigación se presenta realmente, muy bien. Echemos un vistazo al ejemplo número 3, que es de Good Club, donde el diseñador realmente puso un
enorme, enorme enfoque en los visuales también. Integró muchas fotos, que también se integra en la página web. Un montón de maquetas realmente hermosas y un diseño de ajuste realmente bueno también. Espero que esos ejemplos te ayuden a obtener algo de inspiración porque ahora, es un momento realmente bueno para integrar también todos los visuales en tu esquema. Entonces consigue tu hoja de trabajo, y anota todos los visuales que quieras integrar porque ya los tienes, o quiero integrarlos, y luego haz una lista de todos los visuales que quieres integrar en el siguiente lecciones juntas.
21. disposición/composición/diseño: Hablemos del diseño realmente brevemente. Tu caso práctico X o tu portafolio X como alguna pieza de diseño también,
así que asegúrate de pensar realmente en el diseño y cómo organizas todo el diferente tipo de información que recogimos en los últimos videos. Es realmente importante crear un gran layout que realmente apoye tu proceso. A lo mejor no eres un 100 por ciento flexible porque ya estás usando algún tipo de plantillas si estás usando Squarespace o WordPress, por ejemplo. Pero en general, siempre son algunos diseños básicos que puedes integrar allí también. Mi recomendación es empezar diseñando o viaframing tu contorno. Simplemente puedes conseguir un lápiz y unas hojas de papel y escribirlo. Imagina que esto sería algo así como un Viaframe donde
integras todo el diferente tipo de información que acabas de reunir, luego ordenarlos visualmente e integrar los visuales que reunimos, el texto que tenemos, y luego soluciona eso antes de entrar realmente en tu programa de diseño. Entonces el siguiente paso, puedes mover todo eso en una plataforma digital, esto podría ser Adobe XD, y puedes usar las plantillas que creé para ti para que te sea más fácil empezar. Pero sí, siéntete libre de verme haciendo mi maquetación del siguiente video. Esto es probablemente útil para que empieces con tu diseño.
22. disposición/composición/diseño: Mírame trabajar: Antes de empezar a crear enmarcando nuestro layout, echemos un vistazo rápido a nuestro esquema que podemos aprobar. Aquí te dejamos una foto de los Post-its que hicimos con nuestros contornos y los diferentes visuales para los sencillos pasos. Creo que es realmente importante tener eso en mente para tener eso en algún lugar cerca de ti, también
podría estar en tu libro de trabajo porque necesitas usar esos sencillos pasos y todos los elementos que tienes ahí para crear algún diseño. ¿ Qué necesitas para eso son en realidad algunas hojas de papel, cuanto más grandes mejor. Utilizo un A3 y un trozo Sharp de lápiz negro. Empecemos. Ya viste mi contorno, quiero empezar con alguna maqueta grande, gran imagen del producto final para evitar mostrar, cuál fue nuestro producto final. Esto probablemente ya sea realmente útil. Después de eso, voy a anotar todo lo que pertenece a la introducción desde mi fila, mi tarea, por supuesto el cliente también y la línea de tiempo también. Entonces el proyecto breve con alguna imagen. Entonces me estoy dando cuenta de que quiero integrar una imagen más en el esquema por lo que
voy a poner eso en el esquema Post-it, apuntando los pasos individuales en esas hojas y luego poniéndolos a un lado. El siguiente paso será la información de antecedentes ahí. Yo quiero integrar cosas diferentes. Qué es colorear, el Maslow's necesitas pirámide, tipografía, también el grupo objetivo y las esculturas, así que estoy pensando en cómo realmente arreglar eso. Lo que puedes ver aquí es, estoy haciendo esto más o menos como lo harías para normal vía frames. Para mí, solo es importante que tenga en mente realmente dónde colocar esas cosas, donde haya un espacio amplio y ese tipo de cosas. Se puede hacer exactamente lo mismo. Ahora empiezo con el proceso, con la investigación del usuario a primera hora, quiero enfatizar las entrevistas de usuario que hice con algunas imágenes o todo una imágenes sobre la entrevista, el proceso. Después comparte la información más importante, la iteración de estilo, las entrevistas, las preguntas. Entonces comparte los insights que son claros tres insights que pensé. Pon eso a un costado. El siguiente es la parte conceptual. Todo alrededor del concepto ahí, pasé por diferentes etapas, fui a buscar la arquitectura de la información y mostrar alguna gráfica grande ahí. Siguiente son algunos bocetos que hice temprano, para poco texto y un poco de explicación también. También quiero mostrar los wireframes porque diseñé wireframes para toda
la aplicación e hice algunas primeras pruebas. Quiero compartir un poco de textos sobre las pruebas y el resultado también, en algún lugar por debajo de los wireframes también. Sin ningún retiro porque en realidad no he creado ningún retiro para pruebas. Entonces el diseño. Por supuesto, quiero compartir otras cosas que son importantes para el branding, los colores, colores primarios, secundarios con poco texto. tipografía llevó a tipo de tipografía que integré, también las imágenes y con un poco de textos también. Entonces quiero mostrar algunos elementos interactivos en maquetas animadas. Eso es realmente importante integrarse aquí. Entonces quiero resaltar también las piezas de diseño. Para las pruebas, quiero mostrar los resultados, mayormente basados en texto así que solo pienso en cómo arreglar eso. El desenlace que te dará más visual también. Quiero mostrar la maqueta final bajo el texto sobre las cosas que aprendí ahí, quiero integrar algunos elementos interactivos. El área de eventos final, el no hecho de maqueta, y también la configuración final del departamento, maqueta de onboarding. También las lecciones aprendidas desde la perspectiva empresarial son también los próximos pasos que serán desafortunados de integrarse aquí también. Al final, por supuesto, también las cosas que aprendí de probar algunas ideas más que estoy teniendo más allá de la pantalla, que están abolidas y clavos juntos etcétera Una vez que hayas terminado el contorno en el papel, puedes empezar a aprender eso en tu herramienta. Aquí te presentamos las plantillas Adobe XD, que puedes usar y ajustar todo a tus necesidades. No tienes que hacer eso ahora, puedes hacerlo incluso después de haber creado los visuales. Pero lo que realmente me gusta es simplemente conseguir los tableros de arte, ordenarlos ya, integrar el texto que escribí a lo largo de la creación del contorno, luego pensar en dónde faltan los visuales, y si debería tener que crear algunos visuales también, y cómo se ve todo. Ya puedo insertar todas las cosas que sé que quiero integrar, quizá la tipografía que quiero integrar, los visuales que quiero integrar, y sobre todo todos los textos. También puedo integrar mis propias tablas de arte. Por tan solo copiar y pegar eso e integrar mi propia tipografía ahí si no quiero integrar aquí ningún visual. Justo todo exactamente a mis necesidades aquí.
23. Imágenes: Consulta qué fotos tomaste a lo largo del proceso. Esto pueden ser imágenes que tomaste haciendo un taller o una sesión de ideación o algo más. Es súper genial en realidad integrar eso en tu caso de estudio, así que asegúrate de revisar realmente todas las imágenes que tomaste. Esta imagen que estás viendo aquí es una imagen haciendo sesión de
investigación o prueba con una visita de nosotros probando. Esos visuales e imágenes realmente ayudan a entender cómo trabajas y que realmente estuviste involucrado en el proceso, muestra todos los detalles que son interesantes para los clientes. Si no tienes ninguna imagen o no te permite mostrarlas, un pro tip es en realidad usar algún material de stock e integrarlo en tu caso práctico. Por supuesto, no reflejes las ranuras de talleres ni las sesiones de investigación, pero si quieres mostrar algo en torno a un tema específico, este es un ejemplo que creé para el espacio de vida fresco donde tristemente no se me permitió mostrar muchos de los espacios ahí. Encontré espacios muy similares en realidad en línea y los
integré en mis estudios de caso como algunos separadores entre diferentes secciones. Esto ya apoyó todo el proyecto y dio una impresión sobre cómo se ven realmente las cosas ahí. Hay dos sitios que te puedo recomendar para que revises, uno es Pexels y el otro es Unsplash. Realmente prefiero Unsplash, tienen muchas imágenes impresionantes para todos los casos que puedas imaginar,
puedes descargarlas y utilizarlas de forma gratuita y puedes usarlas para casi todas las situaciones que puedas imaginar. También puedes crear tus propios maquetas o usarlos para redes
sociales y ajustarlos y resultados realmente grandes. Definitivamente echa un vistazo a eso y asegúrate de que
estás integrando imágenes en tu caso práctico.
24. Iconos: Usar iconos en tu caso práctico de UX realmente ayuda a, sí, hacer especialmente la parte escrita más visual. Si nos fijamos en el diseño que creamos en nuestras hojas de papel, es realmente útil pensar ya en los diferentes tipos de áreas de textos que quieres integrar y pensar si los iconos apoyarían tu punto ahí. Esto es lo que hice aquí. En realidad a lo largo del proceso, se
me ocurrió, sí, tres insights, y quiero apoyar esos tres insights con tres iconos que necesito crear después. Realmente no los he creado para el proyecto ni algo así,
así que sólo los voy a diseñar para el caso de estudio. Al final, se puede ver el resultado final, y creo que realmente vale la pena poner algunos esfuerzos en el diseño de iconos. Porque imagina ese escenario sin los iconos, se vería completamente diferente. Aquí aquí, sobre todo la combinación entre los textos, por lo que elegir un color resaltado para los iconos, realmente hace que todo el asunto sea mucho más visual y mucho más interesante de ver y leer en realidad. Si no quieres diseñar los iconos tú mismo, aquí te dejamos algunos sitios que te puedo recomendar. A pesar de que mis favoritos son definitivamente Material Design y Font Awesome, pero también plug-ins que puedes descargar para un Sketch, o Figma, o Adobe XD, sea cual sea el software que estés usando, luego integrarlos justo desde el plug-in a tu en su herramienta de diseño. Definitivamente asegúrate de integrar algunos iconos en tu caso práctico de UX.
25. Tipografía: Lo primero que hay hacer es en realidad
que guardes el nombre. En realidad la dirección
de la página web. Para mí, en realidad usé
patriciareiners.de or.net. Utilicé mi nombre y
mi apellido porque mi idea era en realidad que si los clientes me Google, me encuentren. Lo que puedo recomendarte
es hacer exactamente lo mismo. Esto realmente tiene sentido, si la gente quiere
encontrarte te encontrarán. Así que solo usa tu
nombre y apellido. Depende poco si
tienes arcos o algunos otros nombres por los
que eres conocido, o si estás
construyendo una agencia, entonces usa ese nombre. Pero considera que realmente
bien al principio antes de decidir realmente
dónde quieres acoger eso. ¿ Dónde alojar sus estudios de caso
UX y toda su cartera de diseño? Esa es una pregunta realmente buena. Creo que para eso, es realmente importante que
respondieras tu objetivo. ¿ Qué es lo que realmente
quieres lograr con tus estudios de caso,
con tu portafolio? ¿ En realidad quieres
conseguir cliente como diseñador independiente de UX/UI
o quieres
presentarte en línea para conseguir ranuras de
taller o ser
invitado como orador, o tal vez
incluso estás planeando hacer una tienda o vender sus
propios servicios en línea? Considera eso en
un principio, porque si quieres enfocarte en conseguir clientes
y ser visto en línea, puedo recomendar algunas redes
sociales como Behance por ejemplo, que es completamente gratis y te
ayuda a ser
visto por los clientes. Si estás planeando integrar
diferentes cosas como diferentes elementos como una
tienda o cosas así, lo mejor probablemente sería elegir algo
donde puedas integrar una tienda desde el
comenzando o incluso si tienes la opción como
WordPress por ejemplo. Vamos a hablar las diferentes opciones
en este video, y también sobre los precios, y de lo que puedo recomendar. Por lo que encontrarás la herramienta
adecuada para ti. Empecemos con el
primero, que es WordPress. WordPress es una función que crea todo el
sitio web para ti, por lo que realmente no
necesitas cómo codificar. Aunque si
sabes codificar, puedes ajustarlo todo. Porque viene en temas, así que sí, puedes ajustar
esos diferentes temas. También puedes descargar plugins
y diferentes aplicaciones. Lo que es realmente genial y útil
es que puedes descargar plantillas
específicas y
usarlas para solo subir
tu contenido. Diseñé mi propio sitio web
atrás en los días, creo como
hace seis años con WordPress. Es bastante fácil, y super bonito porque
puedes ajustarlo todo y obtener todos los complementos
descargando plugins. También tienes una
visión bastante buena desde la analítica hasta todos los diferentes
sitios y es súper fácil de ajustar eso. Así es en realidad cómo se ve mi
sitio web en el back-end. Cuando quiero ajustar o
hacer algunos cambios de diseño, en realidad
se ve así. Súper fácilmente en realidad
para mí cambiar las cosas, o ajustar mi cartera, o subir tus estudios de caso de UX. Las plantillas
suelen ser bastante baratas. Yo pagué, creo que alrededor de
50 dólares por los míos, y ya seis años, ya
bastante tiempo. Pero creo que
todavía se ve muy bien y se puede
ajustar todo. Un proveedor que resuelve programas
realmente bonitos es Envato. Por lo que definitivamente puedes
comprobar eso. Lo bueno con WordPress
es que también puedes integrar diferentes funciones
como una tienda por ejemplo, y puedes ajustar todo
el diseño y
personalizar casi todo. Otra opción realmente buena es en realidad Squarespace,
squarespace.com, donde solo puedes elegir
diferentes plantillas, diferentes diseños para tu caso de estudio,
para tu portafolio. Tienen muchas
plantillas en su página web. Incluso puedes empezar por encontrar el diseño perfecto o la plantilla perfecta para
lo que quieras mostrar. Tienen mucha área de diseño
realmente cool. Es súper fácil para
ti encontrar eso. Simplemente echa un vistazo a la página web. Lo que es súper útil, creo, es que tengas una encuesta, para que realmente puedas revisar de
qué se trata tu sitio, cuáles son tus objetivos,
¿qué quieres
hacer , y esas cosas? Es súper útil
para ti encontrar las plantillas adecuadas para ti. Su diseño es super bonito. Entonces al final, después de que eligieras una plantilla, puedes ajustar todo el
asunto desde colores, hasta fotografías, hasta texto,
a casi todo. Lo bueno con todas
las plantillas de Squarespace, es que ya se ven
súper hermosas. Desde las perspectivas de UX, están súper bien hechas, lo cual creo que es útil porque no se necesita
mucho tiempo y esfuerzo para llegar
a cualquier codificación o
diseño que ellos mismos. El único punto negativo es
que es bastante caro, depende del plan que
quieras obtener mensualmente, anual, o cualquier
opción que quieras. Son alrededor de los 10 dólares mensuales, que debes
considerar antes de conseguir eso porque es
un pago mensual. Es un pago que
regresa cada mes. Otra
opción muy similar es la Wix. En realidad hay más
que Squarespace y Wix, pero esos son en realidad
los grandes. Wix se
parece más o menos a Squarespace. El diseño es un poco
diferente y es por supuesto, un poco más barato. Tienes diferentes opciones de
pago, que puedes ver aquí. Solo asegúrate de que una de
las opciones de pago realmente con anuncios para Wix. De mi recomendación, sólo
puedo decir que no integren ningún anuncio para
algo más que tu trabajo. Esto se ve muy poco profesional, por lo que o tomas el combo, o la opción ilimitada si quieres trabajar
con Wix aquí. Otra opción realmente buena
es Behance, behance.com. Es una red social para creativos, todo
tipo de creativos. Fotografías, animadores,
videógrafos, casi todos también
UI/UX sobre diseño gráfico. Es una plataforma realmente grande que funciona como
red social también. Es bastante fácil
conectarse entre sí y ser visto como un creativo. Además de eso, es
completamente gratis, así que tenlo en cuenta. Lo realmente bonito es
que es fácil para ti encontrar inspiración también. También tienen historias,
como historias de Instagram de diferentes hashtags donde
puedes vincular tu trabajo. Tienen diferentes transmisiones
en vivo. Si quieres aprender algo, puedes integrar tu propio
perfil allí donde
puedes subir tus estudios de
caso de UX y luego se ve
algo así. Sube tus casos
prácticos por ahí, y puedes integrar los
diferentes elementos que diseñamos en nuestro diseño. Lo realmente bueno
aquí es que tienes esta opción de descubrir donde por supuesto
puedes
descubrir otros trabajos. Pero aquí en el área en la parte superior, durante el grupo de interacción, se
puede encontrar todo
el trabajo que se presentó en la sección de
interacción. Muchos ojos realmente llegan a ver el trabajo
que se presentó allí. Para ti, ser creativo, ser destacado en Behance es como lo mejor
que te puede pasar, porque muchos
clientes, te encontrarán. Muchos clientes también de empresas
más grandes
están buscando a través Behance para encontrar creadores
para su trabajo. Behance es la opción de regrade, sobre
todo si
quieres enfocarte en tu trabajo, quieres conseguir clientes,
querer ser visto, quieres conocerte
por estilos específicos, y tal vez incluso no
quieras poner mucho enfocarse o trabajar en crear
tu propio sitio web, pero empezar
con algunas cosas. Behance es una opción realmente buena no sólo para el principio, sino algo que está en curso, e incluso además de su sitio web. Como puedes ver,
tengo un perfil de Behance, pero también tengo mi página web, y honestamente
empecé con Behance, subiendo mi trabajo ahí para simplemente tener
algo por ahí, y guiar a todos la gente
a través de mi página de Behance, que es gratis. También hice mucha
conexión a través de Behance. Así que definitivamente echa un vistazo a eso. Otra opción realmente buena, sobre todo si tienes la
membresía de Adobe Creative Cloud, es Adobe Portfolio. Es completamente
gratis y puedes vincular súper fácilmente tu caso de estudio de
Behance, por lo que toda tu cartera de
Behance es un PDF diferente o incluso subir tus propios casos prácticos de UX
allí por completo para libre. Tienes diferentes plantillas, tienes diferentes
opciones de diseño para ajustarlo todo. Por lo que esta es una opción realmente
buena también. Puedes ver aquí yo
había
integrado automáticamente todo mi
trabajo en Behance. Ahora puedo ajustar lo que
realmente quiero mostrar ahí. Por ejemplo, si
quiero presentar algo para un trabajo específico, y sólo quiero mostrar tres estudios de caso
diferentes, puedo hacerlo aquí con un enlace
especializado también, por lo que esto funciona muy bien. Puedo hacer todos los ajustes en el lateral desde opciones de diseño, hasta espaciado, hasta diferentes elementos de
navegación, hasta algunas plantillas, que también se pueden ver aquí. Al igual que puedes ver muchas
plantillas diferentes o
simplemente puedes elegir lo que realmente se adapta mejor a ti y sobre todo llevar a
tu especialidad. Podría ser UI/UX. Como puedes ver, hay un millón de opciones por ahí donde puedes alojar
tu portafolio. Depende mucho tus metas y de lo que realmente quieras lograr con eso. Mi recomendación es realmente preguntar alrededor,
preguntar
a diferentes otros
creativos, o amigos,
o compañeros de trabajo donde están
hospedando su portafolio, sus estudios de caso de UX, y también preguntar por qué? A lo mejor obtienes algunas ideas
interesantes sobre razones específicas. Si eres capaz de
codificar eres libre de
codificar tu propio sitio web y
realmente personalizar todo. Pero asegúrate de que
esto sea mucho tiempo, y sobre todo si no
eres el pro codificador, es mucho tiempo y esfuerzo en realidad
ajustar los casos prácticos. Porque por mi experiencia, estoy ajustando mis estudios
de caso de vez en cuando un poco, o quiero agregar algo, o incluso si quiero
subir un nuevo estudio de caso, es mucho más fácil si
tienes algún anfitrión, podría ser WordPress, o
Squarespace, o incluso Behance. Otra cosa a
considerar es que si usas una de esas
herramientas que acabo de recomendar, siempre
tienes algunas plantillas. No eres 100 por ciento libre de hacer el diseño
que realmente quieres. Si tienes algo
muy especial en mente y si no quieres
usar ninguna plantilla, la única opción para ti
es probablemente solo
codificarlo tú mismo o pagar a alguien para que lo codifique. Si bien esto es
definitivamente más caro y no tan práctico
en el uso diario. Vamos a hablar
sobre cómo subir tus estudios de caso de Behance
en el siguiente video.
26. Maquetas: Hablemos realmente brevemente de maquetas. Lo que es realmente útil es si estás usando maquetas para tus visuales o para presentar realmente las pantallas, tus diseños, o las animaciones, o las interacciones que te ocurrieron en maquetas reales. Lo bueno es que hay un millón de recursos gratuitos por ahí en línea, cuales puedes simplemente descargar, elegir, e integrar tu diseño
y luego subirla probada a tu ex caso de estudio. Un maqueta realmente espera mostrar tu diseño en acción. Esto podría ser una imagen del dispositivo para el que diseñas, o alguien sosteniendo un teléfono y navegando a través de tu aplicación por ejemplo. Lo que puedes hacer es diseñar dos, así que maquetas PNG, pero también maquetas animadas. Vamos a hablar de eso en el próximo video. En realidad integré dos tipos
de maquetas en este curso para que puedas descargarlas gratis. Vienen con el curso. Una es para Photoshop donde solo puedes integrar tu diseño, tus pantallas que diseñaste, es una maqueta de iPhone. Siéntete libre de simplemente descargar eso y déjame mostrarte cómo realmente integré la maqueta de mi diseño. ¿ Dónde se pueden encontrar buenos maquetas? Normalmente solo Google el tipo de maqueta que busco. Este es un sitio realmente, realmente útil. Mucha maquetas gratis donde se puede buscar áreas específicas. Ahora seleccionamos el iPhone. Podemos ver todas las maquetas que están disponibles para algún fondo de iPhone. Segundo sitio, más aún un montón de cosas diferentes, por lo que solo puedes elegir lo que quieras. La mayoría de ellos son en realidad gratis, por lo que solo puedes descargarlos y no necesitas pagar nada. Incluso el que son versiones pagadas no es realmente caro. De mis experiencias es que realmente vale la pena pagar alguna cantidad de dinero porque nos veremos muy bien al final. Tan solo asegúrate de que estás descargando un archivo PSD, y no un JPEG, porque en el archivo PSD eso será realmente fácil de integrar para el diseño. Empecemos con la maqueta que diseñé para ti, que realmente viene con el curso. Te guiaré a través este solo paso para crear tu propio simulacro con tu propio diseño. El primer paso es en realidad que abres tu software de diseño, lo que sea que estés usando, y vas a exportar la pantalla que se colocará en tu maqueta. Súper fácil. Simplemente vas a seleccionar la salida, clic en Exportar y luego exportar la pantalla. Después cambias a Photoshop, abres el archivo de la maqueta. Después puedes ver los diferentes diseños utilizados, la iluminación y luego abajo tienes las diferentes pantallas. Aquí vas a colocar tu diseño, el marco, las sombras, todas están colocadas en una sola capa. Eso se puede ajustar, o lo vamos a hacer después de colocar nuestro diseño. Haga doble clic en el objeto Smart, y aquí podrá colocar su diseño. Simplemente inserta tu diseño que acabamos de exportar desde el software de diseño. Y lo haces con arrastrar y soltar. Simplemente elige el archivo y colócalo ahí y luego ajusta el tamaño para que realmente se ajuste al marco. Entonces lo que realmente importa es seguro. Comando S para guardar esos objetos inteligentes realmente importantes, coloca eso en el lugar correcto. También puedes eliminar los otros archivos ahí. Asegúrate de guardarlo. Después vuelve a tu modelo original de PSD. Aquí se puede ver que se colocó en el archivo de pantalla. Ahora vamos a hacer algunos ajustes aquí. Puedes ver el fondo y puedes elegir el collage de fondo solo tienes que hacer doble clic sobre él y luego cambiar el color al color que quieras. A veces lo que realmente me gusta es elegir un color que realmente se ajuste al diseño y presentar en la pantalla. Aquí, estoy jugando un poco buscando diferentes colores lo cual sería un buen ajuste, buscando algo anaranjado pero no demasiado. Simplemente puedes jugar, echa un vistazo a eso. Lo que también puedes hacer es cambiar el color del marco, el marco del iPhone, hacer doble clic en eso, obtienes todos los ajustes y luego tienes el color a opción aquí y simplemente cambia eso al color que prefieras. Podría ser negro, podría ser plata, podría ser algo coloreado si realmente quieres promocionar los colores ahí también. Usa algún tipo de color rojo naranja también, que puede verse realmente realmente, realmente genial. Simplemente juega un poco y elige el color perfecto para tu diseño. Esto se ve bien. Otra cosa que creo que es realmente útil o bueno saber es que sólo se puede copiar. Copia el diseño aquí. Sólo tienes que copiar y pegar. Entonces manda T y mueve eso hacia un lado. Entonces puedes colocar sus diferentes pantallas. Tendrás ya dos pantallas. Simplemente asegúrate de cambiar el nombre del objeto inteligente. Si es el mismo objeto, entonces vas a tener la misma imagen, ahí también. Pero si cambias el nombre de eso, puedes simplemente cambiar el diseño aquí también. Volvamos a nuestras otras semanas diseño o archivo de diseño, exportar en la pantalla podría ser éste. Después de eso, vamos a emplear TS1. Como dije, usualmente hago esa prueba de arrastrar y soltar. Simplemente colóquelo aquí. Exactamente, y luego guardar. Ya está ahí. Eso puedes hacer con tantas pantallas como quieras. Simplemente copia y pega toda la carpeta del iPhone. Tienes diferentes opciones ahora para ajustar el diseño. Por ejemplo, puedes quitar el fondo, guardarlo en tu computadora. Ya guardaste eso como PNG. Eso es realmente útil, sobre todo si no tienes antecedentes. Después de eso, puedes volver a tu archivo Adobe XD o cualquier diseño que estés teniendo. Presenté todas estas plantillas para ti. Simplemente puedes colocar tu diseño del PNG que acabas de crear en esos pasos de diseño único. Ajustar un poco el tamaño. Yo quiero un poco más grande. Entonces ya está terminado. Vamos a resumir esto bastante brevemente. ¿ Cuáles son los takeaways creando maquetas de estudiantes o PNG? En primer lugar, exporta tus diseños en PNG para que la pantalla que diseñaste, abra la maqueta en Photoshop. Coloque su diseño en el objeto inteligente con el nombre colocado signo aquí, guarde el objeto inteligente, y luego haga otros ajustes que desee. Elimina el fondo, cambia los colores de fondo, o haz los ajustes que quieras. Después exporta la maqueta como PNG e insértela en tu maquetación, cual podrás exportarlas e integrarlas en tu sitio web.
27. Animaciones: En este video, vamos a hablar de animación, así que cómo crear animaciones impresionantes para tu caso práctico de UX las cuales están listas para subir en tu caso práctico de Behance o incluso en tu página web. Aquí hay algunos ejemplos y algunas formas de cómo
realmente puedes hacer eso usando la plantilla que creé para ti. Esta es la plantilla, espero que hayas descargado eso porque vamos a usar eso para los diferentes GIF y los videos que vamos a crear ahora. Vamos a empezar con el GIF y así crear una maqueta animada. Primero lo primero, crea un video a partir de tu animación. Ve al modo de vista previa en tu herramienta de diseño Adobe XD por ejemplo, graba
eso, reproduce tu animación, podría ser una pequeña o larga, realmente no
importa, termina la grabación y luego guarda eso donde quieras. Perfecto. Ahora, vamos a cambiar a nuestras plantillas. Abre la plantilla que creé para ti. Aquí podemos ver todas las carpetas, todos los diferentes archivos que se integran y también la composición que se llama coloca aquí tu diseño, abre eso y luego coloca tu video dentro. Se puede ajustar el tamaño ya sea por Comando S y ajustar la escala, o bien hacerlo a mano, haciendo clic en los pequeños pickers de los bordes. Asegúrate de que esté perfectamente alineado a los bordes. Perfecto, esto se ve bien. Entonces vuelve a tu composición, y lo que puedes ver aquí es que automáticamente se coloca en la perspectiva correcta sobre esa zona. Si haces clic en la “Barra Espacial”, se reproduce la animación, para que puedas ver toda la animación. Pero otra cosa que necesitas para ajustar la longitud de la composición. Al usar ese pequeño picker en la parte superior, mueve eso a la longitud perfecta que solo exporta el tamaño que necesitas. Perfecto. Tenemos alrededor de cinco segundos para nuestra animación, que es perfecta. En el siguiente paso, vamos a exportar eso. También podemos hacer algunos ajustes, por ejemplo, quitar el fondo, cambiar el fondo en elementos gráficos específicos. Ahora vamos a dar clic en “Exportar” y luego hacer clic en el renderizador del codificador. Me gusta mucho usar el Encoder Renderer, viene de tu Adobe Suite. Si no tienes eso, no te preocupes, solo
puedes renderizar eso con tu sistema de renderizado normal de After Effects. Eso realmente importa para ese sistema. Pero lo genial es con el codificador que puedes mover eso a MP4, así que eso es realmente útil. Ahora, tenemos que esperar un par de segundos hasta que se añada a la línea aquí a la señal de render y luego podemos simplemente renderizar haciendo clic en el botón verde en la parte superior izquierda. Ahí está. Ahora podemos hacer click en “Render” y luego se renderiza automáticamente. Por lo que tenemos un video fuera de esta composición, creamos un After Effects. Esto se ve bien. Tan solo asegúrate de que tenemos H264 en nuestra configuración aquí, y luego podemos simplemente empezar renderizando. puede ver en la parte inferior que se está renderizando, En realidad es bonito, bastante rápido y la calidad es buena, así que esto está funcionando bien. Ahorra en el lugar que mostraste al principio. Sí. Casi terminado entonces vamos a exportar eso también a After Effects. Vamos a tomar esa animación cuando
termine el renderizado y ponerle eso a Photoshop. Abramos de nuevo Photoshop y coloquemos el video ahí dentro. Se puede ver que hay una línea de tiempo en la parte inferior, lo cual es realmente genial. El siguiente paso es en realidad que estamos usando eso para [inaudible] un GIF porque se puede hacer eso en Photoshop, pero no en After Effects o Premier. Por lo que necesitas usar Photoshop también. Puedes encontrar la función de exportación GIF y en la parte superior lo vamos a hacer en un segundo. Simplemente asegúrate de que tu GIF no sea demasiado largo, todo menos de seis segundos es genial. Puedes hacer click en “Exportar” y luego lo puedes encontrar aquí, solo tienes que dar click en eso. También puedes usar el atajo si quieres, lo que prefieras. Está un poco oculto en realidad para exportar la función GIF. Pero si sabes cómo hacerlo, entonces en realidad es bastante fácil. Entonces haz clic en eso, y después de eso, también puedes ajustar el tamaño. El nuestro es realmente grande porque empecé con un tamaño realmente grande. Entonces vamos a hacer eso un poco más pequeño como 800-800 y asegurarnos de que se repita. Ahora, asegúrate de dónde quieres guardar eso, el nombre, y luego haz clic en “Guardar”, y luego se guardará automáticamente en el lugar donde lo pones en realidad, así que bastante fácil. Entonces al final se verá así. Entonces haces clic y ves que se repite todo el tiempo. El segundo GIF es una mesa de trabajo animada desde tu plataforma de diseño. Podría ser algo así en el caso de estudio Behance, donde se ven áreas animadas. Si mueves eso a tu escritorio, verás que es un GIF, en el tamaño perfecto del diseño. Lo ajustas, puedes subir eso en tu página web, pero también en Behance. Se ve realmente genial, ¿verdad? Te voy a mostrar cómo puedes hacer eso en el tamaño perfecto. Así que vuelve a Adobe XD o cualquier plataforma de diseño que estés usando. Para Adobe XD, puedes hacer click en la mesa de trabajo y dar click en “Exportar”, y luego podrás exportar eso a After Effects de inmediato. Entonces eso en realidad es cosa realmente genial. Se abre en After Effects. No te preocupes, parece que acaba de exportar el rectángulo azul, pero en realidad exportó todo. Entonces lo que puedes hacer ahora es crear un fondo sólido uno blanco, y exportar eso aquí. Ahora vas a integrar el diseño que hicimos antes. Simplemente puedes colocar eso a la zona que quieras. También puedes quitar el rectángulo azul. Esto era sólo algún marcador de posición. Siéntase libre de quitar eso. Puedes ajustar el texto de un lado, hacer lo que quieras, sigue en el vector, por lo que no puedes ajustar lo que quieras. Asegúrate de ajustar el tiempo de las composiciones, por lo que alrededor de cinco segundos y luego volveremos a hacer exactamente lo mismo. Vamos a renderizar eso en el codificador de medios y crear primero un video. Después de eso, vamos a poner eso también en After Effect. Perfecto. Ya está hecho, podemos dar click en él y luego simplemente poner eso en After Effects como la última vez. Ahí está, perfecto, se ve muy bien. Ahora vamos a exportar eso exactamente como la última vez, como el último GIF exportar esa carpeta y luego crear un GIF también. Aquí está el GIF final exactamente listo para subir en tu caso práctico de Behance. Si tienes videos más largos, entonces echa un vistazo a los siguientes videos porque ahí vamos a hablar cómo puedes crear videos más largos, cómo puedes subirlos y cómo puedes integrarlos en tu caso práctico de UX.
28. Videos: ¿ Dónde puedes realmente integrar videos en tu caso práctico de UX y dónde realmente tiene sentido? Te voy a mostrar un ejemplo fuera de mi caso de estudio de UX, donde integre un video súper corto dentro del caso de estudio. Este video trata de algún tipo de flujo de usuario, algún tipo de conversación de usuario como una conversación de Alexa, asistente
inteligente con el sistema. Porque es más larga que unos segundos y la voz está integrada, no
pude simplemente subir un GIF porque la voz de un GIF no está integrada, así que necesitaba formar un video, realidad animado que en After Effects y luego poner eso en Vimeo, como puedes ver aquí y luego incrustado eso en mi caso de estudio UX. Como puedes ver aquí, está alojado en Vimeo y embebido súper fácilmente. Este es el caso de estudio que me gusta mucho, creo que es súper hermoso, en realidad armado como toda una narración. Me encantan especialmente los videos que aquí se integran. Especialmente este video donde puedes ver el flujo del usuario, por lo que todo lo que ya está animado, que ya está integrado en tu diseño, acaba de ser filmado, puesto en una maqueta, juega con fondo realmente bonito y luego subido a tu estudio de caso. Esto en realidad está alojado en YouTube, pero al final, es absolutamente tu decisión donde hospedas tu trabajo y donde subes eso. Creo que eso es súper útil para que los clientes vean cómo realmente interactúan las cosas entre sí, cómo funcionan las transiciones. Es mucho más visual que solo mostrar el flujo del usuario. Especialmente en Behance o en todos tus casos prácticos, todo lo que es animado y realmente tiene sentido, por lo que aporta algún valor, es útil para que el cliente entienda eso, sobre todo como en el diseño de interacción. Aquí puedes ver alguna película de casos. Alguien diseñó un hermoso estuche a partir de explicar todo el producto. Esto es un poco más complicado, no sólo filmar la interacción, sino animar cosas en After Effects. Si eres un pro de After Effects, eso probablemente sea algo bueno, pero realmente no se necesita, es más bonito add-on. Al igual que puedes ver aquí, agregaron con alguna deriva y ahí está donde la diferencia entre esos dos. Los videos son para diseños más largos, videos más largos. Ahora, te voy a mostrar cómo estoy diseñando mis videos para mis casos prácticos con After Effects y Adobe XD. Animaciones o grabaciones más largas son perfectamente para videos y te voy a guiar a través de ese paso a paso. El primero es en realidad un proyecto, así que abres el proyecto que
quieres grabar y donde realmente quieres mostrar el prototipo. Podría ser casi todos los software, estoy usando Adobe XD y aquí se puede ver en el modo prototipo que conecté diferentes cosas, así que es interactivo. Cuando estoy seleccionando una mesa de trabajo y haciendo clic en el icono de juego pequeño aquí, obtengo esta ventana de vista previa la cual puedo grabar. En realidad, la grabación funciona haciendo clic en eso y automáticamente graba. Entonces ahora todo lo que estoy pinchando se graba. Lo que quiero hacer ahora es hacer clic a través de la app y mostrar el flujo básico de incorporación. Mi cita, está bien. Entonces volvamos a la vista de inicio, puedo desplazarme un poco y luego seleccionar solo uno de esos enlaces aquí. Creo que volveré a la pantalla de inicio. Perfecto, esto se ve bien. Llamaré a ese flujo de usuario coliving y guardaré eso en mi escritorio. Puedo cerrar eso de vez en cuando ir a mi herramienta de software de videos. Me gusta mucho After Effect, así que estoy haciendo casi todo con After Effects. También puedes usar Premiere o qué otro tipo de herramienta de edición de video prefieras. Como dije, me gusta mucho After Effects pero puedes usar lo que quieras. Ahora, crea una nueva composición con los 1920, 1080 y alrededor de 33 segundos. Haga clic en “Ok”, aquí está. Eso se ve bien. Entonces lo siguiente es realmente integrar todos los activos que necesito. Ya preparé el video, pero eso no es suficiente. También quiero diseñar un fondo realmente bonito. Esto es lo que ya he preparado. me ocurrió una mesa de trabajo, asegúrate de que sea exactamente igual al mismo tamaño o vuelvo al modo de diseño, asegúrate de que sea exactamente el tamaño de diseño que necesitas. Entonces solo puedes exportar eso, lo nombras y luego lo exportas, selecciónalo y luego puedes exportar eso. Por lo que tenemos un buen fondo para la maqueta. En el siguiente paso, voy a insertar todas las cosas que necesitamos y luego podemos empezar con el diseño. Esto se ve bien y luego voy a insertar la maqueta. También tienes la maqueta en tu carpeta, por lo que solo puedes usar eso si quieres. Voy a cambiar un poco el tamaño para que sea exactamente como quiero que se vea al final. Entonces déjame ver. Aquí está el video, necesito ajustar el tamaño también. Eso ya se ve bien. Otra cosa que realmente me gusta hacer es, aquí, tengo la maqueta, así que en realidad está arriba. Aquí, tienes el pequeño símbolo de hielo para que solo lo hagas invisible, y esto es lo que voy a hacer ahora realmente rápido porque quiero tener algunos bordes redondeados, y por lo tanto que sólo necesitamos enmascarar eso. Asegúrate de que en la parte superior tengas la maqueta, luego tengas el video, y luego tengas el fondo. Estamos pasando por ese paso a paso. Lo que voy a hacer es que voy a hacer visible la maqueta, y luego seleccionar el video, sólo
tienes que insertarlo. Voy a elegir una herramienta de rectángulo redondeado, y voy a colocar eso encima del video. Después con las flechas pequeñas que tienes en tu teclado, las flechas arriba y abajo, puedes ajustar un poco los ángulos. Ahora, se hace más grande. Perfecto. Sabemos que enmascaramos eso. Si vemos ahora la maqueta de arriba, vemos que encaja perfectamente en ese marco. Eso se ve bien. Perfecto. Otra cosa, así que si jugamos aquí, vamos a ver que todo el asunto es interactivo, y que en realidad ahí se muestra toda la animación. Se ve bastante bonito. Otra cosa que quiero integrar aquí es que quiero integrar algunas sombras. Parece que la maqueta es un poco flotante. Voy a seleccionar el flujo de usuario living MP4, y luego voy a ir a dar click en sombra, y luego tenemos la sombra de gota. Aquí, tienes el panel de efectos y presets. Si no tienes eso, entonces haz clic en “Ventana”, y agrega panel Efecto, y puedes usar la sombra de gota, coloca eso en el video [inaudible]. Entonces de este lado, obtienes todos esos ajustes, y ahí puedes jugar un poco alrededor de cómo te gusta eso. Esto ya es mucho, así que esta es la distancia que acabo de cambiar. Entonces también quiero cambiar un poco la suavidad, y luego tenemos la opacidad. He reconocido renderización. Esto se ve bien. Perfecto. Primer marco. Bonito. Lo que podemos hacer ahora es que tenemos en realidad el pasillo ya está terminado, por lo que podemos hacer clic en Archivo, Exportar, y luego exportar a Adobe Media Encoder Query. También puedes ir a la consulta de render, pero me gusta mucho el software del codificador. Eso en realidad está incluido en tu Adobe Creative Suite, por lo que solo puedes usar eso. Es súper genial. En realidad, si quieres explotar algo para tus redes sociales, etcétera te recomiendo encarecidamente revisar eso. Ahí está. Ya pueden ver nuestra animación. Sólo podemos comprobar. Tenemos que asegurarnos de que sea H264, y ahí está. Después de renderizar el video, solo
puedes subirlo en Vimeo o en YouTube, lo que prefieras. Honestamente prefiero Vimeo, así que es súper fácil subirlo, solo tienes que dar click en el nuevo elemento de video aquí y se sube automáticamente y luego puedes hacer algunos ajustes después de que se cargue. En primer lugar, se puede cambiar el título. Vamos a usar ese flujo de usuario co-living. Perfecto. Entonces podemos agregar una descripción, podemos agregar alguna otra pantalla de impresión, y tener algunas otras configuraciones aquí también. Voy a guardar eso. Perfecto. Esto lleva algún tiempo hasta que todo esté listo. Si queremos incrustar eso ahora en nuestra historia de Behance, estamos en consultas de Hance, vamos a dar click en el “Modo Compartir” aquí. En realidad está en alemán, pero normalmente no. Ahora, vamos a dar click en “Compartir”, copiar modo embebido, y ahora volvamos a Behance. Aquí, hacemos click en y “Embed Media”. vamos a pegar el código copiado. Haga clic en “Incrustar”. Entonces eso lo agregará automáticamente a nuestro caso de estudio. Aquí, tienes el video. Aquí están todas las comidas para llevar. Asegúrate de subir tus videos en otra plataforma de video como podría ser YouTube o Vimeo. Asegúrate de tener suficiente espacio depende qué tipo de configuración tengas realmente o qué tipo de perfil tengas. Para el perfil gratuito, puedes subir 500MB por semana. Eso es absolutamente suficiente en un estudio de caso, puede ser incluso para ti también. Asegúrese de que está seleccionando el tamaño correcto, que es 1,920x1,080. Ábrelo y pulsa “Compartir”, selecciona tamaño fijo y escribe 1920x1080. Selecciona reproducción automática y bucle. Anular la selección de todas las casillas de verificación de intro, retratos, etc. Ocultará todos los elementos de miniaturas de video. En tu caso, eso es bastante útil. Si quieres incrustarlo en tu caso de estudio de Behance, copia el código incrustado y pégalo usando Embed Media en Behance, y ya estás bien para ir.
29. Dónde organizar tu caso de estudio: Lo primero hacer es que en realidad
guardes tu nombre de dominio, así que en realidad sea dirección
para el sitio web. Para mí, en realidad usé
patriciarainas.de or.net. Utilicé mi nombre y mi apellido porque mi idea era en realidad que si los clientes me
Google, me encuentren. Lo que puedo recomendarte
es hacer exactamente lo mismo. Esto realmente tiene sentido. Si la gente quiere
encontrarte te encontrarán, así que solo usa tu nombre y
apellido. Depende como un
poco si tienes algún tipo de arcos o algún otro nombre
donde te conozcas
por ello o si estás construyendo una agencia, entonces usa ese nombre pero
considera que lo hará evoluciona al
principio antes decidir realmente dónde
quieres acoger eso. ¿ Dónde alojar sus estudios de caso de
UX y toda su cartera de diseño? Esa es una pregunta realmente buena. Creo que para eso, es realmente importante que
respondas a tus metas. ¿ Qué es lo que realmente
quieres lograr con tus estudios de caso,
con tu portafolio? ¿ En realidad quieres
conseguir cliente como diseñador independiente de UX UI
o quieres
presentarte en línea para obtener ranuras de
taller o ser
invitado como conferenciante, o tal vez incluso planeando hacer una tienda o para vender
su en servicios en línea. Considera eso en
un principio, porque si quieres enfocarte en conseguir clientes
y ser visto en línea, puedo recomendar
alguna red social como Behance por ejemplo, que es completamente gratis y te
ayuda a ser
visto por los clientes. Si estás planeando integrar
diferentes cosas como diferentes elementos como una
tienda o si cosas así, lo mejor probablemente sería elegir algo
donde puedas integrar una tienda desde el
comenzando o incluso si tienes la opción como
WordPress por ejemplo. Vamos a hablar de
las diferentes opciones en este video y también sobre los precios y lo que
puedo recomendar, que encuentres la herramienta
adecuada para ti. Empecemos con el primer
idioma que es WordPress. WordPress es alguna función que crea todo el
sitio web para ti. Realmente no
necesitas cómo codificar. Aunque si
sabes codificar, puedes ajustarlo todo
porque viene en temas. Puedes ajustar esos
diferentes temas. También puedes descargar plugins
y diferentes aplicaciones. Lo que es realmente genial y útil
es que puedes descargar plantillas
específicas y
usarlas para solo subir
tu contenido. Diseñé mi propio sitio web
atrás en los días, creo como
hace seis años con WordPress. Es bastante fácil y súper
agradable porque puedes
ajustarlo todo y obtener
todos los complementos descargando plugins. También tienes una
visión bastante buena desde la analítica hasta todos los diferentes
sitios y es súper fácil de ajustar eso. Así es en realidad cómo se ve mi
sitio web en el back-end. Cuando quiero ajustar o
hacer algunos cambios de diseño, en realidad
se ve así. Súper fácilmente en realidad para
mí cambiar cosas o simplemente mi cartera o subir
tus estudios de caso de UX. Las plantillas
suelen ser bastante baratas. Yo pagué, creo que alrededor de
50 pavos por los míos. Ya tienen seis
años ya bastante tiempo, pero creo que
todavía se ve muy bien y se puede
ajustar todo. Un proveedor que vende programas realmente
bonitos es Envato, por lo que definitivamente puedes
comprobar eso. Lo bueno con WordPress
es que también puedes integrar diferentes funciones
como una tienda por ejemplo, y puedes ajustar todo
el diseño y
personalizar casi todo. Otra
opción realmente buena es en realidad Squarespace, Squarespace.com, donde solo puedes elegir
diferentes plantillas, diferentes diseños
para tu caso de estudio, para tu portafolio que mucha plantillas
en su página web. Incluso puedes empezar por encontrar el diseño perfecto o la plantilla perfecta para
lo que quieras mostrar. Tienen mucha área de diseño
realmente cool. Es súper fácil para
ti encontrar eso. Simplemente echa un vistazo a la página web. Lo que es súper útil,
creo es que
tienes alguna encuesta. Puedes volver a comprobar de qué
es tu lado, cuáles son tus metas,
qué quieres
hacer y esas cosas. Súper útil para que encuentres las plantillas adecuadas para ti. Su diseño es super bonito, y luego al final, después de que eligieras una plantilla, puedes ajustar todo el asunto. Desde los colores hasta las fotografías hasta el texto, a casi todo. Lo bueno con todas
las plantillas de Squarespace, es que todas ya se
ven súper hermosas. Desde la perspectiva de UX
están súper bien hechos, lo cual creo que es útil porque no se necesita
mucho tiempo y esfuerzo para llegar
realmente a cualquier codificación o
diseño sino a sí mismos. El único punto negativo es
que es bastante caro, depende del plan que
quieras obtener mensualmente, anual, o cualquier
opción que quieras. Es redondo como 10
dólares al mes, que debes
considerar antes de conseguir eso porque es
un pago mensual. Es un pago que
regresa cada mes. Otra de
las opciones muy similares es la Wix. En realidad hay más
que Squarespace y Wix, pero esos son en realidad
los grandes. Wix se
parece más o menos a Squarespace. El diseño es un poco
diferente y es por supuesto, un poco más barato. Tienes diferentes opciones de
pago, que puedes ver aquí. Solo asegúrate de que una de
las opciones de pago realmente con anuncios durante semanas. De mi recomendación, sólo
puedo decir que no integren ningún anuncio para
algo más que tu trabajo. Esto se ve muy poco profesional. O bien toma una opción combo o ilimitada si
quieres trabajar con Wix aquí. Otra buena opción es
Behance, Behance.com. Es una redes sociales
para todos los creativos. Fotografías, animadores,
videógrafos, casi todos también UI
UX en diseño gráfico. Es una plataforma realmente grande que funciona como
red social también. Es realmente fácil
conectarse entre sí y ser visto como un creativo. Además de eso, es
completamente gratis. Ten eso en cuenta. Lo realmente bonito es que es
fácil para ti encontrar inspiración también. También tienen historias. Me gusta historias de Instagram de diferentes hashtags donde
puedes vincular tu trabajo. Tienen diferentes transmisas en vivo. Si quieres aprender algo, puedes integrar tu propio
perfil allí donde
puedes subir tus estudios de
caso de UX y luego se ve
algo así. Sube tus casos prácticos
por ahí y puedes integrar los diferentes
elementos que
diseñamos en nuestro diseño. Lo realmente bueno
aquí es que tienes esta opción de descubrir donde por supuesto
puedes
descubrir otros trabajos. Pero aquí en el área en la parte superior, durante el grupo de interacción, se
puede encontrar todo
el trabajo que se presentó en la sección de
interacción. Muchos ojos realmente llegan a ver el trabajo
que se presentó allí. Para ti, ser creativo, ser destacado en Behance es como lo mejor,
lo que te puede pasar. Porque muchos clientes
realmente te encuentran. Muchos clientes también de empresas
más grandes
están buscando a través Behance para encontrar creadores
para su trabajo. Behance es una opción realmente
genial, sobre todo si
quieres enfocarte en tu trabajo, quieres conseguir clientes,
querer ser visto, uno para conocerte por estilos
específicos, y tal vez incluso no
quieras poner un enfoque o trabajo en crear
tu propio sitio web, pero empezar
con algo. Behance es una opción realmente buena no sólo para el principio, sino algo que está en curso, e incluso además de su sitio web. Como puedes ver,
tengo un perfil de Behance, pero también tengo mi página web y honestamente
empecé
con Behance subiendo mi trabajo ahí para
solo tener algo por ahí y guiar todos los gente a través de
mi página de Behance, que es gratis. También hice mucha
conexión a través de Behance. Definitivamente echa un vistazo a eso. Otra opción realmente buena, sobre todo si tienes la
membresía de Adobe Creative Cloud es AdobePortfolio. Es completamente
gratis y puedes vincular súper fácilmente tu caso de estudio de
Behance. Toda tu cartera de Behance
o diferentes PDFs o incluso sube tus propios
casos prácticos de UX allí de forma
totalmente gratuita. Tienes diferentes plantillas, tienes diferentes
opciones de diseño para ajustarlo todo. Esta es una opción realmente
buena también. Se puede ver aquí se
integró automáticamente todo mi
trabajo en Behance, por lo que ahora puedo ajustar lo que
realmente quería mostrar allí. Por ejemplo, si quiero
presentar algo para un trabajo específico y
sólo quiero mostrar tres estudios de caso
diferentes, puedo hacer eso aquí, pero por
enlace especializado también. Esto funciona muy bien. Puedo hacer todos los ajustes en el lateral desde
opciones de diseño hasta espaciado, hasta diferentes elementos de
navegación, hasta algunas plantillas que también
puedes ver aquí. Puedes ver muchas plantillas
diferentes o simplemente puedes
elegir lo que realmente te
encaja mejor y sobre todo
llevar a tu especialidad, podría ser como UI/UX [inaudible]. Al igual que puedes ver hay un millón de opciones por ahí donde puedes alojar
tu portafolio. Depende mucho tus metas y de lo que realmente quieras lograr con eso. Mi recomendación es realmente preguntar alrededor,
preguntar
a diferentes otros
creativos o amigos
o compañeros de trabajo donde están
hospedando su portafolio,
sus estudios de caso de UX
y también preguntar por qué tal vez se obtiene algunas ideas
interesantes sobre razones específicas. Si eres capaz de
codificar eres libre de
codificar tu propio sitio web y
realmente personalizar todo. Pero asegúrate de que
esto sea mucho tiempo. Sobre todo si
no eres el pro codificador, es mucho tiempo y esfuerzo realmente
ajustar los estudios de casos. Porque por mi experiencia, estoy ajustando mis estudios
de caso de vez en cuando un poco, o quiero agregar algo, o incluso si quiero
subir un nuevo estudio de caso, es mucho más fácil si
tienes algún anfitrión, sería WordPress o
Squarespace o incluso Behance. Otra cosa a
considerar es que si usas una de esas
herramientas que acabo de recomendar, siempre
tienes algunas plantillas. No eres 100 por ciento libre de hacer el diseño
que realmente quieres. Si tienes algo
muy especial en mente y si no quieres
usar ninguna plantilla, la única opción para ti
es probablemente solo
codificarlo tú mismo o pagar a alguien para que lo codifique. Si bien esto es
definitivamente más caro y no tan práctico
en el uso diario. Vamos a hablar
sobre cómo subir tus estudios de caso de Behance
en el siguiente video.
30. Behance: Ya hablé de Behance, que es una plataforma realmente genial para que los creativos suban su trabajo y sean vistos por los clientes. Lo bueno a considerar siempre si subes en algún tipo de red social como Behance es que te vieran muchas,
muchas personas; no solo creativos, sino también clientes o personas que podrían reclutarte para un puesto de tiempo completo. Lo importante, si subes tu trabajo en Behance, todas estas redes sociales para creativos, es que compartas tu trabajo de una manera específica. Lo mejor que realmente te puede pasar si estás subiendo tu trabajo en Behance es conseguir destacado. Podrás aparecer en diferentes categorías, podría ser Interaction o Adobe XD, si estás usando Adobe XD como tu plataforma de diseño. Te hablaré a través de lo que es realmente importante si quieres que te
destaquen porque hay algunos consejos y trucos para que te presenten un poco más fácilmente, y esto te da mucho uso y te ayuda a que tu trabajo sea visto por muchos, muchos creadores. Mi primer consejo en realidad no es subir un PNG similar con todos los diferentes pasos del proceso de diseño, sino subir diferentes pasos, o diferentes PNG, o diferentes animaciones. Lo que funciona realmente bien generalmente es en realidad una combinación de animación, por lo que GIF y visuales también, y poner algunas animaciones. Los visuales podrían ser GIF o algo que se
anime en las interacciones entre las otras diapositivas. Esto realmente te ayuda a ser destacado y ser visto por más gente. Aquí tienes un ejemplo y lo que puedes ver aquí es que subí varias mesas de trabajo individuales. Algunos son animados, por lo que los GIF, sobre todo para la tipografía o animaciones diminutas y otros siguen con solo información. También integré algunos videos para animaciones más largas. Desde mi experiencia personal, eso es en realidad lo mejor que puedes hacer para que te presenten también. Hablamos de los diferentes médiums. Asegúrate de mezclar siempre entre animación y imágenes fijas e integra eso donde estás en tu estructura. Echa un vistazo a la estructura también. De hecho, así es como diseñé eso. De hecho hice eso en Adobe XD, y lo que puedes ver aquí son tantas mesas de trabajo individuales. Las diseñé todas en mesas de trabajo individuales y las subí por separado. Por supuesto, animé todos los GIFs, todas las animaciones en After Effects o Premiere, y luego las subí a través de Vimeo, o GIFs normales. ¿ Cómo puedes integrar videos ahora? En realidad es bastante simple. Después de subirlos en Vimeo, haz clic en este pequeño signo de inserción aquí, luego haces clic en “Copiar”. Copia todo el código y luego vuelve a Behance. Cuando estés creando tus casos prácticos de Behance, puedes hacer clic en los medios incrustados, y luego simplemente pegar las cosas que copiaste, guárdalo. Entonces eso, se sube automáticamente a tu caso práctico. Si haces click en el botón de reproducción, podrás ver el video que acabamos de crear con After Effects y Adobe XD. Esto funciona bastante bien, tiene el tamaño perfecto,
y ya está integrado en tu caso práctico. Algunas otras cosas que son importantes saber, también
necesitas una imagen de portada que realmente destaque. Puedes subirlo aquí realmente fácilmente. Si subes todos los pasos individuales, haz clic en “Portada”, y luego verás qué tipo de cubierta puedes subir. Aquí hay algunos ejemplos, que puedes ver que son realmente coloridos. Realmente están tratando de llamar la atención, y se ven realmente diferentes. Muchos parecen algunos simulacros donde se puede ver de qué se trata el producto. Algunas son un poco más sencillas. Asegúrate de que esas imágenes de portada estén realmente estallando porque de lo contrario no te destacarías. Aquí hay algunos ejemplos más,
así que por favor echa un vistazo a eso también. También puedes encontrar una mesa de trabajo de ejemplo para la imagen de portada, o simplemente puedes usar eso con el tamaño ya perfecto. Después, crea un diseño, subirlo en tu caso práctico de Behance. El siguiente cosa muy importante son los ajustes. Asegúrese de seleccionar el área. Para mí, es UX/UI. La interacción también podría ser realidad virtual, así que asegúrate de seleccionar la correcta, es realmente importante. Seleccione un software. Si eliges Adobe XD aquí, tienes la posibilidad de hacerte destacar dos veces: Interacción y Adobe XD. Asegúrate de integrar un texto realmente bueno que esté realmente optimizado para eso. Integra hashtags para que sea más fácil para las personas encontrar tu trabajo también. ¿ Cuáles son las comidas para llevar aquí? Si quieres crear un Behance [inaudible], aquí están mis consejos. En primer lugar, elige el tamaño perfecto aunque que se vea realmente crujiente, pero no es demasiado grande y no necesita edades para cargar. Perfecto son 1,400, y entonces el tamaño es, por
supuesto, lo que necesitas. Entonces, divídalo en diferentes mesas de trabajo. Asegúrate de que estás dividiendo la mesa de trabajo en diferentes mesas de trabajo más pequeñas y subirlas por separado. Entonces, mi punta número tres es integrar muchas animaciones, animaciones más pequeñas como GIF y animación más larga como videos a través de Vimeo. Además, integre hashtags y una descripción
realmente, realmente buena para el proyecto, esto ayuda a ser encontrado. Además, asegúrate de nombrar a las herramientas de Adobe que usas porque esto te
ayudará a que también te destaces en la plataforma de herramientas, por
lo que para UX, por ejemplo ,
no solo Interaction, sino también en la plataforma Adobe XD.
31. Acerca de: El área sobre es algo que debes incluir en cada portafolio o en tu página web también. Esto te ayuda a hablar un poco de ti mismo y de lo que te hace único como diseñador. Ahí se puede ver mi sobre área donde estoy hablando súper brevemente mi personalidad y de qué me hacen único y ahí se pueden
ver mis canales sociales y un poco sobre prensa y medios de comunicación. Lo que es realmente importante es mostrar lo que te hace único y mostrar tu personalidad, no tengas miedo de mostrar realmente quién eres. También habla de pasatiempos o de cualquier historia o algo que realmente tenga en cuenta. Además no olvides integrar tus redes sociales, pero solo si son profesionales, así que no tus personales, eso es realmente importante. ¿ Qué debes integrar? En primer lugar, escribe el texto a tu estilo, esto ayuda a crear simpatía y confianza y atraer a los clientes que estás buscando. Segundo, incluir un llamado a la acción. Si tus clientes quieren saber más sobre ti, realmente
querrían trabajar contigo,
entonces podría ser una llamada a la acción como por favor llámame, o por favor escríbeme un correo electrónico, o avísame si necesitas apoyo con que, por lo que definitivamente integrar un llamado a la acción si sabes cuál es este llamado a la acción. Explica a tus clientes por qué eres interesante para ellos. Mantenga la perspectiva de su cliente y no anote ningún hecho no-informante. Ten en cuenta que la página sobre mí está diseñada para que tus clientes puedan conocerte mejor y desarrollar una relación contigo, esto crea confianza y ojalá alguna cooperación. En tu hoja de trabajo, puedes encontrar un área con alguna información útil sobre qué integrar y qué es realmente útil. Por supuesto, tu nombre y una fotografía si te sientes cómodo con eso, tu rol y también las escuelas que estás teniendo y abajo puedes ver algunas en el ejemplo. Pero asegúrate de que esto sea muy único y no copie algo de otros diseñadores, esa es la razón por la que no muestro ningún ejemplo aquí. Asegúrate de que realmente muestres tu personalidad y que sea un texto muy único sobre eso.
32. Redes sociales: Estamos viviendo en un mundo donde todo sucede en línea. La mayoría de nosotros ya estamos representados en redes
sociales como Dribbble o Behance o Instagram o Twitter. Lo realmente útil es pensar muy estratégicamente sobre la forma en que te presentas en las redes sociales. Si estás publicando algo en una red social o subiendo un nuevo caso práctico, lo único que es realmente importante tener en cuenta es que difundes
la voz en diferentes canales sociales y guías a todos a través de tu nuevo caso práctico de UX, podría estar en todas partes. Asegúrate de crear contenido para todas las redes sociales así para difundir realmente la voz sobre tu caso práctico de UX. Vamos a platicar en este video sobre cómo realmente hacer eso. Vamos a pasar por las diferentes redes sociales, y hablar un poco de mis lecciones aprendidas o cosas que puedo recomendarles. Empecemos con el primero que es Dribbble. Dribbble es una plataforma para diseños de trabajo y procesos, por lo que puedes subir allí partes específicas de tu caso de estudio de UX, podría ser una maqueta, podría ser visual, o cosas por el estilo. ¿ Qué es importante saber aquí? Se puede ver que aquí hay un enorme enfoque en la parte visual. Si eres diseñador visual, diseñador interfaz
visual, esta es la plataforma adecuada para ti. Al igual que puedes ver aquí, mayoría de los diseños son realmente animados. Los subes como GIF y realmente presentas la animación, la interacción con la que se te ocurrió. Eso es realmente importante de entender antes de que realmente publiques allí tu diseño. Aquí también hay una barra de búsqueda en la parte superior. Simplemente puedes buscar elementos específicos. Este podría ser sitio web en una página o lo que sea que estés buscando, y luego ves todos esos diseños. Es una plataforma realmente buena para la inspiración de muchos diseñadores. Constantemente están haciendo sobre todo el trabajo de las cosas desde la inspiración para unos elementos de diseño específicos. Es probable que también encuentres tus diseños ahí,
y revisando esas líneas y te guiarás a través de todo tu caso práctico. Aquí está en realidad mi lado, como puedes ver he subido muchos diseños para diferentes casos de estudios de UX. Este es uno le agregué un diseño. Lo que puedes ver aquí es que incluí el enlace a mis Estudios de Caso Behance allá en la parte inferior. La gente sólo puede chequear eso y ser guiado por esa zona. También puedes subir tus diseños M realmente fácilmente a través de Dribbble. Lo que es realmente importante tener en cuenta es
que se necesita una relación específica que sea de tres a cuatro. Lo mejor es subir eso como GIF. Porque eso es animado, obtienes mucho más vistas. En realidad si animas eso y subes eso como GIF. Si tienes una cuenta pro también puedes subir videos, por lo que MP4s y calidades superiores pero desde mi experiencia realmente no necesitas eso. ¿ Cómo podemos crear contenido a partir de nuestro caso práctico de UX para Dribbble? Lo mejor que puedes hacer es reutilizar las cosas que ya creaste para tu caso de estudio para redes sociales, sobre todo todo todo lo que está animado y en movimiento. Si miramos los videos que creamos para el caso de estudio de UX, y podemos usar esas cosas para redes sociales también. Echemos un vistazo al video que creamos. Vamos a crear uno para Dribbble ahora. Solo vamos a dar click aquí en este pequeño letrero para agregar una nueva composición. El ancho debe ser de 1,600 y la altura es de 1,200, perfecto para Dribbble. La velocidad de cuadro en 25 está bien y luego 32, perfecto. Ahora vamos a renombrar eso llamado Dribbble_UserFlow. Ahora vamos a insertar el flujo de usuario de video en la nueva composición para Dribbble. Pero aquí se puede ver que realmente no encaja perfectamente pero que no es un problema, vamos a ajustar eso un poquito para que encaje. ¿Cómo se ve? Agradable. Lo único que sólo tenemos que tener en cuenta es que vamos a crear un GIF y esto debe ser más largo de seis segundos. Lo mejor donde podemos hacer es enfocarnos realmente en un área y solo mostrar ésta en acción. Lo que creo que es realmente interesante es sobre todo esta parte donde estamos en la pantalla de inicio, luego dar click en el pequeño área de eventos y luego podemos ver lo [inaudible] en acción. Creo que esto es realmente genial. Con esta cosita de esta cosa de marco
voy a seleccionar estas cosas que se renderizarán. Esta será la última parte aquí y como puedes ver, es un poco demasiado, así que así. Ahora voy a dar clic en Exportar archivos y luego agregar a Media Encoder Cola. Ya vamos a exportar eso. Aquí está, y entonces sólo vamos a arrastrar y soltar esto en Photoshop y abrirlo en Photoshop, a la perfección. Esto se ve bien y vemos que aquí apareció la línea de tiempo que es realmente bueno. Ahora podemos hacer click en Exportar archivos y luego Guardar para Web. Esto es lo que necesitaremos. Tenemos que guardar eso para web como GIF. Esta es en realidad la única posibilidad de guardar GIFs de secuelas, por lo que siempre necesitas pasar por Photoshop. Un poco complicado, eso es cierto pero si sabes cómo funciona eso entonces en realidad no es un gran negocio. A veces lleva algún tiempo y ahí está. El tamaño se ve bien, para siempre perfecto vamos a dar click en Guardar. Ahora se sube en Dribbble, como puedes ver aquí. Puedes ajustar la descripción podría ser como app coliving y luego también puedes agregar ajustes, oops, app. Lo que realmente encaja podría ser también diseño minimalista , concepto de
app, lo que pueda agregar descripción y lo que realmente
puedo recomendar es incluir siempre el enlace. Consulta el caso de estudio de Behance. Esto es lo que suelo hacer y luego lo voy a publicar aquí. Ahí lo tienes. Descripciones, vamos a Instagram. Es una plataforma realmente buena para la gente porque hay muchos diseñadores por ahí. Quieren aprender, quieren algo de inspiración. Es un lugar realmente bueno en realidad para publicar tus diseños allí también, especialmente estudios de casos. Un super interesante para la gente si presentas el proceso. Esto son varias veces de algunos de mi proyecto que diseño para clientes pero también para algunos proyectos personales y te mostraré cómo realmente hice eso. Este es el proyecto de coliving que empecé con una cotización y luego pasé todo
el concepto realmente rápido con toda la etapa diferente en los procesos. También integré algunos videos también y también un movimiento llamado a la acción. Por favor echa un vistazo a todo el caso de estudio en Behance, que es realmente importante para guiar a la gente
el artista, la cultura en realidad revisa todo el estudio de caso sobre Behance. Hice esto para otro proyecto también, muy similar, bocetos y wireframes un poco sobre las pruebas. Pero como puedes ver, no
es tanto en profundidad. Se trata mucho de explicar las etapas por las que pasé pero no a fondo. En profundidad es definitivamente todo lo que podemos encontrar en Behance. Lo que puedes hacer siempre es revisar y guiar a la gente a través de la página de Behance, probar tus historias. Por ejemplo, cómo realmente puedes subir o deslizar una publicación que sea súper fácil. Simplemente hacer elementos individuales, exportarlos. Después puedes hacer click en esa cosa diminuta que hay en la parte superior y seleccionar todos los elementos que quieras integrar. Se pueden ver los números 1, 2, 3 y ese es en realidad el orden. Al igual que puedes ver, estoy seleccionando todos los diferentes elementos que quiero integrar en mi post aquí. Puedo subir más hasta las 10 y aquí ya puedes
deslizarte, puedes hacer algunos cambios, y ahora subir eso. Asegúrate de agregar una buena descripción y asegúrate de agregar
unos hashtags realmente buenos sobresalientes unos pocos más grandes, unos pocos más pequeños, tal vez UX. Se trataba de movilidad. Cosas como caso de estudio, UX y esas áreas específicas dependen mucho de tu proyecto. Asegúrese de comprobar eso, y también puede agregar personas por ejemplo. Si subes eso en Behance, y sí, y eso es realmente útil creo también. Un pro tip es escribir un artículo medio sobre el tema. Por lo general, por cada caso de estudio que
estoy haciendo, también estoy escribiendo un artículo medio corto que es súper importante para los clientes sobre todo si pones muchas formas en la parte visual. Hiciste mucha investigación y en realidad tenías algunas ideas realmente interesantes. Tendrás algunos problemas realmente demostrando eso en un estudio de caso porque la gente no lee mucho texto. Pero poner eso en un estudio de caso es súper útil para que la
gente entienda realmente que estás pensando mucho en
eso, que tuviste muchas lecciones aprendidas. Asegúrate de vincular tu caso práctico a continuación para que las personas puedan consultar el estudio de caso debajo de tu artículo medio. No hace falta que sea largo, todo
el artículo pero, sí. Hay un símbolo para LinkedIn porque muchos de tus clientes van a estar en LinkedIn. LinkedIn es una plataforma realmente buena para la creación de redes. Asegúrate de integrar tu trabajo en la parte muy alta de tu perfil y podrás ver el mío. Lo que hice es integrar todas las cosas más importantes de mí, algunos videos que estoy haciendo, algunos casos prácticos de UX Estaba trabajando en algunos artículos en la parte muy alta de mi perfil de LinkedIn. Simplemente puedes integrarlo ahí, potencie el signo del complemento e incrustado con el enlace. También asegúrate de escribir un pequeño post sobre eso, comparte de qué se trata y guía a la gente de LinkedIn a través de tu caso práctico de Behance o también a tu sitio web. Creo que eso es realmente importante hacerlo ya que
mucha gente lo ve y es capaz de compartir eso, porque hay otras personas en LinkedIn en su mayoría clientes que probablemente irán a contratarte. Twitter es un poco diferente. Desde mi experiencia lo que funciona bien es presentar un realmente cool en acción, algo un poco más sobre la tecnología, poner también algo de aprendizaje de pruebas, algo que es un poco polémico se retuitearán y pone un montón de ojos en eso. Asegúrese de vincular también el caso de estudio Behance. Podría ser casi todo solo asegúrate de que sea un poco polémico e interesante para que la gente vistazo
a ver y que empiece algunas conversaciones geniales sobre el tema. Espero que esto haya sido de ayuda.
33. Palabras finales: Estamos casi al final de esta clase. Pero aquí hay algunos últimos consejos y trucos para mí, que me ayudaron en realidad a conseguir tantos clientes y a ser visto por tanta gente. Mi consejo número 1 y recomendación es, además de presentarte en redes sociales, es hacer networking. Redes de la vida real donde conoces gente en la vida real. Construir relaciones valiosas entre usted, diferentes pueblos, y clientes. Porque lo que te ayudará al final es si la gente realmente te recomienda para trabajos o sabe lo que estás haciendo y te consigue cuando necesitan ayuda y apoyo en tu equipo. ¿ Cómo puedes hacer eso ahora? Mi recomendación es checar meetups y eventos en tu ciudad. Hay un sitio web realmente genial llamado meetup.com. Ahí puedes encontrar todos los meetups. Yo estoy radicado en Berlín, y en Berlín solemos tener alrededor como uno o dos meetups de diseño todos los días. Puedes ir ahí, puedes hacer preguntas, puedes hablar con la gente, hablar de lo que estás haciendo, lo que estás buscando, lo que estás buscando, y luego volvemos a empezar a construir relaciones porque esas personas te van a volver si necesitan de tu ayuda, si necesitan de tu apoyo. Siempre asegúrate de agregar a esas personas en LinkedIn y dar seguimiento con algún tipo de un buen mensaje o conversación de seguimiento, también
podría ser una pregunta. El segundo es, si te interesa algo, un área específica, un punto de vista específico donde quieres aprender más, no tengas miedo de llegar a personas que ya son muy profesionales o que son mejor en esas áreas. No tengas miedo de simplemente enviarles un mensaje y preguntarles si estaría encantado de subir a una llamada o puedes
invitarlos a tomar un café o algo así y hacerles algunas preguntas. Esto lo hice varias veces, sobre todo cuando empecé mi carrera. A pesar de que al principio daba miedo, me ayudó mucho a construir realmente relaciones valiosas e iniciar conversaciones sobre temas específicos que me interesan y quería mejorar. Chicos, estoy súper, súper feliz de que les guste terminar este curso. Absolutamente impresionante, realmente gran trabajo. No puedo esperar a ver tus x casos prácticos. Siéntete libre de publicarlos en esta clase o incluso enviármelos a mí. Yo estoy súper feliz de verlos. De verdad con ganas de ver ahí tus resultados, y puedes estar súper orgulloso de ti mismo de que hayas pasado por este curso. Aprende todas esas cosas y siéntete libre de usar los recursos que te envío y tienes preguntas, siéntete libre de llegar a mí. Muchísimas gracias.