Reimaginando el vapor

Este artículo es una pieza complementaria de este estudio de caso de Behance. Con esto, pretendo aportar más contexto a mis decisiones en términos de enfoque y diseño. Si quieres más imágenes y menos divagaciones, ¡échale un vistazo!

Una introducción

Soy un diseñador. También he sido usuario de Steam durante mucho tiempo.

Mi primera cuenta de Steam se creó cuando salió Half Life 2. Era necesario configurar esta cosa de "Steam" para descargar, y luego instalar el juego. En ese momento, la banda ancha apenas comenzaba a ser algo en mi país, por lo que la idea de descargar grandes porciones de un juego que acabo de comprar, especialmente cuando sostenía el CD en la mano, no me atraía exactamente. La experiencia no se sintió necesariamente conveniente ... no solo por los errores, errores y otros problemas que vienen con las nuevas tecnologías, sino también por las limitaciones de velocidad de descarga mencionadas anteriormente.

Los recuerdos de esta ventana verde me llenan de desesperación hasta el día de hoy.

Estoy seguro de que puedes leer experiencias similares en línea: Steam definitivamente tuvo un comienzo difícil. Aún así, prosperó. Y con el tiempo, se convirtió en un servicio viable. Entonces se convirtió en la norma.

Cómo han cambiado las cosas. ¡Juegos en una Mac! ¿Quién lo hizo?

Hoy, 14 años después, lo que Valve comenzó con su plataforma sigue siendo la norma. Cuando las personas piensan en jugar en PC, inevitablemente terminan encontrándose con Steam en algún momento. Lo que inicialmente se concibió como una herramienta de distribución para los juegos desarrollados por Valve evolucionó lentamente hasta convertirse en un escaparate tanto para AAA como para desarrolladores y editores independientes. En cierto modo, Steam se convirtió en sinónimo de juegos de PC.

Por supuesto, este crecimiento vino con muchas características adicionales en el camino:

  • Mensajería.
  • Opiniones de los usuarios.
  • Comunidades
  • Perfiles de curadores que brindan recomendaciones.
  • Contenido enviado por el usuario por juego, como guías, capturas de pantalla, videos, modificaciones, etc.
  • Un mercado (tenga en cuenta que esto es diferente de la tienda), principalmente para el comercio de artículos en el juego.
  • Steam Trading Cards.
  • Big Picture Mode, una experiencia orientada a la televisión para Steam.
  • Juego Streaming.
  • Contenido de video (como en películas, espectáculos, etc.).
  • Software.
  • ... y probablemente más, con más por venir.

En resumen, a partir de hoy, Steam es enorme.

Inevitablemente, las aplicaciones móviles entrarían en juego en medio de esta expansión. Entonces, un día, sucedió.

Steam para Android

Huh Eso me resulta familiar.

Sitio web de Steam en Chrome (izquierda), Steam para Android (derecha)

Es eso…

Sitio web de Steam en Chrome (izquierda), Steam para Android (derecha)

Sí.

Sitio web de Steam en Chrome (izquierda), Steam para Android (derecha)

Sip. Ese es definitivamente el sitio web. ¡Las aplicaciones móviles son envoltorios web!

Las aplicaciones móviles de Steam: ¿cuál es el trato?

Al pensar en Steam como una plataforma para comprar juegos, la idea de tener un componente móvil definitivamente tiene sentido. Pero como ya comentamos anteriormente, Steam ha crecido en tantas direcciones diferentes que es un poco difícil limitar la experiencia a un tipo particular de usuario:

  • El nombre de usuario1 está fuertemente invertido en el grupo comunitario y los debates de sus juegos favoritos.
  • Nombre de usuario2 está en streaming.
  • Y luego tenemos Username3, que está todo en Steam Trading Cards y vende artículos.
  • Username4, por su parte, solo quiere saber cuándo será la próxima gran venta de Steam.
  • Finalmente, Username5 simplemente realiza un seguimiento de sus elementos de la lista de deseos e instala juegos de forma remota.

Si eso suena como muchas características diferentes que se discuten al mismo tiempo, es porque eso es exactamente lo que es. Para bien o para mal, debido a la naturaleza de "envoltura web" de estas aplicaciones móviles, los usuarios tienen acceso a esencialmente todas estas funciones en sus teléfonos. Y también a un montón de otros problemas derivados de eso. Como probablemente pueda imaginar, no es muy difícil encontrar comentarios de los usuarios en línea.

No olvidemos que también hay reseñas de App Store y Google Play. Si bien las calificaciones no son tan malas en Android (aunque los comentarios en sí son bastante ... divisivos por naturaleza), tenga en cuenta que, al momento de escribir esto, la versión de iOS no se ha actualizado en casi 2 (¡dos! ¡Dos! ) años. Incluso sabiendo todo esto, todavía es muy difícil decir si los usuarios pueden hacer todas las cosas que quieren hacer con éxito en la aplicación. A eso, agregue algunas peculiaridades que tienen estas aplicaciones, como mezclar acciones y páginas en el cajón de navegación; o la aplicación no recuerda su edad a menos que sea menor de 18 años, naturalmente; o simplemente ser inconsistente en términos de diseño visual y patrones específicos de la plataforma. Las cosas menores que se acumulan y lastiman la experiencia.

Supongo que podría continuar ... pero no lo haré. En cambio, compartiré lo que se me ocurrió después de pensar: "¿qué haría si tuviera la oportunidad de mejorar algunos de estos puntos?"

Después de la palabra ensalada: rumbo al punto

¿Qué tienen en común los cinco usuarios mencionados anteriormente? Bueno, primero, es muy probable que inicialmente ingresaron a Steam porque querían comprar y jugar juegos. Y segundo, también podemos inferir que tienen acceso a una computadora en la que pueden jugar estos juegos. Simple.

Reiterando lo que dije antes ...

"Al pensar en Steam como una plataforma para comprar juegos, la idea de tener un componente móvil definitivamente tiene sentido".
- Yo, literalmente, hace cinco párrafos y una lista

En un nivel central, hacer que este servicio sea accesible en dispositivos que no sean computadoras no puede ser algo malo, ¿verdad? Ahora, no quiero decir que este componente móvil literalmente debería reflejar la experiencia de escritorio. Creo que debería ser más una aplicación complementaria.

Así que jugué con la idea durante unas semanas y esto sucedió.

Una mirada profunda al concepto

Todos estos son buenos juegos, por cierto.

Actualizaciones menores de identidad visual

Si bien este no es el punto principal del concepto, es probable que sea una de las cosas que más se destacan, por lo que lo sacaré del camino. Como una tarea adicional, hice algunas exploraciones iniciales sobre cómo actualizar un poco el aspecto o la marca de Steam. Esto no es en absoluto un cambio drástico, y traté de mantener el espíritu original de la marca mientras actualizaba los colores y la tipografía para darle un aspecto más moderno. Me inspiré para seguir esto después de ver lo que otras tiendas digitales están haciendo en términos de diseño: GOG, Fanatical, Humble Bundle, Origin ... y, por supuesto, Sony, Nintendo y Microsoft, también pusieron mucho esfuerzo en términos de su estética y diseño. Sería genial ver a Steam seguir sus pasos también.

Actualización: Valve tiene un nuevo sitio web. ¡Y es muy refrescante! Me encanta.

The Capsule, un formato bastante difícil de jugar en dispositivos móviles debido a su relación de aspecto. También en la foto: un buen juego.

Centrarse en la viabilidad

Cuando comencé a trabajar en este concepto, el objetivo principal era mantener las cosas viables. Podría haber sido más fácil para mí reinventar por completo el lado visual de mis gustos, pero quería utilizar todo lo que pudiera de la identidad actual y construir algo nuevo además de eso. Como tal, el formato de cápsula ... bastante extraño sigue vivo en este rediseño.

Vi esto como un desafío y un ejercicio práctico: considere que, si se tratara de un escenario del mundo real, los editores / desarrolladores no tendrían que proporcionar nuevos materiales visuales en diferentes formatos o resoluciones a Valve. Esto también es relevante para la actualización de la marca que mencioné antes. Mantener todo en el mismo espíritu es de lo que se trata.

Las características principales

Si bien el enfoque que tomé fue diseñar para la escalabilidad, me gustaría mantener la aplicación lo más concisa y compacta posible. Con eso en mente ... sabemos que los usuarios de Steam quieren comprar juegos. ¿Qué más podemos ofrecer?

  • Podrían aprender sobre nuevos eventos de ventas mientras están lejos de sus computadoras. ¡Especialmente útil cuando hay ofertas flash involucradas!
  • Administre sus bibliotecas instalando juegos en sus computadoras (que, por cierto, ya es posible hacerlo).
  • Agregue productos comprados en otros escaparates a sus bibliotecas.
  • Tenga una autenticación de 2 factores aún más simple y amigable.
  • Mejores confirmaciones de listado del mercado comunitario. Si bien tener el mercado en sí en la aplicación es un poco excesivo, aprovechar la aplicación complementaria para confirmar que los listados pueden funcionar, por seguridad.
  • ¡Disfruta de un sistema de mensajería funcional!

El resto de las características de la aplicación de escritorio pueden permanecer allí. Al final, son básicamente características adicionales de la mecánica central de Steam. Lo que nos lleva a ...

¡Poner en orden! O, el nuevo punto de partida de todo.

Jerarquía reorganizada y flujo de navegación

Cambiar el concepto a una aplicación complementaria significaba repensar la estructura y aplanarla para hacerlo más conciso, al reducir las funcionalidades centrales que mencioné a 5 vistas básicas de nivel superior. Las aplicaciones reales de Steam tienen una gran cantidad de vistas de nivel superior que inevitablemente necesitan vivir en un cajón de navegación.

¡Cosas para hacer! ¡Muchos de ellos!

Los cajones de navegación no son excelentes: si una aplicación necesita un cajón, probablemente significa que hay demasiadas pantallas únicas de nivel superior. Y, bueno, eso probablemente significa que la aplicación es un poco (¿o tal vez innecesariamente?) Compleja. Con esto en mente, decidí pensar en una estructura que no perdiera el punto principal de la aplicación por un montón de características adicionales, porque recuerde, en este caso, estamos trabajando en una aplicación complementaria, no en un espejo completo de la experiencia de escritorio. Y, por supuesto, la guinda es que terminamos ocultando información vital de los usuarios al ocultar estos enlaces en un cajón.

Por último, aunque el cajón es un patrón conocido de Android, Google introdujo una barra de navegación inferior que refleja las barras de pestañas de iOS en sus Directrices de diseño de materiales relativamente recientemente, lo que debería ser bastante revelador.

Experiencia nativa

Por supuesto, no podemos quejarnos de no tener aplicaciones nativas y que nuestro enfoque no sea ofrecer una experiencia pulida que siga las convenciones de plataforma apropiadas con las que los usuarios esperan interactuar. Si bien la funcionalidad principal está destinada a ser naturalmente idéntica entre aplicaciones, definitivamente habrá características específicas de la plataforma para mejorar la experiencia general de cada grupo de usuarios.

Cuadro grande

Para tener una idea de cuán flexible podría ser esta nueva dirección visual, me tomé algunas libertades para jugar con un enfoque simplificado del modo Big Picture, centrándome más en seguir mejores prácticas para diseñar para TV. Esto se debe a que, aunque sea utilizable, la versión actual de Big Picture sufre mucho por la sobrecarga de contenido y el síndrome de tipo pequeño ™. Sin embargo, es cierto que este fue un pensamiento excesivamente ambicioso.

Por cierto, mientras trabajaba en las últimas etapas de estos artículos y estudio de caso, Valve anunció dos nuevas aplicaciones para Steam: Link y Video que se lanzarán pronto. Probablemente pueda decir que personalmente estoy de acuerdo con la idea de separar estas características en nuevas aplicaciones, ya que difieren demasiado de lo que Steam es en esencia. Entonces, ¿tal vez esto es una señal de lo que vendrá?

De cualquier manera, espero ver la dirección que tomará Valve con sus nuevas aplicaciones. Aqui hay cambio.

Y llegaste hasta aquí. ¡Buen trabajo!

STRV es una tienda integral de desarrollo de aplicaciones móviles que trabaja con startups de primer nivel como Y Combinator y 500 Startups, entre otras. Actualmente cuenta con oficinas en San Francisco, Los Ángeles, Nueva York y Praga.

Siga al equipo de diseño de STRV en Dribbble o Behance.