Lección 1 de 0
En Progreso

3.4 Cómo crear una cartera de diseño de UX en línea

29 marzo, 2023

Entonces, desea crear una cartera de diseño de UX en línea. La buena noticia es que hay más opciones que nunca para crear su cartera en línea. ¿Las malas noticias? ¡Toda esa elección puede hacerte sentir abrumado fácilmente! Por eso estamos aquí: analizaremos las opciones que puede tomar para crear su cartera de UX en línea. Exploraremos algunas soluciones listas para usar como Behance y WordPress, analizaremos algunas consideraciones para codificar su propio sitio web, ofreceremos 6 pautas de diseño para su cartera de UX en línea y terminaremos con un sitio web de demostración que hemos creado específicamente para usted. ¡Empecemos a crear!

Si desea crear su portafolio de diseño de UX en línea, puede optar por dos opciones: utilizar una solución ya preparada, como una plataforma en línea con plantillas para elegir, o codificar su portafolio desde cero. Repasemos cada una de estas opciones.

Utilice plataformas listas para usar para crear su cartera de UX en línea con facilidad

Si no tiene experiencia en codificación, le recomendamos que cree su portafolio de UX en línea con una solución lista para usar. Estas son soluciones, como el diseño de sitios web y los servicios de alojamiento, donde puede crear una cartera en línea sin la necesidad de codificar.

Tratamos de ser lo más imparciales posible y no recibimos ningún tipo de patrocinio o pago de nuestras recomendaciones a continuación. Los elegimos porque son populares entre otros diseñadores y porque creemos que son fáciles de usar. Debe realizar una investigación adicional para encontrar si hay otras plataformas que se adapten a sus necesidades específicas.

Behance (gratis)

Behance es la plataforma de cartera en línea más popular con más de 10 millones de miembros. Puede unirse a la plataforma de forma gratuita y publicar sus estudios de caso de UX.

Si decide crear su portafolio de diseño de UX en Behance, entonces su perfil de Behance, por ejemplo, “behance.net/yournameynamic”, será su portafolio de UX y cada “proyecto” que publique en su perfil actuará como un estudio de caso de UX .

El editor de proyectos de Behance es fácil de usar y le permite escribir sus estudios de casos de UX e insertar gráficos como cualquier otro procesador de texto.

El editor de proyectos de Behance es fácil de usar y le permite agregar imágenes, videos y otros tipos de contenido.

WordPress (gratis y de pago)

Si prefiere tener su propio sitio web , WordPress es una gran opción. Su plan gratuito le brinda un sitio web personalizado “yourwebsite.wordpress.com”, y puede actualizar a un plan pago para personalizar aún más la URL de su sitio web, por ejemplo, a “yourwebsite.com”.

El flujo de registro de WordPress está increíblemente bien diseñado y lo combina con los temas adecuados para que tenga un gran comienzo. Si no está satisfecho con las opciones que se muestran en su flujo de registro, puede elegir entre muchos otros temas.

El flujo de registro de WordPress sugiere temas que son adecuados para el propósito de su sitio web. 
Aquí, WordPress sugiere 4 temas adecuados para una cartera en línea.

Puede crear sus estudios de caso de UX en WordPress como publicaciones a través de un editor intuitivo y fácil de usar . Puede ver una vista previa realista de sus publicaciones en el editor y agregar una amplia gama de “bloques”, como títulos, imágenes, galerías e incluso tablas.

El editor de publicaciones de WordPress es robusto y le muestra una vista previa en vivo de su publicación.

Squarespace (pago)

Squarespace es una plataforma de diseño y alojamiento web premium que te permite crear un sitio web profesional basado en plantillas bellamente diseñadas . En comparación con las otras soluciones que hemos compartido anteriormente, Squarespace no es gratuito y los precios comienzan en $ 12 por mes para su plan anual.

Si está dispuesto a invertir en su cartera de UX en línea, Squarespace es una opción sólida: obtendrá una URL de sitio web personalizada y podrá ponerlo en funcionamiento rápidamente sin necesidad de codificar.

Al igual que WordPress, Squarespace ofrece editores de publicaciones y páginas intuitivos y fáciles de usar , para que pueda diseñar y publicar las páginas de su portafolio y los estudios de casos de UX con facilidad. Además de eso, incluso puede crear su propio logotipo para su cartera de UX con unos pocos clics con el servicio de creación de logotipos de Squarespace llamado Squarespace Logo. El logotipo de Squarespace es gratuito si tienes una cuenta de pago.

La principal desventaja de usar servicios listos para usar es que su cartera de UX en línea puede parecer menos única. Por ejemplo, es probable que muchos sitios usen la misma plantilla que la que eligió para su sitio web de WordPress o Squarespace, y en Behance, su perfil seguirá el estilo visual de Behance. Sin embargo, a pesar de esto , todavía tiene algo de espacio para personalizar su portafolio de UX en línea, por ejemplo, mediante el uso de hermosas imágenes que incluye en sus estudios de caso de UX.

Codifique su propia cartera de UX en línea

Si sabe cómo codificar o tiene una visión específica de su cartera de UX, nada mejor que codificar su sitio web desde cero . Sin embargo, para hacerlo, deberá tener algunos conocimientos en codificación de front-end, como cómo escribir código HTML, CSS y JavaScript.

Pero, ¿qué pasa si realmente desea codificar su propia cartera pero no tiene habilidades de codificación? Bueno, si te encantan los desafíos, puedes considerar las siguientes plataformas en línea que te enseñan a codificar. Si no sabe codificación, no le recomendamos que lo aprenda para crear su primer portafolio de UX en línea. Más bien, debe tratar estos cursos de codificación en línea como parte de su plan a largo plazo, para que eventualmente pueda codificar su propio sitio web personal.

Khan Academy (gratis)

Khan Academy es una plataforma en línea sin fines de lucro que ofrece cursos gratuitos para todos. Como organización sin fines de lucro, nos encanta la misión de Khan Academy. En particular, le recomendamos que tome los cursos de Khan Academy sobre HTML, CSS y JavaScript , que le enseñarán los conceptos básicos que necesita para crear su propio sitio web.

Descubrimos que la interfaz de Khan Academy es especialmente adecuada para aprender a codificar; por ejemplo, sus lecciones en “video” contienen un diseño de dos paneles donde en el panel izquierdo verá el código en vivo que se actualiza mientras el instructor habla, mientras que a la derecha verá una vista previa en vivo del sitio web.

Codecademy (gratis y de pago)

Codecademy es otra plataforma de aprendizaje en línea, pero a diferencia de Khan Academy, se centra completamente en la codificación. Puede tomar cursos en Codecademy de forma gratuita o actualizar a un plan “profesional” pagado para desbloquear trayectorias profesionales y ejercicios de creación de portafolios orientados al código, entre otras características.

Le sugerimos que tome los cursos de introducción de Codecademy a HTML, CSS y JavaScript para que obtenga un control firme del conocimiento fundamental que necesitará para construir su portafolio de UX en línea.

De hecho, si desea dominar los conceptos básicos de HTML, CSS y JavaScript, le recomendamos encarecidamente que tome cursos tanto de Khan Academy como de Codecademy . Eso es porque ambas plataformas enseñan con diferentes metodologías y desde diferentes perspectivas; Si toma cursos de ambas plataformas, tendrá una imagen holística de los conceptos básicos del desarrollo front-end.

7 pautas de diseño que debe seguir al crear su propio portafolio de diseño de UX en línea

A estas alturas, ya debería tener una buena idea de qué opción le conviene más. Si tiene conocimientos de codificación, debería codificar su portafolio de UX desde cero. De lo contrario, debe explorar soluciones listas para usar como Behance, WordPress y Squarespace para crear su portafolio en línea con facilidad.

Independientemente de la opción que elija, deberá tener en cuenta estas 7 pautas de diseño esenciales cuando cree su cartera de UX en línea.

1. Haga una introducción breve y concisa en su página de inicio

Proporcione una breve y clara presentación de usted mismo en la parte superior de su página de inicio . De esa manera, los reclutadores sabrán inmediatamente qué esperar de usted. Recuerde, la página de inicio de su cartera de UX en línea es un lugar privilegiado: es la primera impresión que dará a los reclutadores.

Incluya su nombre y puesto de trabajo actual o el puesto de trabajo al que aspira. Si corresponde, incluya también su ubicación actual. Sea breve, su introducción debe tener un máximo de 3 oraciones. Escríbalo de manera conversacional, como si hablara en un ambiente amigable y profesional.

Tu presentación puede ser una excelente manera de transmitir tu personalidad . ¿Eres una persona alegre? ¿Quizás eres optimista? ¡Deja que tu personaje brille!

Por ejemplo, en la cartera de UX en línea de Teo Yu Siang, se asegura de que su nombre sea lo más importante para que lo notes. Su introducción también es concisa y consta de 3 frases cortas. En la última frase, transmite su personalidad a través de un tachado ligeramente descarado de la palabra “subversivo”.

Kevin Park emplea tácticas similares con gran efecto. En su página de inicio, usa emoji para agregar interés visual y transmitir un tono de voz divertido.

Observe cómo tanto en las carteras de Yu Siang como en las de Kevin, eligieron transmitir primero la información más importante . ¡Tú también deberías hacer eso! Su nombre y función laboral son los datos más importantes. Los pasatiempos y los proyectos paralelos son menos importantes y deben ir más abajo. De hecho, es posible que desee poner sus pasatiempos solo en su página “Acerca de”, en lugar de en la página de inicio.

2. Incluya solo 2 o 3 estudios de casos de UX

Seleccione y muestre cuidadosamente 2 o 3 de sus mejores estudios de casos de experiencia de usuario . Sabemos que es difícil resistir la tentación de mostrar a tus reclutadores todo lo que has hecho, ¡pero debes resistir! Debe mostrar solo estudios de casos que sean excepcionales y relevantes para su puesto de trabajo de UX.

Como ejemplo, el portafolio de UX en línea de Shawn Park muestra 3 estudios de casos principales que sirven para resaltar sus habilidades en el diseño de UI y UX.

3. ¡Hágalo utilizable!

La usabilidad es clave, ¡ especialmente en su portafolio de UX en línea! Los reclutadores juzgarán su cartera en línea como un producto diseñado y los problemas de usabilidad se reflejarán negativamente en usted .

Estas son algunas pautas clave de usabilidad que debe seguir:

  • Asegúrese de que la navegación sea simple y fácil .
  • Diseñe las prestaciones adecuadas en sus enlaces y elementos interactivos. Por ejemplo, los enlaces deben estar subrayados y tener un color diferente.
  • Preste atención a la legibilidad y el contraste de color . Asegúrese de que sus fuentes sean lo suficientemente grandes y verifique su contraste de color con el comprobador de contraste de color de WebAIM.

El portafolio de Simon Pan es un gran ejemplo de un sitio con buena usabilidad. Su menú de navegación superior es claro y legible, y usa un subrayado para indicar la página en la que se encuentra.

Por otro lado, el portafolio de UX en línea de Daniel Rakh es hermoso e increíblemente bien animado. Sin embargo, creemos que el esquema de color que eligió Daniel no proporciona suficiente contraste de color; en particular, el logotipo que dice “Daniel” casi se desvanece en el fondo.

4. Cree una página o sección Acerca de con más información sobre usted

Dado que necesita que la introducción en su página de inicio sea breve, le sugerimos que cree una página o sección “Acerca de” separada para mostrar más información sobre usted.

En su página acerca de, incluya:

  • Más detalles sobre usted, como sus pasatiempos e intereses;
  • Su historial laboral y antecedentes educativos ; y
  • Enlaces de redes sociales a sus perfiles profesionales , como LinkedIn, Medium y Behance.

Asegúrese de que su historial laboral y educación estén actualizados en su página Acerca de, así como en sus otras cuentas en línea como LinkedIn, Medium y Behance. 

5. Coloque los proyectos laterales en una página o sección separada

Sabemos que se siente orgulloso de sus proyectos paralelos, pero debe colocarlos más abajo en su página de inicio o en otra página . El enfoque principal de su página de inicio son los estudios de caso de UX, por lo que no puede permitirse que sus proyectos paralelos compitan por la atención.

Sin embargo, aún debe incluir sus proyectos paralelos en su cartera de UX en línea, ya que ayudan a mostrar sus pasiones y permiten a los reclutadores tener una mejor idea de su personalidad. Le sugerimos que cree una sección o página separada para todos sus proyectos paralelos.

Por ejemplo, Hiroo Aoyama eligió crear una sección separada para “proyectos paralelos”, que colocó debajo de sus estudios de caso. De esta manera, puede mostrar su pasión por el diseño y al mismo tiempo poner el foco principal en sus estudios de caso.

Hiroo Aoyama colocó sus proyectos paralelos en una sección separada de su página de inicio para que no compitan por su atención, pero aún así sean visibles para los reclutadores que estén interesados ​​en aprender más.

6.Haga que su portafolio sea visualmente agradable y consistente

Incluso si no tiene experiencia en diseño visual, su portafolio de UX en línea debe verse estéticamente agradable y ser visualmente consistente . ¿Por qué? Porque, como mencionamos anteriormente, los reclutadores juzgarán su cartera de UX en línea como lo harían con cualquier otro producto diseñado.

Afortunadamente, es más fácil que nunca crear un sitio web visualmente agradable. Si no confía en sus habilidades de diseño visual, puede utilizar una plataforma como WordPress o Squarespace , que le proporciona plantillas bien diseñadas.

Si no domina el diseño visual, utilice plantillas bien diseñadas como esta titulada “York” de Squarespace.

7. Cree un MVP: producto mínimamente viable

Cuando cree su cartera de UX en línea, piense en MVP: un producto mínimamente viable . No intente crear el sitio web más perfecto o hermoso, porque su cartera de UX en línea siempre evolucionará y cambiará. Tendrá que mantener y cambiar regularmente los estudios de caso que muestra, su copia introductoria, etc.

Debe apuntar a crear y lanzar una versión lo suficientemente buena de su portafolio de diseño de UX en línea, en lugar de esperar meses para perfeccionarlo. Una vez que haya publicado su portafolio de UX en línea, podrá dedicar más tiempo a mejorarlo. Al mismo tiempo, ya habría tenido un activo importante que puede utilizar para solicitar puestos de trabajo.