Grandes Ejemplos Recientes de Éxitos en Estrategia Competitiva

¿Qué es la Estrategia Competitiva?
Antes de su era de oro a finales del siglo XX, la estrategia corporativa se centró principalmente en cómo mantener los monopolios.
A partir de finales de 1970, Michael Porter introdujo una serie de *frameworks* de estrategia popular, especialmente su *framework* de cinco fuerzas y estrategias genéricas.
Las Estrategias Genéricas declaran que la ventaja competitiva se puede lograr a través del liderazgo en costos, la diferenciación o una mezcla enfocada de los dos.
A través de su *framework* de posicionamiento de actividad, Porter prescribió que las empresas pueden lograr una ventaja competitiva a través de tres estrategias de posicionamiento: basadas en variedades, necesidades y en acceso.
Basadas en Variedad: produce un subconjunto de los productos o servicios de una industria entera. Trabaja la segmentación a través de la elección de la oferta, no por el cliente.
Basadas en Necesidades: se centra en un segmento de los clientes de la industria con el objetivo de satisfacer todas sus necesidades.
Basadas en Acceso: se dirige a clientes con características similares pero diferentes rutas para acceder al producto/servicio. Utilizando métodos adaptados para presentarlos dentro del mercado.

El éxito de Nvidia a través del posicionamiento basado en necesidades
A pesar de tener 24 años, las acciones de Nvidia han crecido 1,100% en los últimos cuatro años. También tiene un crecimiento de ingresos interanual del 48% y 58,8 márgenes brutos.
Se ha construido un nicho exitoso al centrarse sólo en el segmento de la unidad de procesamiento gráfico (*GPU*) del mercado de chips, donde posee alrededor del 80% de la cuota de mercado.
El acercamiento enfocado de Nvidia le ha permitido acelerar la innovación de la *GPU* a un ritmo más rápido que el mercado de la unidad central de procesamiento (*CPU*), así nuevas industrias como la inteligencia artificial y los automóviles automotores se han formado a su alrededor.
AMD, el principal competidor de Nvidia, ha tenido un rendimiento inferior en comparación porque su enfoque es más generalizado, lo cual resulta en esfuerzos diluidos.

Pinterest encontró un nicho a través del posicionamiento basado en variedad
Pinterest llegó tarde al mercado de redes sociales pero a los siete años, es la 10ª empresa de tecnología privada con mayor valor del mundo, con 12.3 billones de dólares.
Tiene 200 millones de usuarios activos y los ingresos podrían alcanzar los 600 millones de dólares en 2017.
Al centrarse en ciertos segmentos de descubrimiento visual como la moda y el diseño, ha creado una base enfocada de usuarios con casos de uso definidos para la plataforma. El 81% de los usuarios son mujeres.
El 5% del tráfico de enlaces de referencia del mundo proviene de Pinterest. El 55% de sus usuarios usan la plataforma para buscar productos para la compra, en comparación con el 12% de los de Facebook.

Xoom obtuvo una ventaja competitiva al adoptar un posicionamiento basado en acceso
Xoom tuvo éxito en el mercado de pagos directos porque se dio cuenta de que las necesidades de los remitentes de dinero son comunes pero tienen diferentes formas de acceder a los servicios. A diferencia de los operadores tradicionales como Western Union, Xoom ofrecía más opciones para enviar y recibir dinero.
Evitar el funcionamiento de una sucursal le ahorró dinero a Xoom, lo que permitió desviar la inversión hacia la construcción de su tecnología y el rango de opciones de recepción para los consumidores. Sus márgenes brutos eran, regularmente, 20 bps más altos que Western Union
PayPal compró Xoom por 890 millones de dólares en 2015. A pesar de ser el rey de los pagos electrónicos, PayPal necesitaba a Xoom por su experiencia en el posicionamiento basado en acceso. Xoom trabajó como un conducto, permitiendo pagos en lugar de PayPal (y de hecho, Western Union), el cual requería que los usuarios estuvieran dentro de su ecosistema.

La Evolución de la Estrategia Corporativa

Dentro de los ámbitos del mundo empresarial, las teorías de la estrategia competitiva del pre-siglo XX se centraron en los resultados binarios; principalmente cómo golpear mercados con monopolios y acuerdos de exclusividad. A medida que los mercados se volvieron más liberados, los compromisos y las especializaciones se hicieron más importantes y hasta las enseñanzas de mediados del siglo XX avanzaron hacia la obtención de competencia interna dentro del análisis de negocios.
A fines de la década de 1970, la estrategia empresarial competitiva se incorporó a la corriente principal a través de la publicación de Michael Porter llamada Five Forces Framework. Ésta ofrece una herramienta de análisis de la competencia para evaluar mercados basados ​​en la dinámica del poder de negociación de compradores y proveedores, la amenaza de nuevos participantes y sustitutos y la rivalidad general de la industria. Se puede leer una explicación más detallada de este método aquí.
Su secuela se llamó Estrategia Competitiva, la cual introdujo los conceptos de estrategias genéricas. Este framework se basó en la afirmación de que para mantener la rentabilidad a largo plazo por encima del promedio, una empresa requiere una ventaja competitiva sostenible. Hay dos formas de alto nivel en las que una empresa puede poseer esto: a través de tener los costos más bajos o a través de la estrategia de diferenciación producto/servicio. Una empresa debe lograr una de esas, o la tercera, una especialización enfocada en cualquiera de las estrategias dentro de mercados específicos. Si la empresa no se enfoca en uno de estos, podría esforzarse demasiado con una estrategia contradictoria, lo que resultaría en que esté “atrapada en el medio”. La siguiente figura muestra una representación gráfica de sus dos frameworks de estrategia seminal:

Las estrategias genéricas de Porter inspiraron innumerables estudios del caso, contando los exitosos tipos de estrategias competitivas implementadas por empresas como Walmart, Southwest Airlines e Ikea.
En 1996, Porter escribió “¿Qué es la Estrategia?,” el cual presentó sus estrategias de posicionamiento de la actividad, describiendo los caminos que las empresas pueden tomar para obtener una ventaja competitiva dentro de las cadenas de valor. Él escribió que hay tres actividades que se pueden seguir dentro de este framework de posicionamiento, basado en variedadbasado en necesidades y basado en acceso. Como complemento de las estrategias genéricas, estas tácticas dieron caminos más claros hacia cómo una empresa puede obtener una ventaja competitiva y, por lo tanto, tener éxito dentro de una estrategia genérica más amplia.
Por ejemplo, una estrategia genérica de costo-liderazgo simplemente implica que una empresa debe producir al costo más barato. ¿Pero cómo llega una empresa a ese punto? Las estrategias de actividad de Porter complementan este trabajo al ofrecer rutas de posicionamiento. Se muestran visualmente a continuación, seguido de su explicación con algunos ejemplos de estrategias competitivas de compañías exitosas de la era.
Figura 2: Estrategias de Posicionamiento de la Actividad de Porter

1. Posicionamiento Basado en Variedades

Esta es una estrategia en la que una empresa produce un subconjunto de los productos o servicios de una industria completa. Por lo tanto, elige no segmentarse por el cliente sino por la elección de la oferta. Este acercamiento enfocado puede permitir que una compañía alcance la escala a través de la especialización y, al asignar recursos a áreas específicas que le permitan acelerar la innovación, impulsar un mejor servicio y lograr menores costos.
Porter usó el ejemplo de Jiffy Lube para un posicionamiento exitoso basado en variedades. Un negocio que él citó, diciendo que había tenido éxito al producir exclusivamente lubricantes para automóviles y sin productos auxiliares ni servicios ofrecidos. Esto resultó en un servicio más rápido, un costo más económico y un producto superior.

2. Posicionamiento Basado en Necesidades

El inverso del posicionamiento basado en variedad es la opción de simplemente dividir segmentos de clientes y satisfacer todas sus necesidades. Esto construye la excelencia a través de la comprensión de un cliente y la captura de su cadena de valor completa a través de servicios a la medida y la repetición de negocios.
Los ejemplos proporcionados para esta estrategia estaban dentro de la industria de gestión de riqueza. Por lo cual Bessemer Trust y Citibank habían obtenido éxito al apuntar únicamente a los clientes con activos invertibles de 5 millones y 250 mil dólares, respectivamente.

3. Posicionamiento Basado en Acceso

La estrategia final está dirigida a clientes que tienen necesidades similares pero con rutas de acceso dispares al producto o servicio. El acceso puede definirse por la geografía del cliente o la escala del cliente, de manera que una empresa requiere diferentes métodos de entrega para poder atenderlos de manera eficaz.
Carmike Cinemas (vendido en 2016 a AMC Theatres) fue proporcionado como un ejemplo de una aplicación exitosa de esta estrategia. Era una cadena de cines dirigida a pequeños cinéfilos en las zonas rurales. Operar una función corporativa central le permitió a Carmike ganar economías de escala pero distribuyó la experiencia cinematográfica a través de un servicio local personalizado. Uno de los ejemplos mencionados fue a través de los directores de cine, quienes conocían a los clientes por su nombre y publicaban sus propias campañas de marketing.

Ejemplos Modernos de Estrategia Competitiva

Cuando hablamos de la estrategia de las empresas digitales, la conversación generalmente se enmarca en conceptos de innovación, en particular hacia las ideas de Clayton Christensen sobre Innovación disruptiva. Sin embargo, una vez que una empresa ha innovado, todavía necesita tener una planificación estratégica para garantizar que pueda ejecutar y aprovechar la ventaja competitiva. Pensamos en Apple y Nokia al hablar de compañías que han visto bajo escrutinio sus respectivos éxitos estratégicos y fracasos en gran medida en los últimos tiempos.
Teniendo en cuenta que las estrategias competitivas de Porter tienen más de 20 años de antigüedad, este artículo utilizará su framework de mapeo de actividades para demostrar las ventajas de la planificación estratégica a través de ejemplos de casos de éxito en la economía digital.

Posicionamiento Basado en Variedad: Nvidia

Nvidia es un productor de unidades de procesamiento gráfico (GPU), que a la edad de 24 años está registrando un crecimiento anual de ingresos de 48% y márgenes brutos un poco debajo de un 60%. Figuras impresionantes para un negocio maduro.
GPU fue inventado por Nvidia en 1999 y dentro del vasto mercado de chips, sigue siendo la única oferta que produce. Si miras en su sitio web, en lugar de tener la sección “Producto” estándar que enumera sus tipos de hardware, Nvidia muestra las “Plataformas” para las que se crea GPU. Esto es particularmente pertinente como una aplicación exitosa del posicionamiento basado en necesidades ya que la fuerza de Nvidia en las GPU es tan fuerte que ha adaptado sus SKU exactamente a las especificaciones de sus conjuntos de clientes.
El crecimiento de los juegos de video ha ayudado a impulsar la demanda de GPU y por lo tanto, el éxito de Nvidia. La mitad de sus ingresos viene de este sector. Tal especialización no ha limitado a Nvidia; en cambio, como han generado nuevas industrias, se han desviado hacia la poderosa tecnología que crea. Los autos de automanejo y la realidad aumentada son dos ejemplos de casos nuevos a los que Nvidia se ha adaptado y ahora sirve. Las GPU ahora son el centro del universo de la inteligencia artificial que también se aprovechará para ayudar a mantener el ritmo de la innovación de la velocidad del procesador GPU.
El precio de la GPU ha crecido en los últimos años debido a la minería de cripto-monedas, lo que favorece a las GPU más potentes. En junio de 2017, un analista estimó que la minería de cripto-monedas solo conducía un valor de 100 millones de dólares en ventas para Nvidia en sólo 11 días. Uno podría llamar a esto un golpe de suerte o una externalidad positiva de su tecnología que permite nuevos mercados.
Como pionero de la GPU, Nvidia se ha convertido en un guardián del ecosistema, utilizando eventos como la Conferencia de Tecnología para reunir a las partes interesadas y mantenerse en el centro de los procedimientos.
Con el tiempo, sus esfuerzos en el desarrollo de GPU han ayudado a Nvidia a acelerar la mejora del rendimiento en relación con el medio predominante de unidades de procesamiento central (CPU). A través de éste ejemplo central de la Ley de Moore en acción, también ha crecido su propia cuota de mercado en relación con su principal competidor AMD:
Gráfica 1: Comparación de Tiempo de las Mejoras de Rendimiento de la *GPU* de Nvidia Frente a las *CPU* de Intel, y Gráfica 2: Participación de Mercado de Nvidia Frente a AMD para las *GPU* de Escritorio Discreto (en %)
En comparación con AMD, Nvidia se ha superado constantemente. Desde la perspectiva de retorno de un accionista, ha devuelto aproximadamente un 850% más que AMD en los últimos cuatro años:
Gráfico 3: Devolución de los accionistas de 4 años de Nvidia versus el índice AMD y NASDAQ
Con un margen bruto del 58,8%, Nvidia supera a AMD (23,4%) en casi un 35%, que es un negocio EBITDA negativo. AMD también se ha montado la onda de la GPU y tiene un rendimiento de salida comparable de sus chips. Entonces, ¿por qué tiene un desempeño financiero más pobre? Bueno, AMD no está tan centrado como Nvidia—también hace las CPU, donde compite fuertemente con Intel. Se involucró en una demanda fea y prolongada con Intel sobre asuntos antimonopolio que lo distrajeron durante la última década, además de pelear con Nvidia en el mercado de GPU de gama alta. AMD está sobrecargado y por lo tanto, las ganancias han sido un poco decepcionantes.

Posicionamiento Basado en Necesidades: Pinterest

La era dorada de los pioneros de las redes sociales puede haber desaparecido hace tiempo. A pesar de su popularidad continúa, Facebook, Twitter y LinkedIn surgieron hace más de una década. Los costos necesarios para construir una red y atraer a los usuarios son exorbitantes e incluso si no son mercados de ganancias total, se necesitaría un negocio valiente para intentarlo. La atención ahora se ha desviado hacia la mensajería y la interacción. El dominio de Facebook se demuestra a través de la compra de dos de las empresas más prometedoras que surgieron recientemente de este sector, Instagram y WhatsApp.
Una de esas empresas que recientemente ha logrado un nicho exitoso dentro de este mercado es Pinterest. A los siete años, todavía es relativamente joven y vuela en gran medida bajo el radar, sin embargo, está valorada en 12.3 billones de dólares (la 10° compañía de más alto valor). Su red tiene 200 millones de usuarios activos mensualmente, la mitad de los cuales viven en Estados Unidos 81% de los cuales son mujeresAumentó su base de usuarios inicial a través de tácticas de referencia, evitando costosos métodos de adquisición pagados. Pinterest ha crecido en un mercado maduro y competitivo a través del posicionamiento basado en necesidades. Aportando valor a tipos específicos de usuarios que usan la red para descubrir y comprar cosas nuevas. Si buscas Pinterest, esto es lo que ves:
Captura de pantalla del resultado de un motor de búsqueda para Pinterest. La descripción HTML dice "Descubre recetas, ideas caseras, inspiración de estilo y otras ideas."
Su interfaz de lista basada en fotografías ha permitido que Pinterest se desvíe naturalmente hacia actividades que se benefician de esto, como compartir diseños de interiores e ideas de moda. El usuario se beneficia porque a diferencia de, digamos, la sección “Recomendado para ti” de Amazon, estas listas son conservadas por los usuarios y ofrecen sugerencias más amplias y menos sesgadas.
Haber definido la psicografía de los usuarios leales y los casos de uso para la red es una catnip para los vendedores. Pinterest podría haber intentado competir con las redes sociales más amplias al ser un tipo de persona que “hace de todo, conocedor”. En su lugar, abrazó su base de usuarios central y los que generan el mayor valor de las listas basadas en imágenes. Esta estrategia de marca también ha impulsado el valor para el otro lado de su mercado, los anunciantes.
Un artículo que ya fue eliminado por parte de la empresa privada, mostró estadísticas de sus usuarios que muestran que el 93% de ellos han utilizado la plataforma para planificar una compra y luego el 52% la han comprado en línea. Es la segunda fuente más alta de tráfico de referencia con Shopify y su tamaño de pedido promedio de 50 dólares, es el más alto de todas las redes sociales. Genera el 5% de todo el tráfico de referencia en la web. Una investigación de El informe de tendencias de Internet de Mary Meeker en 2016 mostró cómo Pinterest impulsa el tráfico fuerte para las compras por Internet:
Gráfica 4: El Contenido Visual de Pinterest impulsa el intento de compra
A pesar de que solo comenzó a registrar ingresos a partir de 2015, Pinterest hizo 100 millones de dólares en ese año, creció a 300 millones de dólares en 2016 y podría alcanzar 600 millones para 2017. SharesPost International estima que los ingresos anuales seguirán expandiéndose a 40-45% por año hasta 2020. A través del posicionamiento basado en las necesidades, Pinterest ha creado una red lucrativa que brinda servicios a usuarios específicos y, a través de ella, ha encontrado oportunidades de ingresos a través de publicidad de referencia.

Posicionamiento Basado en Acceso: Xoom

Siento que Xoom es el mejor ejemplo de compañías digitales que han usado el posicionamiento basado en acceso efectivo, para construir ventajas competitivas son las de la industria de transferencia de dinero. En cuanto a las remesas, el proceso tradicional es que los remitentes acuden a una oficina de marca (por ejemplo, Western Union) y luego el destinatario la recoge de otra oficina en el país de destino. Claro, funciona, pero ¿quién se beneficia más de esto? Western Union, por supuesto, que mantiene a los usuarios dentro de su ecosistema, independientemente de los compromisos que los usuarios tengan que hacer para enviar o recibir.
Al evitar utilizar su propia infraestructura y actuar como un facilitador de las transferencias, Xoom (establecido en 2001) dio a sus clientes más opciones. Xoom permitiría que un remitente envíe por su teléfono y luego el receptor podría obtener dinero en efectivo de varias maneras, como transferencia bancaria, recarga de teléfono o retiro de efectivo.
Al no definir la recolección de efectivo en “oficinas de Xoom” y en su lugar usando marcas de terceros, aumentó las opciones disponibles para los clientes. Esto también fue lucrativo para Xoom ya que, en el proceso, también obtuvo márgenes brutos más elevados que Western Union ya que no tuvo que construir ninguna de sus propias redes de sucursales propias.
Gráfica 5: Márgenes Brutos de Xoom y Western Union
Xoom muestra un gran ejemplo de creación de ventaja competitiva a través del posicionamiento basado en acceso. Sus usuarios tienen las mismas necesidades (enviar y recibir dinero), pero cada uno tiene aspectos matizados de sus necesidades en función de su geografía. La recolección de efectivo para un destinatario urbano puede ser una opción fácil de tomar pero para un habitante rural, la comodidad de recibirlo a través del crédito por teléfono puede superar con creces las molestias de un viaje a un lugar de retiro de efectivo de un afiliado.
PayPal finalmente compró Xoom en julio de 2015 en una valuación de 890 millones de dólares, una prima del 32% sobre su precio de acción en ese momento. Teniendo en cuenta que PayPal es un gigante de la transferencia de dinero, ¿por qué no simplemente replica Xoom por sí mismo? Bueno, sus intenciones se verán impulsadas por la compra del valor de marca de Xoom, pero también por la compra de su experiencia para obtener una ventaja competitiva a través del posicionamiento basado en el acceso. El sistema de pagos P2P de PayPal tiene tonos de Western Union, en el que para que un usuario envíe a otro, ambos deben tener cuentas de PayPal.

Resumen

Estamos en una increíble era de innovación, con nuevas empresas y empresas rompiendo normas y aportando valor a los consumidores a través de más opciones y utilidad. Sin embargo, una razón por la que muchas nuevas empresas eventualmente fallan es porque siguen una mentalidad de “si lo construyes, vendrán”. Esto lleva a situaciones en las que las nuevas empresas se maniobran en sus mercados al no considerar cómo pueden ganar una ventaja competitiva.
Ahora hay muchas técnicas de estrategia competitiva para analizar industrias y competidores. Dentro de estos, los marcos de Michael Porter proporcionan herramientas sólidas para que las empresas los utilicen para planificar su posicionamiento en el mercado. A pesar de acercarse a sus 40 años, todavía se mantienen firmes para que las compañías digitales los usen de ejemplo al hacer modelos de negocio y la compilación de inteligencia competitiva.
Fuente:
BY ALEX GRAHAM - FINANCE BLOG EDITOR @ TOPTAL (TRANSLATED BY MARISELA ORDAZ)

UIs Oscuros. Lo Bueno y lo Malo. Lo Que Debe Hacerse y Lo Que No.

Las interfaces de usuario oscuras son dramáticas, elegantes y elegantes. Sin embargo, los diseñadores deben pisar con cuidado si eligen caminar en el “lado oscuro”.

Crear la apariencia de un producto es una de las principales responsabilidades del diseñador — la decisión de diseño inicial debe ser apropiada para el propósito del producto, la situación particular y su audiencia. El esquema de color tendrá un impacto duradero y debe ser cuidadosamente elegido — y todo comienza con la selección de un fondo en el que se colocarán los elementos de diseño — el “lienzo”. La opción habitual, casi por defecto, es un fondo blanco.
Hay buenas razones para elegir un fondo brillante. Contraste, texto y legibilidad y la capacidad de trabajar con una amplia gama de colores sutiles son algunos de ellos. Según muchos estudios científicos, la legibilidad óptima requiere texto negro sobre un fondo blanco. La marca también puede influir en la decisión porque los logotipos y los colores de la empresa no funcionarán con una paleta de colores oscuros.
La mayoría de los estudios han demostrado que el texto oscuro sobre un fondo claro es superior al texto claro sobre un fondo oscuro, es decir, es más fácil de leer. En un famoso estudio, “fatiga visual” fue significativamente mayor cuando los sujetos leen personajes de luz sobre un fondo oscuro vs caracteres oscuros sobre fondo claro (Bauer, D., Bonacker, M., and Cavonius, C. R. 1983).
También hay una expectativa: la gente está acostumbrada a ver una variedad de contenidos renderizados con tinta oscura sobre un fondo blanco presentado junto con imágenes. Piense periódicos y revistas — que han estado alrededor por más de 350 años. Volviendo aún más lejos: treinta y cinco años y medio a la era del Paleolítico (los días del hombre de las cavernas), encontramos dibujos rupestres de leones y mamuts generalmente colocados sobre un fondo claro con carbón o huesos quemados usados para dibujar las representaciones.
Pintura prehistórica en la cueva de Chauvet, Francia
Las pinturas prehistóricas de treinta mil años en la cueva de Chauvet, France
Sin embargo, cuando un proyecto lo garantiza, los diseñadores de productos digitales actuales pueden optar por trabajar con un esquema de color oscuro por una variedad de razones. Como se sugirió anteriormente, es a menudo una elección estética destinada a transmitir el drama y provocar una emoción — algo inesperado — o tal vez un diseñador quiere fusionar el diseñar con la marca o asegurarse de que el contenido visual se destaca.
Opción de UI oscura de Apple para Apple TV
Para Apple TV, el sitio de Apple cambia a una interfaz de usuario oscura para efectos dramáticos y porque su uso suele asociarse con entretenimiento nocturno.
Sin embargo, si un diseñador decide cruzar hacia el “lado oscuro”, se enfrentarán con una serie de desafíos. Todo tipo de problemas de usabilidad entran en juego — relacionados principalmente con escaneabilidad, legibilidad y contraste. El aspecto principal a considerar es suficiente contraste entre el texto y el fondo. También se debe considerar el contexto (caso de uso) y el entorno, así como el dispositivo en el que es probable que se vea la interfaz de usuario.
Breitling decidió sobre un fondo negro para hacer destacar sus diseños de relojes.
Breitling decidió sobre un fondo negro para hacer destacar sus diseños de relojes.
Algunas interfaces de usuario oscuras están diseñadas para minimizar la “tensión visual digital”. Con un aumento de la tecnología digital, nos fijamos en las pantallas durante la mayor parte del día. Cepa digital del ojo es una condición común que afecta a millones de personas sobre una base diaria. Causado por todo, desde el uso excesivo de la computadora a la exposición regular a la luz brillante, puede causar dolores de cabeza, dolor de cuello, visión borrosa y ardor / picor ojos.
Incluso hay cosas como síndrome de visión por computadora (CVS ) e “incomodidad ocular”. Según un estudio, más del 83 por ciento de los estadounidenses utilizan dispositivos digitales durante más de dos horas al día, con el 60,5 por ciento informando que experimentan síntomas de cepa ocular digital. (Ojos sobreexpuestos: Dilema de dispositivos digitales.)
Los productos SaaS de empresa a empresa y las aplicaciones de edición multimedia se utilizan durante muchas horas seguidas. Muchos han sido diseñados en una interfaz de usuario de temática oscura para reducir la fatiga ocular sin dejar de proporcionar claridad visual. Sin embargo, este enfoque requiere una cuidadosa evaluación inicial de la dirección del diseño.
Las UI oscuras para las apps de iOS de Bloomberg Anywhere
Apps de iOS de Bloomberg Anywhere (by Jeremy Fuerst).
La mayoría de los desarrolladores usan una pantalla negra con una sintaxis codificada por colores para reducir la fatiga ocular. Como revela el Desarrollador de Toptal Kevin Bloch: “Un fondo negro reduce la fatiga ocular y hace que la codificación automática del color sea más fácil de leer, lo que hace que el código sea mucho más rápido de entender de un vistazo “.
El Desarrollador de Toptal Amin Shah Gilani añade: “Yo personalmente uso el tema solarizado oscuro para mi editor de código.Prefiero un tema oscuro porque un fondo más oscuro se siente más fácil en los ojos, especialmente porque me gusta mantener las luces oscuras o trabajar por la noche.
El Editor de Código del Desarrollador de Toptal Amin Shah Gilani por Atom
El Editor de Código del Desarrollador de Toptal Amin Shah Gilani por Atom.
Las interfaces de usuario de video juegos también tienden a temas más oscuros. El contexto de juego y el entorno en el que los jugadores están en juego encajan mejor con una paleta de colores negros. Un diseño de fondo negro refuerza visuales sorprendentes, introduce un sentido de misterio, tiene mejor contraste, y apoya la jerarquía visual.
El diseño de Halo App Windows con fondo oscuro

Cuando las UIs Oscuras Funcionan Bien

La mayoría de las IU relacionadas con el entretenimiento (televisores inteligentes, consolas de videojuegos y aplicaciones de TV y películas) tienden a tener diseños de interfaz de usuario de temática oscura — y por una buena razón. La mayoría de las actividades relacionadas con el entretenimiento se producen por la noche, se ven desde una distancia de 6-10 pies, y se ven en habitaciones con poca luz — en otras palabras, la pantalla coincide con el medio ambiente. Además, el contenido colorido (por ejemplo, arte de portada y promociones) se destaca dramáticamente en las interfaces de usuario con temas oscuros.
El objetivo es coincidir con el contexto de la actividad: “Está oscureciendo, estoy relajado, y quiero ver un poco de televisión”. Similar a miles de pequeñas bombillas, las pantallas digitales ponen la luz dondequiera que un pixel brillante esté presente; por lo tanto, una interfaz de usuario brillante iluminaría la habitación — un efecto indeseable teniendo en cuenta la actividad. En este escenario, el diseño de interfaz de usuario intenta coincidir con el contexto: el dispositivo, el contenido, la actividad y el entorno.
Diseño de UI oscuro para Hulu
Hulu
Diseño de UI oscuro para Netflix
Netflix
Diseño de UI oscuro para Apple
iTunes por Apple
En el contexto adecuado, el entorno, la aplicación y el uso, las IU de fondo negro tienen sentido. Siempre considere el contexto que la interfaz es probable que se utiliza en. Pero va más allá de eso — la elección para ir con él debe depender de contenido y contextoquécuándo **, **dónde y en qué dispositivo.
  • Para lograr una apariencia fuerte y dramática para imágenes llamativas
  • Proyectar una sensación de estilo y elegancia, lujo y prestigio
  • Crear un sentido de intriga y misterio
  • Para ayudar a enfocar y guiar la atención del usuario con distracciones mínimas
  • Apoyar la jerarquía visual y la arquitectura de la información
Concepto de coche de control remoto y diagnóstico
Concepto de coche de control remoto y diagnóstico por Ramotion.
Las interfaces de usuario oscuras sólo deben utilizarse con texto escaso y mínimo, e información “fragmentada” con un fuerte énfasis en las imágenes — luz sobre el texto. Si se usa texto, debe estar en alto contraste con el fondo oscuro — preferiblemente blanco puro u otro color fuerte (no gris oscuro) sobre un fondo negro.
Paleta de color oscuro con fuerte contraste de texto e imágenes en un sitio web
CINEMATEK, un archivo de cine en Bruselas, utiliza un fondo negro para efecto dramático.

Cuando las Interfaces de Usuario Oscuras no Funcionan Bien

Como se indicó anteriormente en el artículo, las interfaces de usuario de temas oscuros son una mala opción para contenido pesado de texto y pesado de datos, o cuando se utilizan diversos tipos de contenido (texto, imágenes, video, tablas de datos, desplegables, campos, etc.). El consenso general en la comunidad de diseño es que las interfaces de usuario oscuras son un gran desafío para diseñar, a menos que se trate de contenido simple y sólo una aspersión de texto aquí y allá.
El reto es tratar de mantener un contraste suficiente, lo que afecta el desafío global: la legibilidad, que está conectada con la usabilidad, lo que afecta a UX. Generalmente, todos los colores trabajan sobre un fondo blanco, mientras que sobre un fondo oscuro la gama útil de colores se reduce drásticamente.
El diseño de fondo negro para análisis debe ser abordado con cuidado
Hay un contraste insuficiente en algunos de los elementos de la interfaz de usuario en este ejemplo, que afectan al UX (by GUOHAO.W)
He aquí un ejemplo real de cuándo no usar una interfaz de usuario con temas oscuros: participé en un proyecto B2B SaaS en el que el CEO era inflexible, y para “ser diferente”, quería ir con un tema oscuro UI — que coincide con la marca de la empresa … para toda la plataforma. Para todo. Después de varias reuniones, y reuniendo al equipo de diseño ya los gerentes de producto detrás de la causa, pudimos convencerlo de una decisión potencialmente desastrosa.
La plataforma utilizó un conjunto estándar de componentes de interfaz de usuario de aplicación SaaS y, en consecuencia, estaba llena de formularios, widgets, listas desplegables, pictogramas e iconos junto con texto y datos numéricos en tablas. La navegación, el diseño y la funcionalidad se habrían vuelto increíblemente difíciles de manejar al mismo tiempo que lograran un contraste suficiente y un esquema de colores coherente. En resumen, habría sido casi imposible hacer que todo funcionara con una interfaz de usuario de temas oscuros.
Dependiendo de la conveniencia de la aplicación, tal vez la elección correcta habría sido sugerir una mezcla de luz y oscuridad UIs. Por ejemplo, las páginas de configuración con widgets y formularios y tablas de datos podrían haber sido diseñadas con un fondo claro y las páginas analíticas con gráficos podrían haber sido diseñadas con un esquema de color más oscuro.
Interfaz de usuario de Google Analytics
Las interfaces de usuario, análisis e infografías del panel de control funcionan bien en una interfaz de usuario oscura, pero todavía deben tratarse con cuidado para garantizar un contraste suficiente (by Alex Gilev).

Las Normas Para Usar o No Usar UIs Oscuros

Para terminar, la decisión de ir con una interfaz de usuario oscura necesita ser abordada con cuidado. Los diseñadores no debeb hacerlo por las razones equivocadas — para estar de moda, ser diferente, o copiar el diseño de otra persona. Es crucial que un diseñador considere el contexto, el contenido (contraste y legibilidad), el dispositivo y el caso de uso, y tenga una buena razón para elegir. Es un acto de equilibrio delicado, ya que hay potencialmente muchos beneficios, pero también muchas trampas.

Cuándo está bien usar UIs oscuros:

  • Cuando un esquema de color de marca lo avala
  • Cuando el diseño es escaso y minimalista con sólo poco tipo de contenido
  • Cuando es apropiado para el contexto y el uso, como aplicaciones de entretenimiento nocturno
  • Para reducir la fatiga ocular, como páginas de análisis que se utilizan durante largos períodos de tiempo
  • Para provocar una emoción — por ejemplo, un sentimiento de intriga y misterio
  • Para crear un aspecto llamativo y dramático
  • Crear un sentido de lujo y prestigio
  • Para apoyar la jerarquía visual

Cuándo es mejor alejarse del UI oscuro:

  • Cuando hay un montón de texto (la lectura en un fondo oscuro es difícil)
  • Cuando hay mucha mezcla de contenido en la pantalla
  • En el caso de aplicaciones B2B con muchas formas, componentes y widgets
  • Cuando el diseño requiere una amplia gama de colores
El diseño en fondo negro para video juegos no siempre funciona
Aunque es un juego, muchos tipos de contenido mixto no funcionan bien con una paleta de colores oscuros.
Cruzar hacia el “lado oscuro” debe ser abordado con cuidado. Se recomienda una investigación y un análisis más profundo y profundo antes de tomar una decisión potencialmente precaria y llena de trampas. Una vez que un diseñador va por ese camino, es muy difícil volver atrás. Los diseñadores serían bien aconsejados para considerar todos los aspectos — el bueno y el malo, lo que se debe o no hacer, antes de saltar con los dos pies.
BY MIKLOS PHILIPS - UX DESIGNER AND LEAD DESIGN BLOG EDITOR @ TOPTAL (TRANSLATED BY YESICA DANDERFER)
Fuente:

Seguidores