¡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.
Tenemos el antiguo logo de Xaml aquí:
Cuando @itsmichaelwest da nueva vida a la historia, obtienes algo maravilloso:
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ó
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:
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. 😊
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!
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:
Enlace de pedido de sudaderas con capucha WinUI
Enlace de pedido de camisetas WinUI
[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:
Mosaico de repositorio actual
¡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!
Tus presentaciones son increíbles, @embender. Particularmente me gustan los últimos y los primeros.
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?
¡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.
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? 😄
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 ...
¡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 :
Hay algunas cosas que me gustan:
Ideas para el concepto:
Una vista previa de los iconos de control de la aplicación Xaml Controls Gallery:
¿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,
O un retro de uno antiguo, ¿qué tal si modernizamos un ícono familiar, p. Ej.
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
Concepto 2
Concepto 3
@ 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.
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í:
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!
@itsmichaelwest entrando y haciendo un excelente trabajo como siempre :)
He estado esbozando algunas ideas y empezaré a intentar convertirlas en ideas más pulidas.
Aquí hay uno basado en el logotipo de Visual Studio
Aquí hay un logotipo inspirado en el sitio de Fluent Design
Íconos refinados a escala de 16px y 32px
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)?
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:
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! 😊
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
Tejido WinAPI [A]
Tejido WinAPI [B]
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.
El ancho es fijo (la 'tarjeta secundaria', es el tono de azul incorrecto, ¡uy! No quiero enviar spam, así que lo dejaré por ahora)
Rehice el diseño de @AmNotADev usando mi plantilla de tela.
@SaboyaSchuler
Casi parece arte de Word de PowerPoint
Versiones escaladas, similares a Office, estilo Windows 10 Fluent Icon (incluido Acrylic Noise), conservando la metáfora del libro.
Versiones planas y monocromáticas del mismo diseño que compartí antes, más una maqueta de camiseta. ¡Es tela sobre tela!
¡Hola!
Aquí están mis primeras ideas de diseño.
¿Qué piensas?
¡Hola!
Esta es mi idea para 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.
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:
Aquí está mi concepto
Basado en un par de bocetos de
@SavoySchuler Cambiar nombre para Hybrid + UI = HybrUI
UI para todas las plataformas. HybrUI en GitHub.
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!
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! 🏆
@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!
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.
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.
Y aquí están algunos de mis bocetos iniciales si alguno de ustedes tiene curiosidad:
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.
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.
Tomando el nombre de WindowsUI algo literalmente, este diseño muestra a un usuario por encima de una interfaz de estilo Windows.
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.
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?
@stmoy @NoahFeller Me inspiré para intentar combinar algunos de esos elementos que
@stevenbrix AFAIK el equipo de
¡Espero no llegar demasiado tarde a la fiesta!
Aquí hay una contribución de mi lado.
Estos son mis pensamientos detrás de esto
¿Qué más se le puede hacer?
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ó.
@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. :)
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:
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!
¿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?
@mdtauk Sí, nuestra ambición es realizar una polinización cruzada de todos nuestros íconos con imágenes del nuevo logotipo. 😄
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!
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é.
Aqui hay otro
Concepto detrás de esto
Otra versión de esto enfatizando el XAML
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.
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.
Tomé una idea anterior, cambié los colores y agregué ejemplos del kit de herramientas y los logotipos de la galería.
Aquí hay otra versión de mi logotipo anterior.
Otro concepto
Improvisando el logo anterior
¡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
_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
@ratishphilip Espero que no te intentar modificar tu idea ...
_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
@mdtauk Este es mi concepto para la galería, biblioteca y kit de herramientas de WinUI
@ratishphilip Gracias, y aquí están mis opiniones
@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 ...
Estos conceptos se basan en el icono de herramientas de desarrollo.
Aqui hay otro
Otro intento
Aqui hay otro
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
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
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 :).
Aquí hay algunas ideas de Wordmark y convenciones de nomenclatura. WinUI _________ para que todo parezca que pertenece a una familia integral.
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:
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 💙
Sí @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.
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_
_Logo grid_
_Depth and forward slash from Build 2019_
_Fluent Imagary actual y actualizado_
_Tal vez las primeras versiones de Office Icons_
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.
¡Maquetas de MERCH para divertirse! (De uno de mis diseños)
Además, esta sudadera se ve súper cómoda y ahora quiero una. Voy a tratar de abstenerme de comprar sudaderas ahora lol.
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 ...
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 ...
¡Este fue un espectáculo de fuerza que nunca esperábamos! ¡Eres IMPRESIONANTE!
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.
Para proporcionar algo de inspiración para hacer riffs en el diseño de @itsmichaelwest , aquí están nuestros otros favoritos ...
Y una mención de honor a @IUsername por estas presentaciones coloridas y originales:
¡Felicidades de nuevo y gracias a todos!
¡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
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?
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?
¿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!
¿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
Combinaciones de colores aprobadas
Colores universales de Windows
¡Felicidades @itsmichaelwest!
Aquí hay otro concepto basado en el cubo y los paréntesis angulares ...
Concepto aproximado basado en @ratishphilip
Debemos asegurarnos de no confundirnos con el logotipo de Unity ...
@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.
Woah 😮¡Estoy tan emocionado de que el equipo amara mi logo!
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:
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.
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! 😃
Versión del kit de herramientas de este logotipo
Algunos ángulos diferentes para un concepto basado en uno de los íconos de
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.
¿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!
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é.
Versión de la galería agregada junto con las demás
Aquí hay algunos logotipos de otros marcos, por lo que podemos intentar evitar hacer diseños similares.
Anglar JS
Xamarin
Mecanografiado
Nodo JS
Reaccionar
Aleteo
Iónico
HTML / CSS / JS
Diseño de materiales
IU rápida
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 ...
¡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:
@SavoySchuler Me gusta mucho este que publicaste.
- @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 🚨
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"?
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
Verde y amarillo
Azul y rosa
@SavoySchuler > ¿Alguien tiene alguna combinación de colores que le parezca "pop"?
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
Verde y amarillo
Azul y rosa
@mdtauk ¿Se
@itsmichaelwest Me acabo de dar cuenta de que me faltaba una imagen en la viñeta 1 anterior, ¡agregada ahora!
@SaboyaSchuler
Azul> Rosa
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):
También es un homenaje al logotipo original de Xaml:
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
Azul> Rosa
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!
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:
¡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)
.
.
.
.
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!
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!
@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.
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)
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)
Lo primero que veo es un símbolo de reproducción
Aquí hay otro basado en el cubo Fluent de
Aquí está el logo anterior sin el corte.
Otra versión del cubo de
Otra versión del cubo de
¿No crees que esto hace que los corchetes angulares se desequilibren un poco?
Otra versión del cubo de
¿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.
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
¡Me encantan los dos tonos en el soporte!
4096
1024
256
128
64
32
dieciséis
4096
1024
256
128
64
32
dieciséis
4096
1024
256
128
64
32
dieciséis
¡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:
@SavoySchuler ¡ aquí tienes! Perdón por la espera, ¡este hilo parece avanzar bastante rápido!
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
1024
256
128
64
32
dieciséis
1024 Cubo solamente
4096 Cubo solamente
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.
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: :)
¿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.
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.
Y también una versión en 3D, con y sin contorno.
@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: :)
¿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
4096
1024
256
128
64
32
dieciséis
@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 ...
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.
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:
Para cualquier envío final, nos encantaría verlos:
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.
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.
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
Un solo color
@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.
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)
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
Aquí está mi sugerencia
@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)
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?
Mi opinión es que los corchetes deben conservar la misma forma que en el logotipo de XAML con un pequeño redondeo
Aquí está mi sugerencia
@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)
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?
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)
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?
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
1024
256
128
64
32
dieciséis
Un solo color
@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.
Aquí está el esquema
Aquí hay otro con un soporte 3d.
Esto definitivamente resuelve la extraña perspectiva que estaba viendo antes. ¡Bien hecho!
Aquí hay otro con un soporte 3d.
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.
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.
Aquí está el logo actualizado
Hi Nada logo
Este (o su contraparte oscura) es hermoso. Me gusta el degradado porque mezcla un elemento Fluent.
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 :
Especialmente esos corchetes negros brillantes.
Especialmente esos corchetes negros brillantes.
@weitzhandler ¿Qué tal esto?
@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.
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.
¿Es mejor este degradado oscuro?
Hola logotipo de Res
@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:
(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.
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:
(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.
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.
@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:
(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.
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.
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.
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í
¿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.
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 :
(nota: la sombra del cubo no se refleja aquí ya que no pude encontrar una versión sombreada con estos radios de esquina)
(nota: consulte el punto 2 de la sección inferior con respecto a los soportes simétricos frente a los asimétricos)
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".
No hemos terminado del todo, pero estamos más cerca. Estos son los cabos sueltos que estamos atando:
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).
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?
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?
@NoahFeller, ¿así es como esperabas que fuera el logo?
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.
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.
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 :
- 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 :
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.
La imagen de la izquierda es la versión de @chingucoding del diseño de diseños de
@NoahFeller no se vuelve lo mismo que uno de mis envíos anteriores (al hacer que los corchetes sean del mismo color)
@NoahFeller no se vuelve lo mismo que uno de mis envíos anteriores (al hacer que los corchetes sean del mismo color)
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 🙂.
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.
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
Ajusté los soportes para que estuvieran un poco más cerca. Creo que se ve un poco mejor así.
@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?
¡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:
(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.
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
¡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.
@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
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
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.
@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.
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!
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!
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.
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.
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
32
64
128
256
1024
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
32
64
128
256
1024
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
@embender Ojalá esto sea lo que quieres 😃
@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:
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.
¿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! 😛
¡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.
Tenemos el antiguo logo de Xaml aquí:
Cuando @itsmichaelwest da nueva vida a la historia, obtienes algo maravilloso:
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ó
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:
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. 😊
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!
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!
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:
Ese logotipo final resultó genial. Realmente estalla.
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!