Mejores prácticas de desarrollo de consolas

*Este contenido se traduce usando la IA (Beta) y puede contener errores. Para ver esta página en inglés, haz clic en aquí.

Con más de 200M+ jugadores de Xbox y PlayStation, las consolas presentan una gran oportunidad para ti para atraer a más usuarios. En comparación con dispositivos regulares, diseñar para controladores y la experiencia de usuario de 10 pies de consolas tiene algunas guías especiales que debes seguir para ayudar a que tu experiencia tenga éxito en consolas.

Diseñando para Contadores

Las experiencias de consola reciben comandos de los usuarios a través de los controles de entrada, que requieren diseños especiales para las interacciones más suaves.

Simplificando la interfaz de usuario

Aplica lo siguiente para simplificar el diseño de la interfaz de usuario para consolas:

  • Accesible control de navegación : La navegación básica, incluida la cuatro direcciones, elegiry volver, controla cómo los usuarios se mueven y interactúan con tu contenido en consolas. Asegúrate de que los usuarios puedan acceder fácilmente a todos los elementos de la interfaz de usuario que estén en juego al usar estos controles básicos de navegación, para que puedan acceder fácilmente a cada parte interactiva de tu experiencia.

  • Navegación del controlador por defecto : Aunque los usuarios pueden acceder a los menús de la interfaz de usuario activando el cursor virtual, dado que no todos los usuarios están familiarizados con el proceso, debe admitir la navegación del controlador de su interfaz de usuario como opción predeterminada en lugar de requerir que los usuarios activen el cursor virtual.

  • Minimalmente complejo de entrada del controlador : a diferencia de los métodos de entrada táctil o de clic, los usuarios de la consola navegan presionando un botón a la vez, por lo que una acción que toma un movimiento en otros dispositivos puede tomar movimientos adicionales con un Control (ES_MX). Asegúrese de que las acciones de la clave en su experiencia solo toman unos pocos movimientos para acceso.

  • No hay ventana de chat : Independientemente de si usa el sistema de chat de texto en la experiencia por defecto o si desea hacer una fusión del sistema de chat de legado como su sistema de chat personalizado, desactivar la ventana de chat para las experiencias de consola.

Agregar control adicional

A diferencia de los móviles y los escritorios, la navegación siempre es secuencial en las consolas, por lo que los usuarios no pueden saltar entre elementos lejos tan rápido como en otros dispositivos. Para mejorar la velocidad de la navegación, considere agregar botones y atajos de teclas adicionales para las acciones esenciales en la experiencia.

Acomodando Iconos de Botón Dinámicos

A medida que tu experiencia se expande a más plataformas, asegúrate de mostrar iconos de botón que coinciden con diferentes dispositivos. UserInputService tiene dos métodos disponibles que pueden lograr esto:

  • Class.UserInputService:aneanConvertir los códigos de la consulta de EE.UU. a los teclados de consola. Es útil para mostrar los elementos personalizados como iconos de botón para que coinciden con el aspecto y la sensación de tu experiencia. El siguiente ejemplo muestra cómo puedes mapear elementos personalizados para Class.KeyCode.ButtonA :
Mapando Recursos Personalizados

local UserInputService = game:GetService("UserInputService")
local imageLabel = script.Parent
local key = Enum.KeyCode.ButtonA
local mappings = {
ButtonA = "rbxasset://BUTTON_A_ASSET", -- Reemplazar con el activo recursoButtonA
ButtonCross = "rbxasset://BUTTON_CROSS_ASSET" -- Reemplazar con el activo recursoButtonCross
}
local mappedKey = UserInputService:GetStringForKeyCode(key)
local image = mappings[mappedKey]
imageLabel.Image = image
  • UserInputService:GetImageForKeyCode() 返回 Roblox 默认图标为要求的键码为简单的替换,例如以下示例为映射 Enum.KeyCode.ButtonA 显示:

    Mapando Iconos Por Defecto

    local UserInputService = game:GetService("UserInputService")
    local imageLabel = script.Parent
    local key = Enum.KeyCode.ButtonA
    local mappedIcon = UserInputService:GetImageForKeyCode(key)
    imageLabel.Image = mappedIcon

Proporcionar retroalimentación háptica

Una ventaja única de los controles es la capacidad de proporcionar retroalimentación táctil al vibrar físicamente el controlador para activar el sentido del tacto del usuario. Puedes usar HapticService para mejorar la inmersión del usuario y proporcionar opiniónútil. Ejemplos que pueden ser más inmersivos con retroalimentación táctil incluyen:

  • Eventos físicamente dramáticos, como explosiones o colisiones.
  • Eventos que requieren la atención del usuario, como un anillo de timbre o un nuevo cliente que ingrese a la comprar.
  • Notificaciones de acción de UI, como desplazarse hacia el final de una lista o hacer clic en un botón desactivado.

HapticService también le permite controlar los motores individuales en un controlador para establecer la intensidad y la duración de las vibraciones individualmente, para que pueda establecer diferentes vibraciones para diferentes propósitos y mantener la consistencia con la que se activan las respuestas de opinión. Diseña haptics con cuidado y evita el uso excesivo, ya que los usuarios pueden encontrar vibraciones constantes desagradables y molestas.

Construcción para la experiencia de 10 pies

En las consolas, los usuarios generalmente están sentados 10 pies de distancia de la pantalla. Un factor de escala de 1.5x garantiza que la interfaz de usuario sea cómoda, fácil de barra de navegacióny con fuentes legibles.

Considere la zona segura de la TV

An example illustration showing the dimensions of the TV-safe and unsafe zone.
La zona azul representa la zona no segura de la TV.

Dado que no todos los televisores muestran el contenido al borde de la pantalla debido a limitaciones históricas y técnicas, ponga elementos de UI en áreas seguras de la TV para asegurar que los elementos de importancia estén visibles en varios televisores.

implementando UI de tamaño dinámico

Implica tu UI usando tamaños relativos y posiciones relativas para medir todo como porcentajes de un marco. Incorpora un factor de escala a todos los tamaños de UI por:

  • Desarrollando para resoluciones más bajas primero.
  • Usando posiciones relativas y UISizeConstraint para escalar la UI.
  • Dimensiones basadas en las características de salida con GuiService:IsTenFootInterface() .
  • implementar ScrollingFrame para reducir el desordenado en la pantalla a medida que la interfaz de usuario escala.

Adaptando la revelación progresiva

La revelación progresiva retrasa las características avanzadas o poco utilizadas en una pantalla secundaria. Es una de las mejores formas de despejar tu UI y hacerla fácil de usar. Para la interfaz del consola, es común y más rápido tener al usuario ir y venir de las pantallas en lugar de ajustar todo en una pantalla como diseñar para escritorios.

Proporcionar comentarios de sonido

A diferencia de las interfaces de escritorio o móvil, en las que las interacciones generalmente son silenciosas o se basan en opinióntáctil sutil, puede agregar efectos de sonido para mejorar las interacciones de consola. Cuando los usuarios navegan a través de la UI usando un Control (ES_MX), considere incorporar efectos de sonido para confirmar las selecciones o el menú de señal, lo que puede elevar la experiencia general.