Pixonic aumentó la participación en un 25% en ChromeOS mediante la optimización para pantallas grandes

Segundo plano

El equipo de desarrolladores de videojuegos con sede en Moscú, Pixonic, se enorgullece de aprovechar todas las oportunidades para actualizar las apps para dispositivos móviles y llegar a un público más amplio de gamers. Uno de los títulos más populares de la empresa es War Robots, una experiencia de jugadores contra jugadores (PvP) de 12 personas en la que los jugadores operan robots personalizados y los utilizan para batirse a duelo en vivo en un campo de batalla.

War Robots, que se lanzó en 2014, se diseñó originalmente para los dispositivos de las primeras generaciones de Android con movimiento basado en paneles táctiles y sin mouse. El equipo de Pixonic, conformado por jugadores ávidos, reconoció que la app necesitaba algunas modificaciones para brindar una gran experiencia del usuario en una mayor variedad de dispositivos, como laptops y tablets. War Robots ya se podía jugar en cualquier dispositivo Android, ya que las Chromebooks ejecutan una versión completa del framework de Android dentro de un contenedor. Con algunos ajustes de programación más, Pixonic pudo tomar para aprovechar la tecnología todas sus capacidades.

A continuación, puedes ver cómo el equipo de Pixonic optimizó War Robots para brindar una mejor experiencia en pantallas más grandes.

Qué hizo la empresa

Para iniciar las optimizaciones, Pixonic agregó una etiqueta de metadatos en Es un archivo AndroidManifest.xml que le indica al sistema que está listo para admitir totalmente ChromeOS. y debe inhabilitar la emulación táctil:

<uses-feature android:name="android.hardware.type.pc" android:required="false" />

Pixonic también estableció el minSdk de la app en 24 para que el motor de juegos de Unity pueda recibir directamente clics del mouse y todos los eventos de la API relacionados con el movimiento (no solo los eventos del panel táctil).

Compatibilidad con teclado y mouse

En los juegos PvP en tercera persona, como War Robots, resulta mucho más fácil moverse y apuntar con un teclado y un mouse, especialmente en dispositivos con pantallas más grandes. Por eso, el siguiente paso fue volver a escribir el código para que sea compatible con el teclado y el mouse en el modo de batalla del juego, pero que, al mismo tiempo, conserve los controles de pantalla táctil.

A fin de proporcionar los controles adecuados en el momento oportuno, el equipo de Pixonic escribió un nuevo código para comprobar el modo de juego actual del usuario:

@Override
public void onConfigurationChanged(Configuration newConfig) {
    boolean hasQwertyKeyboard = newConfig.keyboard == Configuration.KEYBOARD_QWERTY && newConfig.hardKeyboardHidden == Configuration.HARDKEYBOARDHIDDEN_NO;
    try {
        UnityPlayer.UnitySendMessage("Receiver", "ConfigChange", new JSONObject().put("keyboard", hasQwertyKeyboard).toString());
    } catch (JSONException e) {
        e.printStackTrace();
    }
}

Si se detecta un teclado QWERTY, el juego se adapta al modo de escritorio. El joystick de movimiento de la esquina inferior izquierda desaparece y todas las acciones disponibles (como la elección de las armas, las habilidades y los menús) se etiquetan con combinaciones de teclas.

War Robots en modo de laptop

Si no se detecta un teclado, el joystick de movimiento aparece en la esquina inferior izquierda y las combinaciones de teclas se ocultan en los botones de menú de la parte inferior derecha.

War Robots en modo de juego para dispositivos móviles o tablets

Luego, Pixonic quería asegurarse de que el cursor permanezca oculto cuando un jugador usa el mouse para rotar la cámara. Al orientarse a Android 7.0 (nivel de API 24) y versiones posteriores, el equipo podía establecer cualquier ícono de puntero. En este caso, el equipo usó un mapa de bits transparente para hacer que el cursor sea invisible durante el juego:

public boolean setPointerVisibility(boolean visible) {
    View = activity.findViewById(android.R.id.content);
    view.setPointerIcon(PointerIcon.getSystemIcon(activity, visible ? PointerIcon.TYPE_DEFAULT : PointerIcon.TYPE_NULL));
}

Así, se garantizó que el cursor se inhabilitaría y estaría invisible cuando todas las otras ventanas estuvieran cerradas y hubiera una batalla en curso. Si apareciera una ventana emergente, como el menú de pausa, Pixonic permitiría que el cursor estuviera visible y que mostrara su ícono predeterminado.

Adaptación de los instructivos y la mecánica del juego

A fin de brindar una mejor experiencia del usuario, Pixonic también escribió un código nuevo para mostrar diferentes instructivos del juego en función del modo de dispositivo actual del usuario. Si un jugador alterna entre un juego de tablet y laptop durante la batalla y todavía no vio el instructivo para el modo diferente, antes de reanudar el juego, se muestra el instructivo.

Instructivos de juego en modo laptop con entrada para mouse y teclado

Instructivo de juego en modo tablet con controles de pantalla táctil

Cuando los jugadores están en modo de laptop, Pixonic también inhabilita el control de la cámara de pantalla táctil (ya que los jugadores controlarán la cámara con el mouse) mientras todos los botones del juego funcionan como siempre. Para diferenciar los toques del mouse, el equipo usa la propiedad Input.touchCount (en secuencias de comandos de Unity):

if(Input.touchCount > 0) {
    // this is screen touch event
} else {
    // this is mouse (touchpad) event
}

Compatibilidad con el modo Multiventana

Por último, Pixonic quería asegurarse de que el juego no se bloqueara en modo de pantalla completa cuando se inicia. Habilitar la función de juego en ventana en ChromeOS permite a los usuarios mirar simultáneamente a sus creadores de transmisiones favoritos mientras juegan, actualizar sus robots mientras leen sobre nuevas habilidades en el sitio web del juego o describir una batalla en modo pasivo mientras miran un video separado.

Para ello, Pixonic marcó UnityPlayerActivity como redimensionable:

<activity android:name="com.unity3d.player.UnityPlayerActivity" ....
    android:resizeableActivity="true">

Teniendo en cuenta que la interfaz del juego solo puede reproducirse en un rango de dimensión determinado; el equipo establece tamaños de ventana mínimos compatibles:

<activity … >
    <layout android:gravity="center" android:minHeight="800dp" android:minWidth="1200dp" />
</activity>

Con el objetivo de que el juego fuera más envolvente, Pixonic usó metaetiquetas para establecer el modo de pantalla completa como predeterminada y la orientación horizontal como ideal.

<application>
    <meta-data android:name="WindowManagerPreference:FreeformWindowSize" android:value="maximize" />
    <meta-data android:name="WindowManagerPreference:FreeformWindowOrientation" android:value="landscape" />
    ….
</application>

War Robots se lanzó en modo con ventanas

Estas optimizaciones también garantizaron que el juego no se pausara y que el HUD de la batalla se ajuste en consecuencia a medida que los jugadores expanden y contraen el juego.

Resultados

Gracias a que contaban con una extensa biblioteca de recursos en línea, los cinco miembros del equipo de desarrollo de Pixonic tardaron solo dos semanas en completar todo el proceso.

Más de 100,000 jugadores ya han jugado War Robots en ChromeOS desde Pixonic lanzó las optimizaciones más recientes. Gracias a que ahora el juego puede aprovechar el espacio agregado en pantallas más grandes, las batallas de War Robots son más envolventes y atractivas que antes. De hecho, las sesiones de los usuarios son un 25% más largas en las Chromebooks que en otros dispositivos Android. Los comentarios anticipados fueron increíblemente positivos y algunos jugadores incluso señalaron que el juego optimizado para Chromebook se ejecuta mejor que en el emulador de BlueStacks.

En función de su éxito, los desarrolladores de Pixonic planean actualizar los gráficos de War Robots en todos los dispositivos Android para hacer que el juego sea aún más cercano a una experiencia de calidad de PC.

Consulta algunas prácticas recomendadas que te permitirán optimizar tus apps para ChromeOS.