Design: Logotipo de WebAssembly

Esa es una buena metáfora. FWIW Siempre me gustó el logotipo de Borland C ++, que
parecía que se estaban juntando bloques de construcción. "Ensamblar" también puede tener
esa connotación también.

El miércoles, 3 de junio de 2015 a las 10:34 p. M., JF Bastien [email protected]
escribió:

@sunfishcode https://github.com/sunfishcode hackeó un logotipo rápido para
Montaje web:
[imagen: imagen]
https://cloud.githubusercontent.com/assets/298127/7970689/95aefe64-09f4-11e5-87c8-b67d25f46901.png
Tiene buenas ideas:

• Flechas que se unen para representar "ensamblar".
• Las flechas que se unen también pueden representar la compilación de otros lenguajes
  a la web.

Sería bueno tener algo más elegante / web-y / designer-y, y
manténgalo neutral para que pertenezca a la web y no a uno de los proveedores de navegadores.

Petr Hosek de mi equipo propuso usar los íconos de clase de tecnología HTML5
http://www.w3.org/html/logo/ y se le ocurrió lo siguiente:
[imagen: imagen]
https://cloud.githubusercontent.com/assets/298127/7970659/70880d2e-09f4-11e5-9c7b-c2134ee7f483.png

_¿Cualquier otra sugerencia?_

@lukewagner https://github.com/lukewagner dijo:

Mi propia locura personal sería que la asimetría de las flechas me molestaba
un poco. Sin embargo, la asimetría puede ser visualmente agradable. Solo para lanzar una idea:
¿Qué pasaría si las flechas fueran simétricas pero hubieran 4 ligeramente diferentes?
formas abstractas en las cuatro esquinas: basándose en la "compilación en la web"
metáfora anterior, las 4 formas representarían 4 idiomas de origen diferentes
que se estaban compilando (a través de la flecha) al centro (la web).

-
Responda a este correo electrónico directamente o véalo en GitHub
https://github.com/WebAssembly/spec/issues/112.

@BrendanEich también mencionó que le gusta el ambiente de ensamblaje de superhéroes, al estilo de los Vengadores.

Sí, aparte de mi liendre, en general me gustan las flechas apuntando juntas. Los bloques de construcción son una idea interesante; Me interesaría si alguien tuviera un concepto que coincidiera con el estilo de icono de la clase de tecnología HTML5.

Petr Hosek originalmente propuso lo siguiente:

@davidsehr señaló un defecto horrible en ese logo . Me gustan las flechas, ¡pero definitivamente deberíamos evitar crear inadvertidamente logotipos históricamente insensibles!

Sin embargo, la idea del icono de la clase de tecnología HTML5 sigue siendo buena.

Hablé con algunas personas aquí y sugirieron que no tengamos ningún logotipo hasta el primer lanzamiento. ¡Eso nos permitirá concentrarnos en la tecnología y tomarnos el tiempo para crear un logotipo que esté pensado y no tenga significados inadvertidos!

@lukewagner Bueno, es la versión 1.0 (en algún momento) y su abreviatura es WASM. Además, el verde no es utilizado hasta ahora por los típicos íconos de tecnología HTML5 AFAIK.

EDITAR: Licencia bajo (CC BY 3.0) y basado en el logotipo HTML 5

EDITAR: Proporcionará una versión SVG con menos errores de píxeles cuando tenga tiempo: p.

EDITAR: SVG para la versión verde y morada .

@Teemperor, no podemos aceptar un logotipo sin que usted esté en el grupo de la comunidad W3C y con la atribución de derechos de autor adecuada. También es demasiado pronto para obtener un logotipo por ahora :)

@jfbastien ya estoy en la comunidad W3C . El logotipo debe tener la licencia CC original del logotipo HTML5 porque obviamente es solo el logotipo HTML 5 remezclado.

Otro diseño basado en las flechas que apuntan juntas (para W eb A ssembly):

Con licencia bajo (CC BY 3.0) , creado por Raphael Isemann.

Y creo que un logotipo que se cambiará más tarde es mejor que ningún logotipo :)

Aquí están mis tiros de 3 minutos.

: +1:

¿Qué pasa con el WA Zigzag?

@Namozag ¡ Me gusta!

(parece que los archivos adjuntos no funcionan por correo electrónico ...)
(Par de rápidos y sucios)

Un juego con la idea del zigzag:

Jugando con el espacio negativo:

—Fred

El 23 de junio de 2015, a las 13:27, Andrey [email protected] escribió:

@Namozag https://github.com/Namozag ¡ Me gusta!

-
Responda a este correo electrónico directamente o véalo en GitHub https://github.com/WebAssembly/design/issues/112#issuecomment -114450578.

@fstark no puede verlos.

Parece que no puedes adjuntar imágenes por correo electrónico, así que las agregué al comentario original. ¿Aparecen en línea?

no

Déjame intentarlo de nuevo con una resolución menor.

Imagen 1 (Variación en zigzag)

Imagen 2 (espacio negativo)

Creo que puede resultar confuso utilizar un logotipo de WA, porque Whatsapp también se abrevia como WA.

Trabajo realmente creativo de todos aquí. Acuerde evitar la superposición de WhatsApp; también el \ / \ / de "Clueless" para "whatEVER" ;-).

/ser

Realmente no entiendo la preocupación con Whatsapp, ya que su logo se ve así .

Además, el nombre completo es WebAssembly, no wasm ni wa, por lo que no estoy seguro de dónde vendría la confusión. No es como si la gente comenzara a usar wa como nombre. Son solo algunos garabatos aleatorios en un logotipo. Reutilizar la idea de escudo de @Teemperor (tal vez no verde, para evitar connotaciones WA) con algunos garabatos podría darle a WebAssembly un aspecto reconocible directamente conectado a HTML5. Mmm. Puede intentar eso más tarde.

Tal vez sea una cosa regional, pero no conecto el logo de @fstarks con WhatsApp en absoluto.
Además, como descubrí que el escudo verde es para PHP (y WhatsApp también es verde como lo dice @fstark ), lo volví a colorear a púrpura (y arreglé los errores de píxeles):

Estoy de acuerdo en que debería esperar un logotipo. De hecho, no estoy convencido de que ni siquiera necesite tener uno.

Sin embargo, me gusta pensar en logotipos y me gustan algunos de los diseños que he visto aquí. Si hay un logotipo, creo que debería usar el nombre completo (WebAssembly) o la versión abreviada (wasm). En este último, sugeriría distinguir visualmente la w del asm. Además, se sugiere hacer referencia al aspecto del lenguaje ensamblador de alguna manera.

Asombrado por todas las ideas de logotipos, variación de @Namozag

Parece que prefiero cualquier cosa con 'wasm' o 'asm' allí como texto.

¡Oh, genial, (no) un concurso de logotipos! ¡Y ya algunas ideas geniales! Bueno, esta es mi opinión sobre un logotipo (tratando de incorporar un montón de las ideas anteriores):

• Algo parecido al logotipo de semántica de HTML5 "Dando sentido a la estructura", pero al revés, todavía "permitiendo una web más útil, basada en datos, tanto para los programas como para sus usuarios".
• Datos un poco compactos y fluidos
• Un poco enchufable
• Un poco de pila
• Un poco "W", "A", "S", "M"
• Sombreado opcional y, por supuesto, _verde_

¡Salud!

¡@dcodeIO se ve genial!

@fstark Imagen 2 ,, ¡¡Salud !!

@dcodeIO : ¡bueno!

Quizás algo como esto;)

¡Me gusta mucho el negro / verde de @dcodeIO!

Me gusta el negro y el verde. ¡Salud!

El mié., 1 de jul. de 2015 a la (s) 10:10 am, Jan-Oliver Opdenhövel <
[email protected]> escribió:

Me gusta mucho el negro / verde de @dcodeIO https://github.com/dcodeIO
!

-
Responda a este correo electrónico directamente o véalo en GitHub
https://github.com/WebAssembly/design/issues/112#issuecomment -117662363.

Mi sub

este es un duplicado para mi último sub

¿Deberíamos realizar una encuesta informal para decidir cuál es el mejor logotipo para el proyecto?

Ya te habían hablado del logo de WebAssembly durante mucho tiempo, creo que es hora de terminar.

Enviar por iPhone

在 2015 年 7 月 16 日 ， 22: 36 ， Thomas [email protected]写道 ：

¿Deberíamos realizar una encuesta informal para decidir cuál es el mejor logotipo para el proyecto?

-
Responda a este correo electrónico directamente o véalo en GitHub.

No he probado nada en un software de gráficos, pero mientras esperaba las compilaciones, tuve las siguientes ideas:

• El del centro es una superposición vertical de la W (web) y la A (ensamblaje), y me recuerda mucho al emoticono de una persona levantando la mano al cielo así: \o/
• El de la derecha es el mismo que el del centro, aunque también colapsa muy bien la W (red) y la A (ensamblaje).
• El de la izquierda es el mismo que el del centro, pero también tiene las 4 cabezas flotantes sobre el triángulo central, que se supone que recuerdan el logo temporal original y las mismas ideas.

Si alguien estuviera dispuesto a expandir estas ideas y hacer logotipos reales a partir de estas imágenes de bocetos, ¡sería genial!

Me encanta el negro / verde @dcodeIO

Sobre el tema de la votación, y para ayudar a establecer expectativas en este hilo: aún no tenemos un proceso elegido para elegir un logotipo y sea cual sea este proceso, creo que sucederá más cerca del lanzamiento de WebAssembly (especificaciones e implementaciones) . Habiendo dicho eso, he disfrutado el flujo de ideas aquí y no quiero decirle a nadie que se detenga, solo que no hay prisa ni decisión inminente.

¡Cuantos más, mejor! Estoy de acuerdo con @lukewagner : solo establezcamos un logotipo cuando nos

¡Nunca te rendirás en encontrar el mejor logo!

No soy diseñador, pero hice algunos garabatos y pensé que también podría compartirlos.

Son muy toscos (alineaciones / proporciones / fuente incorrectas), pero la idea general debería resultar.

Vamos a intentar :)

¡La imagen 2 de

@dcodeIO es genial !!

+1 para @dcodeIO

+1 Para @dcodeIO Logotipo negro y verde

+1 para @dcodeIO negro y verde

Realmente como el primero de Raphael

Esto es algo que hice mientras jugaba con Krita. Aunque el diseño ha estado flotando en mi cabeza durante varios meses:

Aquí hay un experimento de 80's-esk que hice mientras jugaba con efectos:

Hola a todos,
Solo quería agregar esta contribución al proyecto, úsela como desee.

Gracias

Los logotipos actuales de HTML5 / CSS / JS son feos y viejos (como esas tecnologías también, lol). Toma ese logotipo vectorial, simple, limpio, poderoso y maldito volador, y haz con él lo que quieras.

wa_logo.zip

Amo el trabajo de @Fogaccio

Me gusta el logo de @Fogaccio .

@Fogaccio 's y @jjmiyao' s obras son cool!

Texto de WASM inspirado y agradecido por Erik Demaine http://erikdemaine.org/fonts/hinged/
Tenga en cuenta que W y M son simétricos. (Al igual que algunos otros personajes, lo que lo hace más divertido).
Usado / sugerido para el proyecto de incubadora experimental F # UN FSharp FSTWASM FSharp To WASM.
Cada letra y número de esta fuente se puede plegar a partir de una cadena universal de piezas con bisagras, específicamente 128 triángulos isósceles rectos con bisagras en sus esquinas afiladas. En particular, cada personaje tiene exactamente la misma área. Además, la cadena se puede plegar en un cuadrado, representado por un punto. Consulte nuestro artículo “Disección articulada del alfabeto”, Journal of Recreational Mathematics, 31 (3): 204–207, 2003.

Soy fan del logo de

+1 en el logo de @Fogaccio , tiene bonitas versiones artísticas en ASCII.

\ \ \  /\
 \/\/\   \

\ \ \   /\
 \ \ \    \
  \/\/\    \

\ \ \    /\
 \ \ \  /  \
  \ \ \     \
   \/\/\     \

...

@Fogacci , ¿tienes la versión .svg , .ai del logo?

@mbebenita si lo hago .. =]

Pero necesito preparar los archivos para la entrega, lo haré lo más rápido posible.

@Fogaccio ¿ Algún progreso en esto?

@kenchris Estoy trabajando en producciones de activos.

@Fogaccio amigable ping

Hola @kenchris y @mbebenita , estoy cerca de terminar los assets .svg y .ai, creo que lo tendré el viernes.

Símbolo de etiqueta HTML + AST.

Hola a todos,
Solo para hacerle saber que aquí (https://github.com/Fogaccio/OpenDesign/tree/master/webassembly_identity) están los archivos de la propuesta de marca que he enviado antes. Espero que estos recursos puedan ayudarlo de la mejor manera. No dude en compartir pensamientos y sugerencias.

Gracias

@Fogaccio gracias, esto es genial. Estoy mirando la versión pequeña de favicon 16x16:

https://raw.githubusercontent.com/Fogaccio/OpenDesign/master/webassembly_identity/favicon/png/browser/favicon_16x16.ico

¿Crees que esto podría hacerse algo más legible? Esta versión del icono se puede utilizar en IDE y otras herramientas. Probablemente necesitemos una versión personalizada de pixel art del logotipo para este tamaño. Estaría feliz de hacer esto, si aún no tienes algo en mente.

Hola @mbebenita , intenté hacer el pixel art en .ico, pero no tuve éxito, no

Estaré muy agradecido por tu ayuda

@Fogaccio usando menos tonos de color (y colores más nítidos, por lo tanto, más contrato con fondo / transparente / blanco) probablemente lo haría parecer más nítido

Sin embargo, es un poco difícil con solo un tamaño de 16x16 :) Necesito elegir cuidadosamente los tonos

Aqui hay otro más. Es un objeto sólido que consta de una "W" encima de una "A" que proporciona un logotipo 2d pixelado de la vieja escuela muy simplista desde una vista y un logotipo 3d desde otra vista. Aquí hay un gif animado:

El objeto sólido se crea mediante programación utilizando el siguiente código en openscad

module LetterW(thickness=5,height=20,width=20,col="Chartreuse")
{
    color(col) {
        union() {
            cube([thickness,thickness,height],false);
            cube([thickness,width,thickness],false);
            translate(v=[width,width-thickness,0])rotate([0,0,90]) union() {
                    cube([thickness,thickness,height],false);
                    cube([thickness,width,thickness],false);
            }
            translate(v=[-1.5*thickness,1.5*thickness,0]) cube([thickness,thickness,height-1.0*thickness]);
            //translate(v=[-1.5*thickness,1.5*thickness,0]) cube([2.5*thickness,thickness,thickness]);
            rotate([0,0,45]) cube([thickness/sqrt(2),sqrt(2)*1.5*thickness,thickness]);
        }
    }

}

module LetterA(thickness=5,height=20,width=20,col="Chartreuse")
{
    offset=-2*thickness;
    color(col) {
        union() {
            translate(v=[0,0,-height]) cube([thickness,thickness,height],false);
            translate(v=[width-thickness,width-thickness,-height]) cube([thickness,thickness,height],false);
            /*
            translate(v=[0,0,offset]) cube([width,thickness,thickness],false);
            translate(v=[width-thickness,0,offset]) cube([thickness,width,thickness],false);
            */
            translate(v=[thickness,0,offset])rotate([0,0,45]) cube([sqrt(2)*(width-thickness),thickness/sqrt(2),thickness]);
        }
    }
}

thickness=5;
height=20;
width=20;
scale=1.0;
$vpr = [0,0,90];

LetterW(scale*thickness,scale*height,scale*width);
LetterA(scale*thickness,scale*height-0.5*thickness,scale*width);

$t = 0.0;
//$vpr = [0, 0, 90];
//$vpr = [$t*90, 0, 90];
$vpr = [90, 0, 90];
$vpr = [90-$t*25, 0, 90-$t*45];

Aquí está la vista 2d:

y aquí está la vista 3D:

Puedo producir variaciones y desarrollar conjuntos de activos cuando sea necesario.

Jugué con un brazo cruzado doblado más simétrico para la A:

pero personalmente prefiero el brazo cruzado recto porque la A es más obvia.

@ h00gs interesante, casi tienes algo de MC Escher, me gusta.

Pensé que una llave inglesa podría comunicar el ensamblaje y podría construirse a partir de formas similares a WA.

@rfernbach de alguna manera su diseño me parece un vikingo:

... necesitamos una mascota? :)

Hola @mbebenita ¿Cómo es el reto de hacer el favicon en pixel art? ... =]

Así que mis esfuerzos iniciales no fueron del todo correctos, así que perseveré y encontré una barra transversal curva para que la A se vea bien. Aquí hay una animación: