Crear un menú de inicio atractivo en Unity es sencillo si dominas el canvas, el panel semitransparente y los botones. Aquí aprenderás a configurar un velo que resalte la interfaz, diseñar botones coherentes como play y quit, y ajustar el render mode y el UI scale mode para distintas resoluciones con precisión y control.

¿Cómo montar un menú de inicio con canvas y panel semitransparente?

Para enfocar la atención del usuario, coloca un panel encima de la escena como velo translúcido. Así tapas el fondo sin ocultarlo del todo y preparas el espacio para los botones.

• Crea un panel desde UI para cubrir la pantalla a modo de velo.
• Ajusta la jerarquía: el elemento más abajo en la lista queda más arriba visualmente. Mueve el título para que quede por encima del panel.
• Usa el cuentagotas para tintar el panel y que combine con la estética global.
• Controla la transparencia: totalmente opaca tapa el fondo; semitransparente deja ver la escena. Un punto intermedio, por ejemplo 140 de transparencia, da buen equilibrio.

¿Cómo usar un panel como velo?

• Fija un color que armonice con el arte del juego.
• Mantén el panel semitransparente para no perder contexto visual.
• Revisa que el texto del título sea legible sobre el velo.

¿Cómo gestionar la jerarquía y el color?

• Coloca el texto del título por encima del panel en la jerarquía.
• Cambia el tinte del panel con el cuentagotas para coherencia visual.
• Ajusta opacidad según el movimiento del personaje antes de iniciar el juego.

¿Cómo diseñar y duplicar botones UI consistentes?

Diferencia el contenedor del botón de su texto hijo. Configura bien uno y duplica para acelerar el flujo. Así mantienes consistencia y reduces errores.

¿Cómo nombrar y estilizar botones?

• Renombra el contenedor: de “botón” a “play button”.
• Cambia el texto hijo a “play”.
• Ajusta la fuente y el tamaño, por ejemplo 30.
• Revisa los overflows vertical y horizontal para evitar cortes.

¿Cómo ajustar tamaños y centrado con Rect Transform?

• Usa Rect Transform para el tamaño: ancho 250 y alto 80–70 funcionan bien como base.
• Centra el botón en pantalla con las herramientas de alineación.
• Tinta el botón: verde para play con el cuentagotas.
• Configura estados de color: normal, presionado, seleccionado o deshabilitado. El multiplicador de color intensifica el resultado.

¿Cómo duplicar y variar el segundo botón?

• Duplica el play button y muévelo un poco más abajo.
• Renómbralo a “quit button”.
• Cambia el color, por ejemplo a rojo.
• Sustituye el texto a “quit”.

¿Qué configuración de canvas y escalado mejora la interfaz en distintas resoluciones?

El canvas define cómo se dibuja la UI respecto a la escena. Elegir bien el modo de renderizado y el escalado evita confusiones visuales y mantiene la legibilidad en cualquier pantalla.

¿Qué render mode conviene?

• Usa render mode screen space overlay: la UI vive por encima del juego y no se mezcla con la cámara.
• Evita screen space in camera si no necesitas que la UI dependa de la cámara: puede confundir al superponer elementos de escena sobre la interfaz.

¿Cómo escalar con UI scale mode?

• Cambia a UI scale mode “Scale With Screen Size” para que el canvas escale con la pantalla.
• La resolución de referencia puede estar en 800×600, pero al cambiar a 1920×1080 los elementos se verán más pequeños si fueron diseñados para menor tamaño.

¿Cómo ajustar tipografías y tamaños tras escalar?

• Aumenta el título a tamaño 120 y estira su contenedor con la cuarta herramienta.
• Reposiciona con precisión: mueve 100 puntos y ajusta finamente 50 si hace falta.
• Amplía botones a 400 de ancho por 150 de alto.
• Centra con precisión usando Alt y Shift al alinear.
• Dirige la atención con la jerarquía tipográfica: texto de “play” a 80 y “quit” a 70. El ojo prioriza lo más grande sin que se note excesivo.

¿Te gustaría compartir cómo personalizas los estados de color o tu truco favorito para centrar la atención en el botón principal?