Transcripciones
1. Introducción: Crear productos digitales intuitivos y
fáciles es esencial en la era digital
actual. éxito de un software o aplicación depende en gran medida su interfaz de usuario y la simplicidad de
su viaje de usuario. Muchos productos digitales que
han fallado en el pasado fracasaron porque se saltaron
el paso crucial de diseñar un prototipo, lo que los llevó a tomar malas decisiones de colocación de
elementos, llevó a una mala experiencia de
usuario del cliente. En lugar de sumergirse
directamente en la codificación, es importante que involucres
a un diseñador para crear un
diseño detallado para cada página. Esto le permite ver cómo se
verá
el producto final antes de construirlo, lo que le permite hacer una lluvia de ideas sobre mejoras antes de
tocar una línea de código Y si puedes
diseñarlo tú mismo, entonces eso es aún mejor porque no
tendrás que gastar mucho dinero en
un diseñador de UI UX. Y esta clase está destinada a
mostrarte cómo hacer precisamente eso. Te mostraré cómo usar FIMA
para diseñar hermosas interfaces de usuario para tus aplicaciones de software
y productos de sitios web, asegurando que cada
elemento esté
colocado correctamente para una experiencia de
usuario mejorada Y al final de esta clase, habrás construido
tu propio tablero para una compañía financiera ficticia, y tendrás
las habilidades para construir tus propias interfaces de usuario
con Figma en el futuro Y por si acaso
te estás preguntando quién soy, mi nombre es Ken, y durante los últimos cinco años, he estado ayudando a la gente a
aprender a construir sitios web
profesionales
con Elementor Puedo consultar mi perfil
para ver mi trabajo reciente. A lo largo del curso,
te mostraré el editor Figma, te
enseñaré a usar las herramientas Figma más
utilizadas y te mostraré cómo organizar
tus proyectos de diseño Y como mencioné,
aprenderás trabajando en un proyecto del mundo
real, lo que resultará en un hermoso dashboard para una aplicación web
ficticia Aquí no estamos haciendo teoría. Entonces, como ya puedes ver, esta clase va
a ser práctica,
está diseñada para
llevarte rápidamente de un principiante
a un usuario seguro de
Figma Pero quizás también te estés preguntando, ¿esta clase es para mí? Entonces, ¿para quién es esta clase? Bueno, esta clase es para aspirantes a
diseñadores de UIUX que quieren
ponerse al día con
la herramienta de diseño
UIUX más popular diseño
UIUX Entonces, si siempre has querido aprender
a usar Figma, que es la herramienta líder de diseño de
UIUX, esta clase Esta clase también está
pensada para emprendedores que buscan crear sus
propios productos digitales. Entonces, si eres emprendedor
o desarrollador web, pero quieres adquirir algunas habilidades de
diseño para que puedas diseñar tu propio software
antes de escribir tu código. Esta clase es un
buen comienzo para ti. Entonces me siento muy
emocionada por comenzar, y si te sientes
tan emocionada como yo, exploremos juntos el mundo
de Figma Pero antes de sumergirnos, echemos un vistazo rápido al proyecto de clase en
el que
trabajaremos a lo largo de
la clase. Aquí vamos.
2. Resumen del proyecto: Como siempre señalo, la mejor manera de
aprender una nueva habilidad, especialmente una habilidad técnica
es trabajando en un proyecto. En esta lección, quiero
mostrarles lo que vamos
a construir. Entonces estoy dentro de mi editor, y este es el dashboard que
vamos a estar creando. Como puedes ver, antes que nada, está muy bien organizado. Lo tenemos como tablero de instrumentos. Pero ahora si empezamos a expandir cada parte
del tablero de instrumentos, Notarás que el tablero está compuesto por tres partes principales. Barra de búsqueda, que es esta sección que tiene todos estos iconos y
la propia barra de búsqueda. Tenemos la barra lateral,
que está compuesta por
el logo y todos estos botones de barra lateral y este contenido, y puedo arrastrarla por ahí. Seleccionando esto,
también puedo arrastrarlo por ahí. Y tenemos el contenido principal, que está conformado por, por supuesto, el contenido principal que
quieres echar un vistazo, y puedo arrastrar
todo alrededor. Si explico el contenido principal, también
está bien organizado
en las diferentes partes. Así que déjame hacer click aquí. Si pongo el cursor sobre cualquier elemento, lo verás resaltado
dentro de la propia obra de arte Entonces solo échale un vistazo a eso. Por ejemplo, si selecciono
esta tarjeta de ganancias totales, y la llamaré
ganancias totales porque, por
supuesto, es la tarjeta que
muestra las ganancias totales. Se trata de las ganancias netas, pagos
pendientes,
gastos. Esto está agrupado. Puedo llevarlo por ahí y
reorganizar toda la sección. El caso es que también es un
grupo de otros contenidos. Estamos anidando elementos o
elementos cada vez más profundos. Empezamos desde el tablero. Anidado dentro del tablero es, son estos tres elementos,
estos tres grupos, y anidadas dentro
del contenido principal son las tarjetas que contienen
diferentes tipos de Y dentro de cada tarjeta hay otros elementos
que conforman la tarjeta. Por ejemplo, tenemos
este grupo que tiene el porcentaje de
incremento o disminución. En el pasado, tal vez en las ganancias totales o
en las ganancias netas. Hubo una caída de 3.4, un incremento de
las ganancias totales, 3.8, y ese es un grupo
que también tiene el 3.8, la flecha y el rectángulo
que lo sostiene. Entonces anidando elementos dentro de los
elementos dentro de los elementos. Te mostraré cómo
organizar tu trabajo, y te mostraré cómo crear cada parte de este dashboard para que
para cuando terminemos, tengas un
dashboard como este para mostrar o exhibir a tus
amigos o compañeros. Al mismo tiempo, recuerden que
vamos a
empezar de cero. No vamos a usar las plantillas de
nadie. Vamos a empezar
desde el fondo. Después agrega botones. Agrega el logo. Vamos a crear
cada tarjeta desde cero, agregando cada elemento. Eso te permitirá
entender cómo usar todas estas diferentes
herramientas que estarás usando la mayor parte del tiempo
cuando trabajas en Figma. Ese es el objetivo de
darte una guía sobre las
herramientas más utilizadas a través de ejemplos. Esta es la mejor manera de
aprender a usar esas herramientas. Y por cierto, te
proporcionaré esta plantilla de diseño
para que puedas explorar y ver exactamente cómo creé cada parte a medida que
trabajas en tus propias partes. Entonces solo revisa debajo este reproductor de video en la pestaña de
proyectos
y recursos, y encontrarás la
plantilla ahí junto con cualquier otro activo que
encuentre útil para ti. si acaso
quieres ver cómo hice la mía, no
olvides descargarla. Entonces, si estás tan emocionado como yo, si quieres
aprender a construir este dashboard y
adquirir las habilidades para construir cualquier otro tipo
de diseño de UI UX, este proyecto será
un buen comienzo para ti. Entonces,
sin perder más tiempo, reunámonos en la siguiente
lección y creemos una cuenta Figma. Te
veré en breve.
3. Crea una cuenta de Figma: Bienvenida de nuevo. Ahora que hemos tenido una visión general rápida de lo que
vamos a construir, es el momento de crear
una cuenta en Figma. Yo sólo quiero salir de aquí. Vendré a este menú desplegable. A continuación, haga clic en volver a los archivos. Ahora, me llevarán de vuelta a mi página de inicio para esta cuenta
específica. Si hago clic en este
menú desplegable, como pueden ver, actualmente
estoy conectado
como este perfil, pero también estoy conectado como
este otro perfil aquí. Déjame cerrar la sesión así. Cerrar sesión en todas las cuentas. Y esto es lo que
tendrás cuando visites FIDMA. Así que voy a hacer clic en
Comenzar gratis. Vamos a usar la
cuenta gratuita. Y no te preocupes. Voy a hablar
un poco sobre el plan gratuito en
la siguiente lección. Así que vamos a seguir y
crear una cuenta por ahora. Ahora, solo voy a seguir
con una cuenta de Google, y voy a usar esta cuenta que
nunca antes había usado. Haré clic en Continuar.
A, aquí estamos. Debido a que es la primera
vez que creamos una cuenta, vamos a pasar por
este asistente de configuración de incorporación, lo cual es muy sencillo Así es como
aparecerás en el archivo Figma. Así que voy a ir con
el nombre por defecto, pero puedo dar click
aquí y cambiarlo. Digamos que ¿Puede
la D, entonces continuar? También puedes optar por
saltarte algunos pasos. Continuar. ¿Qué tipo
de trabajo realiza? Digamos que estoy en desarrollo de
software, porque estoy asumiendo que
tal vez quieras diseñar interfaces para tu software.
Elige lo que quieras. También puedes elegir otro. Desarrollo de software, continuar. Cualquiera de estos describe tu
trabajo en el fundador de una agencia, digamos que soy freelancer, o digamos que soy fundador. Continuar. ¿Con quién colaboras
habitualmente? Los compañeros de equipo, los clientes,
nadie, sólo yo. Continuar. Quiere invitar a
algunos colaboradores. No. Puedes saltarte este paso, pero si quieres
colaborar con personas en este proyecto en
particular, puedes enviarles correos electrónicos. Puedes ingresar sus correos
electrónicos aquí. Sáltate eso. ¿Qué
te trae hoy a Figma? Instalarlo para mi equipo, iniciar un nuevo trabajo o proyecto. Sí. Y aquí puedes
seleccionar un número de ellos. Así que solo comprobando las cosas. Continuar. ¿Has usado
Figma para productos antes No, es mi primera vez. Continuar. ¿Qué plan te
gustaría? A mí me gustaría este plan. Entonces voy a hablar
más sobre los archivos y proyectos
a los que tienes acceso con este plan gratuito
en la siguiente lección. Así que sigamos adelante
y hagamos clic en Continuar. ¿Qué te gustaría hacer primero? Entonces hablemos de diseñar con Figma porque no
queremos usar Fig Jam Eso es todo un curso sobre sí mismo. Acabado. Y aquí estamos. Entonces, en el momento en
que
terminemos ese asistente de configuración, vamos
a ser llevados a este rápido recorrido que nos
muestra las diferentes
partes del editor. No vamos a
pasar por esto, sino que tómate un momento y recorre todo
el recorrido para ver las
distintas partes del editor. Pero te vas a
acostumbrar a usarlos ya que
construimos las diferentes
partes de nuestro archivo. Parece porque me desconecté, no
tengo el archivo abierto Lo que voy a hacer es iniciar sesión
en mi otra cuenta, agregarla aquí para que también pueda ver qué vamos
a estar construyendo. Básicamente, así es como
crear una cuenta en FIMMA. En la siguiente lección,
hablemos de archivos y proyectos
en el plan gratuito. Te veré en breve.
4. Descripción general del editor de Figma: I. Y bienvenidos de nuevo. Entonces, ahora que has
creado una cuenta de Figma, es momento de echar un
vistazo rápido al editor Y si también has pasado por
el editor que te impulsaron a pasar con esa burbuja que estaba aquí, debes haber visto
esa burbuja azul. Pasaste por unos pasos y viste las diferentes
partes del editor. Y el paso final fue
continuar practicando aquí
o abrir un nuevo expediente. Así que he hecho clic,
creo un nuevo archivo, y ahora estoy en un editor en blanco Estos son lo mismo. Pero ahora, claro,
esto tiene algo de contenido. Entonces aquí hay un editor en blanco. Ahora, por supuesto,
lo primero que quiero señalar es que puedes cambiar el nombre
de este archivo en particular,
este archivo de diseño, y
actualmente está dentro de borradores Entonces, lo que quiero hacer
es darle un nombre, tal vez diseño de aplicaciones web de finanzas de IA, porque estamos
diseñando una aplicación
web, diseño de interfaz de usuario de aplicaciones web o
algo por el estilo. Si ahora vuelvo a los archivos, inmediatamente
nos
redirigen a la
carpeta de borradores bajo el equipo de Ken Koko Como puedes ver, tenemos un equipo generado
automáticamente. Cuando terminamos
el Asistente de Configuración, Figma
creó automáticamente este equipo para nosotros, y tenemos borradores, y tenemos todos los Ahora, dentro de todos los proyectos, tenemos justamente este proyecto de equipo. Vamos a
hablar de qué es un proyecto,
qué es un equipo, qué es una página,
qué es un archivo de diseño. Así que no te sientas
abrumado por todo eso. El punto a
quitar de esto aquí es que estos tres expedientes
están dentro de los borradores. Estos son los
expedientes de práctica que estábamos viendo,
por ejemplo, este Conceptos básicos de Figma,
básicos de Figma. Ahora, podemos mover este archivo desde aquí haciendo
clic derecho en él, mover archivo. Y bajo el equipo de Ken Koko, este equipo, tenemos borradores Como puedes ver, actualmente estamos dentro del draft,
por eso tenemos el tick, pero podemos moverlo
al movimiento de Tim Project. Entonces ahora la carpeta de borradores
tiene solo estos dos archivos. Ahora, si voy a Tim Project, ahora
tenemos el archivo de diseño de aplicaciones
web de AI Finance. Ahora, déjame hacer doble clic en él. Lo primero que debes hacer cuando
quieres empezar a trabajar en un proyecto es usar un marco. Entonces voy a hacer clic en eso. Esta es la herramienta de marco. Si haces clic en el menú desplegable, tiene algunas otras herramientas
que rara vez uso, pero puedes averiguar más
sobre para qué se utilizan Pero un marco es lo que me
gusta llamar la pantalla. Entonces por ejemplo, cuando en el
momento en que seleccionas marco aquí, vemos plantillas de
marcos que podemos usar. Entonces, si estás creando
una aplicación para teléfono, pero ahora esta es una aplicación web, así que digamos, de escritorio. Vamos con
escritorio, por ejemplo. Ahora bien, esta es una
pantalla que podemos empezar a poblar con nuestro diseño Si lo borro, y
tenemos el frame activo. También podemos dibujarla manualmente. Y si queremos editar el tamaño, podemos entrar aquí e introducir
nuestras dimensiones manualmente. Entonces el ancho, el alto, el ancho aquí puede ser 1920. Control y
rueda de desplazamiento para alejar el zoom. Rueda media del mouse presione hacia abajo la rueda del mouse
central para arrastrar, y la altura puede ser
1080. Eso es Full HD. Entonces así es como crear
una pantalla o un marco. Entonces claro, aquí
hay otras herramientas. Esta es la herramienta de selección, y tenemos otras herramientas aquí. Entonces claro, probablemente ya sepas
lo que hacen estas herramientas. Si quieres agregar algún
texto, puedes usar eso. Por supuesto, sé que me estoy
saltando estas herramientas, y la razón es porque a
lo largo de la clase, vamos a ver cómo trabajar con la herramienta más
utilizada Así que no te preocupes por eso.
Sólo te estoy enseñando los alrededores. Entonces, lo siguiente que
habrás notado es cuando agregamos un frame, esto se
creó automáticamente como una capa. Siempre que agreguemos algo, si selecciono la
herramienta rectángulo y agrego un rectángulo, se agregará dentro de aquí, pero es su propia capa. Si agrego algunos textos
y empiezo a escribir, Esa es otra capa. Si agrego una línea, esa es
otra capa. Todo existe como una capa, pero podemos agruparlos. Si selecciono la línea,
ya está seleccionada, y ese rectángulo
y los textos, notarás que
también están resaltados aquí. Si le pego al control G, puedo agruparlos y
ahora son el grupo uno. Puedo llamarlos elementos. Si explico los elementos, ahora puedes ver los tres
elementos que tenemos aquí. Aquí dentro, también puedo elegir a
estos dos y agruparlos, Control G, y grupo interno. Ahora este grupo interno está
anidado dentro de elementos, que está anidado dentro del marco Si lo amplío, ahora podemos ver estos dos. Si selecciono el grupo en sí, puedo llevar a esos dos por ahí. Si selecciono esto, llevo el grupo de elementos, y si selecciono el marco, llevo
todo el grupo de cuadros. Entonces espero que entiendas cómo
trabajar con grupos ahora, la jerarquía de grupos. Ahora bien, si selecciono eso, controlo el turno G, eso agrupa los grupos
que hayas seleccionado. Y claro, antes
que nada, hemos desagrupado al grupo externo Ahora bien, si vuelvo a controlar el turno G, desagruparemos al grupo interno Puedes dejarme deshacer eso. También puedes seleccionar
Ahora este es un grupo. Si hago clic con el botón derecho, puedo agrupar, así como así. Ahora, una vez que tengamos seleccionado este
rectángulo, traeremos
aquí algunas propiedades que podemos cambiar. Por ejemplo, el color de relleno, seleccione eso, podemos
cambiarlo a rojo. También podemos agregar un
trazo como podemos ver. Entonces seleccionando más aquí
agrega un trazo negro. Y si me acerco, note
que tenemos ese trazo negro, y seleccionándolo de nuevo, podemos ir al trazo
y agregar su ancho. Seleccionando aquí y usando la flecha de la aplicación
en el teclado. También podemos cambiarlo
a una línea discontinua
yendo a este menú y
cambiar de sólido a d, y ahora es una línea discontinua Mientras está seleccionado,
podemos eliminar el campo haciendo clic en este signo menos. Si bien está seleccionado, también podemos jugar con
el radio del borde. Esas son las esquinas.
También podemos simplemente ir directamente aquí y
tirar de estos puntos. O podemos entrar aquí, hacer clic ahí e
ingresar un valor específico. Quizás 20, y ahora tiene
un radio fronterizo de 20. Si digo 50, así como así. Si selecciono este icono de
esquinas independientes aquí, podemos cambiar la parte
superior inferior izquierda, superior derecha, abajo derecha. Vamos a probar eso. Arriba a la derecha 50. Ahora, digamos arriba a la derecha cero,
y abajo a la derecha, abajo a la izquierda, cero. Ahí vamos. Si seleccioné, podemos volver atrás y
agregar un color de relleno una vez más y
eliminar el trazo. Cuando seleccionamos el texto, traemos a colación propiedades
que pertenecen al texto Podemos cambiar el
grosor de la fuente, extra negrita. También podemos cambiar el tamaño
viniendo aquí y
escribiendo tal vez 32. Podemos cambiar de inter
a una fuente diferente. Vamos a escribir tal vez
Montserrat Enter. Podemos cambiar la
alineación del texto. Ahora bien, si tenemos un párrafo. Por ejemplo, permítanme simplemente
copiar un párrafo de uno de estos copia que.
Pega eso ahí. Ahora notarán que aquí pegué
un párrafo largo, pero está en una línea, y eso es por
esta configuración de aquí mismo Puede ser ancho automático, pero si vuelves a hacer clic en
él, puede ser ancho automático o puedes
cambiarlo a tamaño fijo. Ahora, déjame seleccionar esta esquina aquí y
ponerla ahí mismo. Ahora bien, si explico esto, notarán
que esto ha cambiado de o ancho a tamaño fijo porque tiene que caer dentro
de las dimensiones específicas de este cuadro de texto
que lo sostiene. Ahora bien, si lo
volvemos a cambiar de nuevo, cambia a esa línea
única. Todo bien. Eso es básicamente una
visión general rápida del editor. Llegaremos a conocer más sobre las diferentes partes del
editor a medida que continuemos. Recuerda, mi objetivo con esta clase es
mostrarte cómo usar las diferentes herramientas
que
usarás la mayor parte del tiempo
cuando trabajas en Figma. Y con eso dicho,
pasemos a
la siguiente clase donde
estaremos hablando de equipos, proyectos,
archivos de diseño y páginas. ¿Qué quieren decir? Lo que
cae dentro de lo que. Vamos a averiguarlo.
5. Equipos, proyectos, archivos y páginas: Lo que quiero hacer es ir a este menú desplegable
y volver a los archivos. Entonces este es el proyecto en el que estaba. Ahora, antes de ir demasiado lejos, antes que nada quiero llegar
a este menú desplegable, y como pueden ver,
puedo agregar una cuenta. Así que permítanme agregar
cuenta porque quiero abrir nuestro diseño de
referencia, el que había diseñado antes, así que permítanme iniciar sesión. Y esto es todo. Déjame ver. Déjame hacer doble clic en eso. Sí, aquí estamos. Ahora, si vuelvo a los archivos, en esta pestaña, estoy
logueado como Ken Bs. Déjame arrastrarlo para que
sea el primero aquí. En esta pestaña, estoy
loged in como la D. Se
puede iniciar sesión como cuentas
diferentes en diferentes De esa manera, si vuelvo
a la cuenta de Ken Bersa, ahora
puedo hacer doble clic en esta Y abrirla, y
solo puedo desacoplarla de esa ventana y dejarla como ventana
propia para que podamos cambiar entre las dos con
alt tab, así como así Ahora, volviendo aquí, cuando terminamos de
configurar nuestra cuenta Figma, cuando pasamos por
ese asistente de configuración, Figma
creó automáticamente un equipo para Ahora mismo, deberías
estar teniendo un equipo aquí diciendo algo té. Con eso hecho,
solo quiero deshacerme de eso porque eso es un traqueteo. Y ahora que estamos
dentro de este equipo, el equipo Ken Pumas.
Déjame hacer clic en eso. Sí. Así que
asegúrate de hacer clic en el menú desplegable
y hacer clic en tu equipo Ahora estás dentro de tu equipo. Aquí, tenemos un proyecto. Si queremos un proyecto extra, necesitaremos actualizar
al plan pro. Si hago clic en esto para agregar
un proyecto o aquí, me encontraré con este aviso
para actualizar a profesional. Pero un proyecto es
más que suficiente para nuestro trabajo, nuestros proyectos
personales. Por supuesto, tal vez quieras
cambiar este nombre del proyecto. Entonces iré a este menú
desplegable, renombraré, y lo
llamaré Control A. Elimine eso, finanzas de IA,
y le renombraré Ese es el nombre de
este equipo en particular. Déjame agregar la palabra equipo. Equipo ahí. Ahí vamos. Si hacemos clic aquí en este menú
desplegable, también
puedes crear
otro equipo A lo mejor tienes un
equipo de Fitness, un equipo de Fitness App. Así que tienes otro equipo que está
trabajando en una app de fitness, y puedes optar colaborar con la
gente o esquiar por ahora. Elija el motor de arranque. Y ahora tu equipo
dentro de la app Fitness. Haz clic en este menú desplegable, puedes volver a AI Finance o crear
otro equipo más. Entonces quiero
volver a AI Finance. Ahí vamos. Y cada equipo
tendrá un proyecto. Así que el equipo de AI Finance
tiene un proyecto. Pero cada proyecto puede
tener tres archivos de diseño. Entonces como pueden ver,
tenemos este archivo original. Puedo añadir
otro, otro. Pero si voy al cuarto, me pedirán que actualice. Así que déjame hacer
doble clic en esto. Y llamarlo tal vez aplicación web de finanzas de
IA. Así que volvamos a los archivos. Entonces estamos dentro
del proyecto de equipo, podemos renombrar el proyecto. Este proyecto de equipo
aquí mismo es si hago clic en el menú desplegable y solo
selecciono el equipo de finanzas de IA, ¿este proyecto de equipo
aquí que contiene los tres archivos de diseño que
estamos a punto de crear? Si tengo razón, puedo cambiarle el nombre para financiar archivos de diseño. Perdón por eso. Archivos de diseño de AI Finance. Entonces ahí vamos. Ahora, recuerde que hemos creado un archivo llamado AI
Finance Web App. A lo mejor este es el
archivo donde usamos para diseñar la
versión de la aplicación web del mismo. Ahora, si agrego otro,
ahora, recuerda que estamos dentro del proyecto
AI Design Files. Esta se puede llamar aplicación móvil
AI Finance. Volviendo a los archivos. Ahora, en cuanto
dejamos un archivo de diseño, cuanto salimos del editor, somos redirigidos de
nuevo a un proyecto Y recuerda, solo tenemos
un proyecto por cada equipo. Así que ahora mismo estamos dentro
del proyecto de
archivos AI Finance Design. Déjame llamar a este proyecto. Proyecto de Diseño de AI Finance. Pero también podemos ir dentro del equipo que está
sosteniendo este proyecto y todos los demás proyectos en él si estamos en el plan de pago. Si entro dentro del equipo de AI Finance, Todos los proyectos que tenemos aquí se
enumerarán debajo del equipo. Pero recuerda, bajo cada equipo, si estamos usando el plan gratuito, solo
podemos tener un proyecto. Ahora, cuando estamos
dentro de un proyecto, este proyecto que actualmente está
dentro del equipo de finanzas de IA, para ver todo lo que está
dentro del proyecto, simplemente
podemos hacer clic en eso. Ahora estamos dentro del proyecto
que está dentro del equipo. Ahora dentro de este proyecto, recuerda que tenemos
dos archivos de diseño. Podemos agregar un archivo de diseño más. Ahora bien, esta es la tercera. Digamos que tal vez también tenemos una versión en el sitio web de nuestra aplicación, sitio web de
I Finance. Eso es con fines
informativos, y queremos contarle a la
gente sobre nuestra aplicación Ahora tenemos tres archivos aquí, sitio web de
AI Finance, AI
Finance Mobile App, AI Finance Web app. Si tratamos de agregar un archivo de diseño, nos encontraremos con
este mensaje aquí para actualizar porque solo podemos tener tres archivos de diseño dentro un proyecto que está dentro de un equipo. Ahora, creo que aquí había creado algo para
ayudarnos con la jerarquía. Déjame abrir adobe
Illustrator muy rápidamente. Y aquí estamos.
Contamos con un equipo. Por ejemplo, tenemos
este equipo de finanzas de IA, y el equipo solo puede tener un proyecto si estamos
usando el plan gratuito. Un equipo puede tener un proyecto. Si queremos un proyecto extra, tenemos que estar en el plan
profesional pagado. Un equipo puede tener un proyecto. Un equipo, el
equipo de finanzas de IA tiene un proyecto, que es el proyecto de diseño de IA. Déjame entrar dentro
del propio equipo. Tiene apenas este proyecto único llamado AI Finance
Design Project. Si queremos agregar proyectos
extra, tendremos que ir
al plan pagado. Un equipo tiene un proyecto. Pero puedes crear
múltiples equipos. Contamos con el equipo de Fitness App
que tiene la misma jerarquía. Si cambiamos a eso, Este tiene un proyecto que no
hemos renombrado, y el proyecto aún no
tiene archivos de diseño También podemos crear un tercer equipo. A lo mejor tenemos un equipo de
aplicaciones de marketplace. Crea eso. Vamos a saltar por ahora. Como puedes ver,
tenemos tres equipos hasta el momento y puedes
seguir creando equipos. Permítanme
volver a las finanzas de IA. O Equipo de finanzas de IA El
equipo tiene un proyecto, un proyecto gratuito llamado AI
Finance Design Project, y cada proyecto puede
tener tres archivos de diseño. Este proyecto de diseño de IA
cuenta con tres archivos de diseño. Si queremos uno extra, también
tenemos que pagar tres archivos
Figma Design y FIJ Ahora, una vez que estamos
dentro de un archivo de diseño, también
tenemos acceso
a tres páginas, pero por cierto nunca uso más de
una página. Si por ejemplo, abro la aplicación móvil, haga
doble clic en esa, el archivo de diseño de la aplicación
móvil. Estamos en la página uno ahora mismo. Si queremos páginas extra, podemos venir aquí.
Estamos en la página uno. Puedo agregar una
página extra, página dos, entrar, página tres, entrar, Si trato de agregar una
página extra, no puedo obtenerla. Así que normalmente
solo uso una página. Permítanme simplemente borrar eso eso, y ahora me queda
esta sola página. Déjame colapsar eso. Aquí es donde ahora
puedo venir y comenzar agregar capas de elementos
dentro de esta primera página. Para mí, normalmente es
más que suficiente para mi proyecto, y ya lo verás. Pero ahora mismo, quería que
echáramos un
vistazo rápido a la jerarquía
y cómo se relacionan los proyectos, archivos y páginas. No vamos a tocar Fig Jam porque ese es todo un
curso por sí solo. A lo mejor voy a hacer eso más tarde. Ahora mismo,
solo nos estamos enfocando en diseñar este dashboard
usando el editor Figma No nos estamos enfocando en Fig Jam. Ahora bien, con eso dicho,
creo que esta lección se
ha vuelto mucho
más larga de lo que esperaba. Pero tenía muchas ganas de
conducir eso a casa. Yo quería que tuvieras esa
claridad porque esta es una de las partes más confusas
de Figma para los principiantes. Realmente no
entienden qué es un archivo, qué es un proyecto, qué es un equipo. Ahora que
entiendes todo eso, creo que estás listo para comenzar a
construir nuestro tablero. En la siguiente lección, veamos
cómo crear la barra lateral. Te veré en breve.
6. Agrega un fondo y un logotipo: Entonces ahora estamos listos
para comenzar con el diseño real
del tablero, y decimos que vamos a
comenzar con la barra lateral. Entonces como puedes ver, lo primero que tenemos que
hacer es importar el logo. Entonces, volviendo a nuestro
espacio de trabajo, ¿dónde está? Aquí estamos. Entonces ahora, estamos trabajando en la versión de la
aplicación web de nuestra aplicación. Entonces voy a hacer doble clic en eso
y ahora aquí estamos. Lo primero que queremos hacer es crear la pantalla real. Para ello, seleccionaré esta
herramienta y una vez que la seleccione, va a revelar
aquí
varias plantillas con las que podremos
comenzar rápidamente. Debido a que esto es un escritorio, quiero seleccionar, déjame colapsar el teléfono
y expandir el escritorio. Después elegiré el
Macbook Pro de 16 pulgadas. O simplemente, vamos a elegir
eso. Ahí vamos. Por supuesto, como pueden ver, si selecciono esta
herramienta una vez más, si quisieras
diseñar para teléfonos, puedes elegir el
teléfono que quieras aquí. Con eso,
lo siguiente que queremos hacer, permítame simplemente
volver a nuestra referencia. Quiero agregar aquí esta
tenue línea. En primer lugar,
agreguemos el fondo. Volviendo, vendré aquí y seleccionaré la herramienta
rectángulo. Si no puedes ver
la herramienta de rectángulo, haz clic en el menú desplegable y
selecciónala de la lista. Entonces solo arrastraré y cubriré toda la
pantalla con ella. O marco. Con eso, quiero seleccionar
un muy oscuro En primer lugar, cambiemos al azul. Digamos que azul, y luego es a tal vez ese
azul oscuro así. Yo solo lo estoy haciendo
freestyle, pero para ti, tienes que trabajar con códigos de color
específicos Aquí está el código de color. Si quieres usar los
colores que estoy seleccionando. Hagámoslo más oscuro
hasta ese punto. Ese es el código de color. Ahora permítanme seleccionar este
menú desplegable y elegir la línea. Seleccione para limitarlo
solo a arriba e abajo y
no moverse de izquierda a derecha. Puedes mantener presionado el turno. Eso significa que solo
se moverá hacia arriba y hacia abajo para una
línea vertical de tasa de arco. Y ahí vamos. Quiero seleccionar la línea en
sí y seleccionar el color del trazo. Quiero ir a esto y
arrastrarlo tal vez hasta ese punto. Sólo para asegurarse de que está oscuro. Creo que ese es un buen lugar. Ahora para importar el logotipo, voy a hacer clic en este
menú desplegable archivo lugar imagen Como pueden ver, tenemos
un atajo Control Shift K. Simplemente puedo
hacer click en cualquier parte aquí, luego Control Shift
K. Se abrirá el Explorer y podré ir directamente a donde
tengo esos elementos. Tengo esta llamada de polo activos. Tenemos el logo aquí
si quieres usar este logo y pinchando en
cualquier lugar y arrastrando Colocará el logo aquí. Entonces mantendré presionada la tecla shift y luego seleccionaré una de las esquinas
y la arrastraré para redimensionarla. Si no mantienes presionado el turno, el marco se
moverá por todos los lados, pero si mantienes presionado el turno, solo
se moverá
proporcionalmente Recuerda, controla el turno K, haz
doble clic, luego selecciona
en cualquier lugar y arrastra para importar. Entonces ahí vamos. Creo que vamos a parar esta
lección aquí mismo. Hemos aprendido a
crear el fondo, agregar esa línea, cambiar colores e importar una imagen. Esa es también la
misma manera de importar cualquier otro tipo de imagen
que quieras importar. Así que paremos
ahí mismo por ahora. En la siguiente lección, veamos cómo
crear un botón. Entonces te veré en breve.
7. Crea los buttons de la barra lateral: Bienvenido de nuevo. Ahora que hemos creado un
fondo y hemos agregado el logo, es el momento de crear los botones. Déjame acercar
manteniendo pulsado el control y desplazándome
con la rueda del ratón Después manteniendo presionada la rueda
del ratón sola. Puedo arrastrar y colocar esto en
el medio para que podamos verlo. Ahora, te darás cuenta aquí, tenemos algunos textos y un icono. Y claro, tenemos
el botón de fondo. Cambiando de nuevo aquí. Mantener pulsado el control y desplazarse con
la rueda del ratón Suelta el control, mantén presionada
la rueda del ratón y arrastra. Quiero venir aquí y seleccionar esta herramienta de rectángulo y arrastrar y soltar y arrastrar y
soltar en ese lugar. Ahora, notarás
que tiene esquinas afiladas. Para darle esquinas redondeadas, podemos dar click aquí. Y darle tal vez diez enter, y creo que ese es un buen botón de esquina
redondeada. Ahora, por supuesto, en nuestro diseño de
referencia aquí, esto es más ligero que
el fondo. Seleccionando esto,
iremos aquí al campo. Seleccione el fondo. Creo que este es el color
de fondo que seleccionamos. No, ese es el color de fondo porque ahora lo podemos ver, pero ahora quiero que
sea más claro. Quizá hasta ese punto. Sólo estamos tratando de
jugar con los colores. Pero recuerda, si es una
marca real en la que estás trabajando, necesitas usar los
colores de la marca. Sé creativo con ellos. Creo que eso me gusta.
Lo siguiente que quiero hacer es seleccionar el texto y hacer
clic en cualquier lugar, no necesariamente
dentro del botón. También puedo hacer clic aquí
y escribir resumen. Haga clic afuera o en cualquier lugar
aquí. Después selecciona eso. Hagamos que sea el tamaño 16 y
el texto 16, así como así. Puedes cambiar la
fuente si quieres. Ahora mismo es ter. Podemos seleccionar tal vez Monat Enter. Podemos cambiar el
peso para que pueda seleccionar negrita. Ahí vamos. Ahora lo siguiente que
queremos agregar es el icono. Entonces cambiando de nuevo,
notarás que ya había abierto
una pestaña aquí para iconos vectoriales, y se llama
icono plano o icono plano, dependiendo de cómo
quieras pronunciarlo. Entonces voy a escribir lo que tenemos aquí. Analítica, por ejemplo, enter. Todo bien. Entonces aquí estamos. Tengo este análisis
aquí mismo, y ya estoy conectado. Si no estás conectado, no
podrás editar los iconos antes de
descargarlos. Si selecciono el icono en
sí, aparecerá la
opción de editar el icono. Haré clic en el icono de edición. Mientras esta está seleccionada, haré clic en el color y lo
cambiaré a color blanco. Después descárgala.
Seleccionaré el tamaño 64 pixeles. Descarga gratuita. Ahora que lo
tenemos descargado. Déjame volver a cambiar aquí. Lo tenemos descargado. Puedo arrastrarlo y soltarlo aquí. Mantenga pulsada la tecla Mayús, luego seleccione una esquina aquí y cambie su tamaño. Colócala ahí. También puedes venir aquí y hacer clic en este icono
aquí mismo para mostrarlo en carpeta. Se abrirá donde se
encuentra en tus descargas. Y luego puedes arrastrarlo
y soltarlo ahí. Suprimir eso. También puedes
controlar el turno K, recuerda. Después ve a descargas. Haga doble clic en eso y arrastre manteniendo presionada la tecla Mayús para
cambiar su tamaño proporcionalmente Esas son todas
formas diferentes de hacerlo. Ahí vamos. Déjame solo Posicionar eso. Ahora, una forma de
posicionar los elementos dentro su obra de arte es seleccionar
tal vez
el texto, el icono y
finalmente, el botón. Ahora cuando alineemos los ítems, habrá alineados en
referencia al botón. Si vengo aquí para alinear
los centros verticales y hacer clic en eso, como has visto, se han movido relación con el
fondo del botón en sí. No se mueve, pero
todo lo demás se
ha movido porque es
el último elemento que seleccioné. Entonces una vez más, si
pongo eso ahí y quiero que esté
verticalmente en el centro, puedo seleccionarlo, luego
el botón en sí, el ítem al que quiero que el otro
ítem esté alineado. Y luego haga clic en este centro de alineación
vertical, y ahora está en el centro
del último elemento que seleccionamos. Entonces con eso, voy
a seleccionar estos tres. Controla G y agruparlos y
renombrarlos al botón uno. Ahora bien, si mantengo pulsado Alt, como pueden ver el
cursor del mouse parece estar duplicado, y eso es una
indicación de que estamos a
punto de duplicar este botón. Y arrastrando mantén presionado el turno para limitarlo que no se mueva hacia la izquierda y
hacia la derecha Mantenga el turno,
suéltelo ahí mismo y luego controle D para
continuar duplicándolo. Control D, y ahora
tenemos varios botones. Ahora voy a repetir el proceso para
estos otros botones, el mismo proceso de
edición de este texto, seleccionaré este texto, cambiaré estos dos órdenes. Entonces iré a
icono plano o flatcon, y tal vez buscaré pedidos Déjame solo buscar órdenes. Solo busca bonitos iconos
creativos. Déjame ver las ventas. Todo bien. Entonces L et
me seleccionamos eso. Icono de edición. Mientras se selecciona
esta, Blanca descarga PNG
64 descarga gratuita. Se ha descargado.
Vuelva a cambiar aquí. Acercar. Ve aquí,
arrastra y suelta eso. Mantenga presionado el turno, obtenga una esquina. Seleccione esto, quítelo. Ahora, cuando tenga un grupo y desee seleccionar un
elemento dentro de ese grupo, mantenga presionado el control, puede seleccionar un solo elemento
dentro de cualquier grupo. Si suelta el control, no
podrá seleccionar
elementos dentro del grupo a menos que haga doble clic. Ahora quiero reposicionar
esto, mantén presionado turno. Y voy a dejar eso ahí mismo. Entonces voy a repetir el mismo proceso para el resto de los botones, y te veré una vez que termine. Ahora, por si acaso encuentras que un artículo no está dentro de un grupo en el
que querías estar. Por ejemplo, este icono ahora
no está dentro de este
grupo, está afuera. Si selecciono este grupo, es el botón tres, y
el icono está aquí arriba. Aquí está el grupo, y
aquí está la billetera. Yo sólo puedo arrastrar la
cartera al grupo tres, así como así,
dejarla caer ahí. Ahora si selecciono el grupo, cada uno solo grupo. Entonces mensajes,
vamos a los mensajes. Déjame arrastrar esto hasta
el fondo así. Cambia eso a la configuración. Seleccione la
herramienta de selección. Entonces aquí voy a. Seleccione eso. Dit el icono. Cambia el color a blanco, descarga, PNG, 64, descarga
gratuita. Vuelve aquí. Arrastre,
mantenga presionada la tecla Mayús. Por supuesto, está afuera, este es el botón número seis, entonces está automáticamente
dentro, así que no hay problema. Mantenga presionado el control para
seleccionar este icono,
elimínelo , mantenga presionado el
control para seleccionarlo. Vamos a colocarlo ahí. Tal vez mantenga presionado el turno y seleccione eso. Está correctamente alineado. Sólo voy a arrastrar eso. Espero que hayas seguido
el proceso que hicimos con el primer botón y ahora
tienes un par de botones. Creo que este es el
final de esta lección. En la siguiente lección, veamos cómo
crear la barra de búsqueda. Te veré en breve.
8. Crea la barra de búsqueda: Bienvenido de nuevo. Ahora es el momento de
crear la barra de búsqueda. Vamos a emplear
los mismos principios que empleamos aquí mismo. Volviendo a nuestro editor. Aquí estamos.
Lo primero que tenemos que hacer es seleccionar esta herramienta rectangular. Sólo voy a arrastrar y a lo mejor soltar cuando
llegue a ese punto. Ahora, claro, necesito
darle esquinas redondeadas. Lo seleccionaré
y le daré 50 para asegurarme de que esté
completamente redondeado. Como puedes ver,
tenemos este ícono de búsqueda. Déjame acercar, buscar. Entonces voy a ir a icono plano. Después busque Buscar Entrar. Y aquí vamos. Tenemos
tantos íconos de lentes aquí. Vamos, déjame
ir con éste. Voy a hacer clic en el icono de Eddie. Cambia eso a No, déjame hacerlo grisáceo. Entonces 64 descarga gratuita. Volviendo aquí. De hecho, permítanme cerrar así a todos
estos otros. Ahora, volviendo aquí, iré a las descargas
y arrastraré esto aquí. Ahora como se puede ver los dos
colores son casi similares, así se puede ver la lente. Seleccionaré la barra de sarge
y la haré quizá más oscura, un poco más oscura, así como así Ahora puedes ver la lente, y mantendré presionada la tecla
Mayús para redimensionarla. Incluso podría ponerlo en
este otro extremo porque la curva está en el lado izquierdo del
lado derecho, así como así. Guardar. Y me olvidé
de encender mi luz aquí. Entonces espero que ahora me puedan
ver claramente. ¿Qué más tenemos aquí? Tenemos estos botones, notificaciones,
modo oscuro y usuario. Entonces volviendo a cambiar aquí. Notificaciones. Déjame seleccionar ese cambio de color. Descargar PNG 64
Pixels, descarga gratuita. Necesitamos entrar en modo oscuro. Podemos seleccionar tal vez esto
o tal vez esto, editar icono. Vamos a cambiarlo a
blanco, descargar, PNG, descarga
gratuita, y por último, er. Seleccionaré esto o tal vez este ese icono
cambie eso a blanco. Descarga esa descarga gratuita de PNG
64. Ahora, volvamos aquí, notificación. Y haz eso. Notificación, déjala ahí, brillo y
contraste y usuario. Seleccionando
los tres manteniendo pulsada la tecla shift para cambiar su tamaño. Ahora los arrastraré y colocaré. De hecho, ahora que tengo
los tres seleccionados, puedo alinearlos verticalmente
en relación entre sí. Creo que ahora estamos empezando
a tener un buen diseño. Creo que por ahora lo
vamos a dejar ahí. Veamos lo que tenemos a continuación. En la siguiente lección, veamos
cómo crear estas tarjetas. Vamos a comenzar
con un texto aquí y luego crear una tarjeta. Te veré en breve.
9. Tarjeta de ganancias totales: Ahora es el momento de comenzar a crear las partes principales del tablero, y estas son las tarjetas. Pero antes de hacer eso, antes que nada, agreguemos este texto. Voy a mantener presionada
Control para seleccionar este texto, copia triple clic. Entonces voy a cambiar de nuevo a mi editor aquí mismo.
Seleccione el texto a. Haga clic en cualquier lugar de allí y
luego controle V para pegar. Todo bien. Así que lo
colocaré ahí mismo. Y voy a venir y
triple clic aquí, copiar ese Hall abajo en aquí, y arrastrar triple clic pegar. Déjame usar los botones de
flecha de mi teclado. Ahora, para ti,
estarás escribiendo. Permítanme seleccionar T, y luego escribir salud financiera. Estado, escape o clic en
cualquier lugar fuera. Ahora puedes ir al texto. Puedes cambiarlo a Monsat, o a cualquier otro teléfono que quieras Entonces puedes aumentar
el tamaño del teléfono. mejor digamos 36, y tal vez digamos que el
peso es negro. Sólo
te estoy enseñando cómo hacerlo si no lo estás copiando
pegándolo de alguna parte Vamos también esta es una visión general de su situación
financiera este mes. Al hacer clic en cualquier lugar fuera.
Ahora que tenemos eso, puedo cambiar esto
tal vez a la talla 12. Digamos 14, y
cambiemos esto de nuevo a lo regular. Básicamente, así es
como hacer eso. Pero ahora permítanme simplemente borrar eso porque
ya tengo mi texto. Ahora queremos crear esta tarjeta. Antes de hacer eso,
agreguemos este botón. Simplemente seleccionaré esto, mantén pulsado y arrastraré eso. Hasta ese fin. Después mantendré pulsado el control para seleccionar este
fondo en sí. Ahora que está seleccionada, puedo presionar I para que aparezca la herramienta cuentagotas y puedo pasar el
cursor sobre esta naranja, y eso aplicará este color naranja al artículo
que esté seleccionado actualmente Entonces haz clic en eso. Ahora nuestro botón tiene ese color. Esto decir es crear nuevos productos. Crear nuevos productos. Haga clic en cualquier lugar aquí. Mantenga pulsado Control para
seleccionar el botón, quítelo, mantenga presionado
Control, para seleccionarlo. Y no te
preocupes por la organización. Sé que
aquí todo está desorganizado, pero eso es una lección por sí solo Vamos a
organizarlo todo porque tendremos que
agruparlo todo en consecuencia. Lo siguiente que queremos hacer
es crear esta tarjeta aquí. Sólo voy a
aguantar para
duplicar esto y
dejarme colocarlo aquí mismo. De hecho, voy a
desagruparlo por ahora, haz clic
derecho en grupo, y ahora
ya no está agrupado Quiero redimensionar este
2255 por De hecho, déjame hacerlo manualmente El ancho es 259, la altura es 252. Hagamos esto 260. Por 26260. Ahora está al cuadrado Quiero seleccionarlo
y tocar I para que aparezca el cuentagotas y
luego seleccionarlo Después haga clic afuera. Eso le dará ese
mismo color que los botones. Vamos a crear la
cantidad copiar eso. También puedes simplemente arrastrar esto,
seleccionar esto, y tal vez
dejémoslo a un lado. Digamos 43,210 afuera, haga clic. Pon eso ahí. Haga doble clic en esto. A lo mejor
puedo llamar a este signo de dólar, hacer clic afuera, arrastrarlo y
soltarlo en algún lugar de aquí. O necesitamos
hacerlo un poco más ancho. No necesariamente tenemos
que tenerlo como rectángulo. Ganancias totales. Simplemente voy a
arrastrar no, seleccionar esto. Ganancias totales. Así como así. Ahora
tenemos estos tres, celdas de
tienda, anuncios de YouTube,
anuncios de Google. Podemos seleccionar esta herramienta. Podemos seleccionar este rectángulo, crear algunos rectángulos diminutos
manteniendo presionada la tecla shift, quiero o adentro por
control y rueda del ratón Entonces vamos a darles una esquina redondeada de tal vez
tres, así como así. Al y arrastra esto. Venta en tienda.
Anuncios de YouTube Anuncios de Google. Así que haga clic en cualquier lugar afuera. Seleccione eso y aquello.
Antes de hacer eso, hagamos esto regular. Hagámoslo tal vez Talla. Seleccione ese Agregar y luego controlar
D para repetir el mismo movimiento. Anuncios de Google Ads en YouTube. Ese es el ingreso que
hicimos de todo eso. Ahora cambiemos los colores. Puede darle a esto un gris claro. Cambiemos al azul, luego dale ese azul claro. Vamos a darle a esto tal vez
algún color rojo. ¿O debería decir color naranja? Sí, vamos de hecho, vamos a sombrero yo para sacar el cuentagotas
dos mientras se selecciona este,
yo, y luego toque eso Y luego también tenemos
un bonito verde. Entonces abriendo esto creo
que es un bonito verde. Ahora bien, en el
diseño de referencia aquí, si mantengo pulsado el control
y selecciono esto, como pueden ver, este
es el icono de gráfico Pi. Entonces cambiando de nuevo aquí, puedo ir al icono plano. Gráfico pi, gráfico Pi, enter. Ahora creo que ya está, pero quiero algo más sencillo. Déjame seleccionar
eso. Editar icono, y ahora tenemos tres colores. Puedo cambiar esto a
que color era este. Déjame volver a aquí, seleccionando esto, copia eso. Control C para copiar
este código de color, vuelve aquí, pégalo ahí. Oh, se supone
que debemos entrar aquí. S elige esta naranja. Copia eso, cámbiate aquí. Ese es el color azul. Haz doble clic en esto,
pégalo ahí, y ahora es naranja. Por último, tenemos este verde, haga
doble clic en eso,
Control C, seleccione esto. G aquí,
haga doble clic en eso, ingrese. Ahora tenemos eso. Descargar, PNG. Vamos a descargar 512. Descarga gratuita, y ahí vamos. Ahora, entrando aquí, podemos arrastrar y soltar esto aquí. Mantenga presionado el turno, redimensionarlo. Y ahora cada
porción del Pi está representada por
estos valores aquí. Déjame mantener presionada la tecla shift
y seleccionarlas todas, mantén presionada la tecla shift para cambiar su tamaño. Arrastra y ponlos ahí. Selecciona el texto en sí, y vamos a darle
tal vez tamaño diez o 11. Ahí vamos. Ahora también dejémosme mantener
presionado el control y acercar, sosteniendo esto y
turno, luego aquello. Alineemos eso con
el cuadrado pequeño. Sostén eso, luego cambia. Alinea, selecciónalo,
mantén presionada la tecla Mayús. Alinea eso. Ahora, seleccionando estos tres en y arrastrando hacia la derecha. Mantenga presionado el turno para
moverse en línea recta. Ahora vamos a cambiar de alinear a la
izquierda en el
texto a escribir align. Déjame seleccionar esto,
luego esto, luego esto, y alinearlos a la derecha
en referencia a esto, luego arrastrarlos hasta
tal vez ese punto. Porque queremos venir
y sumar estas cifras, 12.05 3.000 dólares y Signo de dólar 3,522, signo de dólar 10,320
y
signo de dólar También podemos seleccionar
el texto la figura misma y controlar
B para que sea negrita. Controla B o ve directamente
aquí y hazlo negro. Pero eso es audaz extra
audaz. Cambiando aquí. Estos son un poco débiles, así que seleccionaré a los
tres, iré a sentir y
los arrastraré hasta ese punto Esto también es débil. Lo arrastraré tal vez
hasta ese punto. Ahora, te darás cuenta, necesitamos hacer algún
arreglo aquí para que sea un poco más
atractivo y organizado. Pero en general, me encanta lo que
tenemos hasta ahora. Guarde eso. Ahora, empujemos esto hacia adentro
junto con todos estos. Y por último, necesitamos agregar
este indicador de desempeño. Entonces, claro,
podemos simplemente arrastrar esto. Aguanta, arrastra eso. Entonces vamos a redimensionarlo. 3.8 arriba por 3.8 este mes. Ahora, esto está detrás de esa caja. Así que sólo puedo arrastrarlo y ponerlo encima.
Quizá en algún lugar ahí. Todavía no está arriba, así que seguiré
arrastrándolo hasta arriba Vamos a colocarlo ahí mismo. U en 3.5%. Haga clic afuera. Lo
haré verde. Así que voy a golpear mientras
se selecciona este ojo para
traer el cuentagotas, así como
así, luego
controlar B, para que sea audaz Y claro, ahora
necesitamos encontrar esta flecha. Así que voy a entrar aquí, cerrar eso, luego flecha. A mí me gusta esto, selecciona
eso, edita icono. Cámbialo a ese verde. Volviendo aquí, seleccionaré. No. Volvamos a nuestra obra de arte porque queremos
tener este verde preciso. Control C para copiar eso. Vuelve aquí,
haz doble clic en esta pasta. Descargar PNG 64, descarga gratuita. Ahí vamos. Vuelve aquí, arrastraré y soltaré esto aquí. Mantenga presionado el turno. Luego gírelo manteniendo presionado el turno para hacer 45 incrementos de
ángulo Y haz eso, mantén presionado el
turno y empieza a girar. Coloquemos eso ahí. Y ahí
lo tenemos. Ahora, de hecho, voy a seleccionar
todo aquí. A ver. Sí,
todo está seleccionado, Control G. Luego seleccionaré
mientras aún esté seleccionado,
el grupo, todos bajaré el turno y seleccionaré la tarjeta que
se supone que los sostenga, luego ahora alinee todo
al centro de eso. Ahí vamos. Entonces,
tenemos nuestra primera tarjeta.
10. Assignment: el resto de las cartas: En la lección anterior, creamos esta tarjeta, y te estoy dejando
con asignaciones para crear estas tres
cartas, una, dos, tres, y como puedes ver, esta es una barra
igual a esta, y es de color verde. Si mantengo presionado el control
para seleccionar
esto, tiene este color azul claro, pero aún tiene
esquinas redondeadas y todo eso. Ahora, solo quería dar más aclaraciones para esto, cómo creé esto
fue, si me acerco, como pueden ver, esto de aquí, es un rectángulo con esquinas
redondeadas, pero en el nivel tres. Entonces por eso no se están reuniendo así en el centro. Así que volviendo al nivel tres. A esto se aplica el mismo caso. Pero ahora esto no
tiene un color de campo, tiene un color de trazo. Y básicamente
coloqué esto dentro esto para crear este
efecto de niveles. Espero que tenga sentido. Y para esta última, lo que hice fue Lo
mismo que hice aquí. Fui a inundar icono y
busqué qué es esto, por cierto, Fecast Vamos a entrar aquí y
ver si podemos conseguir un pronóstico. ¿Qué conseguimos? Todo bien. Ahora bien, lo que estamos obteniendo
es el pronóstico del tiempo. Entonces creo que el pronóstico de ventas. Sí. Ves
documentos como estos para representar pagos pendientes. Pero como puedes ver, esta sección aquí es bastante similar a esta, y eso es algo que
puedes hacer muy fácilmente. Yo solo quería ayudarte con esa aclaración para
que no te quedes atascado. Veamos qué se
te ocurrirá. Además, siéntete libre de crear
algo propio. No hace falta crear
estas barras o estas aquí. Veamos si puedes ser
creativo y diseñar algo
diferente para las tarjetas. En la siguiente lección,
veamos cómo agregar estos gráficos y gráficos de barras. Entonces te veré en breve.
11. Agregar gráficos y gráficos: Ahora es el momento de trabajar en esta tarjeta de aquí
y probablemente esta. Volviendo a nuestra obra de arte. Quiero seleccionar este grupo y esta tarjeta que los
sostiene, y de hecho, agruparlo
todo. Control G. Ahora es una sola carta
que puedo arrastrar por ahí, o hay este
número aquí que
también mantengo presionado la nave para seleccionar
ambas, Control G. A. No puedo poner eso ahí porque está
en un grupo separado. Déjame antes que nada, desagruparlo. ¿Qué hay aquí?
Déjame simplemente desagruparlo. Ahora tenemos 3.5. Déjame
arrastrarlo dentro del grupo tres. Ahora está dentro de ese
grupo. Todo bien. Ahora déjeme mantener pulsado y arrastrar
tal vez hasta un espacio de 25. Y hacer el mismo control D. Ahora el espaciado es
igual a través de todo. Pero claro,
voy a ampliar esto. Pero antes de hacer eso,
mantén presionadas las teclas shift y shift y arrastra ese
espaciado de 25 una vez más, suéltalo ahí mismo. Ahora, borra eso, luego desagrupa esto porque quiero agruparlo una vez más, y desagruparlo una vez Quiero separarlos
en individuales Gracias. Elementos, Permítanme
borrar todo eso. Volvamos a cambiar a esto. Todavía tiene esto,
así que me quedaré con eso. Pero lo que quería hacer es
cambiar el tamaño de esto para asegurarme de
que está llegando a este punto Pero quiero
expandirlo un poco para
asegurarme de que este ritmo aquí
sea lo mismo que este Eso significa que vamos a
mover el botón. Selecciona el botón y mantén
presionada la tecla Mayús, selecciona esto luego alinea el botón a la
derecha en referencia a esto. mismo caso aplica a estos, mantenga pulsado el control
g para agruparlos. Después mantén pulsada la tecla Mayús y alinéalas al
botón así como así. Ahora, volviendo a esto, esto está en el lado derecho. Así que mantén presionado el control para acercar
con la rueda del ratón. En primer lugar,
permítanme solo agrupar esto. Selecciona eso, eso y luego lo que los sostiene y
alinéalos así. Después controla G para agruparlos. Ahora este es un grupo. También mientras se selecciona
esto,
seleccionaré eso y ese control
G para agruparlos juntos. Ahora puedo llevarlos como
un solo grupo, así como así. Quiero seleccionar esto
y este mantenga pulsado en. Ahora están detrás de eso. Entonces
los voy a arrastrar hasta arriba. Después, mantén presionado el turno. No. Vamos a cambiar el tamaño En primer lugar, ¿qué dice? Ventas la semana pasada. Ventas la semana pasada, y esto debería ser blanco. Así es como te
desempeñaste la semana pasada. Bien, así como así. Sequemos y pongamos eso ahí. Ahora, podemos hacer que este tamaño
pueda usar la rueda del ratón. Es decir, puedo usar las
teclas de flecha del teclado. Creo que 28 está bien. Empujarlo hacia abajo tal vez a 13. Ahora, digamos 12, y luego empujarla hacia
arriba, empuja esto hacia abajo. Creo que esa es una buena posición. De hecho, empujemos esto hacia abajo, solo para alinearlo con esto. Mantenga el control para seleccionar
la figura en sí. Selecciona
las ganancias totales, empuja hacia arriba. Seleccione este grupo,
empújelo hacia arriba más cerca del número. Ahí vamos. Guarde eso. Ahora, para agregar estas
tablas y gráficas de Pi, hagamos clic derecho en cualquier lugar aquí. Hover plug-ins, administrar complementos. Eso sacará a
colación los plug ins pop up. Ahí podemos buscar
cualquier plug in que queramos. Vamos a escribir gráfico. Y creo que esto es
lo que necesitamos gráficos. Por Sam Mason. Voy a hacer clic. Déjame decir “Corre”. Sí, y esto es todo. cambiar el número
de puntos de datos. Lo dejaré a las diez. Podemos decidir si queremos
que sea una dispersión o
área o barra Pi D un gráfico, volveré a cambiar a línea. Podemos cambiar el rango, tal vez esto sea de 10 mil. Eso cambia a 10 mil. Podemos cambiar el rango del conjunto de datos. Digamos dos. De hecho, hablando de bar, déjame cambiar eso a bar, y puedo seguir adelante
y decir agregar gráfico. Ahora, se colocará
en tu obra de arte, y si me acerco, notarás que
el texto es negro y estas líneas
apuntando al texto. En primer lugar, y no
creo que esté agrupada. Si uso la rueda del mouse, manteniendo presionada la rueda del mouse
para arrastrarla no está agrupada. Voy a mantener pulsado. En primer lugar, déjame acercar con control y rueda del ratón. Después seleccionaré el
texto, este otro texto. De hecho, no necesito la grilla. Déjame seleccionar la
cuadrícula y eliminarla. No lo necesito. Ahora los textos, los otros textos, y la barra. Ahora bien, si los arrastro, lo único que
queda son las barras de rejilla. Control G para
agruparlos. Todo bien. Ahora déjeme arrastrar
esto y ponerlo aquí. Mantenga presionado el turno para encogerlo. Ahora te darás cuenta
porque lo hemos encogido, el texto se ha derrumbado. Mantendré pulsado el control para
seleccionar textos individuales, para seleccionar varios
textos juntos. Mantendré pulsado el
control y el turno. Y voy a tirar de eso para
ampliar el soporte del texto. A continuación, mantenga pulsada la
tecla Control y Mayús para seleccionar el
texto una vez más. De hecho, déjame seleccionarlo
todo así. Después cambia el color a blanco. Voy a seleccionar hecho, déjame seleccionar eso. Mantenga pulsado el control. Es
una tarea un poco tediosa, pero tenemos que hacerlo, mantener pulsado el control y cambiar
para seleccionar los diferentes Déjame empezar por arriba,
control, y este
otro al final,
mantenga pulsada la tecla de turno y control. Entonces seleccionemos
los del medio. Y este principal.
Cambia eso a blanco. Repetimos lo mismo para esto. Mantenga pulsado Control.
Control de cambio. Voy a seleccionar estos. Y voy a cambiar eso a blanco. Ahora, para este color, el color azul,
lo seleccionaré, luego mantendré el turno de control. Presiona la tecla del ojo en el
teclado para abrir el cuentagotas y selecciona este color solo por uniformidad Creo que me gusta lo
que tenemos hasta ahora. Echemos un vistazo a
qué más tenemos. Consigamos este tipo de gráfico. Voy a hacer clic derecho a los enchufes. Ahora tenemos gráficos
porque es uno de los recientes usados recientemente. Vamos a darle a este cinco. Vamos a darle tres puntos. Ocultar cuadrícula, y ahí vamos. Agrega gráfico, y ese es
el gráfico que tenemos. Ahora voy a repetir
el mismo proceso. Asegúrese de seleccionar todos los
elementos del gráfico. No creo que haya
dejado nada atrás. En primer lugar,
permítame seleccionar esto. Si seleccioné antes de
agrupar todo, ahora tengo la opción de
cambiar el color diferente. Puedo cambiar el color de
relleno a blanco, todo lo que tiene un color de
campo es blanco. Después trazo de color a blanco, todo lo que tiene un trazo. El mismo caso aplica a este grupo. Color de relleno blanco, color
trazo blanco. Ahora, quiero seleccionar esto. Es amarillo, pero quiero que
sea de este color naranja. Para esta segunda, quiero que sea de
ese color azulado Ahí vamos. Ahora
puedo seleccionar esto. Control G para agruparlo. Entonces puedo encogerlo.
Tengo que empujar esto. Déjame deshacer eso. Ahí está este recorte
que está sucediendo. Creo que permítanme simplemente
expandirlo hasta ese punto. No sé qué es eso. Déjame deshacer eso. Después arrástralo una vez más. Déjame poner eso ahí, luego solo redimensionarlo
mientras aún estamos ahí No sé por qué está
pasando esto. Pero está bien. Ahora, mantenga pulsado Control. ¿Qué es esto? No
sé qué es esto. Creo que es el clip
fuera del gráfico. Pero honestamente, no
sé qué es, pero no va
a impedir que hagamos nuestro trabajo. Sostener pulsado. Permítanme simplemente
borrar eso. Suprimir eso. Mantener pulsado el control y el
turno para seleccionarlos. Ahora puedo ampliar eso. Ahí vamos. Control
S para guardar eso. Y ahora tenemos un
bonito tablero. Ahora, claro, acabo de
duplicar estos. Por supuesto, el tuyo
debe ser único. Cada uno de ellos debe
ser diferente. Yo habría hecho lo
mismo por esta parte porque se trata de
venir aquí gráficos correctos. Y esta debería ser área
y repetir lo mismo. Pero no voy a hacer eso
porque eso es algo que
puedes hacer tú mismo. Mi objetivo aquí es darte
una buena guía para que la
sigas y te ocurra tu propia versión creativa
o el tablero. Lo que voy a hacer
es seleccionar este y este y estos textos, y esto. Entonces finalmente, este control
G para agruparlo todo junto. Entonces mantén presionado
para duplicarlo. Y luego con un
espaciado de 25 ahí, voy a dejar caer eso ahí. Y parece que en
realidad no hemos agrupado esto porque está en un
grupo diferente, pero no hay problema. Vamos a hacer algo de limpieza cuando estemos organizando
todo Entonces voy a arrastrar esa manteniendo
presionada la Alt para colocarla ahí, y todo lo que tengo que hacer es cambiarla para decir
ventas el mes pasado, pero no voy a hacer eso. En la siguiente lección, hagamos algunos toques finales ya que te
expliqué cómo
vas a hacer esto. Así que eso es todo por ahora, y te veré en
la siguiente lección.
12. Assignment: finalización de las cartas: Entonces ahora mismo es el momento
de otra tarea, y va a ser una tarea
muy fácil y rápida. Ahora bien, si miras esta
sección de aquí mismo, tiene estos artículos
vendidos más recientemente en tu inventario, y notarás, por supuesto, estos son íconos que
descargué de ícono plano. Y eso es algo que ya
sabes, visita Flacon para descargarlos. La otra cosa que
notarás es este rubro y este subtítulo es bastante parecido a lo que
ya tenemos aquí Eso es algo que
puedes crear rápidamente. Por último, tenemos estos cuadrados de
línea discontinua aquí mismo. Crear un
cuadrado de línea discontinua es muy fácil. Todo lo que tienes que hacer, de hecho, déjame mostrarte muy
rápidamente cómo hacerlo. Volviendo a nuestro trabajo. Voy a mantener presionado el
control, luego seleccionarlo, luego afuera y arrastrar para duplicar
eso con ese duplicado, de hecho, está agrupado. Déjame solo agruparlo. Grupo. Una vez más, grupo, y ahora esta es una sola, y ahora esta es una tarjeta
individual. Mientras esté seleccionada,
iré a trazo. Y agrega y ahora tiene un trazo. Entonces restaré el campo
para deshacerme del campo. Ahora bien, si acercamos el zoom,
notarás que es solo el trazo. Si bien todavía está seleccionado, puedo darle al trazo este
color azulado claro, así como así También puedo aumentar el ancho. Digamos que le puedo dar cuatro. Puedo elegir tener el trazo
dentro afuera o en el centro. Ahora mismo está dentro. Podemos ponerlo afuera también. Ahora está afuera, y
podemos ponerlo en el centro. Ahora bien, si voy a este
menú de aquí mismo, podemos ir a este menú
desplegable y
cambiarlo a d y eso
se convierte en un trazo discontinua Así es como crear esto. Vas a jugar con esos escenarios y a ver
qué se nos ocurre. Habiendo descrito todo lo que debes hacer para crear esto, creo que esa va a ser
una tarea fácil para ti, y debería ser muy interesante ver qué se
te ocurrirá. Esto es muy fácil de crear, solo básicamente duplicar
esto o crearlo desde aquí, y luego agregar algunos textos, ir al icono plano y
seleccionar un botón cerrado Como puede ver, esto se elimina. Si vas al icono plano, puedes decir tal vez cerrar porque es un
ícono cerrado, y aquí estamos. Tómate tu tiempo y completa
esta tarjeta, esta, y esta tarjeta de mejora ahora, y te veré en
la siguiente lección, donde estaremos hablando de
cómo organizar todo aquí. Porque si miras lo que
tenemos en mi sitio web de referencia, en mi diseño de referencia, Esta es la referencia en realidad. Si colapso
eso, está muy bien organizado, así que te veré en
la siguiente lección.
13. Organización de componentes: Bienvenida de nuevo. Ahora es el momento de organizar nuestro diseño o nuestro archivo. Y mirando nuestro archivo de
diseño de referencia aquí mismo, cómo lo había organizado. Como puedes ver, tenemos la barra de
búsqueda que está en la parte superior. Tenemos la barra lateral, y luego
tenemos el contenido principal. Si amplío el contenido principal, también
se subcategoriza
en diferentes secciones. Al pasar el cursor sobre diferentes partes, notas
que todo
está muy bien organizado, y solo puedo venir y llevarlo a un lado
o aquello y dejarlo a un lado Entonces hagámoslo en nuestro proyecto. Volviendo aquí. Ahora,
déjame deshacerme de eso. Ahora, claro,
comencemos con la barra de búsqueda. Está conformado por el icono de búsqueda, luego la propia barra de búsqueda. Voy a seleccionar a los dos, luego a Control G para agruparlos. Ahora puedo llevarlos a los
dos y hacer. Esto ya está agrupado. Recuerda que seleccionamos a
los tres. Ahora mientras ese
grupo está seleccionado, puedo seleccionar este
otro manteniendo presionado el turno. De hecho, no están alineados. Desde que he seleccionado este último, podemos alinear estos tres
con esto. Así como así. Ahora si le pego a Control G, formamos un nuevo
grupo llamado grupo 16 y solo puedo
llevar todo. Este grupo 16 se puede llamar
la barra de búsqueda enter. zoom, mantener
pulsado el control
y el desplazamiento de la rueda del ratón Ahora, también tenemos estos botones. Recuerda que agrupamos
cada botón, así puedo
llevar eso solo para confirmar que
cada uno de ellos está agrupado. Todo bien.
Seleccionaré este botón, mantendré pulsada la tecla Mayús para seleccionarlos todos junto
con el logo y esta línea, luego controlaré
G para agruparlos. Ahora, si ahora mismo no puedo agruparlos
a todos. Si notas ese comportamiento donde has
seleccionado todo, golpeas el control G y algunos elementos no están
incluidos en el grupo. Puedes desagruparlos, así que yo los desagruparé Ahora son individuos. Ahora déjeme solo buscar
al grupo. Es el grupo 16. Déjame llamarlo barra lateral. Ahora puedo llegar al logo
del proyecto. Déjame llamarlo logo y arrastrarlo al grupo
de barras laterales. Seleccione
también esta línea, línea de barra lateral. Ingresa y arrástralo al grupo de barras
laterales también. Déjalo caer ahí. Ahora bien, si colapso
el grupo de barras laterales, puedo llevar toda la barra
lateral así como así. Ahora, recuerden que
habíamos creado esto como grupo, así que no hay problema. Este también fue un grupo. Esto no es del todo un
grupo porque este texto
no se estaba uniendo al grupo cuando
probamos Control G. Así que déjame ver. Esto se llama ventas Grupo de la semana
pasada. Si bien está seleccionado, solo
haré doble clic en la tarjeta de la semana de ventas. Ahora bien, este es el título de la tarjeta de ventas del Grupo 13 la semana
pasada. Y ahora puedo arrastrarlo a
las ventas la semana pasada tarjeta. Ahora bien, si lo arrastre y lo
muevo, se está moviendo junto con un grupo porque es
parte del grupo y lo hago un hábito
etiquetar cada cosa
con su nombre apropiado. Si es esta cantidad aquí, eso no necesita una etiqueta. Pero ahora para esta tarjeta, podemos llamarla tarjeta de
ganancias totales. Tarjeta. Oh, ocho. Nosotros etiquetamos lo incorrecto. Por ejemplo, este
grupo de aquí mismo, llamémoslo Tarjeta de
ganancias totales porque es la tarjeta de ganancias
totales. Como puedes ver
aquí mismo en nuestra referencia, si selecciono esto, se llama ganancias totales. Si selecciono
esto, son ganancias netas. Selecciona estos gastos,
así como así, y tiene todo lo
demás dentro de él. Volviendo a nuestras tarjetas. Por supuesto, no voy a pasar tiempo
etiquetando estas otras partes, pero tú consigues el taladro. Ahora, claro, esto aquí
tampoco es del todo un grupo
a menos que cambiemos esto. Esto es digamos que esto es ganancias el mes pasado. Mes. Haciendo clic afuera
y seleccionando esto. Este grupo es el mes pasado, déjame colapsar eso. Déjame seleccionar esto.
Se trata del Grupo 14. Déjame hacer doble clic en él
y llamarlo tarjeta de mes de ventas. Ahora, título del mes de ventas. Y déjalo caer ahí. Tarjeta de ganancias totales, que es este botón barra
lateral siete, barra de búsqueda. Todo bien. Ahora queremos
crear el grupo de contenido principal. Ahora vamos a repetir lo que
acabamos de hacer C G. Contenido
principal. Si lo
escondo, eso es co. De hecho, este texto
también debería estar en el contenido principal. Así que vamos a arrastrar y ponerlo ahí y este botón también. Vamos a llamarlo botón de
crear. Recuerden, chicos, esto
es solo una guía. Tómese su tiempo para organizar cada elemento de la manera que tenga sentido para usted y los miembros de su equipo
si tiene un equipo. Entonces, ¿qué es este rectángulo? No sé qué
rectángulo es este, si golpeo, y este
es el fondo. B tierra. Entonces lo voy a poner en el contenido
principal también. Y ahora está por encima de todo, así que voy a arrastrar y ponerlo por
debajo de la tarjeta de ganancias totales. Ahora, como puedes
ver, la barra lateral no
es visible y la barra de
búsqueda porque el fondo está dentro
del contenido principal y
el contenido principal está
por encima de la barra de búsqueda. De hecho, no lo hemos
puesto dentro. Arrastremos la barra lateral sobre el contenido principal y la barra de búsqueda por encima
del contenido principal. Ahora dentro del contenido principal,
arrastra el fondo. Justo por debajo de las ganancias totales. Ahora, hagamos doble
clic en Macbook Pro, que era el marco
y llamémoslo dashboard. Ahora podemos colapsar
el tablero, y ahí es donde empezamos si le estamos describiendo este
proyecto a alguien. El tablero se compone de la barra lateral y
el contenido principal. Y la barra lateral está
conformada por todos estos botones, y puedo colapsar los botones. Línea de barra lateral, el logotipo. Puedes reorganizar las cosas. Se puede poner el botón
uno encima del botón seis. Ya tienes el simulacro, estoy bastante seguro de que puedes seguir reordenando y
organizando todo Antes de compartir este
proyecto con alguien, necesitas tenerlo
organizado de esa manera. Hasta el momento, creo que
hemos cubierto la mayor parte de todo lo que
vas a usar la mayor parte del tiempo cuando estés
trabajando en Figma. Por supuesto, esta es solo
la primera entrega una serie de clases, estaré publicando
regularmente sobre Figma desde lo básico
hasta las etapas avanzadas Antes de que te vayas, tengo
algunas reflexiones finales, me gustaría compartir contigo, así te veré en la lección
final. No vayas muy lejos.
14. Reflexiones finales: Solo quiero tomarme un
momento para darte muchas gracias por quedarte conmigo hasta
el final de esta clase. Espero que te haya resultado
informativo y agradable y que ahora te sientas más seguro en tus habilidades de figma. A estas alturas, ya tienes un
dashboard totalmente diseñado que
podrás compartir con tus amigos
o compañeros de trabajo, y estoy muy orgulloso
de ti por eso. De hecho, te animo a darte
palmaditas en
la espalda y tomarte un momento para celebrar porque mucha gente
puede iniciar un curso, pero pocas personas
logran terminarlo. Y tú tienes. Entonces felicidades
por ese logro Si disfrutaste esta clase
y la encontraste valiosa, me gustaría
pedirte un simple favor. Por favor, tómate un momento, de hecho, menos de un minuto para escribir una reseña y decirle los demás lo que
pensabas de la clase. Tus comentarios son increíblemente valiosos
porque me ayudan a saber si estoy haciendo un buen trabajo y ayuda a otros estudiantes a
descubrir esta clase. Cuando los estudiantes se encuentran con
tu revisión de la clase, les
resulta fácil decidir si es una buena
clase para que tomen. Entonces como mencioné, te
llevará menos de un minuto, pero hará una
gran diferencia. Simplemente haz clic en la estrella de
revisión debajo este reproductor de video y
hazme saber lo que
pensabas de la clase. Y no olvides consultar mi perfil para más
clases sobre UI, UX y diseño web. Tengo una variedad de
cursos diseñados para
ayudarte a seguir
construyendo tus habilidades y avanzando en tu carrera. Porque recuerden, estamos
viviendo en un mundo digital. Y tener esas
habilidades es crucial. Así que echa un vistazo a mi perfil
para más clases. Y una vez que termines de trabajar
en tu proyecto de dashboard, no
olvides compartirlo
aquí mismo con la comunidad. Nos encanta compartir nuestros
proyectos para obtener comentarios de compañeros
y profesores. Déjame mostrarte un
ejemplo de una clase reciente. Aquí hay una clase que
publiqué hace un tiempo. Y debajo de la pestaña de proyectos
y recursos, aquí hay algunos ejemplos
de proyectos que los estudiantes han enviado
para obtener algunos comentarios. Entonces todo lo que tienes que hacer es
ir a la pestaña Proyectos y Recursos y
hacer clic en Enviar proyecto. Y ahí mismo, puedes subir una captura de pantalla de tu completado. No olvides
darle un título de proyecto y tal vez una descripción del proyecto. Así que tengo muchas ganas de
ver tu proyecto final. Una vez más, quiero decir,
gracias por acompañarme en esta clase, y espero
verte en la siguiente. Pieza Happy Designing.