Microsoft-ui-xaml: Rediseño de logotipo y botín

Creado en 22 ago. 2019  ·  312Comentarios  ·  Fuente: microsoft/microsoft-ui-xaml

[Actualización 18/10/19] ¡Tenemos un nuevo logo y un nuevo botín!

¡Hola, maravillosa comunidad! Un gran agradecimiento a todos ustedes por conducir esta casa. Realmente queríamos crear algo que combinara todo el trabajo favorito que todos pusieron aquí. Creemos que esto hace eso.

WinUI Logo

WinUI Logo Wireframe

Vamos a informar

Tenemos el antiguo logo de Xaml aquí:

Original Xaml Logo

Cuando @itsmichaelwest da nueva vida a la historia, obtienes algo maravilloso:

WinUI_LogoExporation_V3_GitHub

A partir de ahí, nos dirigimos a la comunidad. Después de (casi) otros cien envíos que exploraron la re-coloración y el estilo, nos enamoramos de este giro simple pero elegante para contener los corchetes. Como lo expresó

New WinUI Logo - wireframe

En cuanto al color, nuestra comunidad de usuarios habló y exigió algo que todavía "se parecía a Windows". @mdtauk hizo que fuera fácil imaginar este azul familiar que representa a nuestra comunidad una vez más:

New WinUI Logo - color

Por supuesto, en este breve resumen, he resumido las ~ 300 interacciones de casi 40 colaboradores aquí y volúmenes más en Twitter y fuera de línea. La historia corta es esta: no podríamos haber hecho esto sin todos ustedes, y espero que todos vean un poco de su trabajo y su historia reflejada en lo que hemos creado juntos. De alguna manera se ve moderno y retro al mismo tiempo, moderno y, sin embargo, también histórico, preciso y asimétrico. Es un tema de conversación, y eso es por diseño. 😊

New WinUI Logo - wireframe and color

Viendo hacia adelante

Teniendo en cuenta lo diverso que fue este esfuerzo de colaboración y todas las variaciones coloridas que vimos, ¿cómo no podríamos mantener las cosas animadas con todas las ideas que nos has dado? Estamos emocionados de experimentar con los colores y el tema. ¡Esté atento a Twitter mientras compartimos un trabajo de diseño divertido y tratamos de idear el mes de celebración, las vacaciones y las variantes temáticas de lanzamiento para compartir! 😊

También vamos a comenzar a iterar sobre diseños de botines emocionantes. ¡Asegúrese de pasar por nuestro stand en Microsoft Ignite para recoger una de estas pegatinas a continuación!

WinUI Logo Sticker

¡Tenemos un botín para compartir!

Equipo de la comunidad, te escuché alto y claro. Querías tener la oportunidad de comprar el mismo botín que los miembros de nuestro equipo interno lucirán en Microsoft Ignite, en el escenario y en todo el mundo. Elegimos diseñar y ordenar nuestro botín a través de una empresa que podría hacer que eso suceda para usted.

Hice nuestro pedido final de más de 100 artículos hoy. Cada miembro del equipo pudo elegir uno u otro. A muchos les gustaron tanto los dos que tomamos uno y pedimos el otro nosotros mismos (incluido yo).

Por favor hazme saber si tienes preguntas. Tengo algunas notas:

  • Si fue el ganador de nuestro "Número 1000 - ¡Gracias!"
  • Las sudaderas con capucha requieren un pedido mínimo de 6. Puede cambiar fácilmente el producto por uno sin mínimo o armar un formulario de pedido grupal.
  • Si hace su pedido esta semana / envía a su hotel, puede obtenerlos a tiempo para unirse a nosotros y usarlos en Microsoft Ignite en Orlando, FL, del 4 al 8 de noviembre.

Enlace de pedido de sudaderas con capucha WinUI

WinUI Hoodies

Enlace de pedido de camisetas WinUI

WinUI Shirts


[Cerrado el 12/09/19} ¡Rediseño del logotipo!

¡El equipo de WinUI está renovando nuestro logotipo y está invitando a la comunidad a unirse a nosotros para experimentar, crear e iterar sobre nuevas ideas!

Requisitos del logotipo:

  • Moderno, moderno, profesional
  • Escalable desde un tamaño nativo de 64x64px hasta 16x16px y arbitrariamente grande sin dejar de ser reconocible.

Línea de tiempo:

Para mantener el esfuerzo en el alcance, estamos buscando precisar nuestra selección final para el 6 de septiembre .

¿Dónde se usará esto?

  • Marca de producto / repositorio
  • Estilo
  • Pegatinas
  • Medios (Twitter, GitHub, etc.)

Cosas legales:

Estamos licenciando un diseño de referencia bajo Creative Commons Attribution-No Derivatives 4.0 https://creativecommons.org/licenses/by-nd/4.0/, lo que significa que queremos que distribuya libremente cualquier diseño de referencia que se encuentre disponible comercialmente. o no comercialmente. Sin embargo, no queremos que miles de variaciones del logo se vuelvan locas, por eso elegimos una licencia que restringe la capacidad de distribuir más material adaptado.

Si tiene adaptaciones, envíelas a nuestro proyecto GitHub, y ofreceremos las adaptaciones enviadas bajo la misma licencia Creative Commons. Como recordatorio bajo la licencia, el uso del material de referencia no puede usarse para sugerir que está patrocinado, respaldado o otorgado un estado oficial por Microsoft o puede usarse en contextos que son ilegales. En resumen, use el sentido común al hacer referencia a cualquiera de los diseños de logotipos; nos complace que los comparta, pero tomaremos medidas si se usan de manera inapropiada.

Recursos:

  • Logotipo actual:
    WinUI Library Logo

  • Mosaico de repositorio actual
    WinUI Repo Tile

hot team-Controls

Comentario más útil

¡Siempre es emocionante ver a la comunidad unirse en la iconografía! ✨

Se me ocurrió un borrador inicial que creo que puede escalar bastante bien en varios medios / merchandising. En el centro hay un cubo redondeado con cada cara sombreada con varios colores; actualmente seleccionado de la paleta de la marca Windows, esto obviamente se puede cambiar.

Los signos mayor / menor que encierran el cubo. Estos no son visibles en tamaños más pequeños, sino que se enfocan en el cubo.

El logotipo también se puede delinear con fines de merchandising. Se burló de una idea de cómo podría verse en una camiseta.

Aún siendo un WIP, los comentarios son muy apreciados. 😊 A mí mismo me preocupa que se sienta demasiado abstracto, ¡pero dejaré que la comunidad lo juzgue!

WinUI_LogoExporation_GitHub

Todos 312 comentarios

¡Hola a todos! El primer ministro de Windows IXP (anteriormente Composición) que quería agregar mis ideas a la mezcla :) aquí hay algunas con las que he estado jugando, ¡déjeme saber lo que piensa!

WINUI
logo2
logo
logoagain

Tus presentaciones son increíbles, @embender. Particularmente me gustan los últimos y los primeros.

WebUI
Rápidamente simuló un ícono de WinUI que no estaría fuera de lugar estacionado para otros productos dentro de la suite.

¡Increíble, @iconredesign! Me encanta tu uso de sombras en el ícono para evocar regiones de aplicaciones.

Para evitar la combinación con el ícono de Microsoft Word (abajo), ¿qué pensaría acerca de incorporar algunos de los colores de Fluent Design System o algo similar?

Microsoft Word icon

¡Absolutamente! Estaba tratando de mantener el color del tema de WinUI, pero me vino a la cabeza que tal vez a la más breve de las miradas podrían verse iguales.

Echaré un vistazo a las pautas presentadas y enviaré una revisión. ¡Gracias!

@iconredesign

¡Absolutamente! Estaba tratando de mantener el color del tema de WinUI, pero me vino a la cabeza que tal vez a la más breve de las miradas podrían verse iguales.

Echaré un vistazo a las pautas presentadas y enviaré una revisión. ¡Gracias!

Estas son las buenas noticias: puede ayudarnos a estandarizar los colores de los nuevos temas. ¡Nuestras pautas son intencionalmente sueltas en ese sentido para que podamos tener la libertad de hacer esto increíble!

@SaboyaSchuler

Estilo

Espero ver algunas camisetas disponibles para comprar una vez que el logo sea oficial.

@SaboyaSchuler

Estilo

Espero ver algunas camisetas disponibles para comprar una vez que el logo sea oficial.

@shaggygi , ¡anotado! ¿Qué tipo de diseño te hará usar una de nuestras camisas todas las semanas durante los próximos años? Mi listón para el botín es al menos así de alto. 😉

@SavoySchuler No me gusta demasiado llamativo 😄. Normalmente uso mi camiseta de GitHub cada dos semanas. Un logotipo final simple sería bueno ... probablemente lo suficiente para que otros sientan curiosidad por preguntar qué significa explicar / promover.

WebUI v2

Supongo que es importante que un diseñador ofrezca un manifiesto completo, así que aquí está.

El logotipo, por supuesto, evoca otros productos de software de Microsoft. Esto deja en claro la organización detrás de ella, y la iconografía de una interfaz de usuario simulada define claramente para qué es esta aplicación. El WinUI> se distingue de un producto de Office, el uso de corchetes y barras en lugar de una letra lo hace notablemente diferente y evita la combinación de letras. En total, el icono comunica claramente que 1) es un producto de Microsoft, 2) es una herramienta basada en código para el diseño de la interfaz de usuario y 3) NO es un producto de Office.

El diseño plano incorpora el elemento donde el color del tema principal de la aplicación se traslada a su fondo. Metafóricamente, es la "base" de la aplicación y se ajusta al esquema de diseño de una aplicación como Excel. Se puede sacar una conclusión visualmente donde "WebUI es la base del diseño de la interfaz de usuario que descansa en la parte superior. Lo hizo posible".

Durante mi breve investigación de WinUI para asegurarme de que mi logotipo realmente representa el producto, me llevó a una imagen insignia que muestra una interfaz de muestra que muestra la amplitud de los elementos de la interfaz. Los grises se quitaron de esa imagen simbólicamente para lograr 1) Simplicidad de coloración para evitar un diseño feo, 2) Es simplemente una diferencia de tono del blanco y también es neutral, y 3) Para resaltar jerarquías que lo refuerza aún más con el comercio de Diseño de interfaz de usuario (que personalmente me encanta) y 4) los tonos diferenciados de gris significaron que esta metáfora funcionará independientemente del tamaño del icono, lo más importante, su tamaño en la barra de tareas.

Entonces, sobre el tema de la estandarización, ¿qué mejores colores para representar la interfaz de usuario de Microsoft que los colores que ya se utilizan para representar el diseño? Ya fluye perfectamente con el blanco.

Espero que les guste, y si tienen inquietudes, ¡no duden en plantearlas!

Sin embargo, me disculpo si sientes que estoy atascado en este diseño, así que estoy abierto a una actualización si es más apropiado.

@iconredesign
La idea detrás de su diseño está bien, pero la ejecución tiene problemas.

Primero, ¿por qué hay 3 radios de esquinas redondeadas? Elija uno para el marco maestro y otro para la caja con> en él y las tarjetas.

En segundo lugar, los colores necesitan algunos ajustes, no tiene sentido tener un tono claro en la parte superior y luego oscuro debajo.

En tercer lugar, supongo que estabas intentando hacer una sombra con varios cuadrados oscuros con opacidad. Eso estaría bien para algo más abstracto, pero en la mayoría de los casos no es así como se hace.

Además, el diseño parece que tomó un ícono, lo vectorizó en Illustrator y cambió un poco las cosas (tal como fue mi primera impresión).

Es por eso que necesito una opinión externa porque soy inmune a quedar atrapado en mi cabeza.

Tomaré en cuenta sus sugerencias y las perfeccionaré. ¡Gracias!

Tenga en cuenta que la sombra paralela aún es temprana, por lo que la final no se verá tan desorganizada. Está literalmente intacto de lo que originalmente se suponía que era solo una maqueta.

Hola @SavoySchuler , me preguntaba cuál es la misión de WinUI en tus palabras. Pregunto porque sería bueno evocar esos pensamientos a través del nuevo logo. ¡Gracias!

@iconredesign

Tenga en cuenta que la sombra paralela aún es temprana, por lo que la final no se verá tan desorganizada. Está literalmente intacto de lo que originalmente se suponía que era solo una maqueta.

¿No es más fácil hacer clic en un botón para obtener una sombra que hacer un rectángulo, elegir un color, reducir la opacidad y luego copiarlo? 😄

WebUI v3

Abordar todos los problemas:

1 - Unificó todos los radios y arregló la parte superior del ícono, lo cual fue un gran descuido. Las tarjetas se han rectificado para utilizar las esquinas rectas de la interfaz.

2 - La barra de navegación ahora es más oscura y comparte el mismo tono que el primer elemento de menú de la lista.

3 - Finalmente hice clic en el "un botón" antes mencionado después de apresurar esa parte para la maqueta inicial para que la sombra paralela se vea mucho mejor ahora.

Buscando algo que podría faltar en el ícono, pero creo que se ve bien por ahora.

@iconredesign
Es un poco mejor ahora con las correcciones 🙂

IDK, podría ser solo yo, pero ¿quizás intentar una nueva dirección? Me recuerda demasiado al icono de Word ...

WebUI variant

¡Tú preguntaste, yo entregué! Toma diferente, por lo que el> es parte de la interfaz, y los elementos se levantan de la hoja para que el elemento de evocación todavía esté en juego. El azul es el azul de WinUI.

@iconredesign
Mejorando, pero ahora nos hemos ido demasiado planos y con esquinas demasiado afiladas. Fluent se mueve hacia degradados (leves), sombras y esquinas redondeadas.

Los cuadros grises / blancos representan elementos de menú o?

Editar: también, piense en tamaños pequeños (como se mencionó en la primera publicación), no estoy seguro de cuán descifrable sería este :)

Esta variante está diseñada teniendo en cuenta los tamaños pequeños. En ese tamaño, realmente no puede usar degradados y esquinas redondeadas de manera efectiva debido a cómo todo se reduce y estos elementos desaparecen.

Tenga la seguridad de que este diseño es perfectamente visible en la barra de tareas. El elemento principal es un menú desplegable de una barra de navegación.

@iconredesign
Haga una versión "más grande" y luego: D

Además, puede usar degradados incluso en tamaños más pequeños, aún se notará;)
Ejemplos: iconos de Visual Studio (código), texto sublime, suite de Adobe, ...

¡Ciertamente estoy de acuerdo con explorar varias direcciones! Debo señalar que realmente me gusta esta presentación de @iconredesign :

WebUI v3

Hay algunas cosas que me gustan:

  • La alineación con los iconos de Microsoft Office Suite es un complemento del conjunto de iconos. Visualmente, sabes quién ofrece el producto y evoca confianza.
  • La metáfora de la aplicación es excelente. La barra de desplazamiento y el menú desplegable fuera de la ventana raíz son llamadas nítidas a nuestro conjunto de control, nuevo y antiguo.
  • El texto agrega claridad al concepto de que esta es una herramienta para desarrolladores.

Ideas para el concepto:

  • La principal preocupación parece ser la combinación con el esquema de colores de Word. Algo bueno en los diseños de @embender que, al ramificarse en un esquema de color de dos tonos, su primer y tercer diseño pueden aprovechar el color con éxito sin alejarse demasiado del territorio de los iconos de Office. ¿Podría este diseño incorporar un par de colores como el verde / violeta de @embender o algo más?
  • El "contenido de la aplicación" también se puede reconfigurar para que se parezca menos a Word, ¿tal vez algo que muestre una cuadrícula o use un ProgressRing? La aplicación "Xaml Controls Gallery" en la Tienda Windows mostrará nuestra colección completa de controles de IU y sus íconos.

Una vista previa de los iconos de control de la aplicación Xaml Controls Gallery:

Xaml Controls Gallery app screenshot

¿Quizás algunas de las imágenes aquí se pueden usar como inspiración? También se puede hacer clic en todos estos para ver el comportamiento visual real de los controles de la interfaz de usuario.

@SavoySchuler sería bueno si también recibieran un tratamiento fluido, el estilo actual se parece a los íconos de la barra de herramientas VS2015 / 17 para mí 😄

Mañana haré una maqueta y la publicaré

Quizás solo la parte </> del ícono actual,
image

O un retro de uno antiguo, ¿qué tal si modernizamos un ícono familiar, p. Ej.

Untitled

Por favor, perdona mis bocetos descuidados.

También me gusta mucho la de

Yo voto para que sea sólido, mínimo y simple. Sin gradientes por favor, me hace sentir 97 '.

@SavoySchuler El ícono W ES hermoso, pero está gritando MS Office Word, mabe en lugar de W, algo más, </> o cualquier cosa geek y familiar en su lugar.

Oye, casi me olvido de mencionar, ¡el logo actual también funciona para mí!

Tal vez deberíamos mantenernos alejados del nuevo estilo de icono de Office. Estos íconos son parte de la familia de productos de Office 365, por lo que para mí no tendría sentido incluirlo en todo lo relacionado con Microsoft.

Eso sí, diseñar íconos que escalen bien es muy, muy difícil (como acaban de descubrir mientras se lo ponían en una camiseta :)). Recomiendo contactar al equipo de Microsoft Design para ver si hay alguien que pueda ayudarnos con esto.

Lo intenté, inspirado en el logotipo de .NET Core muy básico. Realmente no 'gritan' un marco de interfaz de usuario, por lo que eso podría ser un problema. Por otro lado, podría encajar con otros logotipos de framework como la familia .NET.

Concepto 1
Concept1

Concepto 2
Concept2

Concepto 3
Concept3

@ neils9001 FWIW, realmente me gusta el concepto 1; buena idea en la inspiración allí. (Prefiero el texto de WinUI todo en una línea, frente al Concepto 2). El concepto 3 también es bastante bueno; parece escalable, simple y elegante.

winui logo-01

Creo que si ya estamos aquí, pensando en íconos y marca para WinUI, quizás también podríamos considerar "la otra mitad", las API del sistema (el paquete Microsoft.Windows.SDK.Contracts NuGet), llamémoslo WinAPI.

Podía imaginar una oficina-como el diseño de iconos con ser el texto "interfaz de usuario" o "API" y para la interfaz de usuario del resto de ella sería algo así como una de esas artes fluidas abstractos (algo así como éstos ), y el "API" podría ser uno o más engranajes ... engranajes fluidos.

Tal vez el logotipo estricto, la pequeña etiqueta podría ser solo un logotipo de Windows y el texto "UI" o "API" al lado. Además, por supuesto, la parte artística con el material fluido abstracto y los engranajes.

@MySelfMaruf, personalmente, deseo que WinUI no esté vinculado a Windows. TBH Desearía que el nombre no fuera Win. Por lo tanto, estar mentalmente abierto para la expansión futura de una interfaz de usuario de .NET Core que funcione en cualquier .NET Core (o incluso en un entorno estándar de .NET).
Vea esta solicitud de función.

De hecho, tuve pensamientos similares sobre el concepto de "interfaz de usuario" @petroemil

Aquí hay un primer intento limpiado y editado por mí:
256
image

Quiero redactar un segundo envío que esté separado de Windows, y estoy de acuerdo con

@AmNotADev

@weitzhandler que podría ser una buena idea evitar conectar el estilo de este y Microsoft directamente

Me refería a Windows, no a Microsoft.

De hecho, tuve pensamientos similares sobre el concepto de "interfaz de usuario" @petroemil

Quiero redactar un segundo envío que esté separado de Windows, y estoy de acuerdo con

Acordado. Quizás sería interesante pensar en algo .Net Core UI o .Net UI. Sin embargo, recomendaría ahora afiliar estos íconos con la marca Office. Solo la marca Office a partir de ahora usa el corte pequeño. con el panel desplegable.

Además, si esto desencadenaría un cambio de marca y un nombre completos, ¿cómo podríamos integrar mejor el Kit de herramientas de la comunidad de Windows?

WinUI
Kit de herramientas de la comunidad WinUI?

Mi mal, pero estoy de acuerdo con eso todavía @weitzhandler

Para explicar por qué tomé este camino para mi primer borrador, estos no son solo el estilo de la marca de oficina, otras plataformas de Microsoft están usando estos estilos de logotipos, incluidos Skype, OneDrive y Microsoft Teams (Skype y OneDrive no tienen el recorte, pero Teams tiene eso).

Pensé que sería un buen experimento ver cómo se vería un logotipo de marca, con ese estilo, antes de probar cualquier otra cosa. cc @ niels9001

@ niels9001 @weitzhandler WinUI no es exclusivo de .NET, también es el marco de interfaz de usuario para aplicaciones nativas y es posible que incluso recuerde algo sobre el futuro soporte de Python. Sin mencionar que también es el marco subyacente para cosas como Xamarin, Uno o las próximas soluciones React Native.

¡Siempre es emocionante ver a la comunidad unirse en la iconografía! ✨

Se me ocurrió un borrador inicial que creo que puede escalar bastante bien en varios medios / merchandising. En el centro hay un cubo redondeado con cada cara sombreada con varios colores; actualmente seleccionado de la paleta de la marca Windows, esto obviamente se puede cambiar.

Los signos mayor / menor que encierran el cubo. Estos no son visibles en tamaños más pequeños, sino que se enfocan en el cubo.

El logotipo también se puede delinear con fines de merchandising. Se burló de una idea de cómo podría verse en una camiseta.

Aún siendo un WIP, los comentarios son muy apreciados. 😊 A mí mismo me preocupa que se sienta demasiado abstracto, ¡pero dejaré que la comunidad lo juzgue!

WinUI_LogoExporation_GitHub

@itsmichaelwest entrando y haciendo un excelente trabajo como siempre :)

He estado esbozando algunas ideas y empezaré a intentar convertirlas en ideas más pulidas.
image

Aquí hay uno basado en el logotipo de Visual Studio
winUI logo idea 1

image

winUI logo idea 3

winUI logo idea 4

Aquí hay un logotipo inspirado en el sitio de Fluent Design

winUI logo idea 5

Íconos refinados a escala de 16px y 32px

image

De hecho, tuve pensamientos similares sobre el concepto de "interfaz de usuario" @petroemil

Quiero redactar un segundo envío que esté separado de Windows, y estoy de acuerdo con

Acordado. Quizás sería interesante pensar en algo .Net Core UI o .Net UI. Sin embargo, recomendaría ahora afiliar estos íconos con la marca Office. Solo la marca Office a partir de ahora usa el corte pequeño. con el panel desplegable.

Además, si esto desencadenaría un cambio de marca y un nombre completos, ¿cómo podríamos integrar mejor el Kit de herramientas de la comunidad de Windows?

WinUI
Kit de herramientas de la comunidad WinUI?

Desde una perspectiva a largo plazo, ¿el diseño no debería utilizar la nomenclatura de la interfaz de usuario de Windows (win)?

Artboard Copy
Artboard

winUI logo idea 7

De hecho, tuve pensamientos similares sobre el concepto de "interfaz de usuario" @petroemil

Quiero redactar un segundo envío que esté separado de Windows, y estoy de acuerdo con

Acordado. Quizás sería interesante pensar en algo .Net Core UI o .Net UI. Sin embargo, recomendaría ahora afiliar estos íconos con la marca Office. Solo la marca Office a partir de ahora usa el corte pequeño. con el panel desplegable.

Además, si esto desencadenaría un cambio de marca y un nombre completos, ¿cómo podríamos integrar mejor el Kit de herramientas de la comunidad de Windows?

WinUI
Kit de herramientas de la comunidad WinUI?

Apreciamos la llamada @ niels9001. 🦙❤

Sin embargo, Windows Community Toolkit es más que una simple interfaz de usuario (aunque nuestros controles y el trabajo XAML son la mayor parte de lo que se usa). No estoy seguro de cuánto tiene sentido la marca compartida aquí todavía, especialmente porque el equipo de WinUI no administra el Kit de herramientas, somos organizaciones separadas. Entonces, esa será una discusión más amplia para tener en otros lugares.

En cuanto a la entrada a los diseños, me gustó mucho el icono de libro existente, ya que es una biblioteca de controles ... 😛

Dicho esto, hay algunos de los diseños que me hacen pensar que tal vez pueda cambiar de opinión ... Estoy de acuerdo en que deberíamos alejarnos del patrón de diseño de Office.

Hola @SavoySchuler , me preguntaba cuál es la misión de WinUI en tus palabras. Pregunto porque sería bueno evocar esos pensamientos a través del nuevo logo. ¡Gracias!

¡Esta es una pregunta fabulosa, @saraclay! No tenemos una misión formal para WinUI, ya que está en constante evolución para satisfacer las necesidades de nuestra comunidad, pero nuestro objetivo para WinUI 3 es este:

"WinUI 3 llevará la moderna plataforma de presentación de Windows a más desarrolladores, más rápido y de una manera más abierta".

Puedo desglosar el contenido de esto un poco más si ayuda; solo quiero asegurarme de no saturar el espíritu creativo con los detalles técnicos. ¡Sólo házmelo saber! 😊

image

Aquí está mi opinión sobre el logotipo del libro actual, estilizado para parecerse a los íconos de Office Fabric. También me tomé la libertad de crear conceptos para "WinAPI", como @petroemil mencionó anteriormente.

Tejido WinUI
WinUI Fabric

Tejido WinAPI [A]
WinAPI Fabric 1

Tejido WinAPI [B]
WinAPI Fabric 2

Sobre el tema de nombrar

De hecho, tuve pensamientos similares sobre el concepto de "interfaz de usuario" @petroemil

Quiero redactar un segundo envío que esté separado de Windows, y estoy de acuerdo con

Acordado. Quizás sería interesante pensar en algo .Net Core UI o .Net UI. Sin embargo, recomendaría ahora afiliar estos íconos con la marca Office. Solo la marca Office a partir de ahora usa el corte pequeño. con el panel desplegable.
Además, si esto desencadenaría un cambio de marca y un nombre completos, ¿cómo podríamos integrar mejor el Kit de herramientas de la comunidad de Windows?
WinUI
Kit de herramientas de la comunidad WinUI?

Desde una perspectiva a largo plazo, ¿el diseño no debería utilizar la nomenclatura de la interfaz de usuario de Windows (win)?

Veo un excelente debate sobre el nombre del producto. ¡Estas son excelentes preguntas para hacer!

Como señaló @petroemil , WinUI no es exclusivo de .NET. Es el marco de interfaz de usuario moderno para aplicaciones nativas de Windows que puede aprovechar varios marcos de desarrollo, incluido React Native, así como también es el marco subyacente para cosas como Xamarin y Uno.

Nuestro objetivo es brindarle la forma más rápida, fácil y abierta de crear una interfaz de usuario de clase mundial. Piense en la "victoria" en "WinUI" como "🏆UI". Crees que estoy bromeando, pero hacemos esto todo el tiempo en nuestro equipo 🏆Dev (WinDev).

Si alguien puede pensar en una forma de traducir 🏆 en un logotipo legítimo, hará que @jeffbog sea la semana.

También me gustaría señalar que los íconos de Fabric (veo que aquí se hace referencia a ellos como "íconos de Office") _no_ se limitan a MS Office. Por ejemplo, Your Phone y la nueva Terminal de Windows usan íconos de Fabric, a pesar de que no están relacionados en absoluto con Office.

Parece que el estilo Fabric está orientado a servicios multiplataforma, incluidos Your Phone, Terminal (ya que contiene Ubuntu) y Azure (el sitio web usa Fabric). Si WinUI también está destinado a ser multiplataforma, sería perfecto asociar WinUI con otros servicios multiplataforma.

@yoshiask ¡Fui con la misma inspiración algunas publicaciones por encima de la tuya! También traté de hacer lo mismo sobre Fabric, pero tú lo llevaste a casa mucho mejor que yo.

Me gusta cómo quedó el tuyo, pero se sienten un poco más compactos que los logotipos actuales de Fabric.

@AmNotADev ¿Podría dar más detalles sobre "compacto"? ¿Te refieres al color (en la parte de 'contenido') o al recorte (la 'tarjeta' con ">")?

@yoshiask el ancho de la sección de "fondo" del logotipo no parece coincidir con ninguna de las proporciones de los otros logotipos de Fabric, se ve un poco ... ¿aplastado? Lo haría un poco más ancho para que el logotipo general se sienta más cuadrado.

Tuve el problema opuesto e hice el mío un poco demasiado ancho para coincidir.

Ah, buen punto. Creo que coincidí con las proporciones del diseño actual cuando estaba trabajando en él, y olvidé volver a cambiarlo.

Me gusta, aquí está mi edición del envío anterior si arreglo mi tamaño y posición.
256

El ancho es fijo (la 'tarjeta secundaria', es el tono de azul incorrecto, ¡uy! No quiero enviar spam, así que lo dejaré por ahora)
WinUI Fabric

Rehice el diseño de @AmNotADev usando mi plantilla de tela.
WinUI AmNotADev Blue
WinUI  AmNotADev Green

@SaboyaSchuler
Win Combined
Casi parece arte de Word de PowerPoint

winUI logo idea 9

Versiones escaladas, similares a Office, estilo Windows 10 Fluent Icon (incluido Acrylic Noise), conservando la metáfora del libro.

Idea 9 _ all

image

Versiones planas y monocromáticas del mismo diseño que compartí antes, más una maqueta de camiseta. ¡Es tela sobre tela!
WinUI Fabric Mono
WinUI Literal Fabric

¡Hola!

Aquí están mis primeras ideas de diseño.
¿Qué piensas?
logos

¡Hola!
Esta es mi idea para WinUI
winui

Sobre el tema de nombrar

De hecho, tuve pensamientos similares sobre el concepto de "interfaz de usuario" @petroemil

Quiero redactar un segundo envío que esté separado de Windows, y estoy de acuerdo con

Acordado. Quizás sería interesante pensar en algo .Net Core UI o .Net UI. Sin embargo, recomendaría ahora afiliar estos íconos con la marca Office. Solo la marca Office a partir de ahora usa el corte pequeño. con el panel desplegable.
Además, si esto desencadenaría un cambio de marca y un nombre completos, ¿cómo podríamos integrar mejor el Kit de herramientas de la comunidad de Windows?
WinUI
Kit de herramientas de la comunidad WinUI?

Desde una perspectiva a largo plazo, ¿el diseño no debería utilizar la nomenclatura de la interfaz de usuario de Windows (win)?

Veo un excelente debate sobre el nombre del producto. ¡Estas son excelentes preguntas para hacer!

Como señaló @petroemil , WinUI no es exclusivo de .NET. Es el marco de interfaz de usuario moderno para aplicaciones nativas de Windows que puede aprovechar varios marcos de desarrollo, incluido React Native, así como también es el marco subyacente para cosas como Xamarin y Uno.

Nuestro objetivo es brindarle la forma más rápida, fácil y abierta de crear una interfaz de usuario de clase mundial. Piense en la "victoria" en "WinUI" como "🏆UI". Crees que estoy bromeando, pero hacemos esto todo el tiempo en nuestro equipo 🏆Dev (WinDev).

Si alguien puede pensar en una forma de traducir 🏆 en un logotipo legítimo, hará que @jeffbog sea la semana.

Me gustaría disculparme de antemano por mis habilidades de diseño, use su imaginación cuando mire el siguiente boceto :

¿Y si el logo fuera una moneda, una medalla (en lugar de una copa / trofeo)?

En el caso de WinUI, ¿podría ser una moneda de plata con una paleta de pintura dorada en el interior? O la curva exterior de la paleta podría ser un círculo más perfecto y la parte restante del círculo podría rellenarse con una pieza plateada.

Y WinAPI podría ser una moneda de plata con, contrariamente a la ilustración siguiente, una rueda dentada relativamente delgada en el borde con muchos dientes.

win-ui-api-logo-sketch

Una cara de la moneda podría ser el texto UI / API o el símbolo </> / { # } (aunque los símbolos dentro de los símbolos pueden ser demasiado simbolismo), y el otro lado podría ser un logotipo de Windows.

Se necesita un poco de imaginación, pero puedo imaginar que esto realmente se ve bien.

Algunos ejemplos adicionales de las interwebs:

  • El tipo de diseño de moneda de rueda dentada que tenía en mi cabeza: enlace
  • Y como ya estaba allí, buscando ejemplos, me di cuenta de que la moneda BitCoin también se ve muy bien: enlace

Aquí está mi concepto

WinUI-1

Basado en un par de bocetos de
WinUI VS ScaledWinUI XAML Card

1

2

3

4

5

6

7

8

@SavoySchuler Cambiar nombre para Hybrid + UI = HybrUI
UI para todas las plataformas. HybrUI en GitHub.

GRACIAS POR TUS IDEAS INCREÍBLES: ¡Los colores y el tema XML también pueden variar!

Creo que es posible que hayamos empujado un poco la encuesta al tener un logotipo preexistente, ya que muchos de estos diseños se refieren a un tema XML. ¡Esto está bien! Pero XML es también _sólo uno_ de los lenguajes de programación que puede utilizar. Lo mismo ocurre con la combinación de colores, ¡ no es necesario ceñirse al azul y al blanco!

Si puede pensar en ideas modernas y de moda que subviertan estos temas y / o colores, ¡le recomendamos que las comparta!

Dicho esto, cambiar el nombre de WinUI no es un objeto de este esfuerzo, pero si la idea de su logotipo depende de un cambio de nombre, no dude en enviarla de todos modos. Tenga en cuenta que es probable que los logotipos que incluyan el nombre "WinUI" reciban más atención de quienes tomarán las decisiones finales.

Todos ustedes son los mejores. ¡Este resultado es increíble! 🏆

winui_funky

@IUsername - ¡¡Qué tiempo de @mdtauk y @embender también tenían algunos esquemas de color experimentales arriba.

Vi el uso de las imágenes de cubo y corchetes como XAML en lugar de XML de manera más amplia. Pero sí, WinUI es más que XAML, por lo que ir más allá de la iconografía XAML puede ser mejor.

Intenté centrarme en el aspecto de libro / biblioteca y el aspecto de XAML (como en este momento, XAML es el único marco de interfaz de usuario que usa WinUI, con WPF y GDI incorporando XAML en sus marcos)

Aquí están mis ideas turquesas de hoy, ampliadas 3x desde 64px. ¡DIVERTIDA!
WinUI_3x

Honestamente, no veo nada malo en ceñirme al esquema de color azul y gris. El azul y el violeta (especialmente el azul) parecen ser los más asociados con Windows, por lo que no veo ningún problema en mantener azul el logotipo de WinUI. (A menos que "Windows" y "Win" se eliminen del nombre).

Otra opinión: las interfaces de Fluent Design se centran en gran medida en un solo color de acento, ya sea el color de la aplicación o el color de acento del usuario. La mayoría de los colores en una aplicación Fluent usan solo neutrales y variaciones del color de acento. La paleta de colores de WinUI debe reflejar esto al ceñirse a un solo color de acento, más neutros como negro, blanco y gris.

Aquí hay una idea emparejada al mínimo.
idea 11

Fabric Icons
Microsoft parece ir en una nueva dirección con sus íconos. Los íconos de Office rediseñados y los íconos de tela más nuevos (como vi que alguien los llamó aquí) comparten muchos elementos que los ayudan a ser parte de un lenguaje de diseño cohesivo. Noté que muchos de ellos incorporan profundidad, tienen colores vibrantes, representan de manera abstracta su servicio y están construidos con lo que yo llamo bloques. Toma el ícono de Excel. Los bloques son de color verde vibrante (con un degradado casi pixelado) y representan de manera abstracta las celdas en una hoja de cálculo. Su profundidad es con el cuadrado que contiene la "E" proyectando una sombra sobre el rectángulo debajo de él. Me aseguré de incorporar estos elementos en mis diseños.

Quería desviarme de la estructura de los iconos de Office que describí en el ejemplo anterior. Como WinUI no es un servicio de Office, tener un cuadrado con texto flotando sobre un panel rectangular no fue una dirección que elegí para mis diseños. En su lugar, decidí usar algunos de los elementos que mencioné anteriormente, lo que permite mucho espacio para la creatividad y, al mismo tiempo, clasifica el ícono como un producto de Microsoft.

Para los colores de mi diseño, quería incorporar el aspecto de degradado de color sólido (que se muestra en muchos de los iconos de Office / Fabric). Debido a que no soy un experto en cómo obtener una combinación de colores que funcionen bien juntos, solo usé los colores del ícono de Outlook. Funcionó porque quería que los diseños fueran azules (como el original). Realmente solo quería transmitir la idea general y esos tonos funcionaron.

En muchos de mis diseños utilicé bloques para representar de manera abstracta una interfaz de usuario. Para lograr esto en algunos de mis diseños, utilicé una cuadrícula que no está definida y se adapta a cualquier diseño que se pueda diseñar utilizando los componentes de WinUI. Esto se sintió como una de las mejores formas de representar la biblioteca de componentes y las interfaces que se pueden construir con ella.

Usé la profundidad mostrada con sombra en muchos de mis diseños para. El efecto de profundidad debe refinarse en algunos de ellos, pero como dije antes, estos deberían transmitir la idea general.

Icons 2 Layout

Icons 1 Layout

Y aquí están algunos de mis bocetos iniciales si alguno de ustedes tiene curiosidad:

321
123

4 Logos

Tengo cuatro diseños que cada uno tiene múltiples iteraciones que se muestran arriba. Entraré en un poco más de detalle con cada uno de los que se muestran en la imagen.

  1. Una versión modernizada del logo original. Me gusta mucho la metáfora del libro y la biblioteca del original. La portada podría interpretarse como una interfaz de usuario abstracta. Entonces contiene múltiples metáforas, lo cual es genial. El texto tiene un estilo similar al nuevo icono de Terminal. El marcador muestra la profundidad que era importante para mí porque es un atributo principal de los íconos de Fabric y Fluent Design.

  2. Tomando el nombre de WindowsUI algo literalmente, este diseño muestra a un usuario por encima de una interfaz de estilo Windows.

  3. La navegación vertical es una pieza importante de la interfaz de usuario de Windows, que se muestra en muchas aplicaciones y sitios. Este diseño muestra una versión simplificada en un estilo similar al logo de Windows Terminal (tanto en la forma como en la forma en que ambos enfatizan un elemento importante de la interfaz. Para el icono de Terminal, son las pestañas en lugar de la navegación vertical). Los colores probablemente deberían mezclarse un poco para que el texto sea más legible. Pensé que esto encajaba bastante bien con el lenguaje de diseño de Windows.

  4. Intenté mostrar una abstracción extrema de las IU (y los componentes que las componen) con las diferentes iteraciones de este diseño. Son bastante simples pero creo que se ven geniales.

@NoahFeller - ¡Realmente estoy investigando el ícono 1! Me gusta mantener la metáfora del libro, pero no estoy seguro de entender la cuadrícula de la portada del libro. Creo que la cuadrícula de color azul agrega un poco de ruido al ícono, lo que dificulta su análisis desde la distancia. ¿Cómo se vería con una "portada" más simple?

@stmoy Ese también es uno de mis favoritos. La idea detrás de la cuadrícula fue mi forma de representar una interfaz de usuario de una manera muy simplificada y abstracta. También estaba pensando que representa el marco que es WinUI. Sin embargo, estoy de acuerdo con tu punto. Tal vez los tonos de color más similares ayudarían a que parezca menos ruidoso. Hice todo lo posible para implementar bloques para que coincidieran con el estilo de otros íconos de tela (su teléfono, terminal, íconos de oficina). Tengo una versión del icono en la parte inferior izquierda de mi primera imagen que no tiene la cuadrícula. Probaré algunas variantes diferentes porque no me encanta el aspecto de esa. Se podrían mejorar los colores y el diseño de los rectángulos. También estoy considerando ampliar un poco el marcador. ¡Gracias por la respuesta!

@itsmichaelwest , ¿qué representa el cubo en tu diseño? Para mí, se parece más a un símbolo de espacio en 3D, AR, que a un marco de interfaz de usuario basado en marcado

@itsmichaelwest , ¿qué representa el cubo en tu diseño? Para mí, se parece más a un símbolo de espacio en 3D, AR, que a un marco de interfaz de usuario basado en marcado

@danzil , no estoy seguro, pero ¿quizás es el cubo de Fluent el que representa material?

image

@stmoy @NoahFeller Me inspiré para intentar combinar algunos de esos elementos que

Idea 12

@stevenbrix AFAIK el equipo de

image

image

¡Espero no llegar demasiado tarde a la fiesta!

Aquí hay una contribución de mi lado.

WinUI_logo

Estos son mis pensamientos detrás de esto

  • WinUI es principalmente para Windows, por lo que el logotipo se deriva del logotipo de Windows.
  • Dado que la interfaz de usuario permanece a la vanguardia interactuando con el usuario, aquí el componente azul representa la interfaz de usuario tal como está frente a los otros componentes (grises) del logotipo.
  • Se agregó transparencia y sombra al componente azul para representar Fluent Design.
  • Redondeé un poco las esquinas para que quede un poco más pulido.

¿Qué más se le puede hacer?

  • el símbolo> se puede agregar al componente azul para enfatizar WinUI

Espero que te guste.

Las sugerencias son bienvenidas.

@ratishphilip Es una idea similar a una con la que estaba dibujando, pero no pude hacer que funcionara bien en tamaños pequeños cuando se desarrolló.

image

@mdtauk , tienes razón. En tamaños realmente pequeños, la transparencia, las sombras no funcionarán.

Aquí hay otro: concepto similar al de mi presentación anterior, pero inspirado en la invitación del 2 de octubre de Microsoft. :)

WinUI_logo2

Si gira el logotipo en el sentido contrario a las agujas del reloj 45 grados, puede ver el elemento> en el logotipo.

@itsmichaelwest , ¿qué representa el cubo en tu diseño? Para mí, se parece más a un símbolo de espacio en 3D, AR, que a un marco de interfaz de usuario basado en marcado

@danzil El cubo es una interpretación fluida del cubo de vidrio / brillante que se usó originalmente en el logotipo de XAML:

XAML file icon

Pensé que sería bueno que el logotipo de WinUI representara de alguna manera lo que proporciona: un conjunto de controles y estilos XAML.

No estoy muy contento con esto, pero si alguien está inspirado para hacer algo con él, ¡me encantaría verlo!

image

¿Se mantendrán sincronizados estos logotipos? ¿Y deberían todos compartir el nombre de WinUI, si es que debe abarcar todo la interfaz de usuario de Windows y XAML?

image

@mdtauk Sí, nuestra ambición es realizar una polinización cruzada de todos nuestros íconos con imágenes del nuevo logotipo. 😄

Actualización de la línea de tiempo: ¡Anunciamos los 5 mejores la próxima semana!

Querida comunidad, ¡tus ideas son increíbles! Cada vez que anticipo que subirás el listón, lo subirás más alto. Estamos muy emocionados de trabajar con todos ustedes en un proyecto como este. 😊

Nuestro objetivo es a principios de la próxima semana telegrafiar nuestras 5 mejores selecciones hasta el momento para que todos puedan tener la oportunidad de darles los últimos giros antes de que lo reduzcamos a uno el 9 de septiembre .

¡Hasta entonces, continuaremos uniéndonos a ustedes para intercambiar ideas y crear!

Idea 14

Una familia unificada de iconos: todos se basan en la cuadrícula de 16 píxeles, por lo que a medida que aumenta la escala, los detalles pueden volverse más sutiles, como he demostrado en ideas de logotipos anteriores que publiqué.

image

Aqui hay otro

WinUILogo

Concepto detrás de esto

  • WinUI se compone de código + XAML. El código está representado por llaves y el XAML está representado por>.
  • También representa un cuadrado con esquinas redondeadas que denota una ventana con esquinas redondeadas.

Otra versión de esto enfatizando el XAML

WinUILogo_a

Untitled-9
Rápidamente quise mostrar cómo uno de mis diseños podría adaptarse a los íconos de WinUI que acompañan al logo principal. Mi objetivo con el diseño 1 era modernizar el icono existente en el estilo Fabric / Fluent. Apuntaba a una apariencia fresca y nueva, pero familiar. Se usó la misma estrategia en los íconos que lo acompañan. Obviamente hice algunas modificaciones, pero hice todo lo posible para dejar intacta la estructura básica de cada uno de los íconos de WinUI mientras usaba el enfoque de modernización. De esa manera, si se implementan estos íconos, los usuarios aún comprenderán lo que representan y su apariencia compartida los unirá como parte de un solo servicio. Compartir elementos más generales con otros iconos nuevos muestra que representan un producto de Microsoft. Debido a que algunas partes de los íconos se hicieron más gruesas (letras y otros detalles), en realidad se escalan bastante bien.

Aquí hay una versión improvisada de mi presentación anterior.

WinUILogo2

Mi opinión sobre el logo

Una simple modernización del logotipo actual, siento que algunos de los conceptos anteriores, aunque se ven bien, se desvían demasiado de la idea del icono de WinUI. Aunque el icono podría ser algo así como una caja, un portátil lo resume mucho mejor.

El diseño es relativamente simple y está hecho teniendo en cuenta la escala, con esquinas redondeadas y gradientes sutiles. Algunos elementos de otras herramientas de Microsoft dev (relacionadas) están aquí, como < y > desde el icono de Terminal.

image

Detalle (64px + versión):

image

image

Logotipo con la marca denominativa _WinUI_

image

Tomé una idea anterior, cambié los colores y agregué ejemplos del kit de herramientas y los logotipos de la galería.
Idea 12-family

Aquí hay otra versión de mi logotipo anterior.

WinUILogo3

Otro concepto

WinUILogo4

Improvisando el logo anterior

WinUILogo5

¡Me gusta mucho ese ratishphilip!

Nunca estuve feliz con el hecho de que el símbolo, > , parece una "etiqueta de cierre". ES DECIR. me molesta que el símbolo aparezca en el código donde están las cosas ...

</finished> or </ended> (or </dead>, heaven forbid).

Pero su último ícono (y otros similares) están estilizados para desviar el enfoque de la barra.

Me preguntaba si podrías estilizarlo un poco más ... ¡tal vez podrías poner un punto redondo en la parte inferior de la barra para que se parezca un poco más a un signo de exclamación!

Los signos de exclamación son relevantes y aparecen en los comentarios XAML, como en ...

<!-- WinUI is awesome -->

Solo para ilustrar la escala de mis ideas de logotipos anteriores, aquí están los íconos de 16px y 128px: puede ver los cambios en las proporciones, el aumento en los detalles

Idea 12 - Scale

_I también ajustó la elevación de la parte I de los iconos, así que tendían sombra en la PART_ U

Improvisando el logo anterior

WinUILogo5

@ratishphilip Espero que no te intentar modificar tu idea ...

ratishphilip idea refined
_Editar: restauró los símbolos de llaves alternas del diseño original_

@ratishphilip Espero que no te intentar modificar tu idea ...

No hay problema :)

@ratishphilip Espero que no te intentar modificar tu idea ...

No hay problema :)

@ratishphilip Gracias. ¿Cómo ve que el logotipo se expande para XAML Controls / WinUI Gallery y Windows Community / WinUI Toolkit?

@mdtauk Este es mi concepto para la galería, biblioteca y kit de herramientas de WinUI

WinUILogo6

@mdtauk Este es mi concepto para la galería, biblioteca y kit de herramientas de WinUI

WinUILogo6

@ratishphilip Gracias, y aquí están mis opiniones
ratishphilip idea refined

@mdtauk

Si bien parece interesante, parece demasiado ocupado con demasiados elementos y sombras superpuestos. Solo mis $ 0.02

@mdtauk

Si bien parece interesante, parece demasiado ocupado con demasiados elementos y sombras superpuestos. Solo mis $ 0.02

Personalmente estoy de acuerdo, pero solo estaba tomando la idea tal como se presentó y agregando los detalles

Aquí hay algunos conceptos más. La caja de herramientas de WinUI es bastante tosca ...
WinUI Collection Fabric + WinAPI
Estos conceptos se basan en el icono de herramientas de desarrollo.
WinUI DevTools Fabric

Aqui hay otro

WinUILogo7

Otro intento

WinUILogo8

Aqui hay otro

WinUILogo7

Estos parecen un mal patrón de muaré, la sombra es un poco demasiado fuerte y las rayas no parecen representar bien la elevación.

Otro intento

WinUILogo8

Estos son más prolijos, pero el logotipo de la biblioteca y los logotipos de la galería son muy similares, y la caja de herramientas no parece encajar en la cuadrícula cuadrada, por lo que no es útil con un tamaño de 16 x 16 píxeles.

Actualización de la línea de tiempo: ¡Anunciamos los 5 mejores la próxima semana!

Querida comunidad, ¡tus ideas son increíbles! Cada vez que anticipo que subirás el listón, lo subirás más alto. Estamos muy emocionados de trabajar con todos ustedes en un proyecto como este. 😊

Nuestro objetivo es a principios de la próxima semana telegrafiar nuestras 5 mejores selecciones hasta el momento para que todos puedan tener la oportunidad de darles los últimos giros antes de que lo reduzcamos a uno el 9 de septiembre .

¡Hasta entonces, continuaremos uniéndonos a ustedes para intercambiar ideas y crear!

¿Alguna idea de qué día planea reducir algunas de estas ideas?

Otro derivado del logo de Microsoft Word

WinUILogo9

Actualización de la línea de tiempo: ¡Anunciamos los 5 mejores la próxima semana!
Querida comunidad, ¡tus ideas son increíbles! Cada vez que anticipo que subirás el listón, lo subirás más alto. Estamos muy emocionados de trabajar con todos ustedes en un proyecto como este. 😊
Nuestro objetivo es a principios de la próxima semana telegrafiar nuestras 5 mejores selecciones hasta el momento para que todos puedan tener la oportunidad de darles los últimos giros antes de que lo reduzcamos a uno el 9 de septiembre.
¡Hasta entonces, continuaremos uniéndonos a ustedes para intercambiar ideas y crear!

¿Alguna idea de qué día planea reducir algunas de estas ideas?

Actualización de la línea de tiempo: ¡Anunciamos los 5 mejores la próxima semana!
Querida comunidad, ¡tus ideas son increíbles! Cada vez que anticipo que subirás el listón, lo subirás más alto. Estamos muy emocionados de trabajar con todos ustedes en un proyecto como este. 😊
Nuestro objetivo es a principios de la próxima semana telegrafiar nuestras 5 mejores selecciones hasta el momento para que todos puedan tener la oportunidad de darles los últimos giros antes de reducirlo a uno el 9 de septiembre.
¡Hasta entonces, continuaremos uniéndonos a ustedes para intercambiar ideas y crear!

¿Alguna idea de qué día planea reducir algunas de estas ideas?

@mdtauk Me @ryandemopoulos esta tarde (3 de septiembre) y tendremos nuestros cinco primeros en ese momento o un período de tiempo más específico con el que puedo informar. 😄

@SavoySchuler Hola Savoy, ¡gracias por la actualización! ¡Es increíble ver a la comunidad tan activa en esto :)!

Realmente me gustan muchos conceptos, especialmente aquellos en los que la Galería, la Biblioteca y el Conjunto de herramientas tienen una apariencia similar. Incluso podemos extender esto para alinear las IU de la aplicación Community Toolkit y Gallery para tener un mensaje uniforme para los nuevos desarrolladores de UWP.

Me preguntaba si alguien del equipo de diseño también está mirando las presentaciones. El sombreado de color (para accesibilidad) y la escalabilidad son cosas que son realmente importantes y los diseñadores tienden a tener mucha más experiencia en estas cosas que nosotros, los desarrolladores :).

WinUI wordmarks

Aquí hay algunas ideas de Wordmark y convenciones de nomenclatura. WinUI _________ para que todo parezca que pertenece a una familia integral.

WinUI naming

Cualquier _flavours_ de WinUI debe tener una convención de nomenclatura igualmente simple, por lo que WinUI _for_ _____

@SavoySchuler Hola Savoy, ¡gracias por la actualización! ¡Es increíble ver a la comunidad tan activa en esto :)!

Realmente me gustan muchos conceptos, especialmente aquellos en los que la Galería, la Biblioteca y el Conjunto de herramientas tienen una apariencia similar. Incluso podemos extender esto para alinear las IU de la aplicación Community Toolkit y Gallery para tener un mensaje uniforme para los nuevos desarrolladores de UWP.

Me preguntaba si alguien del equipo de diseño también está mirando las presentaciones. El sombreado de color (para accesibilidad) y la escalabilidad son cosas que son realmente importantes y los diseñadores tienden a tener mucha más experiencia en estas cosas que nosotros, los desarrolladores :).

¡Gran pregunta, @ niels9001! Contamos con expertos en diseño y accesibilidad en nuestro equipo, así como con una verificación de cumplimiento global requerida, todo lo cual garantizará un logotipo accesible y apropiado para todos. 😊 ¡Estoy esperando hasta que tengamos a nuestros mejores candidatos seleccionados antes de aplicar este proceso, ya que de lo contrario crearía una escucha indebida de las 121 presentaciones increíbles y únicas que hemos visto hasta ahora!

No creo que ninguno de nosotros esperara que un solo diseño se tomara como está, por supuesto, todos sirven como una especie de tablero de estado de ánimo, que los expertos en diseño de Microsoft tomarán, moldearán y producirán un diseño / marco finalizado que los futuros logotipos e iconos se pueden basar en.

El hecho de que aquellos de nosotros que hemos contribuido, nos hayamos influenciado unos a otros, con suerte significará un diseño final, exhibirá partes reconocibles de muchas ideas 🙂

No creo que ninguno de nosotros esperara que un solo diseño se tomara como está, por supuesto, todos sirven como una especie de tablero de estado de ánimo, que los expertos en diseño de Microsoft tomarán, moldearán y producirán un diseño / marco finalizado que los futuros logotipos e iconos se pueden basar en.

¡Gran llamada, @mdtauk! Eso es correcto: podemos modificar la selección final en función de los comentarios de los recursos anteriores, pero también me encantaría mostrar el trabajo original de un miembro de la comunidad, por lo que tendremos que ver qué nos depara el futuro para nuestra selección final. .

El hecho de que aquellos de nosotros que hemos contribuido, nos hayamos influenciado unos a otros, con suerte significará un diseño final, exhibirá partes reconocibles de muchas ideas 🙂

En cuanto a esto, ¡ciertamente estaré alentando variaciones y tomas alternativas en el top 5 después de que las publiquemos! 🙂

@SavoySchuler ¿

@SavoySchuler ¿

@mdtauk ¡ Otra gran pregunta! He estado encuestando internamente a 86 personas durante las últimas semanas en una variedad de medios sobre nuestras (ahora) 121 presentaciones. Debido al volumen, no podré ofrecer comentarios completos, pero puedo sintetizar algunas notas personales sobre los 5 últimos y animar a las partes particularmente interesadas a que hagan lo mismo. He dudado en proporcionar comentarios durante esta ronda abierta, ya que soy cauteloso para crear limitaciones que inhiban la creatividad de este hilo, pero también entiendo que quiero medir su dirección, he sintetizado algunos comentarios generales a continuación:

  • Los diseños de soportes angulares + cubo / hexágono son los preferidos casi universalmente. Estilísticamente, estos diseños son simples, únicos, reconocibles en todo el espectro de logotipos y bien escalados en varios tamaños. El consenso general que he observado es que los corchetes angulares (aunque controvertidos para algunos) hablan de nuestra historia e indican un producto arraigado en el software, mientras que el cubo / hexágono rinde homenaje al ecosistema de Fluent Design System y transmite de manera abstracta cosas en la línea de color, profundidad, iluminación, material, etc.
  • El libro clásico de la biblioteca, la "ventana de aplicación" abstracta de estilo Office y los diseños circulares de .NET están relativamente empatados como finalistas preliminares. Creo que esto se debe a la similitud, los precedentes y la familiaridad con otros logotipos de productos del ecosistema de desarrolladores de Windows. También tienden a ser simples, nítidos y claros.
  • A la inversa de la primera viñeta, los logotipos que son estilísticamente complejos con varios tonos y componentes con bandas invocan preocupación con respecto a la escala para tamaños pequeños sin parecer ocupados.

Y comentarios sobre cualquiera que se quede corto.

En cuanto a esto, no dude en enviarme un mensaje de texto sobre cualquier envío que le interese particularmente y puedo ver qué puedo ofrecerle. 🙂

Espero ansiosamente ver los 5 que son los favoritos @SavoySchuler , y ojalá algunos comentarios sobre esos 5 que ofrezcan alguna dirección en cuanto a qué cambios se buscarían 💙

@SavoySchuler , esperando ansiosamente ver el top 5.

Cualquier comentario es siempre bienvenido. Como ya mencionó @mdtauk , estos comentarios seguramente nos ayudarían a avanzar en la dirección correcta. Con suerte, el esfuerzo colectivo de todos nosotros dará como resultado la obtención del mejor logotipo para WinUI.

controls-1x
fluentdesign-app-header

73c6c980871835 5cee218391221
788b8080871835 5cee2183914f2
Quería agregar que pude ver algunos diseños en el sitio web de Fluent Design siendo adaptados / ajustados para que funcionen como el logotipo de WinUI (por ejemplo, imagen superior). La misma historia con algunos de los iconos de Fluent (pensaba que la luz o el material podrían ser un buen punto de partida). Pensé que algunas de ustedes podrían encontrar interesantes las imágenes de abajo . Muestran la profundidad y los aspectos del nuevo estilo de diseño de iconos de Microsoft. Pueden servir de inspiración para que los finalistas piensen en sus diseños en un espacio 3D.

_Logotipo de capas y profundidad_
1_Y12LiOMu-9R9WZrvkh7HXQ

_Logo grid_
1_c0ea_S6S2-jY2IGzII_-Fw

_Depth and forward slash from Build 2019_
Build_2019_web_header_1900x300

_Fluent Imagary actual y actualizado_
1_8MRcLQULvZ_lAtfB_3UBFg

_Tal vez las primeras versiones de Office Icons_
image

Sé que es un poco tarde, pero el icono situado más a la derecha en la penúltima imagen (el que tiene el fondo negro y los iconos blancos) también funcionaría muy bien para el icono de WinUI. Es simple, limpio y funciona con colores (pude ver diferentes tonos de azul) o como está con el diseño del contorno.

Sé que es un poco tarde, pero el icono situado más a la derecha en la penúltima imagen (el que tiene el fondo negro y los iconos blancos) también funcionaría muy bien para el icono de WinUI. Es simple, limpio y funciona con colores (pude ver diferentes tonos de azul) o como está con el diseño del contorno.

Di algo similar desde el principio.

image

¡Maquetas de MERCH para divertirse! (De uno de mis diseños)
Folded-Sweatshirt-Mockup 1
Folded-Sweatshirt-Mockup
MockUp
Tshirt Mockup

Folded-Sweatshirt-Mockup 1 (2)

Además, esta sudadera se ve súper cómoda y ahora quiero una. Voy a tratar de abstenerme de comprar sudaderas ahora lol.

Comunidad fabulosa, ¡hemos llegado a los resultados de la primera ronda!

Interna y externamente, ¡la votación fue lo suficientemente clara como para que pudiéramos llegar al número 1 líder del grupo! Pero antes de que diga nada ...

¡Gracias!

En nombre de todo el equipo de WinUI, "¡gracias!" a todos los que colaboraron y contribuyeron aquí y en nuestras redes sociales. Por los números que teníamos ...

  • 121 presentaciones
  • 30 colaboradores de la edición
  • 86 miembros del equipo encuestados

¡Este fue un espectáculo de fuerza que nunca esperábamos! ¡Eres IMPRESIONANTE!

¡El nuevo logotipo preliminar de WinUI presentado por @itsmichaelwest!

Este elegante diseño sigue siendo la presentación principal en el hilo del problema Y fue elegido casi por unanimidad entre todos los miembros del equipo encuestados. Hay mucho que amar de este logo para detallarlo aquí. Estilo, elegancia, escalabilidad, capacidad temática, todo es genial. Gracias @itsmichaelwest por crear este logotipo de dinamita.

winui logo submission

¡Increíbles subcampeones!

Para proporcionar algo de inspiración para hacer riffs en el diseño de @itsmichaelwest , aquí están nuestros otros favoritos ...

  1. por @mdtauk

winui logo submission

  1. también por @mdtauk

winui logo submission

  1. por @ niels9001

winui logo submission

  1. por @NoahFeller

winui logo submission

  1. por @ratishphilip

winui logo submission

Y una mención de honor a @IUsername por estas presentaciones coloridas y originales:

winui logo submission

¡Felicidades de nuevo y gracias a todos!

¿A dónde vamos desde aquí?

¡Nos encantaría ver algunos riffs y variaciones en este diseño! Debido a Microsoft Ignite, nuestra fecha límite se ha movido hasta las 8 am PST del viernes 6 de septiembre, por lo que aceptaremos presentaciones variantes hasta la medianoche PST del jueves 5 de septiembre.

Para inspirarnos, estas son variaciones del logo de

1. ¿Soportes?

Hemos explorado la idea de expandir WinUI más allá del lenguaje de rebajas y podemos hacerlo en el futuro, lo que significaría ir más allá de esta sintaxis "<>". ¿Crees que el cubo podría ser lo suficientemente fuerte como para sostenerse por sí solo? Si es así, ¿alguien tiene ideas que puedan ayudarlo?

2. ¿Texto adentro?

Para Microsoft Ignite, haremos pegatinas hexagonales. Este diseño encaja perfectamente en esa forma, pero necesitaremos mover el texto "WinUI" en el cubo. ¿Alguien tiene ideas sobre cómo podríamos hacer que esa variante se vea genial?

3. ¿Colores?

¿Alguien tiene propuestas de colores alternativos? Estamos contentos con el tema azul, pero tampoco estamos particularmente casados ​​con él. ¡Estamos abiertos a explorar propuestas alternativas!

4. ¿Independiente o + texto?

¿Necesitamos el texto "WinUI" _como parte_ del logotipo o el diseño del cubo es lo suficientemente fuerte como para sostenerse por sí solo? ¿Con el <>? ¿Sin?

Si el Cubo va a actuar como el símbolo general, deberá recibir un tratamiento visual que lo hará único.

En 16 x 16 no hay mucho espacio para nada más que el cubo, por lo que elementos como el Kit de herramientas y la Galería deberán ser inteligentes para incluir el cubo y más en los tamaños más pequeños.

¿Este logotipo de WinUI también se convierte en el nuevo logotipo de XAML? Dado que XAML usa el cubo entre corchetes, ¿qué hace que esto sea más que solo XAML?

Aquí están los colores de la marca corporativa de Microsoft
image

Combinaciones de colores aprobadas
image

Colores universales de Windows
image

¡Felicidades @itsmichaelwest!

Filled Cube Idea

WinUILogo10

WinUILogo11

Aquí hay otro concepto basado en el cubo y los paréntesis angulares ...

image
Concepto aproximado basado en @ratishphilip

image
image

Debemos asegurarnos de no confundirnos con el logotipo de Unity ...

image

@mdtauk ¡No pensé en eso!
Honestamente, creo que el ángulo del cubo es lo suficientemente diferente, pero de todos modos parece que ya hemos elegido las 5 mejores ideas.

Algunas ideas más que tuve.
image

Inner Cube idea

Fluent 2019 Cube

Asset 21winui_cube4

WinUILogo11_2

Woah 😮¡Estoy tan emocionado de que el equipo amara mi logo!

Actualizaciones de logotipos

He estado buscando versiones alternativas del cubo que se inspiran en los otros diseños de este hilo. Me gustó particularmente el uso de @mdtauk de los colores del sitio web de Fluent , por lo que he desarrollado una versión del cubo que usa estos degradados (_ ¡esto no es definitivo! _). También dejé caer los corchetes por ahora, tal vez este "cubo fluido" pueda sostenerse por sí solo:

WinUI_LogoExporation_V2_GitHub

Pegatinas

Aquí hay un par de ideas para pegatinas. El primero encoge el cubo y agrega el texto de WinUI, así como un enlace al repositorio. El segundo agrega una superposición en el cubo, con el texto de WinUI. No estoy seguro de cuál funciona mejor y si se necesita un enlace al repositorio.

WinUI_StickerExploration_V2_GitHub

La segunda pegatina también podría funcionar como un logotipo de redes sociales.

Seguiremos desarrollando esto. ¡Gracias a todos los que están proporcionando inspiración en este hilo! 😃

Inner Cube idea

Inner Cube Toolkit idea

Versión del kit de herramientas de este logotipo

image
Algunos ángulos diferentes para un concepto basado en uno de los íconos de

image

Fluent Inner Cube Dark

Fluent Inner Cube Light

Genial .. Me gusta esta dirección.

Solo para mantener el sentido ... ¿qué creemos que representa 'el cubo'? Sería bueno tener un poco de razón fundamental.

Me gusta el enlace a Fluent Design

El cubo no era mi preferencia inicial, porque es difícil poseer ese símbolo como logotipo o marca. Con los corchetes, lo vincula intrínsecamente a XAML, y quién sabe qué otros paradigmas de IU pueden surgir en el futuro.

Entonces ... he estado tratando el cubo como un núcleo, por lo tanto, un cubo dentro de un cubo, como una parte del núcleo.

En el logotipo XAML original, creo que el cubo es un objeto, como en la codificación orientada a objetos, o un elemento XML / XAML.

Two Tone Cube Dark

Two Tone Cube Light

Untitled-3-01

Outlined Cube

¿Este logotipo de WinUI también se convierte en el nuevo logotipo de XAML? Dado que XAML usa el cubo entre corchetes, ¿qué hace que esto sea más que solo XAML?

@mdtauk Si

@mdtauk La publicación de los colores de su marca es un excelente recurso en este hilo. ¡Gracias por ser un levantador pesado en este hilo!

WinUILogo11

Aquí hay otro concepto basado en el cubo y los paréntesis angulares ...

@ratishphilip - @ryandemopoulos , @stmoy y yo realmente nos gusta lo autónomo que es este diseño. @mdtauk , también un interesante cambio de colores. Estoy explorando algunas combinaciones de colores alternativos de esto en este momento. Si se me ocurre algo meritorio, lo publicaré.

Inner Cube idea

Inner Cube Toolkit idea

Versión de la galería agregada junto con las demás
Inner Cube Gallery

Aquí hay algunos logotipos de otros marcos, por lo que podemos intentar evitar hacer diseños similares.

Anglar JS
image

Xamarin
image

Mecanografiado
image

Nodo JS
image

Reaccionar
image

Aleteo
image

Iónico
image

HTML / CSS / JS
image

Diseño de materiales
image

IU rápida
image

Actualización de la ronda semifinal

Acabamos de terminar la reunión nuevamente para revisar todo lo que ha ocurrido desde la última vez agradable. Lo primero que discutimos: ¡Guau, todos ustedes son increíbles! ¡Y rápido!

En segundo lugar, tres diseños (además del original de @itsmichaelwest ) se destacaron para nosotros y tenemos algunas preguntas para cada uno ...

  1. > He estado buscando versiones alternativas del cubo que se inspiran en los otros diseños de este hilo. Me gustó particularmente el uso de @mdtauk de los colores del sitio web de Fluent , por lo que he desarrollado una versión del cubo que usa estos degradados (_ ¡esto no es definitivo! _). También dejé caer los corchetes por ahora, tal vez este "cubo fluido" pueda sostenerse por sí solo:
    >WinUI_LogoExporation_V2_GitHub

¡Nos gustó mucho lo que hiciste aquí! ¿Existe alguna posibilidad de que tenga una versión de alta fidelidad que pueda usar para mostrarnos cómo se ve con corchetes en el lateral? Estamos imaginando algo como esto:

WinUI Icon Simple Mock

  1. @mdtauk y @ratishphilip , ¡nos gusta la negrita naranja que ambos publicaron! Nos encantaría ver más variantes de color que creas que son increíbles. Me burlé de algunos esquemas de colores alternativos a continuación. La parte superior usa los colores de la marca Microsoft @mdtauk publicados arriba. El de abajo no sigue ninguna paleta de marca en particular, solo estaba explorando. ¿Alguien tiene alguna combinación de colores que le parezca "pop"? Tampoco estoy en contra de los gradientes, ¡mis habilidades aún no están allí!

WinUI Logo Alternate Colors 1

WinUI Logo Alternate Colors 2

  1. @mdtauk , ¡realmente nos gusta este que publicaste! ¿Existe alguna posibilidad de que pueda compartir versiones de esto que a.) No tienen texto y b.) Tienen fondos negros (con y sin texto)?

WinUI White Cube Logo

image
@SavoySchuler Me gusta mucho este que publicaste.

  1. @mdtauk , ¡realmente nos gusta este que publicaste! ¿Existe alguna posibilidad de que pueda compartir versiones de esto que a.) No tienen texto y b.) Tienen fondos negros (con y sin texto)?

🚨 Imágenes grandes entrantes 🚨
Export Fluent Inner Cube Dark
Export Fluent Inner Cube Light

Los tamaños incluyen 1024 x 1024 (con y sin texto) - 16 x 16 - 32 x 32 - 64 x 64 - 128 x 128 - 256 x 256 - 4096 x 4096

Versiones claras y oscuras

¡Me encanta el icono que acaba de publicar @mdtauk ! ¡Se ve increíble!

@SavoySchuler > ¿Alguien tiene alguna combinación de colores que le parezca "pop"?

Two Tone Cube Dark
Purple and Orange es una combinación clásica de colores complementarios. Pero tener dos colores en un solo cubo se vería un poco extraño

Two Tone Cube Dark - G + Y
Verde y amarillo

Two Tone Cube Light - B + P
Azul y rosa

image

@SavoySchuler > ¿Alguien tiene alguna combinación de colores que le parezca "pop"?

Two Tone Cube Dark
Purple and Orange es una combinación clásica de colores complementarios. Pero tener dos colores en un solo cubo se vería un poco extraño

Two Tone Cube Dark - G + Y
Verde y amarillo

Two Tone Cube Light - B + P
Azul y rosa

@mdtauk ¿Se

WinUI Logo Alternate Colors 2
WinUI Logo Alternate Colors

@itsmichaelwest Me acabo de dar cuenta de que me faltaba una imagen en la viñeta 1 anterior, ¡agregada ahora!

@SaboyaSchuler

Filled Cube - Purple

Azul> Rosa

Filled Cube - Teal

Verde azulado> Azul

Podrías hacer algo como esto, un esquema análogo a través del Cubo

¡Ese segundo con Teal> Blue es mi favorito hasta ahora!

Genial .. Me gusta esta dirección.

Solo para mantener el sentido ... ¿qué creemos que representa 'el cubo'? Sería bueno tener un poco de razón fundamental.

Me gusta el enlace a Fluent Design

¡Gran pregunta, @ niels9001! La gente ha ofrecido algunas tomas a lo largo de este hilo ahora masivo.

Para muchos, es un homenaje a los principios del sistema Fluent Designs que se muestran aquí (en forma de cubo):

Fluent Design System principles in visual metaphor

También es un homenaje al logotipo original de Xaml:

Original Xaml logo

Pero otros, como yo y @ pag3 , lo han descrito como un "bloque de construcción" y la plataforma WinUI y sus ofertas exactamente como eso: los bloques de construcción para la interfaz de usuario.

@SaboyaSchuler

Filled Cube - Purple

Azul> Rosa

Filled Cube - Teal

Verde azulado> Azul

Podrías hacer algo como esto, un esquema análogo a través del Cubo

¡También me encantan estos! ¡Excelentes elecciones, @mdtauk!

Untitled-1

Aquí hay un diseño que hice hace un tiempo para un proyecto diferente, pero no terminé necesitándolo. ¡He decidido enviarlo aquí! Funciona muy bien aquí porque muestra muchos de los principios del Fluent Design System:
Luz: el resplandor del interior del cubo.
Profundidad: es un cubo 3D con profundidad visible.
Material: tiene un aspecto acrílico genial.
Escala: cubos pequeños dentro de un cubo grande, tiene un tamaño que contrasta.

También creo que se ve muy bien y es algo único. Evita el problema con algunos diseños aquí por ser genéricos. Hay muchos logotipos de hexágonos / cubos, por lo que puede ser difícil ser diferente (creo que este diseño logra no ser genérico). Además, la parte de luz en el medio se puede usar para otros diseños y patrones complementarios. He aquí un ejemplo:

Untitled-2

¡Abierto a comentarios!

@NoahFeller ¡ Eso se ve increíble! ¿Tiene una versión más oscura para poner fondos más claros?

Gracias @yaichenbaum. (Comentaste justo antes de que yo publicara esta explicación jajaja)
Untitled-12t53
.
.
.
.
Untitled-61

Estoy bastante seguro de que he visto esta estructura de cuadrícula en algún lugar relacionada con Fluent Design. Sobre un fondo blanco, el diseño necesita una sombra directamente detrás de él o el color del cubo a negro. ¡Me aseguraré de experimentar un poco más!

Filled Cube - Yellow + Blue

Untitled-61

Estoy bastante seguro de que he visto esta estructura de cuadrícula en algún lugar relacionada con Fluent Design. Sobre un fondo blanco, el diseño necesita una sombra directamente detrás de él o el color del cubo a negro. ¡Me aseguraré de experimentar un poco más!

image

Filled Cube - T + P

Filled Cube - O + P

@ratishphilip - @ryandemopoulos , @stmoy y yo realmente nos gusta lo autónomo que es este diseño.

Gracias por la respuesta.

Aquí hay un logo más refinado.

WinUILogo12A

Aquí hay otra versión del logo anterior. Mi objetivo aquí es representar que una parte del cubo se ha cortado para mostrar el núcleo del cubo (tal como se muestra en los diagramas de la tierra)

WinUILogo12B

Aquí hay otra versión del logo anterior. Mi objetivo aquí es representar que una parte del cubo se ha cortado para mostrar el núcleo del cubo (tal como se muestra en los diagramas de la tierra)

WinUILogo12B

Lo primero que veo es un símbolo de reproducción

Aquí hay otro basado en el cubo Fluent de

WinUILogo12C

Aquí está el logo anterior sin el corte.
WinUILogo12D

Otra versión del cubo de
Light Cube

Otra versión del cubo de
Light Cube

¿No crees que esto hace que los corchetes angulares se desequilibren un poco?

Otra versión del cubo de
Light Cube

¿No crees que esto hace que los corchetes angulares se desequilibren un poco?

Sí, claro, pero se ajusta a las caras del cubo. Solo quería probar el estilo de colorear.

¿Y qué es una pequeña asimetría entre amigos?

No es mi trabajo más orgulloso, pero intenté agregar los corchetes a la idea de @NoahFeller . Si se hace correctamente, tal vez, pero como me preocupa, se ve ocupado / sobrediseñado.

WinUI Semi-Transparent Logo

Veo lo que estabas buscando @SavoySchuler. Siento que el ícono podría no necesitar los corchetes y es lo suficientemente poderoso como para sostenerse por sí solo. Definitivamente iteraré en el diseño (simplificaré y / o modificaré) y cargaré algunas versiones diferentes, algunas con y otras sin corchetes. Siento que el ícono no se ve tan bien girado, aunque eso se puede arreglar 🙂. Al cargar, solo estaba tratando de evaluar si a la gente le gustaría o no un diseño similar a este. Los comentarios parecen haber sido buenos, así que seguiré trabajando. Gracias por las sugerencias.

Otra versión del cubo de
Light Cube

¡Me encantan los dos tonos en el soporte!

4096
Fluent Inner Cube 4096

1024
Fluent Inner Cube 1024

256
Fluent Inner Cube 256

128
Fluent Inner Cube 128

64
Fluent Inner Cube 64

32
Fluent Inner Cube 32

dieciséis
Fluent Inner Cube 16

4096
Fluent Inner Cube 4096

1024
Fluent Inner Cube 1024

256
Fluent Inner Cube 256

128
Fluent Inner Cube 128

64
Fluent Inner Cube 64

32
Fluent Inner Cube 32

dieciséis
Fluent Inner Cube 16

4096
Fluent Inner Cube 4096
Fluent Inner Cube 4096

1024
Fluent Inner Cube 1024
Fluent Inner Cube 1024

256
Fluent Inner Cube 256
Fluent Inner Cube 256

128
Fluent Inner Cube 128
Fluent Inner Cube 128

64
Fluent Inner Cube 64
Fluent Inner Cube 64

32
Fluent Inner Cube 32

dieciséis
Fluent Inner Cube 16

¡Nos gustó mucho lo que hiciste aquí! ¿Existe alguna posibilidad de que tenga una versión de alta fidelidad que pueda usar para mostrarnos cómo se ve con corchetes en el lateral? Estamos imaginando algo como esto:

WinUI Icon Simple Mock

@SavoySchuler ¡ aquí tienes! Perdón por la espera, ¡este hilo parece avanzar bastante rápido!

WinUI_LogoExporation_V3_GitHub

Export Inner Cube - Mono

Versión monocromática

@itsmichaelwest > ¡aquí tienes! Perdón por la espera, ¡este hilo parece avanzar bastante rápido!

Lo siento ... 😛

Aquí hay algunos, pero usando el tratamiento de color de Michael West ...

4096
Fluent Inner Cube 4096

1024
Fluent Inner Cube 1024

256
Fluent Inner Cube 256

128
Fluent Inner Cube 128

64
Fluent Inner Cube 64

32
Fluent Inner Cube 32

dieciséis
Fluent Inner Cube 16

1024 Cubo solamente
Fluent Inner Cube Only 1024

4096 Cubo solamente
Fluent Inner Cube Only 4096

Creo que he terminado con estas variaciones, a menos que @SavoySchuler @itsmichaelwest u otros quieran algo en particular de mí.

https://www.figma.com/file/KCQQ1wtMBnWxsXrmDOHmhB/WinUI-Logo-Share?node-id=0%3A1
_Aquí está el enlace al archivo Figma con algunos de mis logotipos en_

@mdtauk : muchas gracias por todos sus aportes y variaciones. Una pregunta rápida: muchos de los diseños son "cubo dentro de un cubo". ¿Qué pretende transmitir este cubo doble?

@itsmichaelwest sugirió originalmente usar el ícono XAML como base del logotipo, y su diseño fue elegido en la primera ronda de presentaciones.

Veo el cubo como un núcleo, una parte fundamental de la creación de aplicaciones de Windows, por lo que decidí ilustrar el concepto de núcleo haciendo que una parte del cubo se destaque. También jugué con tener un espacio "vacío", para mostrar que este es un espacio para construir.

Pero hacer que el diseño del cubo y el soporte sea algo "que se pueda poseer" y que sea distinto, entre las miles de otras iconografías basadas en cubos que existen, juega un papel importante.

image

Untitled-3

Versión oscura / clara. Todavía estoy trabajando un poco en el color azul. Como siempre, se agradecen los comentarios.

@yaichenbaum Quería ver cómo se vería una versión monocromática del cubo que publicaste, pero no soy un artista, así que literalmente me burlé de esto crudamente en Paint: :)

image

¿Es así como preveías que se vería una versión monocromática, o tienes otra idea en mente de cómo se vería una versión monocromática?

Me gustaría volver a dibujarlo por completo si está bajo consideración, pero aquí hay una edición rápida con mi pensamiento, Estos están solo en la escala de 16px, por lo que será necesario volver a dibujarlo por completo.

Bracket Inner

Untitled-4

Maqueta monocromática rápida (no del todo terminada) de mi diseño. Bastante fluido 😄.

Una dirección totalmente nueva que es realmente fluida y puede usar fácilmente diferentes colores para encajar en botines, pegatinas, etc. Este diseño indica bloques de construcción, así como uno oculto en el medio. Puedo mostrar en otros colores para fondos más claros si la gente está interesada.
image
Y también una versión en 3D, con y sin contorno.
image

@yaichenbaum Quería ver cómo se vería una versión monocromática del cubo que publicaste, pero no soy un artista, así que literalmente me burlé de esto crudamente en Paint: :)

image

¿Es así como preveías que se vería una versión monocromática, o tienes otra idea en mente de cómo se vería una versión monocromática?

@SavoySchuler ¿Está bien?

Un solo color
Fluent Inner Cube Mono Black
Fluent Inner Cube Mono

4096
Fluent Inner Cube 4096

1024
Fluent Inner Cube 1024

256
Fluent Inner Cube 256

128
Fluent Inner Cube 128

64
Fluent Inner Cube 64

32
Fluent Inner Cube 32

dieciséis
Fluent Inner Cube 16

PREGUNTA FINAL

@itsmichaelwest y @mdtauk, nuestras dos últimas elecciones se han reducido a una propuesta de cada uno de ustedes. ¡Acabamos de terminar casi dos horas de deliberación con varios miembros del equipo y no ha sido fácil! Tenemos una última pregunta para cada uno de ustedes antes de decidir ...

image

image

@michaelwest

Para su logotipo, existe cierta preocupación acerca de cómo los soportes 2d y los cubos 3D se unen. ¿Hay alguna alteración que pueda pensar en hacer que pueda ayudar a que estos componentes se presenten de manera más cohesiva? No estamos seguros de qué es exactamente lo que se necesita, si es el espaciado, los colores, etc., solo que se siente un poco desarticulado.

@mdtauk

Para su logotipo aquí, varias personas encuestadas respondieron que estaban confundidas al pensar que se suponía que los corchetes dentro del cubo eran letras como "I" y "J". Para decirlo de otra manera: existía la preocupación de que perdieran la sensación de los corchetes. Parecía mejorar en la actualización más reciente cuando los redujo un poco, pero no estamos seguros de si hay algo que se pueda hacer para que se sientan más como corchetes.

También nos encantaría ver líneas de corchetes rellenas y huecas en las tomas monocromáticas si es relevante:

image
image

Ambos

Para cualquier envío final, nos encantaría verlos:

  • Versiones en color y monocromáticas sobre fondos en blanco y negro
  • En tamaños de 16x16px, 64x64px y alta resolución

Gracias

Sabemos que hemos pedido mucho. Cuando comenzamos todo este proceso, no sabíamos que tendríamos tantas opciones excelentes para deliberar y que la calidad de las presentaciones sería tan increíble.

Todos ustedes han elevado el listón tan alto que me parece que ahora estamos revisando cada pequeño píxel y curva. La razón por la que somos tan quisquillosos es porque todos nos han dado oro.

Si alguna de estas solicitudes finales es demasiado pedir, lo entendemos. Independientemente de cualquier esfuerzo continuo, les enviaremos a ustedes ya varios otros un merecido "¡gracias!" botín que lleva las contribuciones que ha hecho aquí.

Felicitaciones tanto a @mdtauk como a @itsmichaelwest.
Es posible que el problema que mencionaste con la gente que lo ve como una I y una J tenga que ver con el hecho de que usar dos colores para el corchete izquierdo hace que parezca un reflejo en la parte superior. Quizás usar el mismo color para todo el corchete solucionaría este problema de 'reflejo' y luego el otro corchete ya no se verá como una J.

@SaboyaSchuler

@michaelwest
Para su logotipo, existe cierta preocupación acerca de cómo los soportes 2d y los cubos 3D se unen. ¿Hay alguna alteración que pueda pensar en hacer que pueda ayudar a que estos componentes se presenten de manera más cohesiva? No estamos seguros de qué es exactamente lo que se necesita, si es el espaciado, los colores, etc., solo que se siente un poco desarticulado.

Tengo una sugerencia para esto, pero será Michael quien proponga una solución.
Fluent Cube 4096
El sombreado de los corchetes está en línea con el sombreado del cubo.

¡Felicidades chicos! Un poco de comentarios / ideas: Creo que en el diseño de @itsmichaelwest , los corchetes solo deben estar parcialmente redondeados en lugar de la forma de "píldora", que es más un estilo de Google. (Como lo que acaba de publicar en @mdtauk) También siento que la forma en que el corchete se ajusta al diseño de

@yaichenbaum El corchete que parecía una J era el más a la derecha (en el logo de @mdtauk ); algunos miembros del equipo sintieron que era demasiado J-ish. Personalmente, pensé que había mejorado un poco con la versión más reciente publicada, ya que se redujeron un poco. Sé que existe el deseo de mantenerlos lo suficientemente gruesos como para que pueda ver los corchetes en las versiones pequeñas.

De todos modos, no soy diseñador ni siquiera juego uno en la televisión. Podría haber muchas otras formas de hacer que se vean más entre corchetes; Dejaré eso en manos de @mdtauk.

Sin embargo, estos diseños son tan buenos. Estamos hablando de minucias en este punto.

Tengo la posibilidad de adelgazar las líneas a medida que se amplía el logotipo. También puedo ajustar las curvas para que sea más un borde puntiagudo, en el cubo y el soporte.

¿Los tres tonos de color obstaculizan la apariencia del soporte?

@mdtauk ¿y si cambia los corchetes a un degradado? De esa manera, aún tendría más de un color, pero se mezclarían mejor entre sí, dándole una forma más unificada.

... También siento que la forma en que el soporte envuelve el diseño de

Usé un degradado de diamante, en lugar de redondo, para insinuar la idea de que había un cubo de color dentro del cubo "acrílico" esmerilado.

@mdtauk ¿y si cambia los corchetes a un degradado? De esa manera, aún tendría más de un color, pero se mezclarían mejor entre sí, dándole una forma más unificada.

El problema con eso sería mantener la idea de que los corchetes están en la superficie del cubo, pero intentaré ajustarlo un poco más, enderezarlos y adelgazarlos un poco.

... También siento que la forma en que el soporte envuelve el diseño de

Usé un degradado de diamante, en lugar de redondo, para insinuar la idea de que había un cubo de color dentro del cubo "acrílico" esmerilado.

Ya veo, es demasiado indefinido para realmente decirle a la OMI, así que tal vez puedas modificarlo un poco. No tiene que hacerlo, solo se pregunta si podría mejorarse.

@mdtauk Para mí, me gustaron los diferentes colores / tonos en los corchetes. Si hay una manera de hacer que parezcan más entre paréntesis sin perder los diferentes colores, me encantaría ver eso. Pero supongo que vale la pena jugar con diferentes sombreados y menos colores para ver si eso también ayuda.

@mdtauk ¿y si cambia los corchetes a un degradado? De esa manera, aún tendría más de un color, pero se mezclarían mejor entre sí, dándole una forma más unificada.

También puede parecer genial que el cubo tenga un brillo más fuerte de cada color hasta el punto en que el cubo tenga más o menos esos tres colores y los corchetes podrían contrastar que el cubo sea blanco o negro. Simplemente lanzando ideas por ahí.

@mdtauk Para mí, me gustaron los diferentes colores / tonos en los corchetes. Si hay una manera de hacer que parezcan más entre paréntesis sin perder los diferentes colores, me encantaría ver eso. Pero supongo que vale la pena jugar con diferentes sombreados y menos colores para ver si eso también ayuda.

También me gustaron, es solo tener dos tonos diferentes los divide, también hace que la mitad inferior del corchete izquierdo tenga una altura similar a la derecha, dándole un aspecto como un bloque "abc" con una I y una J.

Esto podría ayudar a mejorarlo un poco, pero en mi opinión arruina el buen aspecto que tenía antes.
image

Creo que parte del problema con los soportes es que tienes una forma 3D con mucho color e iluminación detrás de ellos y son solo de un color sólido, por lo que no se entrelazan también. Parece un poco divertido con ambos diseños, pero es más prominente cuando los corchetes están en el cubo.

@mdtauk Para mí, me gustaron los diferentes colores / tonos en los corchetes. Si hay una manera de hacer que parezcan más entre paréntesis sin perder los diferentes colores, me encantaría ver eso. Pero supongo que vale la pena jugar con diferentes sombreados y menos colores para ver si eso también ayuda.

4096
Fluent Inner Cube 4096

Un solo color
Fluent Inner Cube Mono Black

@ryandemopoulos ¿

Felicitaciones @mdtauk y @itsmichaelwest.
¡Grandes diseños hasta ahora!

Creo que parte del problema con los soportes es que tienes una forma 3D con mucho color e iluminación detrás de ellos y son solo de un color sólido, por lo que no se entrelazan también. Parece un poco divertido con ambos diseños, pero es más prominente cuando los corchetes están en el cubo.

test

No estoy seguro de que funcione como inverso

@ryandemopoulos ¿

Solo soy una opinión, pero sí, me parece más entre paréntesis. Creo que los bordes más afilados ayudaron. Para la versión monocromática, los corchetes todavía se ven súper gruesos, ¿cómo se verían con los corchetes que se acaban de describir, algo así? (excepto usando su geometría más reciente)

image

No estoy seguro de que funcione como inverso

Si, tienes razón. Retiro esto ⬇. Gracias por probarlo.

También puede parecer genial que el cubo tenga un brillo más fuerte de cada color hasta el punto en que el cubo tenga más o menos esos tres colores y los corchetes podrían contrastar que el cubo sea blanco o negro. Simplemente lanzando ideas por ahí.

Mi opinión es que los corchetes deben conservar la misma forma que en el logotipo de XAML con un pequeño redondeo

XAML file icon

Aquí está mi sugerencia

WinUILogo12E

@ryandemopoulos ¿

Solo soy una opinión, pero sí, me parece más entre paréntesis. Creo que los bordes más afilados ayudaron. Para la versión monocromática, los corchetes todavía se ven súper gruesos, ¿cómo se verían con los corchetes que se acaban de describir, algo así? (excepto usando su geometría más reciente)

image

En los tamaños de 32px y 16px, los corchetes deberán rellenarse para que sean legibles, pero ¿cómo es esto para los tamaños más grandes?
Fluent Inner Cube Mono Black

Mi opinión es que los corchetes deben conservar la misma forma que en el logotipo de XAML con un pequeño redondeo

XAML file icon

Aquí está mi sugerencia

WinUILogo12E

@ratishphilip ¿El corchete izquierdo es verticalmente más pequeño o es el sombreado lo que causa una diferencia percibida?

@ryandemopoulos ¿

Solo soy una opinión, pero sí, me parece más entre paréntesis. Creo que los bordes más afilados ayudaron. Para la versión monocromática, los corchetes todavía se ven súper gruesos, ¿cómo se verían con los corchetes que se acaban de describir, algo así? (excepto usando su geometría más reciente)
image

En los tamaños de 32px y 16px, los corchetes deberán rellenarse para que sean legibles, pero ¿cómo es esto para los tamaños más grandes?
Fluent Inner Cube Mono Black

Etiquetando esta geometría para @stmoy.

@ryandemopoulos ¿

Solo soy una opinión, pero sí, me parece más entre paréntesis. Creo que los bordes más afilados ayudaron. Para la versión monocromática, los corchetes todavía se ven súper gruesos, ¿cómo se verían con los corchetes que se acaban de describir, algo así? (excepto usando su geometría más reciente)
image

En los tamaños de 32px y 16px, los corchetes deberán rellenarse para que sean legibles, pero ¿cómo es esto para los tamaños más grandes?
Fluent Inner Cube Mono Black

Para ser honesto, no estoy seguro de cuál me gusta más: relleno o esquema. Necesitaré mirar un poco más. :) Creo que ambos funcionan, incluso a mayor resolución. (y estoy de acuerdo en que a menor resolución, la única opción real es rellenar)

@ryandemopoulos @SavoySchuler @stmoy

4096
Fluent Inner Cube 4096
Fluent Inner Cube 4096

1024
Fluent Inner Cube 1024
Fluent Inner Cube 1024

256
Fluent Inner Cube 256
Fluent Inner Cube 256

128
Fluent Inner Cube 128
Fluent Inner Cube 128

64
Fluent Inner Cube 64
Fluent Inner Cube 64

32
Fluent Inner Cube 32
Fluent Inner Cube 32

dieciséis
Fluent Inner Cube 16
Fluent Inner Cube 16

Un solo color
Fluent Inner Cube Mono Black
Fluent Inner Cube Mono White

@ratishphilip ¿El corchete izquierdo es verticalmente más pequeño o es el sombreado lo que causa una diferencia percibida?

Ambos soportes son del mismo tamaño ...

Aquí hay otro con un soporte 3d.

WinUILogo12F

Aquí está el esquema

WinUILogo12_outline

Aquí hay otro con un soporte 3d.

WinUILogo12F

Esto definitivamente resuelve la extraña perspectiva que estaba viendo antes. ¡Bien hecho!

Aquí hay otro con un soporte 3d.
WinUILogo12F

Esto definitivamente resuelve la extraña perspectiva que estaba viendo antes. ¡Bien hecho!

El cubo no se gira limpiamente, hay líneas diagonales arriba y abajo

Aquí hay otro con un soporte 3d.

WinUILogo12F

Eso también soluciona el problema de que parece que tiene una I y una J.

El cubo no se gira limpiamente, hay líneas diagonales arriba y abajo

: D sí, una ligera rotación ... gracias por avisarme @mdtauk ... se puede arreglar fácilmente.

También estoy pensando en quitar la redondez de la esquina más interna (que toca el borde del cubo) y afilarla.

Fluent Inner Cube Mono 16
Fluent Inner Cube Mono 16

Fluent Inner Cube Mono 32
Fluent Inner Cube Mono 32

Fluent Inner Cube Mono 64
Fluent Inner Cube Mono 64

Fluent Inner Cube Mono 128
Fluent Inner Cube Mono 128

Fluent Inner Cube Mono 256
Fluent Inner Cube Mono 256

Fluent Inner Cube Mono 1024
Fluent Inner Cube Mono 1024

Fluent Inner Cube Mono 4096
Fluent Inner Cube Mono 4096

Aquí está el logo actualizado

WinUILogo13

WinUILogo13_outline

Hi Nada logo

WinUILogo13_HiRes

Este (o su contraparte oscura) es hermoso. Me gusta el degradado porque mezcla un elemento Fluent.
image
Tal vez lo anterior también debería dividirse en un cubo de 2 2 2, incorporando esto , ¡qué gran idea! Cambiaría los colores para resaltar un poco más tal vez.

Sin embargo, este me da una connotación de Apache Cordova :
image
Especialmente esos corchetes negros brillantes.

Especialmente esos corchetes negros brillantes.

@weitzhandler ¿Qué tal esto?

WinUILogo13_color

@SavoySchuler publicó los dos logotipos preliminares en Twitter, y el comentario principal que tomé de las respuestas es que no se siente muy parecido a Windows. Así que aquí está el mismo logotipo, pero en el color azul de Microsoft. Me pregunto si esto ayuda.

Fluent Inner Cube 16
Fluent Inner Cube 32
Fluent Inner Cube 64
Fluent Inner Cube 128
Fluent Inner Cube 256
Fluent Inner Cube 1024
Fluent Inner Cube 4096
Fluent Inner Cube Mono 16
Fluent Inner Cube Mono 32
Fluent Inner Cube Mono 64
Fluent Inner Cube Mono 128
Fluent Inner Cube Mono 256
Fluent Inner Cube Mono 1024
Fluent Inner Cube Mono 4096

Creo que los corchetes izquierdo y derecho deben verse idénticos entre sí en tamaño, ya que también tienen el mismo tamaño en la sintaxis XAML ( < > ) . Por lo tanto, hacer que aparezcan ópticamente como diferentes en tamaño me parece extraño (es decir, el corchete izquierdo parece más grande que el corchete derecho). Prefiero la forma en que @ratishphilip muestra esos corchetes en este momento.

@ Felix-Dev
Los corchetes de

Aunque no todos los logotipos deben ser azules, tiene sentido con esto. Cuando pienso en Win UI, pienso en la interfaz de usuario de Windows. También asocio el azul con Windows.
Ese último logotipo de @mdtauk llama a Windows en mi opinión y tiene su propia identidad y podría reconocer lo que significa en comparación con los muchos otros logotipos de cubos.

@SavoySchuler publicó los dos logotipos preliminares en Twitter, y el comentario principal que tomé de las respuestas es que no se siente muy parecido a Windows. Así que aquí está el mismo logotipo, pero en el color azul de Microsoft. Me pregunto si esto ayuda.

¡Realmente me gusta esto @mdtauk! Gran mejora en mi opinión. Creo que tener un aspecto más reflectante que un aspecto brillante es mejor en esta circunstancia. Tal vez solo haga que el lado derecho sea un poco más claro o tenga un gradiente más similar. Pero aparte de ese gran trabajo.

Fluent Inner Cube 64 scale

¿Es mejor este degradado oscuro?

Hola logotipo de Res

WinUILogo13_HiRes

@mdtauk ¿y si intenta implementar el final de los corchetes en el diseño de @ratishphilip en sus corchetes? Creo que los corchetes se confundirán menos con letras si ambos terminan de la misma manera.

Si se eligieran los diseños de @ratishphilip : ambos deben parecer del mismo tamaño. @mdtauk Por favor, cree también una versión de su logotipo con los corchetes de @ratishphilip .

Si se eligieran los diseños de @ratishphilip : ambos deben parecer del mismo tamaño. @mdtauk Por favor, cree también una versión de su logotipo con los corchetes de @ratishphilip .

Los corchetes de diseño de @mdtauk es que los corchetes envuelven el cubo.

@NoahFeller Los corchetes, en mi opinión, deberían reflejar los corchetes de XAML, que son del mismo tamaño. Esto debería reflejarse en el logo. El problema que tengo con el diseño de @mdtauk es que cuando aislados , especialmente en tamaños de imagen más pequeños, tengo la impresión de que los tamaños de los soportes son los siguientes:
image
(El corchete izquierdo es claramente más grande en comparación con el derecho. En XAML, ese no es el caso). En algunas resoluciones de imagen, p. Ej.
image
esto es bastante deslumbrante para mí y, francamente, me desconcierta. Los pares de corchetes <> son tan prominentes en XAML que creo que está justificado "simplemente golpearlos" en el cubo tal como están, o al menos darle a esto mucha consideración.

@NoahFeller Los corchetes, en mi opinión, deberían reflejar los corchetes de XAML, que son del mismo tamaño. Esto debería reflejarse en el logo. El problema que tengo con el diseño de @mdtauk es que cuando miro los corchetes _isolated_, especialmente en tamaños de imagen más pequeños, tengo la impresión de que los tamaños de los corchetes son los siguientes:
image
(El corchete izquierdo es claramente más grande en comparación con el derecho. En XAML, ese no es el caso). En algunas resoluciones de imagen, p. Ej.
image
esto es bastante deslumbrante para mí y, francamente, me desconcierta. Los pares de corchetes <> son tan prominentes en XAML que creo que está justificado "simplemente golpearlos" en el cubo tal como están, o al menos darle a esto mucha consideración.

Creo que el diseño de corchetes 3D de @mdtauk es el camino a seguir, pero si el corchete izquierdo termina de la misma manera que el derecho, hará que se vea del mismo tamaño, incluso con el efecto 3D, estoy adjuntando un bonito feo ejemplo solo para aclarar el punto.
image

@NoahFeller Los corchetes, en mi opinión, deberían reflejar los corchetes de XAML, que son del mismo tamaño. Esto debería reflejarse en el logo. El problema que tengo con el diseño de @mdtauk es que cuando miro los corchetes _isolated_, especialmente en tamaños de imagen más pequeños, tengo la impresión de que los tamaños de los corchetes son los siguientes:
image
(El corchete izquierdo es claramente más grande en comparación con el derecho. En XAML, ese no es el caso). En algunas resoluciones de imagen, p. Ej.
image
esto es bastante deslumbrante para mí y, francamente, me desconcierta. Los pares de corchetes <> son tan prominentes en XAML que creo que está justificado "simplemente golpearlos" en el cubo tal como están, o al menos darle a esto mucha consideración.

Creo que el diseño de corchetes 3D de @mdtauk es el camino a seguir, pero si el corchete izquierdo termina de la misma manera que el derecho, hará que se vea del mismo tamaño, incluso con el efecto 3D, estoy adjuntando un bonito feo ejemplo solo para aclarar el punto.
image

Veo lo que quieren decir, chicos. Probablemente tengas razón. Aquí hay una versión rápida que es simétrica y aún en 3D. Está muy inacabado (sin sombras, los corchetes son demasiado grandes, el color podría ser mejor, etc.) pero puedes hacerte una idea general de lo que estoy buscando. Una especie de efecto de ilusión óptica genial en el que puedes mirarlo de dos maneras. Por supuesto, depende totalmente de @mdtauk decidir en qué dirección tomar el diseño.

Fluent Inner Cube 4096

Los corchetes de diseño de @mdtauk es que los corchetes envuelven el cubo.

@NoahFeller, los corchetes tienen sentido en el espacio 3D. Si mira el cubo en la dirección que muestra la flecha roja a continuación, los corchetes se verían así

WinUILogo13_SideView

Fluent Inner Cube 64 scale

¿Es mejor este degradado oscuro?

@mdtauk Una pequeña sugerencia ... Si el corchete izquierdo se ajusta a la superficie del cubo, entonces las dos esquinas en el medio del corchete deben tener un radio de esquina cero ... igual que el borde del cubo.

Lo hicimos.

Comunidad: eres increíble y no puedo enfatizar eso lo suficiente. Después de, literalmente, _horas_ de deliberación nos hemos decidido por una. Es la combinación de los diseños de @mdtauk :

Color:

New WinUI logo colored

(nota: la sombra del cubo no se refleja aquí ya que no pude encontrar una versión sombreada con estos radios de esquina)

Monocromo:

New WinUI logo monochrome

(nota: consulte el punto 2 de la sección inferior con respecto a los soportes simétricos frente a los asimétricos)

Pensamientos

Como dijo @ryandemopoulos , "Este logo es rudo. De alguna manera se ve moderno y retro al mismo tiempo, moderno y sin embargo también histórico, preciso y asimétrico. Es un tema de conversación, y eso es por diseño".

New WinUI logo in use

Llamando a los diseñadores para nuestros últimos pasos

No hemos terminado del todo, pero estamos más cerca. Estos son los cabos sueltos que estamos atando:

  1. Nos gusta este esquema de color, pero aún necesitamos explorar algunas variantes de color diferentes (y mezclar eso con sombras / brillos en varios fondos también).

  2. Recibimos dos versiones realmente buenas: una con corchetes simétricos y la otra con corchetes asimétricos. Nos inclinamos hacia lo asimétrico (como se muestra a la derecha). ¿Pensamientos?

symmetrical vs. asymmetrical version of the new winui logo

  1. Necesitamos diseñar algún botín. Camisas, calcomanías, bolsos, tal vez un modelo físico, etc. Siempre está lo obvio, pero apuesto a que podríamos encontrar algo _realmente_ genial. 😄

Lo hicimos.

Comunidad: eres increíble y no puedo enfatizar eso lo suficiente. Después de, literalmente, _horas_ de deliberación nos hemos decidido por una. Es la combinación de los diseños de @mdtauk :

¡Felicitaciones @itsmichaelwest y @mdtauk!

Lo hicimos.

Comunidad: eres increíble y no puedo enfatizar eso lo suficiente. Después de, literalmente, _horas_ de deliberación nos hemos decidido por una. Es la combinación de los diseños de @mdtauk :

¡Felicitaciones @itsmichaelwest y @mdtauk!

@ratishphilip Veo que has estado trabajando duro para ayudarnos a llegar hasta aquí, así que te

Los corchetes de diseño de @mdtauk es que los corchetes envuelven el cubo.

@NoahFeller, los corchetes tienen sentido en el espacio 3D. Si mira el cubo en la dirección que muestra la flecha roja a continuación, los corchetes se verían así

@ratishphilip, si se preguntaba qué quise decir con mis comentarios sobre que su diseño no funciona en 3D, lo explicaré aquí. En su diseño, las sombras no coinciden con la fuente de luz que ilumina el cubo. Están en direcciones opuestas. Si el corchete izquierdo es perpendicular a la cara superior del cubo, debería tener una sombra larga proyectada detrás. Actualmente solo parece un corchete estirado con una sombra que no tiene sentido. Si miras la sombra del otro corchete, parece que está orientada en sentido contrario. Además, los corchetes se ven extraños y se transformaron en un ángulo como ese. El objetivo de la ilusión es que los soportes se vean bien en el ángulo desde el que se ven. No entiendo por qué están tan distorsionados. No hay un marco de referencia para la forma del soporte original (se muestra en la imagen de la derecha) porque es solo un icono. No quiero ser súper crítico, solo quiero brindarte comentarios para que puedas ser un diseñador aún mejor.

Los corchetes de diseño de @mdtauk es que los corchetes envuelven el cubo.

@NoahFeller, los corchetes tienen sentido en el espacio 3D. Si mira el cubo en la dirección que muestra la flecha roja a continuación, los corchetes se verían así

@ratishphilip, si se preguntaba qué quise decir con mis comentarios sobre que su diseño no funciona en 3D, lo explicaré aquí. En su diseño, las sombras no coinciden con la fuente de luz que ilumina el cubo. Están en direcciones opuestas. Si el corchete izquierdo es perpendicular a la cara superior del cubo, debería tener una sombra larga proyectada detrás. Actualmente solo parece un corchete estirado con una sombra que no tiene sentido. Si miras la sombra del otro corchete, parece que está orientada en sentido contrario. Además, los corchetes se ven extraños y se transformaron en un ángulo como ese. El objetivo de la ilusión es que los soportes se vean bien en el ángulo desde el que se ven. No entiendo por qué están tan distorsionados. No hay un marco de referencia para la forma del soporte original (se muestra en la imagen de la derecha) porque es solo un icono. No quiero ser súper crítico, solo quiero brindarte comentarios para que puedas ser un diseñador aún mejor.

Gracias @NoahFeller. Agradecemos sus comentarios.

@NoahFeller, ¿así es como esperabas que fuera el logo?

WinUILogo13_shadow

@NoahFeller, ¿así es como esperabas que fuera el logo?

WinUILogo13_shadow

Probablemente se vería algo parecido a eso (la sombra probablemente no sería tan oscura) pero el problema es que el diseño no se ve muy bien al ser renderizado con precisión en el espacio 3D. Como dije anteriormente, los corchetes se ven extrañamente comprimidos y no se adaptan a la dirección desde la que se ve la vista. Pude verlo funcionando mejor con soportes de forma adecuada flotando paralelos a la vista de la 'cámara' y las sombras proyectadas con precisión. O podría ser genial ver los soportes empotrados en el cubo o algo así. En mi opinión, su diseño no funciona tan bien en su forma actual. Pero la buena noticia es que definitivamente se puede modificar para mejorar de diferentes maneras.

Reflexiones sobre el diseño final

Mientras se realizan los últimos ajustes, tengo algunas cosas que quiero mencionar sobre el diseño. En primer lugar, es realmente genial ver que se usa la combinación de cubo acrílico + brillo. También me preocupan un poco los corchetes de colores sólidos en la parte superior del cubo 3D. El cubo emite una luz y parece haber una luz direccional al costado del cubo, por lo que no tiene sentido que los corchetes sean de colores sólidos. Probablemente deberían tener un aspecto ligeramente degradado que coincida con las fuentes de iluminación (no tanto degradado que parezca pegajoso, solo para que sea realista). De lo contrario, no tiene ningún sentido en el espacio 3D y parece fuera de lugar. Lo último que quería preguntar es si ( @SavoySchuler , @stmoy) consideraría hacer los corchetes simétricos de esta manera.

64465361-47f1fd00-d0da-11e9-834e-918ad9f57736

Como dije antes cuando lo publiqué, este es un diseño muy tosco (sin sombras, los corchetes son probablemente demasiado grandes, el color realmente podría mejorarse, etc.). Aun así, aborda muchos de los problemas que he visto aquí y en Twitter acerca de que los corchetes son asimétricos y de formas diferentes, y lo hace sin dejar de envolver el cubo de manera similar a como lo hacía antes. Imagínense el corchete derecho extendido en el cubo de @mdtauk . Me parece una gran mejora porque el cambio hace que los corchetes se vean como lo que son en lugar de letras o algo así. También la simetría, cuando es posible, es agradable y proporciona equilibrio. Obviamente, el estilo se agregaría al cubo acrílico de @mdtauk con el brillo y no a su cubo azul (que se muestra en la imagen de arriba), pero ¿estaría abierto a la idea de ver esta modificación experimentada más?

¡También felicitaciones a @itsmichaelwest y @mdtauk!

En primer lugar, felicitaciones a @itsmichalwest y @mdtauk y un enorme agradecimiento a @mdtauk por compartir sus archivos

En cuanto al comentario de @SavoySchuler :

  1. Nos gusta este esquema de color, pero aún necesitamos explorar algunas variantes de color diferentes (y mezclar eso con sombras / brillos en varios fondos también).

Aquí está mi opinión sobre el impresionante diseño de @mdtauk :

Fluent Inner Cube 64 scale
Fluent Inner Cube 16 scale (1)

He cambiado el verde azulado, azul y rosa con variaciones del tema de Windows azul para darle una sensación más "Windows".

¡Realmente emocionado de ver el ícono final! ¡Parece realmente pulido! @mdtauk y @NoahFeller en particular compartieron muchas ideas increíbles y puntos de vista que serán útiles para cualquier diseño que haga en el futuro.

64472825-71f00180-d164-11e9-8ee4-61791013b070

La imagen de la izquierda es la versión de @chingucoding del diseño de diseños de

2019-09-08-19-28-05
2019-09-08-19-21-38

@NoahFeller no se vuelve lo mismo que uno de mis envíos anteriores (al hacer que los corchetes sean del mismo color)

WinUILogo13_X

@NoahFeller no se vuelve lo mismo que uno de mis envíos anteriores (al hacer que los corchetes sean del mismo color)

WinUILogo13_X

Algo así como. Los corchetes son de varios colores y les da la apariencia de estar envueltos alrededor del cubo, por lo que es un poco diferente. Las diferencias de color son algo significativas. Como mencioné anteriormente, los corchetes de @mdtauk funcionan mucho mejor para tener sentido en 3D. Además, los corchetes de @mdtauk son un poco más gruesos. Pero sí, puedes pensar en ello como una combinación de los dos diseños. Estaba tratando de mejorar la implementación de los corchetes de cada uno. Un medio feliz 🙂.

cubewithiin

Oh, me olvidé por completo de mencionar que esta versión tiene un cubo dentro de un diseño de cubo que he visto en algunos diseños de esta página. Creo que es un aspecto realmente genial de integrar y tiene un significado genial detrás. A continuación se muestra lo que dijo @mdtauk al explicar su cubo dentro de los diseños de un cubo en respuesta a @stmoy :

@mdtauk : muchas gracias por todos sus aportes y variaciones. Una pregunta rápida: muchos de los diseños son "cubo dentro de un cubo". ¿Qué pretende transmitir este cubo doble?

@itsmichaelwest sugirió originalmente usar el ícono XAML como base del logotipo, y su diseño fue elegido en la primera ronda de presentaciones.

Veo el cubo como un núcleo, una parte fundamental de la creación de aplicaciones de Windows, por lo que decidí ilustrar el concepto de núcleo haciendo que una parte del cubo se destaque. También jugué con tener un espacio "vacío", para mostrar que este es un espacio para construir.

Pero hacer que el diseño del cubo y el soporte sea algo "que se pueda poseer" y que sea distinto, entre las miles de otras iconografías basadas en cubos que existen, juega un papel importante.

64468236-f7c56b80-d0d6-11e9-9bfc-fa155de7791f

Y aquí hay un cubo de soporte simétrico dentro de un diseño de cubo basado en el diseño verde / azul / morado de

Mi opinión es que el ancho de los corchetes debe ser 1/4 del ancho del cubo exterior. El cubo interior debe tener la mitad del tamaño del cubo exterior, que colocará los soportes a una distancia de 1/4 del ancho del cubo, desde los bordes del cubo exterior.

Y aquí hay un cubo de soporte simétrico dentro de un diseño de cubo basado en el diseño verde / azul / morado de

164468236-f7c56b80-d0d6-11e9-9bfc-fa155de7791f

Ajusté los soportes para que estuvieran un poco más cerca. Creo que se ve un poco mejor así.

Colour-Test

@SavoySchuler ¿Es este el tipo de color con el que te gustaría ir?

Los corchetes simétricos son definitivamente mucho más bonitos. Me gustaría ver un concepto en el que las esquinas interiores también estén redondeadas.

Los corchetes simétricos son definitivamente mucho más agradables. Me gustaría ver un concepto en el que las esquinas interiores también estén redondeadas.

Totalmente de acuerdo. De lo contrario, es difícil decir que son paréntesis angulares. ¿Puede aclarar lo que quiere decir con rincones internos?

Colour-Test-2

¡Nuevas combinaciones de colores geniales @mdtauk! Has hecho un trabajo increíble. Me preguntaba si tenía una opinión sobre si los corchetes angulares deben tener una forma simétrica o no. He visto a @ Felix-Dev, @elalexg y @goranalkovic publicar aquí sobre cómo prefieren los corchetes simétricos. Tengo curiosidad por saber si tiene un punto de vista contrastante. La publicación de @ Felix-Dev está a continuación para el contexto.

@NoahFeller Los corchetes, en mi opinión, deberían reflejar los corchetes de XAML, que son del mismo tamaño. Esto debería reflejarse en el logo. El problema que tengo con el diseño de @mdtauk es que cuando miro los corchetes _isolated_, especialmente en tamaños de imagen más pequeños, tengo la impresión de que los tamaños de los corchetes son los siguientes:
image
(El corchete izquierdo es claramente más grande en comparación con el derecho. En XAML, ese no es el caso). En algunas resoluciones de imagen, p. Ej.
image
esto es bastante deslumbrante para mí y, francamente, me desconcierta. Los pares de corchetes <> son tan prominentes en XAML que creo que está justificado "simplemente golpearlos" en el cubo tal como están, o al menos darle a esto mucha consideración.

Visual Studio Purple
Colour-Test-3

¡Nuevas combinaciones de colores geniales @mdtauk! Has hecho un trabajo increíble. Me preguntaba si tenía una opinión sobre si los corchetes angulares deben tener una forma simétrica o no. He visto a @ Felix-Dev, @elalexg y @goranalkovic publicar aquí sobre cómo prefieren los corchetes simétricos. Tengo curiosidad por saber si tiene un punto de vista contrastante. La publicación de @ Felix-Dev está a continuación para el contexto.

@NoahFeller Hacerlos simétricos significaría separar los soportes del cubo. Produje una versión con los soportes del mismo tamaño (pero no de forma simétrica), y el equipo que toma las decisiones parece estar del lado de mantener la Asimetría.

Si ve los corchetes como una representación literal de los corchetes angulares de XAML / XML, seguramente se ofenderá con el enfoque estilizado.

Pero si las formas son un símbolo de los corchetes, pero el cubo en sí es el logotipo, entonces la asimetría apunta a los corchetes, aunque está lo suficientemente estilizada como para ser un logotipo interesante.

Hacer simétricos los soportes, mientras se mantienen colocados sobre el cubo, significaría rotar el cubo, y eso no se ha pedido, y es otro paso más lejos de la inspiración del logotipo XAML.

Colores

@mdtauk - has sido increíble. Todo lo que necesitamos son sus archivos de formato vectorial para los logotipos a continuación (las formas izquierda y central son preferibles si están disponibles). De lo contrario, no se sienta obligado a prestarnos más de su tiempo a menos que lo desee. ¡No podríamos pedir más sin sentirnos culpables!

Excluyendo los envíos más recientes de

image

Como última exploración, nos gustaría ver si es posible trabajar bien este diseño en los colores oficiales de Microsoft (si es posible). He estado explorando esto sin conexión y todavía no he encontrado nada que me enorgulleciera publicar. A menos que cualquiera de los presentes pueda hacerlo, seleccionaremos uno de los esquemas de color anteriores.

En cuanto a la forma del soporte / altura, nuestro interés está en lo que mejor complemente los colores. Hasta ahora, creo que las imágenes de la izquierda y el centro de arriba hacen esto mejor, pero eso no descarta de ninguna manera el elemento derecho de arriba o cualquier envío de color alternativo que se desvíe de esto.

Colores

@mdtauk - has sido increíble. Todo lo que necesitamos son sus archivos de formato vectorial para los logotipos a continuación (las formas izquierda y central son preferibles si están disponibles). De lo contrario, no se sienta obligado a prestarnos más de su tiempo a menos que lo desee. ¡No podríamos pedir más sin sentirnos culpables!

Excluyendo los envíos más recientes de

image

Como última exploración, nos gustaría ver si es posible trabajar bien este diseño en los colores oficiales de Microsoft (si es posible). He estado explorando esto sin conexión y todavía no he encontrado nada que me enorgulleciera publicar. A menos que cualquiera de los presentes pueda hacerlo, seleccionaremos uno de los esquemas de color anteriores.

En cuanto a la forma del soporte / altura, nuestro interés está en lo que mejor complemente los colores. Hasta ahora, creo que las imágenes de la izquierda y el centro de arriba hacen esto mejor, pero eso no descarta de ninguna manera el elemento derecho de arriba o cualquier envío de color alternativo que se desvíe de esto.

Yo también he intentado utilizar los colores del logotipo de Microsoft Four Square, y no pude conseguir que se vieran bien juntos sin dejar de preservar la dimensionalidad del cubo.

¿Qué herramienta estás usando para trabajar? He estado usando Figma, ya que creo que es una herramienta con la que Microsoft está familiarizado, pero puedo transferirlos a Illustrator si así lo prefiero.

Gracias por compartir su punto de vista sobre simetría / asimetría @mdtauk.

@NoahFeller Hacerlos simétricos significaría separar los soportes del cubo. Produje una versión con los soportes del mismo tamaño (pero no de forma simétrica), y el equipo que toma las decisiones parece estar del lado de mantener la Asimetría.

Hacer simétricos los soportes, mientras se mantienen colocados sobre el cubo, significaría rotar el cubo, y eso no se ha pedido, y es otro paso más lejos de la inspiración del logotipo XAML.

No veo lo que quiere decir cuando dice que hacer simétricos los corchetes significa que tendrían que estar separados del cubo. Tampoco estoy seguro de lo que quiere decir con la necesidad de rotar el cubo para mantener simétricos los corchetes. No tuve que hacer ninguna de esas cosas cuando itere en su diseño, solo modifiqué ligeramente la altura y la forma de sus corchetes para lograr la simetría ⬇. A menos que esté malinterpretando lo que está diciendo, esas partes de su declaración no parecen correctas.

64565562-08b5ed00-d322-11e9-8c29-6aa1e67a6691

@elalexg también aclaró ese punto en su comentario:

Creo que el diseño de corchetes 3D de @mdtauk es el camino a seguir, pero si el corchete izquierdo termina de la misma manera que el derecho, hará que se vea del mismo tamaño, incluso con el efecto 3D, estoy adjuntando un bonito feo ejemplo solo para aclarar el punto.
64464723-94cfd680-d0ce-11e9-965e-a08b89d1fa73

Me inspiré parcialmente en él para modificar tu diseño.

Tampoco veo cómo sus paréntesis simbolizan paréntesis angulares. Parecen ser paréntesis angulares, solo que uno es un poco más grande que el otro. Como dijo @ Felix-Dev, los corchetes XAML originales son simétricos, por lo que parecería que la simetría en realidad estaría más cerca de los diseños XAML anteriores, sin alejarse de ellos.

Sin embargo, puedo ver lo que quieres decir con querer estilizar el logo. Me parece antinatural a mí y a los demás que mencioné ver los soportes de diferentes tamaños, pero puedo ver totalmente cómo ves de manera diferente. Siento que el logotipo es lo suficientemente complejo con textura, brillo, un montón de colores diferentes, etc. y no necesita más interés, pero nuevamente puedo ver cómo piensas de otra manera.

Realmente depende de @SavoySchuler y su equipo decidir qué camino tomar, solo estoy tratando de entender su razón de ser. ¡Gracias de nuevo por explicarme!

Para su información, estoy planeando diseñar (en 3D) e imprimir en 3D yo mismo una versión de la vida real de lo que sea el logotipo final (final). Voy a usar un filamento translúcido para emular el efecto acrílico (ejemplo a continuación). ¡Me aseguraré de compartir una foto del resultado si alguno de ustedes está interesado!

a4f18cabbcf406fd66d3d049da0dc25a067bc6f0

Para su información, estoy planeando diseñar (en 3D) e imprimir en 3D yo mismo una versión de la vida real de lo que sea el logotipo final (final). Voy a usar un filamento translúcido para emular el efecto acrílico (ejemplo a continuación). ¡Me aseguraré de compartir una foto del resultado si alguno de ustedes está interesado!

a4f18cabbcf406fd66d3d049da0dc25a067bc6f0

Impresionante. Ya hemos hablado un poco internamente sobre hacer objetos físicos como este basados ​​en el logo; ¡No puedo esperar a ver qué se te ocurre!

También probé con los colores de la marca Microsoft y no funcionó del todo, creo que la combinación de colores es Windows, ya que esta es la interfaz de usuario de Win (dows) después de todo.
@mdtauk tuvo una idea interesante con los colores de Visual Studio que también podría tener sentido.

Al observar todos los comentarios sobre simetría / asimetría de los corchetes, me inclino más hacia el diseño asimétrico, ya que le da otro aspecto único al logotipo y de alguna manera parece dibujar el cubo un poco mejor.

No veo lo que quiere decir cuando dice que hacer simétricos los corchetes significa que tendrían que estar separados del cubo. Tampoco estoy seguro de lo que quiere decir con la necesidad de rotar el cubo para mantener simétricos los corchetes. No tuve que hacer ninguna de esas cosas cuando itere en su diseño, solo modifiqué ligeramente la altura y la forma de sus corchetes para lograr la simetría ⬇. A menos que esté malinterpretando lo que está diciendo, esas partes de su declaración no parecen correctas.

Tampoco veo cómo sus paréntesis simbolizan paréntesis angulares. Parecen ser paréntesis angulares, solo que uno es un poco más grande que el otro. Como dijo @ Felix-Dev, los corchetes XAML originales son simétricos, por lo que parecería que la simetría en realidad estaría más cerca de los diseños XAML anteriores, sin alejarse de ellos.

Sin embargo, puedo ver lo que quieres decir con querer estilizar el logo. Me parece antinatural a mí y a los demás que mencioné ver los soportes de diferentes tamaños, pero puedo ver totalmente cómo ves de manera diferente. Siento que el logotipo es lo suficientemente complejo con textura, brillo, un montón de colores diferentes, etc. y no necesita más interés, pero nuevamente puedo ver cómo piensas de otra manera.

Realmente depende de @SavoySchuler y su equipo decidir qué camino tomar, solo estoy tratando de entender su razón de ser. ¡Gracias de nuevo por explicarme!

Quería que las "marcas" del cubo se alinearan con los lados de las caras del cubo. Al cortar los trazos finales del soporte izquierdo en un ángulo diagonal, se siente antinatural para el contorno del cubo y hace que se sienta como si estuviera desconectado de la rotación.

image

Pero ahora es para @SavoySchuler y el equipo tomar el diseño, interpretarlo y moldearlo en lo que el equipo quiere y necesita de él.

Estoy terminando las versiones de Adobe Illustrator, despojadas de todo color, para que puedan tomarlo como punto de partida.

image

Aquí está el archivo de Illustrator, comprimido
Formas del logotipo final.zip
_EDIT: Archivo de Illustrator actualizado con versiones rellenas de color monocromático agregadas_

dieciséis
Final Logo Shapes _ Mono 16
Final Logo Shapes _ Shaded 16
Final Logo Shapes _ Filled 16

32
Final Logo Shapes _ Mono 32
Final Logo Shapes _ Shaded 32
Final Logo Shapes _ Filled 32

64
Final Logo Shapes _ Mono 64
Final Logo Shapes _ Shaded 64
Final Logo Shapes _ Filled 64

128
Final Logo Shapes _ Mono 128
Final Logo Shapes _ Shaded 128
Final Logo Shapes _ Filled 128

256
Final Logo Shapes _ Mono 256
Final Logo Shapes _ Shaded 256
Final Logo Shapes _ Filled 256

1024
Final Logo Shapes _ Mono 1024
Final Logo Shapes _ Shaded 1024
Final Logo Shapes _ Filled 1024

4096
Final Logo Shapes _ Mono 4096
Final Logo Shapes _ Shaded 4096
Final Logo Shapes _ Filled 4096

Ok, gracias por aclarar @mdtauk. Lo hice de esa manera para lograr el cubo sutil dentro de un diseño de cubo del que hablé en una publicación anterior. Debido a que el ángulo de la tapa de la línea es de 45 °, está en la línea diagonal del cuadrado, por lo que no siento que sea demasiado antinatural. Sin embargo, veo lo que quieres decir. Creo que prioricé el ajuste de la forma como un hexágono mientras que tú priorizaste el ajuste como un cubo y hay un poco de compromiso de cualquier manera (simetría equilibrada con el cubo dentro de un diseño de cubo versus carácter agregado y mejor envoltura). De todos modos, ¡realmente aprecio la explicación!

Ok, gracias por aclarar @mdtauk. Lo hice de esa manera para lograr el cubo sutil dentro de un diseño de cubo del que hablé en una publicación anterior. Debido a que el ángulo de la tapa de la línea es de 45 °, está en la línea diagonal del cuadrado, por lo que no siento que sea demasiado antinatural. Sin embargo, veo lo que quieres decir. Creo que prioricé el ajuste de la forma como un hexágono mientras que tú priorizaste el ajuste como un cubo y hay un poco de compromiso de cualquier manera (simetría equilibrada con el cubo dentro de un diseño de cubo versus carácter agregado y mejor envoltura). De todos modos, ¡realmente aprecio la explicación!

Ninguno de los enfoques es mejor que el otro, solo diferentes ideas en el núcleo. Como dices, no quería perder el hecho de que este es un cubo, con profundidad y textura, como la intención original detrás del logo XAML.

Aquí está el archivo de Illustrator, comprimido
Formas del logotipo final.zip
_EDIT: Archivo de Illustrator actualizado con versiones rellenas de color monocromático agregadas_

dieciséis
Final Logo Shapes _ Mono 16
Final Logo Shapes _ Shaded 16
Final Logo Shapes _ Filled 16

32
Final Logo Shapes _ Mono 32
Final Logo Shapes _ Shaded 32
Final Logo Shapes _ Filled 32

64
Final Logo Shapes _ Mono 64
Final Logo Shapes _ Shaded 64
Final Logo Shapes _ Filled 64

128
Final Logo Shapes _ Mono 128
Final Logo Shapes _ Shaded 128
Final Logo Shapes _ Filled 128

256
Final Logo Shapes _ Mono 256
Final Logo Shapes _ Shaded 256
Final Logo Shapes _ Filled 256

1024
Final Logo Shapes _ Mono 1024
Final Logo Shapes _ Shaded 1024
Final Logo Shapes _ Filled 1024

4096
Final Logo Shapes _ Mono 4096
Final Logo Shapes _ Shaded 4096
Final Logo Shapes _ Filled 4096

¡Hola amigo! Nos encantaría tener los diseños de logotipos multicolor y azul originales que hizo tal como lo envió inicialmente, un archivo .ai en una carpeta con cremallera. ¡Se ven genial! gracias por ayudarnos, realmente nos gusta tanto tu trabajo que queremos mantenerlo como está :) gracias de nuevo

@SavoySchuler @embender He actualizado la Figma con los logotipos y colores finales, estos incluyen las sombras que habrían aumentado el tamaño de los archivos de Adobe Illustrator.

https://www.figma.com/file/KCQQ1wtMBnWxsXrmDOHmhB/WinUI-Logo-Share?node-id=0%3A1

¿Soy solo yo o los cubos grises más pequeños se ven borrosos? ¿Es solo un artefacto de compresión de imagen o algo así?

¿Soy solo yo o los cubos grises más pequeños se ven borrosos? ¿Es solo un artefacto de compresión de imagen o algo así?

¿Los logotipos en escala de grises que publiqué anteriormente?

Las imágenes deben ser nítidas cuando se ven con un zoom del 100%, ya que están diseñadas para verse nítidas en una cuadrícula de píxeles.

@mdtauk : gracias de nuevo por todas sus contribuciones y respuestas rápidas. Has sido invaluable durante este proceso. Gracias también por proporcionar logotipos monocromáticos: ¡creo que se verán geniales en el botín!

Si no es demasiado problema, ¿podría enviar recursos que demuestren la versión del contorno del logotipo, incluidos los corchetes asimétricos? Algo así, pero actualizado a los últimos diseños:

image

Además, ¿qué piensas sobre el grosor del contorno? Sé que ha habido conversaciones sobre cómo garantizar que el grosor del contorno ayude a mantener el logotipo en tamaños de píxeles pequeños, pero para el estilo, me pregunto si las líneas más delgadas serían más efectivas.

Me gusta mucho la versión asimétrica del logo donde las líneas se extienden hasta los bordes exteriores de cada cara. Es decir.
Logotipo de luz multicolor.zip

Permite que cada cara sea coherente por derecho propio y te permite imaginar cómo se verían las caras ocultas si se girara el cubo.

En esa nota, podría ser genial si el diseño se usara para los cubos de Rubik.

@stmoy Reducí un poco los contornos a aumentaba la escala, pero para 16 y 32, quería mantenerlo en un grosor de 1 px.

De todos modos, he agregado íconos de peso Monoline más delgados a la Figma.

Mono 16
Mono 32
Mono 64
Mono 128
Mono 256
Mono 1024
Mono 4096

¿Soy solo yo o los cubos grises más pequeños se ven borrosos? ¿Es solo un artefacto de compresión de imagen o algo así?

¿Los logotipos en escala de grises que publiqué anteriormente?

Las imágenes deben ser nítidas cuando se ven con un zoom del 100%, ya que están diseñadas para verse nítidas en una cuadrícula de píxeles.

¡Ah, tonto de mí y de la escala DPI! 😛

Logotipo finalizado

¡Hola, maravillosa comunidad! Como estoy seguro de que has visto durante la última semana, definitivamente, sin duda, sin lugar a dudas, 100%, de verdad, aterrizamos en un logotipo que nos entusiasma SUPER. Un gran agradecimiento a todos ustedes por conducir esta casa. Realmente queríamos crear algo que combinara todo el trabajo favorito que todos pusieron aquí. Creemos que esto hace eso.

New WinUI Logo - wireframe and color

Vamos a informar

Tenemos el antiguo logo de Xaml aquí:

Original Xaml Logo

Cuando @itsmichaelwest da nueva vida a la historia, obtienes algo maravilloso:

WinUI_LogoExporation_V3_GitHub

A partir de ahí, nos dirigimos a la comunidad. Después de (casi) otros cien envíos que exploraron la re-coloración y el estilo, nos enamoramos de este giro simple pero elegante para contener los corchetes. Como lo expresó

New WinUI Logo - wireframe

En cuanto al color, nuestra comunidad de usuarios habló y exigió algo que todavía "se parecía a Windows". @mdtauk hizo que fuera fácil imaginar este azul familiar que representa a nuestra comunidad una vez más:

New WinUI Logo - color

Por supuesto, en este breve resumen, he resumido las ~ 300 interacciones de casi 40 colaboradores aquí y volúmenes más en Twitter y fuera de línea. La historia corta es esta: no podríamos haber hecho esto sin todos ustedes, y espero que todos vean un poco de su trabajo y su historia reflejada en lo que hemos creado juntos. De alguna manera se ve moderno y retro al mismo tiempo, moderno y, sin embargo, también histórico, preciso y asimétrico. Es un tema de conversación, y eso es por diseño. 😊

New WinUI Logo - wireframe and color

Viendo hacia adelante

Teniendo en cuenta lo diverso que fue este esfuerzo de colaboración y todas las variaciones coloridas que vimos, ¿cómo no podríamos mantener las cosas animadas con todas las ideas que nos has dado? Estamos emocionados de experimentar con los colores y el tema. ¡Esté atento a Twitter mientras compartimos un trabajo de diseño divertido y tratamos de idear el mes de celebración, las vacaciones y las variantes temáticas de lanzamiento para compartir! 😊

También vamos a comenzar a iterar sobre diseños de botines emocionantes. ¡Asegúrese de pasar por nuestro stand en Microsoft Ignite para recoger una de estas pegatinas a continuación!

WinUI Logo Sticker

Swag Link?

Vi que había solicitudes para hacer disponibles enlaces de compra de botines personales. Tan pronto como tengamos nuestra alineación de botines finalizada, analizaré si puedo hacer que esto suceda e informar a este hilo. ¡Dejaré de cerrar el tema hasta entonces!

¡Tenemos un botín para compartir!

Equipo de la comunidad, te escuché alto y claro. Querías tener la oportunidad de comprar el mismo botín que los miembros de nuestro equipo interno lucirán en Microsoft Ignite, en el escenario y en todo el mundo. Elegimos diseñar y ordenar nuestro botín a través de una empresa que podría hacer que eso suceda para usted.

Hice nuestro pedido final de más de 100 artículos hoy. Cada miembro del equipo pudo elegir uno u otro. A muchos les gustaron tanto los dos que tomamos uno y pedimos el otro nosotros mismos (incluido yo).

Por favor hazme saber si tienes preguntas. Tengo algunas notas:

  • Si fue el ganador de nuestro "Número 1000 - ¡Gracias!"
  • Las sudaderas con capucha requieren un pedido mínimo de 6. Puede cambiar fácilmente el producto por uno sin mínimo o armar un formulario de pedido grupal.
  • Si hace su pedido esta semana / envía a su hotel, puede obtenerlos a tiempo para unirse a nosotros y usarlos en Microsoft Ignite en Orlando, FL, del 4 al 8 de noviembre.

Enlace de pedido de sudaderas con capucha WinUI

WinUI Hoodies

Enlace de pedido de camisetas WinUI

WinUI Shirts

Ese logotipo final resultó genial. Realmente estalla.

¿Fue útil esta página
0 / 5 - 0 calificaciones