Pixel-art, episódio 1: exibir Super Mario


47

sou eu!

A tarefa de hoje é simples: escreva um programa ou uma função que exiba o pequeno sprite Mario ocioso, do Super Mario Bros, no NES, sobre um fundo azul.

Qualquer tipo de entrada é válida desde que exiba esses 12 * 16 pixels em qualquer lugar da tela / janela / navegador.

(EDIT: a imagem exibida pode ser ampliada se o seu idioma não puder fazer pixel art. Você também pode produzir arte ASCII ou arte HTML, mas usando as cores certas.)

Imagem (ampliada em 400%):

Você deve usar as seguintes cores:

  • azul: # 6B8CFF
  • vermelho: # B13425
  • verde / marrom: # 6A6B04
  • laranja: # E39D25

O programa mais curto (em número de caracteres) vence!

As brechas padrão se aplicam (especialmente, nenhuma conexão de rede é permitida), mas é permitida a codificação e a exibição de um arquivo de imagem no seu programa. (as entradas usando esse truque serão classificadas separadamente)

Aqui vamos nós!


Classificação atual

Resposta mais curta usando apenas código:

Resposta mais curta usando algum tipo de imagem codificada:


2
Além disso, a criação de um arquivo não é permitida? Tem que ser exibido?
Martin Ender

1
Não vejo nenhum padrão nessa imagem. Portanto, tudo se resume à melhor compactação que se pode usar em um idioma.
Optimizer

20
Nitpicking: Esse é o Mario, não o Super Mario.
Dennis

5
Que idéia divertida ... Aqui está uma idéia para um desafio de sequela: Pegue a imagem do Mario (qualquer formato) e transforme-a na imagem do Luigi!
Zibbobz 17/10/2014

3
Podemos fazer um programa de piet que se pareça com ele?
Conor O'Brien

Respostas:


36

HTML / JS, 206 158 153 102


102

Truque usado: salve o arquivo GIF compactado como um arquivo HTML e adicione <img src = #> no final

Graças a esta entrada: https://codegolf.stackexchange.com/a/39926/10732 por @NiettheDarkAbsol

GIF87a  ¡ kŒÿã%jk±4%,       6„‡héj„Af-ÕdÎy\%    …R˜0”ŒÈJ­³I©±²û“ú=ª$±p%i¸•¤ <img src=#>

Demonstração: http://meuziere.free.fr/mario/gif.html


Versões mais antigas:

153

Truque usado: salve o arquivo PNG compactado como um arquivo HTML e adicione <img src = #> no final

‰PNG


IHDR         _v”   PLTEjkkŒÿ±4%ã%ó’V   IIDAT×c[ʵj%C€ÍUŸ?|ìíœÿ02„ÿÿÊÐÊàÐÄÈÀ°ŠáÓë~†«ö3üZµž!jÚR‡P x( s6ïåÇ<img src=#>


158

Truque usado: definindo o dataURI aparado de um PNG compactado como SRC de uma tag IMG e empacotando tudo em caracteres Unicode.


Execute isso no seu console JS:

document.write(unescape(escape('🁩𫑧𘁳𬡣👤𨑴𨐺𪑭𨑧𩐻𨡡𬱥𝠴𛁩𥡂𣱒𭰰𢱇𩱯𠑁𠑁𣡓𥑨𡑕𩱁𠑁𠑷𠑁𠑁𤑁𩱍𠑁𠑂𩡄𜱡𥑁𠑁𠑄𡡂𣑖𡑖𬑡𭱒𬡪𤀫𮁎𠱘𪡮𤱘𮡫𩱨𥱁𠑁𠑓𥑬𡑑𥡑𢐱𜡍𢑗𮁘𢱅𣁖𬑊𥑏𠑺𥡕𡱮𮠹𛱇𦁺𬰷𤡭𨰯𮡁𮑨𤀯𛱹𪁄𤑅𣑲𩰰𣑔𢑷𣁃𢱧𩑈𥀶𜰶𡱦𝡶𜡍𛱸𨑴𦠴𪁡𭁰𤱂𫱤𤑯𢁧𫱁𭰾').replace(/uD./g,'')))


206

Sem embalagem (206b):

<img src=data:image;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAQAgMAAABfD3aUAAAADFBMVEVqawRrjP+xNCXjnSXzkghWAAAASUlEQVQI12MIWxXKELVqJUOAzVUGnz9/GXzs7Rmc/zAyhP//yhDQEMrg0MTIwLCKgeHT636Gf6v2M/xatZ4hatpSBodQoHgoAw>

Demo


Ferramentas usadas:


Você não precisa das tags. Basta usar o uri de dados do chrome e inseri-lo na sua barra de URL. 200 caracteres
Otimizador

Hum ... eu considerei que o dataURI não é um "programa" válido. Mas você está certo. Todos os navegadores permitem dataURIs na barra de endereços.
xem 16/10

Agora você está usando uma brecha como OP;). Você está transferindo todo o trabalho para a compactação externa / interna do formato GIF. Se isso é legal, todos devemos procurar formatos de imagem obscuros com a melhor taxa de compactação agora, e eu poderia ter poupado muito trabalho escrevendo minha própria compactação. ;)
Martin Ender

2
@ xem Bem, seu desafio, sua ligação. Mas parece um pouco inútil se agora estamos apenas procurando o formato de arquivo existente mais compactado. ;)
Martin Ender

1
Parece que o link rawgit está morto.
Addison Crump #

27

Mathematica, 412 292 252 212 163 148 143 141 caracteres

f=FromDigits[ToCharacterCode@#,2^16]~IntegerDigits~#2&;Image@Partition[f["넴╫賿橫ӣ鴥",256][[3#+1;;3#+3]]/256&/@"吀啐^A媾핮﻽溿뽫ﺩ埿⩕樨ꦪª⿼?ཐᐅ橕ꦪ喪"~f~4,12]

Isso usa notação de sinal de intercalação ^Apara o caractere de controle no ponto de código 1. No Mathematica, eu posso realmente incorporar o personagem literalmente, embora isso leve a todo tipo de feiura ao copiar as coisas. De qualquer forma, o texto acima é 2 caracteres menor que minha versão anterior, e eu os usei com base-4 em vez de base-5 para codificar os índices da paleta de cores. No momento, não posso me incomodar em corrigir a explicação e a captura de tela abaixo, por isso estou deixando você aqui com a versão base 5 original da minha resposta:


f=FromDigits[ToCharacterCode@#,2^16]~IntegerDigits~#2&;Image@Partition[f["넴╫賿橫ӣ鴥",256][[3#-2;;3#]]/256&/@"ᯱ曎㌟뱮䚻륏Σ襺ﺦ您汜豈塘ᙉ雬儥衰ꐰꃾ纔ㆯ쭴뫋澖ᕿ蓉"~f~5,12]

Estou codificando os pixels em caracteres Unicode (sim, para contar por caracteres!).

Aqui está o que parece no Mathematica:

insira a descrição da imagem aqui

Veja como funciona:

Primeiro, definimos uma função fque transforma seqüências de caracteres Unicode (passadas como o primeiro argumento #) em listas de números inteiros. Primeiro, obtemos os códigos de caracteres. Esses podem ser interpretados como dígitos de um número 65536 base. E então convertemos esse número em outra base, passada como o segundo argumento #2.

Agora vamos fazer isso para a string Unicode mais longa. ToCharacterCodeproduz esta lista:

{7153, 26318, 13087, 48238, 18107, 47439, 931, 35194, 62191, 65190, \
 24744, 57782, 27740, 35912, 22616, 5705, 38636, 20773, 34928, 42032, \
 41214, 32404, 12719, 52084, 47819, 28566, 5503, 33993}

Tratando isso como base 65536:

7933607912575313477287527915733176998797205587959732019781370103381...
4831246938139171755469819519515972565671101475553962564506286523593

E convertendo para a base 5:

{2, 2, 2, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 1, \
 2, 2, 2, 3, 3, 3, 4, 4, 3, 4, 2, 2, 2, 2, 3, 4, 3, 4, 4, 4, 3, 4, 4, \
 4, 2, 2, 3, 4, 3, 3, 4, 4, 4, 3, 4, 4, 4, 2, 3, 3, 4, 4, 4, 4, 3, 3, \
 3, 3, 2, 2, 2, 2, 4, 4, 4, 4, 4, 4, 4, 2, 2, 2, 2, 3, 3, 1, 3, 3, 3, \
 2, 2, 2, 2, 2, 3, 3, 3, 1, 3, 3, 1, 3, 3, 3, 2, 3, 3, 3, 3, 1, 1, 1, \
 1, 3, 3, 3, 3, 4, 4, 3, 1, 4, 1, 1, 4, 1, 3, 4, 4, 4, 4, 4, 1, 1, 1, \
 1, 1, 1, 4, 4, 4, 4, 4, 1, 1, 1, 1, 1, 1, 1, 1, 4, 4, 2, 2, 1, 1, 1, \
 2, 2, 1, 1, 1, 2, 2, 2, 3, 3, 3, 2, 2, 2, 2, 3, 3, 3, 2, 3, 3, 3, 3, \
 2, 2, 2, 2, 3, 3, 3, 3}

Esses são os índices de cores dos pixels, em ordem azul, vermelho, verde e laranja. Nós os usamos para indexar nessa lista de números, que é a paleta de cores.

Agora, a paleta de cores. É isso "넴╫賿橫ӣ鴥". Usamos os índices acima para selecionar a string correta. Em seguida, aplicamos nossa função novamente, mas usando a base 256. Isso gera uma lista de 12 números inteiros:

{177, 52, 37, 107, 140, 255, 106, 107, 4, 227, 157, 37}

Usamos a ;;indexação de intervalo para extrair a fatia relevante para a cor atual.

Por fim, usamos apenas Partitionpara dividir isso em linhas 12e alimentá-lo Image. Voilà!

Edit: Com a embalagem Unicode, o RLE não valia mais a pena. A remoção salvou 50 caracteres.

Edit: Obviamente, sem o RLE, também não há necessidade de ir para a base 16.

Edit: E enquanto estamos nisso, por que não Unicode-pack a paleta de cores também? (Tenho um palpite de que posso economizar um pouco mais, transformando toda a paleta de cores em uma única sequência e usando Partition-a também. Tentarei isso mais tarde.)

Edit: Sim, isso eliminou outros 5 bytes.


1
você se importaria de adicionar uma captura de tela do resultado? (não que eu não confio em seu código, mas curioso sobre como ele é exibido:??? em uma janela de um navegador mais)
xem

@xem Vai fazer. É um ambiente REPL capaz de entrada e saída gráfica.
Martin Ender

Não tenho certeza, mas você está espelhando a parte inferior da imagem?
Optimizer

1
@ Otimizador Não, duvido que seja capaz de fazer isso em menos caracteres do que economizaria.
Martin Ender

Quando olho para a documentação do Mathematica, não vejo nenhum uso no til, mas parece que você está usando aqui para alimentar o resultado de uma função em outra e, em seguida, aplicar um argumento adicional à segunda função (IntegerDigits)? Além disso, a paleta de cores: olhando para a imagem, parece que existem apenas quatro cores, mas sua paleta de cores parece incluir mais do que isso: {177, 52, 37, 107, 140, 255, 106, 107, 4, 227 157, 37}. Observando a documentação da Image, parece que ela imprime em escala de cinza, a menos que sejam fornecidas opções adicionais como ColorScale -> RGB.
CryptoCommander

20

Java: 398 377

void s(){new java.awt.Frame(){public void paint(java.awt.Graphics g){int i=0,x,m[]={12226,44085194,467839834,0x5abea55a,0x5bbd5d50,0x5ffe9540,0x5ffe9540,0x5aee5d50,531408218,334277466,333492170,0xc02fc2},c[]={7048447,0xB13425,6974212,0xE39D25};for(setSize(99,99);i<192;g.setColor(new java.awt.Color(c[m[x]&3])),m[x]/=4,g.drawLine(x+40,60-i%16,x+40,60-i++%16))x=i/16;}}.show();}

Simplesmente desenha o sprite descompactando um int para cada coluna. Mostrado em um programa completo:

class P{
    public static void main(String[]a){
        new P().s();
    }

    void s(){
        new java.awt.Frame(){           
            public void paint(java.awt.Graphics g){
                int i=0,x,m[]={12226,44085194,467839834,0x5abea55a,0x5bbd5d50,0x5ffe9540,
                               0x5ffe9540,0x5aee5d50,531408218,334277466,333492170,0xc02fc2},
                          c[]={7048447,0xB13425,6974212,0xE39D25};
                for(setSize(99,99);i<192;
                    g.setColor(new java.awt.Color(c[m[x]&3])),m[x]/=4,
                    g.drawLine(x+40,60-i%16,x+40,60-i++%16)
                )x=i/16;
            }
        }.show();
    }
}

Captura de tela obrigatória:

sou eu Mario


1
Você pode salvar 9 bytes usando um import java.awt.*.
Kevin Cruijssen 27/02

15

Código da máquina x86, 102 bytes

Como funciona: a imagem é armazenada como uma imagem de 2 bits usando uma paleta. Cada linha da imagem é armazenada como 3 bytes, seguidos por 1 byte da paleta de cores. Isso permite que os dados sejam carregados como um único DWORD. Os doze pixels são impressos mascarando os 2 bits mais baixos do valor, gravando-os na memória de vídeo e, em seguida, deslocando o valor inteiro dois bits à direita. Após a saída dos pixels da linha, o byte da paleta é gravado na paleta VGA. Quando a imagem termina de desenhar, o programa entra em um loop infinito.

Código de montagem para gerar o binário:

org 100h
mov al,13h
int 10h
les ax,[bx]

mov si,image_data
draw:
add di,320-12
lodsd
xchg eax,ebx
mov cl,12
row:
mov ax,bx
and al,3
stosb
shr ebx,2
loop row
xchg ax,bx
mov dx,0x3c9
out dx,al
test al,al
jnz draw

image_data: db 21,0,85,0xb1/4, \
5,0,64,0x34/4,            \
165,190,87,0x25/4,        \
185,191,127,0x6b/4,       \
185,254,254,0x8c/4,       \
233,191,106,0xff/4,       \
213,255,95,0x6a/4,        \
165,168,85,0x6b/4,        \
169,40,106,0x4/4,         \
170,0,170,0xe3/4,         \
47,195,248,0x9d/4,        \
63,0,252,0x25/4,          \
15,0,240,111,             \
5,20,80,111,              \
169,85,106,111,           \  
170,85,170 

Binário codificado na base 64, salve-o como Mario.com para executá-lo: sBPNEMQHvigBgcc0AWatZpOxDInYJAOqZsHrAuL1k7rJA + 6EwHXiwxUAVSwFAEANpb5XCbm / fxq5 / v4j6b9qqV8QwA

Saída de amostra: insira a descrição da imagem aqui


10

GIF - 93 bytes

A codificação da imagem está aparentemente bem agora, então ... sim? : D

GIF87a  ¡ kŒÿã%jk±4%,       6„‡héj„Af-ÕdÎy\%    …R˜0”ŒÈJ­³I©±²û“ú=ª$±p%i¸•¤  ;

Como visto no Notepad ++

captura de tela no NP ++

Como PHP - 131 bytes

<? header("Content-Type:image/gif");?>GIF87a  ¡ kŒÿã%jk±4%,       6„‡héj„Af-ÕdÎy\%  …R˜0”ŒÈJ­³I©±²û“ú=ª$±p%i¸•¤  ;

1
você pode fazer o upload do seu gif em algum lugar (ctrlv.in por exemplo)? Eu gostaria de usá-lo em minha entrada, em vez de PNG :)
xem


@NiettheDarkAbsol Não sei bem como você contou o tamanho disso, mas conto 150 bytes. Independentemente disso, a pontuação é por caracteres, e parece ter 114 caracteres.
Martin Ender

2
Sim, o snippet do PHP é bom para mim (mesmo que você possa remover os últimos 2 bytes). Mas o snippet de gif bruto não é um programa.
xem 16/10

1
@xem: se o navegador for considerado um "intérprete" para HTML / javascript / etc, e alimentar o snippet de gif bruto pelo mesmo mecanismo resulta na saída desejada ... a diferença se torna pequena
Mooing Duck

10

Bash + ImageMagick: 350 331 321 caracteres

(Paleta descaradamente roubado de Martin Büttner 's resposta .)

p=(B13425 6B8CFF 6A6B04 E39D25)
for c in 21 0 85 5 0 64 165 190 87 1{85,91,27,85} 254{,} 233 191 106 213 255 95 165 168 85 169 40 106 170 0 170 47 195 248 63 0 252 15 0 240 5 20 80 169 85 106 170 85 170;{
for j in 0 2 4 6;{
d+=(-fill \#${p[c>>j&3]} -draw point\ $[i%12],$[i++/12])
}
}
convert -size 12x16 xc: "${d[@]}" x:

Saída de amostra:

Mario

Para inspecioná-lo, adicione -scale 120com facilidade convertos parâmetros para obter uma versão em escala de 10x:

Mario escalado 10


2
s/185 191 127 185 254 254/1{85,91,27,85} 254{,}/; s/do/{/; s/done/}/
grawity

Doh. Eu até upvoted DigitalTrauma relacionado 's ponta , mas eu continuo esquecendo que {.. }. Obrigado, @grawity.
manatwork

8

Octo / XO-Chip , 70 bytes

O Octo é uma linguagem assembly de alto nível que é compilada em instruções codificadas por código para a máquina virtual CHIP-8 . A Octo fornece algumas extensões personalizadas chamadas "XO-Chip" para o bytecode básico do CHIP-8, incluindo a capacidade de desenhar bitmaps de 4 cores por meio de planos de bits sobrepostos.

Os bytes compilados são os seguintes:

0xA2 0x08 0xF3 0x01 0xD0 0x00 0x1F 0x00 0x3F 0xC0 0x39 0x00 0x51 0x00 0x58 0x80
0x21 0xE0 0x00 0x00 0x3F 0x00 0x7F 0xE0 0xFF 0xF0 0x36 0xC0 0x1F 0x80 0x3F 0xC0
0x39 0xC0 0x70 0xE0 0xF0 0xF0 0x00 0x00 0x00 0x00 0x3F 0x80 0x7F 0xE0 0x7F 0xF0
0x3F 0xE0 0x1F 0xC0 0x37 0x00 0x76 0xE0 0xF0 0xF0 0xE9 0x70 0xE0 0x70 0xC0 0x30
0x00 0x00 0x70 0xE0 0xF0 0xF0

mario

Execute-o aqui no seu navegador: http://johnearnest.github.io/Octo/index.html?gist=33aa37d4717a425ccd4f

Provavelmente é mais esclarecedor ver a linguagem assembly Octo que produz esse bytecode:

: main
    i := mario
    plane 3
    sprite v0 v0 0

: mario
    0x1F 0x00 0x3F 0xC0 0x39 0x00 0x51 0x00 
    0x58 0x80 0x21 0xE0 0x00 0x00 0x3F 0x00 
    0x7F 0xE0 0xFF 0xF0 0x36 0xC0 0x1F 0x80 
    0x3F 0xC0 0x39 0xC0 0x70 0xE0 0xF0 0xF0 
    0x00 0x00 0x00 0x00 0x3F 0x80 0x7F 0xE0 
    0x7F 0xF0 0x3F 0xE0 0x1F 0xC0 0x37 0x00 
    0x76 0xE0 0xF0 0xF0 0xE9 0x70 0xE0 0x70 
    0xC0 0x30 0x00 0x00 0x70 0xE0 0xF0 0xF0 

O programa principal é três instruções de dois bytes. Defina o registro do índice de memória ino início do segmento de dados, selecione o plano de desenho 3 (3 é uma máscara de bit; isso indica que você deseja desenhar no modo de 4 cores com os dois planos de bit) e, em seguida, desenhe um sprite na posição xey indicada por registrador v0(inicializado em zero). O 0 final fornece o tamanho do sprite, que nos conjuntos de instruções SuperChip e XO-Chip desenhará um sprite de 16x16. No modo de 4 cores, um bitmap para o primeiro plano é seguido imediatamente por um bitmap para o segundo plano.

Para ver como os aviões funcionam, considere este programa modificado que rola um plano para a direita após desenhar mario:

mario2

: main
    i := mario
    plane 3
    sprite v0 v0 0
    plane 2
    scroll-right
    scroll-right
    scroll-right
    scroll-right

: mario
    0x1F 0x00 0x3F 0xC0 0x39 0x00 0x51 0x00 
    0x58 0x80 0x21 0xE0 0x00 0x00 0x3F 0x00 
    0x7F 0xE0 0xFF 0xF0 0x36 0xC0 0x1F 0x80 
    0x3F 0xC0 0x39 0xC0 0x70 0xE0 0xF0 0xF0 
    0x00 0x00 0x00 0x00 0x3F 0x80 0x7F 0xE0 
    0x7F 0xF0 0x3F 0xE0 0x1F 0xC0 0x37 0x00 
    0x76 0xE0 0xF0 0xF0 0xE9 0x70 0xE0 0x70 
    0xC0 0x30 0x00 0x00 0x70 0xE0 0xF0 0xF0 

Se você gosta disso, pode gostar de uma de minhas outras soluções escritas com Octo. Na verdade, há um congestionamento de jogo no mês de outubro com base nessa ferramenta.


6

Groovy 417 386

Divertido como o inferno, mas com uma contagem terrível de caracteres. GroovyFX necessário

m=[b:'6B8CFF',r:'B13425',g:'6A6B04',o:'E39D25'];groovyx.javafx.GroovyFX.start{stage(visible:!0){scene(width:60,height:80){flowPane{"3b5r4b2b9r1b2b3g2o1g1o3b1b1g1o1g3o1g3o1b1b1g1o2g3o1g3o1b2g4o4g1b3b7o2b2b2g1r3g4b1b3g1r2g1r3g1b4g4r4g2o1g1r1o2r1o1r1g2o3o6r3o2o8r2o2b3r2b3r2b1b3g4b3g1b4g4b4g".toList().collate 2 each{l->(l[0]as int).times{rectangle(width:5,height:5,fill:"#"+m[l[1]])}}}}}}

ungolfed:

m=[b:'6B8CFF',
   r:'B13425',
   g:'6A6B04',
   o:'E39D25']           

s=5

groovyx.javafx.GroovyFX.start {bd->
  stage(visible: !0) {
    scene(width:s*12, height:s*16) {
      flowPane {
        "3b5r4b 2b9r1b 2b3g2o1g1o3b 1b1g1o1g3o1g3o1b 1b1g1o2g3o1g3o 1b2g4o4g1b 3b7o2b 2b2g1r3g4b 1b3g1r2g1r3g1b 4g4r4g 2o1g1r1o2r1o1r1g2o 3o6r3o 2o8r2o 2b3r2b3r2b 1b3g4b3g1b 4g4b4g"
          .replaceAll(" ", "")
          .toList()
          .collate(2) 
          .each { l->
            t=l[0] as int
            cr=m[l[1]]
            t.times {
              rectangle(width:s, height:s, fill:"#"+cr) 
            }
          }
      }
    }
  }
}

insira a descrição da imagem aqui


grep()em vez detoList()
cfrick 18/10/2014

5

HTML / JS, 427 408 264 256 239 226 caracteres

Obfuscatweet, 271 270 264 256 239 226 caracteres

Usando obfuscatweet, conseguiu reduzir isso para <250: D

document.write(unescape(escape('🁳𨱲𪑰𭀾𨰽𦰢𝡂𞁃𡡆𘠬𘡂𜐳𝀲𝐢𛀢𝡁𝡂𜀴𘠬𘡅𜰹𡀲𝐢𧐻𨐽𙰰𜐵𝐰𜀰𝐵𝐵𝀰𠑂𡑃𜀲𡑆𡑆𠰲𡑂𡡂𡠲𠡆𡑁𞀰𜱆𡡆𜀰𠐶𠐰𜀲𠐶𞑁𞁁𠐵𝑁𠑆𞑄𝰶𡡆𡀵𝐷𡡆𝐵𝐵𡠰𝐴𜐵𜀲𠐰𜁁𞁁𠐰𜁁𠐧𞱷𪑴𪀨𩁯𨱵𫑥𫡴𚑦𫱲𚁩🐰𞱩🀹𝠻𭱲𪑴𩐨𙰼𨡲🠧𚐩𮱨🐨𙰰𜀰𙰫𬁡𬡳𩑉𫡴𚁡𛡳𫁩𨱥𚁩𛁩𚰽𝠩𛀱𝠩𛡴𫱓𭁲𪑮𩰨𝀩𚐮𬱬𪑣𩐨𛐱𜠩𞱦𫱲𚁪🐰𞱪🀱𜠻𭱲𪑴𩐨𙰼𬡰𘁳𭁹𫁥🐢𬁡𩁤𪑮𩰺𜐠𞀻𨡡𨱫𩱲𫱵𫡤𞠣𙰫𨱛𪁛𪠫𚱝𧐫𙰢🠼𛱲𬀾𙰩𚐻𯐼𛱳𨱲𪑰𭀾').replace(/uD./g,'')))

O código abaixo é o que consiste.

Truque usado: imagem convertida em base4 String de blocos de cores, convertida em String hexadecimal. O índice da base 4 indica cor (0 = azul, 1 = VERMELHO etc.). CSS com um p inline é usado porque divs precisam de conteúdo para expandir (também p é mais curto). Como o CSS precisa começar com uma letra, 'A' é precedido antes das tags CSS.

O preenchimento do CSS fornece pixels. Nada disso usa caracteres Unicode, com os quais não estou muito familiarizado, apesar de provavelmente ficar abaixo de 300 nesse caso. A vantagem relativa de usar o preenchimento é que você pode, como neste caso, ampliar a imagem para o tamanho que desejar para cada pixel. Eu usei 9 pixels, mas se você gastar um caractere extra, poderá obter até 99 pixels por pixel representado.


CSS, 127 119 118 114 100 13 0 caracteres

Mudar de ppara rpremove a necessidade de display:inline, custa +1 char, -15! caracteres!

Foram removidas todas as cores e colocadas em uma matriz nos caracteres JS -87. Então eu apenas removi todo o css

JS, 300 289 280 275 329 325 caracteres

c=["6B8CFF","B13425","6A6B04","E39D25"];a='0155000555540ABEC02EFEFC2EBFBF2BFEA803FFF00A6A002A69A8AA55AAF9D76FFD557FF5555F0541502A00A8AA00AA';with(document)for(i=0;i<96;write('<br>')){h=('000'+parseInt(a.slice(i,i+=6),16).toString(4)).slice(-12);for(j=0;j<12;write('<rp style="padding:1 8;background:#'+c[h[j++]]+'"></rp>'));}

Tentei cortar o máximo que pude desse JS simples, processando uma cadeia hexadecimal, mas, como é a minha primeira tentativa, é assim que chego usando apenas o que sei. A escrita em HTML foi reduzida por uma função que adiciona tags, e as classes usam o valor base 4 para determinar a cor a ser exibida.

Usando redução adicional, substituiu charAt por [] e removeu a classe A0 e defina azul como cor padrão para p, economizando 10 caracteres adicionais. O custo adicional para usar rptags é compensado por uma enorme perda de CSS.

Deslocamento adicional da remoção do bloco de loop while até a adição de '000' para o caso de uso e o fatiamento de -12 a partir dele.

Adicionado JS adicional para cores e, em seguida, coloque o preenchimento. Percebeu um bug no preenchimento que requer 2 caracteres extras para corrigir. Compactou um monte de loops

Arquivo HTML, 430 429 419 399 366 342 caracteres

Demo

<script>c=["6B8CFF","B13425","6A6B04","E39D25"];a='0155000555540ABEC02EFEFC2EBFBF2BFEA803FFF00A6A002A69A8AA55AAF9D76FFD557FF5555F0541502A00A8AA00AA';with(document)for(i=0;i<96;write('<br>')){h=('000'+parseInt(a.slice(i,i+=6),16).toString(4)).slice(-12);for(j=0;j<12;write('<rp style="padding:1 8;background:#'+c[h[j++]]+'"></rp>'));}</script>

Agradável! Aconselho você a remover todas as quebras de linha do seu código e fornecer um link para uma demonstração ( c99.nl ). Como bônus, você pode incluir sua entrada nos caracteres Unicode usando xem.github.io/obfuscatweet . Isso irá melhorar sua pontuação.
xem 16/10

Além disso, você pode remover as tags & lt; html>, colocar a tag & lt; style> no final e remover o / style e o "}" à direita da última regra CSS.
xem 16/10

OK, cortei todas as linhas e esmaguei tudo. Vou tentar descobrir uma maneira ideal de dividir o JS pelo obfuscatweet.
Compass

1
O obfuscatweet aceita qualquer código js (para que você possa colocar seus 289 caracteres js) ou qualquer código html (para copiar seu arquivo html aqui). A saída do obfuscatweet pode ser executada no console do navegador ou em um arquivo HTML usando a metatag charset correta.
xem 16/10

psst, você esqueceu de remover o último "}" da parte CSS. Funciona sem ele.
xem 17/10

5

MATLAB, 194 193 bytes

O código:

imagesc(dec2base(base2dec(reshape('5FVQL5VVVT50A4L4HA594GAHA45A015DAL551G2L41GO101VO0A7FMAANVVAAVVVQ5VLVL40L8100L80',5,[])',32),4)-48);colormap([106 107 4;107 140 255;227 157 37;177 52 37]/255)

E a saída:

Mario

Basicamente, converti a imagem do Mario para que cada pixel seja um número de 2 bits. Eu então codifiquei isso na base 32, que é a string mostrada no código. Essa string é remodelada primeiro para 5 x 16 (cada linha (12 px) de números de 2 bits foi codificada na base 32) e depois convertida novamente na base 10. O resultado é convertido novamente, desta vez na base 4, produzindo uma matriz 12x16 de Números de 2 bits. Esses números são plotados usando imagesc(). Em seguida, as cores são atribuídas usando colormap()um mapa de cores personalizado dos valores hexadecimais necessários.

Divertidamente, um terço do número de bytes usados ​​serve apenas para o MATLAB definir as cores corretas após a plotagem. O código de cores é quase o mesmo número de bytes que toda a cadeia base32!

Sem corrigir a cor (remover a colormap()chamada), são 135 bytes e esta é a saída para o mapa de cores padrão no MATLAB R2013a:

Mario, sem mapeamento


4

JavaScript / CSS / HTML 446 430 407 353 328 316

Joguei o máximo que pude e acabei com algum HTML / JS sujo, mas o que quer que seja ... funciona.

Edit : É isso aí ... eu terminei.

Editar Seriamente feito desta vez.

Javascript

for(i=0;i<192;)document.body.innerHTML+=(i%12?"":"<br>")+"<font color=#"+["6B8CFF","B13425","6A6B04","E39D25"]["000111110000001111111110002223323000023233323330023223332333022333322220000333333300002212220000022212212220222211112222332131131233333111111333331111111133001110011100022200002220222200002222"[i++]]+">█"

JSFiddle


O JSFiddle vinculado não contém a mesma versão postada aqui e não funciona (pelo menos não para mim no Firefox). A propósito, para uma saída melhor *{line-height:1}, a ajudaria.
manatwork

@manatwork Tente novamente.
SomeShinyObject

Agradável. Mas por que o div? Por curiosidade, tentei uma versão do ECMAScript. Tenho 372 caracteres: jsfiddle.net/768h7brb
manatwork

porque <div></div>é mais curto que document.createElement('div'). E jsFiddle não gostadocument.write
SomeShinyObject

1
Reverter a condição do operador ternário para se livrar do lado direito da comparação: i%12?"":"<br>".
manatwork

4

Matlab - 449/3382305 bytes

compressão parcial + Usando a simetria inferior da imagem:

a=[0,0];b=[2,2];c=[3,3];d=[a,0];f=[b,2];g=[c,3];h=[b,b];i=[a,a];k=[1,1];l=[0,f,1,2;h,k;c,2,1,3,1;g,k,1;c,k,k;a,k,1,0;0,f,a;h,a];imshow(uint8([d,k,1,k,i;a,k,k,k,k,1,0;a,f,c,2,3,d;0,2,3,2,g,2,g,0;0,2,3,b,g,2,g;0,b,c,c,h,0;d,g,g,3,a;a,b,1,f,i;[l fliplr(l)]]),[107 140 255;177 52 37;106 107 4;227 157 37]/255)

- Versão parcialmente compactada (332 bytes):

a=[0,0]
b=[2,2]
c=[3,3]
d=[a,0]
e=[1,1,1]
f=[b,2]
g=[c,3]
h=[b,b]
i=[a,a]
imshow(uint8([d,e,1,1,i;a,e,e,e,0;a,f,c,2,3,d;0,2,3,2,g,2,g,0;0,2,3,b,g,2,g;0,b,c,c,h,0;d,g,g,3,a;a,b,1,f,i;0,f,1,b,1,f,0;h,e,1,h;c,2,1,3,1,1,3,1,2,c;g,e,e,g;c,e,e,1,1,c;a,e,a,e,a;0,b,2,i,f,0;h,i,h]),[107 140 255;177 52 37;106 107 4;227 157 37]/255)

Versão totalmente descompactada (449 bytes):

imshow(uint8([0,0,0,1,1,1,1,1,0,0,0,0;0,0,1,1,1,1,1,1,1,1,1,0;0,0,2,2,2,3,3,2,3,0,0,0;0,2,3,2,3,3,3,2,3,3,3,0;0,2,3,2,2,3,3,3,2,3,3,3;0,2,2,3,3,3,3,2,2,2,2,0;0,0,0,3,3,3,3,3,3,3,0,0;0,0,2,2,1,2,2,2,0,0,0,0;0,2,2,2,1,2,2,1,2,2,2,0;2,2,2,2,1,1,1,1,2,2,2,2;3,3,2,1,3,1,1,3,1,2,3,3;3,3,3,1,1,1,1,1,1,3,3,3;3,3,1,1,1,1,1,1,1,1,3,3;0,0,1,1,1,0,0,1,1,1,0,0;0,2,2,2,0,0,0,0,2,2,2,0;2,2,2,2,0,0,0,0,2,2,2,2]),[107 140 255;177 52 37;106 107 4;227 157 37]/255)

Saída nos dois casos (ampliada na tela obviamente, a real é 12x16pix):
MarioMagnified


Ei, eu me perguntei se alguém iria explorar a simetria de alguma forma. Não consegui encontrar uma maneira com o método que finalmente segui.
Bumpy

4

C, 4999 bytes

Isso absolutamente não pode competir com algumas das respostas aqui, mas pensei em dar uma chance em C. O código é uma única linha longa, então aqui está um link pastebin. Se você preferir, aqui está uma codificação base64 do código compactado em gzip:

H4sICAzFGFYCA21hcmlvLmMA3Zc9DsIwDIXv0qndUqchkXwUurAgdYiFEEyIu4NYaZBI7PzNT3Lsz4mf408bjdPjct3odh6HVeujdgg4K4vzohCM8esdjHOpkrVoALUtIrBX8y1R04DKNCGZmTp85CVdAHifYuxO3mElIlju6xaRICOgCo4pD64PoiTzHnkZcHYnRhAYcEEpFznxB1mXP4TdS/KeVGYPZbmVaQHlnRVZFi65OkhoGodq+RHrby4xsTj8i6RmapXrPvfa0Q8ZWZY1/UPbSiC7Z2bYA7r0zla57Xmo8sOEzxdNYIXFhxMAAA==

Notável, pois não requer bibliotecas externas para executar.

Requer terminal xterm, Konsole ou GNOME, porque usa a expansão RGB para os códigos de escape de cores ANSI para produzir as cores corretas (o ANSI não define laranja). Por razões óbvias, o ideone não funciona. Ele pode ser executado no Windows no Cygwin, que usa o xterm (de fato, foi assim que eu o testei). MSYS pode funcionar; Não tenho certeza.

Saída na minha máquina (xterm):

sou eu, mario!


2
-1 é um múltiplo de 10 #
Conor O'Brien

Desculpe, foi em referência à pontuação #
Conor O'Brien

4

Excel VBA, 310 307 295 Bytes

Função Janela Anônima do VBE Immediates que gera um Mario para o objeto Activesheet nas células A1:L16

o=2465251:Cells.RowHeight=48:a[A1:L16],-29589:a[C4:K5,D3:I7,J7,L5,A11:L13],o:a[C3:E3,H3:H4,B4:B6,C6,D4:D5,E5,I5,H6:K6,C8:H8,B9:K10,A10:L10,C11,J11,B15:D16,A16,I15:K16,L16],289642:a[D1:H1,C2:K2,E8:E10,F10:H10,H9,D11:I13,C13:E14,H13:J14],2438321:a[E11,H11],o

SubRotina auxiliar a

Sub a(r,c):r.Interior.Color=c:End Sub

Versão Ungolfed

Public Sub b()
    o = 2465251
    Cells.RowHeight = 48
    a [A1:L16], -29589
    a [C4:K5,D3:I7,J7,L5,A11:L13], o
    a [C3:E3,H3:H4,B4:B6,C6,D4:D5,E5,I5,H6:K6,C8:H8,B9:K10,A10:L10,C11,J11,B15:D16,A16,I15:K16,L16], 289642
    a [D1:H1,C2:K2,E8:E10,F10:H10,H9,D11:I13,C13:E14,H13:J14], 2438321
    a [E11,H11], o
End Sub


Private Sub a(ByRef r As Range, ByVal c As Integer)
    r.Interior.Color = c
End Sub

-3 bytes para remover espaços em branco -12 bytes para usar [...]notação sobre Range(...)notação; mudando de cores hexadecimais para cores int

Resultado

Sou eu


3

Bash 346

festança pura com VT100 como seqüências de escape (desculpe não laranja nessa paleta)

C="  "
B="\033[44m$C"
R="\033[41m$C"
G="\033[42m$C"
O="\033[43m$C"
N="\033[00m\n"
A="BBBRRRRRBBBBNBBRRRRRRRRRBNBBGGGOOGOBBBNBGOGOOOGOOOBNBGOGGOOOGOOONBGGOOOOGGGGBNBBBOOOOOOOBBNBBGGRGGGBBBBNBGGGRGGRGGGBNGGGGRRRRGGGGNOOGRORRORGOONOOORRRRRROOONOORRRRRRRROONBBRRRBBRRRBBNBGGGBBBBGGGBNGGGGBBBBGGGGN"
while read -n1 v
do
  printf "${!v}"
done <<< "$A"

1
Você pode reduzi-lo usando uma matriz para a paleta em vez de caracteres separados. Como a declaração de matrizes associativas é longa, é melhor recodificá-la para números inteiros. Uma versão de 295 caracteres do seu código: pastebin.com/d0LW0HM1
manatwork

3

Pitão, 83 bytes

Isenção de responsabilidade: este não é um candidato vencedor, porque alguns dos recursos do idioma foram criados após a publicação da pergunta.

.wc16@Lc4CM"±4%kÿjkã%"jC"T\0UP\0Z¾Õnþýn¿¿kþ©WÿõZ*Uj(©ª\0ªøÃ/ü\0?ð\0PjU©ªUª"4

Aqui está um hex-dump:

00000000   2E 77 63 31  36 40 4C 63  34 43 4D 22  B1 34 25 6B  .wc16@Lc4CM".4%k
00000010   8C FF 6A 6B  04 E3 9D 25  22 6A 43 22  54 5C 30 55  ..jk...%"jC"T\0U
00000020   50 5C 30 01  5A BE D5 6E  FE FD 6E BF  BF 6B FE A9  P\0.Z..n..n..k..
00000030   57 FF F5 5A  2A 55 6A 28  A9 AA 5C 30  AA F8 C3 2F  W..Z*Uj(..\0.../
00000040   FC 5C 30 3F  F0 5C 30 0F  50 14 05 6A  55 A9 AA 55  .\0?.\0.P..jU..U
00000050   AA 22 34                                            ."4

Você também pode baixar o programa aqui e executá-lo com

python3 pyth.py mario.pyth

Isso cria um arquivo o.png:

Mario

Explicação:

Existem apenas 4 cores diferentes, portanto, preciso apenas de 2 bits para salvar a cor de cada pixel.

.wc16@Lc4CM"..."jC"..."4
                  "..."   the colors of the image, 2 bit per pixel
                 C        convert these bytes to a number
                j      4  and convert it to base 4 (extracting the colors)
           "..."          the hexcodes of the 4 colors (3 byte per color)
         CM               convert each byte into its number
       c4                 split into 4 lists
     @L                   for each pixel, pick the correct list of color-list
  c16                     split into 16 rows
.w                        save it as "o.png"

Isso funciona na última versão do Pyth antes do lançamento do desafio?
lirtosiast

@ThomasKwa Sim, esqueci. Vou editar uma informação.
Jakube 10/10

2

Processando 2 - 359 caracteres

Eu vi esse desafio e pensei imediatamente na função pixel [] do Processing. Eu esperava que fosse mais curto, mas ainda estou bastante satisfeito com o resultado, considerando que esta é minha primeira tentativa de código de golfe.

int i,l;i=l=0;size(12,16);loadPixels();for(char c:"3b5r6b9r3b3g2o1g1o4b1g1o1g3o1g3o2b1g1o2g3o1g3o1b2g4o4g4b7o4b2g1r3g5b3g1r2g1r3g1b4g4r4g2o1g1r1o2r1o1r1g5o6r5o8r2o2b3r2b3r3b3g4b3g1b4g4b4g".toCharArray()){while(l>0){pixels[i]=#6B8CFF;if(c=='r')pixels[i]=#B13425;if(c=='g')pixels[i]=#6A6B04;if(c=='o')pixels[i]=#E39D25;i++;l--;}if(c<58){l=c-48;}}updatePixels();

ungolfed:

int i,l;i=l=0;
size(12,16);
loadPixels();
for(char c:"3b5r6b9r3b3g2o1g1o4b1g1o1g3o1g3o2b1g1o2g3o1g3o1b2g4o4g4b7o4b2g1r3g5b3g1r2g1r3g1b4g4r4g2o1g1r1o2r1o1r1g5o6r5o8r2o2b3r2b3r3b3g4b3g1b4g4b4g".toCharArray())
{
    while(l>0)
    {
        pixels[i]=#6B8CFF;
        if(c=='r')pixels[i]=#B13425;
        if(c=='g')pixels[i]=#6A6B04;
        if(c=='o')pixels[i]=#E39D25;
        i++;
        l--;
    }
    if(c<58){l=c-48;}
}
updatePixels();

você pode baixar o processamento aqui


2

Javascript 515

str='';
"000111110000|001111111110|002223323000|023233323330|023223332333|022333322220|000333333300|002212220000|022212212220|222211112222|332131131233|333111111333|331111111133|001110011100|022200002220|222200002222"
.split("|").forEach(function(ov, ok) {
str += '<div>'
    ov.split("").forEach(function(iv, ik) {
    str += '<div style="width:1px;height:1px;background-color:' + ['#6B8CFF','#B13425','#6A6B04','#E39D25'][iv] + ';display:inline-block"></div>';
    });
    str+= '</div>';
});
document.write(str);

apenas funcionou, ainda tem que entrar e jogar golfe


1
Você pode substituir os divs que compõem as linhas por uma tag embutida por padrão. Eu não testei, mas usar adeve funcionar. Você também pode usar em backgroundvez de background-color.
NinjaBearMonkey 17/10/2014

2

Perl - Ungolfed 927

Vou ter que jogar isso mais tarde. Primeira vez tentando Image::Magick.

#!/usr/local/bin/perl
use Image::Magick;
use strict;
use warnings;

my @p = (
[0,0,0,1,1,1,1,1,0,0,0,0],
[0,0,1,1,1,1,1,1,1,1,1,0],
[0,0,2,2,2,3,3,2,3,0,0,0],
[0,2,3,2,3,3,3,2,3,3,3,0],
[0,2,3,2,2,3,3,3,2,3,3,3],
[0,2,2,3,3,3,3,2,2,2,2,0],
[0,0,0,3,3,3,3,3,3,3,0,0],
[0,0,2,2,1,2,2,2,0,0,0,0],
[0,2,2,2,1,2,2,1,2,2,2,0],
[2,2,2,2,1,1,1,1,2,2,2,2],
[3,3,2,1,3,1,1,3,1,2,3,3],
[3,3,3,1,1,1,1,1,1,3,3,3],
[3,3,1,1,1,1,1,1,1,1,3,3],
[0,0,1,1,1,0,0,1,1,1,0,0],
[0,2,2,2,0,0,0,0,2,2,2,0],
[2,2,2,2,0,0,0,0,2,2,2,2],
);
my $image = Image::Magick->new;
$image->Set(size=>'12x16');
$image->ReadImage('canvas:white');
for my $i (0..$#p) {
    for (0..(@{$p[$i]} - 1)) {
        my $color;
        $color = ($p[$i][$_] < 1 ? "#6B8CFF" : $p[$i][$_] < 2 ? "#B13425" : $p[$i][$_] < 3 ? "#6A6B04" : "#E39D25");
        print "$i : $_ : $color \n";
       $image->Set("pixel[$_,$i]"=> $color);
    }
}
#$image->Write("mario.png");
$image->Display();

Tenho certeza de que temos muitos deles, mas aqui está o meu: Mario!


2

Bash Printable: 179 158 bytes

Inspirado na resposta do usuário2485710 .

Você precisa ajustar seu terminal para corresponder exatamente às cores.

eval "$(base64 -d<<</AD/8AAD9Wm/2amr2Wpq1qlX/qqv9RX/1RRXVQBVpIIaqAAqoAAK8DwP1f9XVf9V|xxd -b -c3 -g0|cut -c10-33|sed $'s/../\e[4$[2#&+1]m \e[0m/g;s/^/echo /')"

é isso que eu vejo . Estou fazendo algo errado?
ardnew

2
@ardnew: BSD base64 usos -Dpara decodificar e -dpara depuração .
Dennis

2

Tcl 298

package require base64
set d [base64::decode AVUABVVUCr7ALv78Lr+/K/6oA//wCmoAKmmoqlWq+ddv/VV/9VVfBUFQKgCoqgCq]
binary scan $d B* z
set i 0
foreach {a b} [split $z ""] {
if {$i % 12 == 0} {puts "\033\[0m"}
puts -nonewline "\033\[4[string map {00 4 01 1 10 2 11 3} $a$b];m  "
incr i
}
puts "\033\[0m"

É uma imagem de 2 bits por pixel na base 64. Os pixels são mapeados para os códigos de escape ansi.

insira a descrição da imagem aqui


Sem sequer tentar, o código parece um pouco golfable pouco: tio.run/...
sergiol

2

JavaScript - 256 caracteres (161 obfusc-a-twittou)

d=v=>{for(i=v&15;i--;)O.innerHTML+=`<i style="color:#${'6B8CFF6A6B04B13425E39D25'.substr(x%4*6,6)}">█</i>`+(++f%12?'':'<br>');x++},f=x=0,[..."fhilsswsssuss££cgÓdcddc¤g£stcucds³c¹cefefcc¤c§"].map(v=>(d(v=v.charCodeAt(0)-99),d(v>>4)))
<p id=O>

insira a descrição da imagem aqui

Método:

  1. Usando máscaras de bits, uma sequência de 63 x 8 bits fornece uma matriz de valores de 126 x 4 bits composta por números no intervalo de 0 a 9. (Frustrantemente ... salvou 63 caracteres indo em 4 bits, mas gastou 50 caracteres descompactando os bits novamente lol. Ainda assim, 13 caracteres são 13 caracteres! :-)
  2. As quatro cores de tinta são alternadas na ordem: B, G, R, O. A cada iteração, 0-9 divs são renderizados para a cor atual (com uma quebra de linha a cada 12)

Para determinar a ordem ideal para o ciclo de cores, executei o algoritmo de compactação nos dados brutos de cada uma das 24 permutações de [R, G, B, O] e selecionei a que produzia a menor saída (126 era melhor, menos ideal era cerca de 150 e poucos)

O ETA descobriu isso apenas depois de ler as outras respostas usando o obfusca-tweet ...

eval(unescape(escape`𩀽𭠽🡻𩡯𬠨𪐽𭠦𜐵𞱩𛐭𞰩𣰮𪑮𫡥𬡈𥁍𣀫👠🁩𘁳𭁹𫁥🐢𨱯𫁯𬠺𘰤𮰧𝡂𞁃𡡆𝡁𝡂𜀴𠠱𜰴𜠵𡐳𞑄𜠵𙰮𬱵𨡳𭁲𚁸𙐴𚠶𛀶𚑽𘠾ﶈ�𛱩🡠𚰨𚰫𩠥𜐲🰧𙰺𙰼𨡲🠧𚐻𮀫𚱽𛁦👸🐰𛁛𛠮𛠢𩡨𪑬𬱳𭱳𬱳𭑳𬲣𸱣𩳓𩁣𩁤𨲤𩲣𬱴𨱵𨱤𬲳𨲹𨱥𩡥𩡣𨲤𨲧𘡝𛡭𨑰𚁶🐾𚁤𚁶👶𛡣𪁡𬡃𫱤𩑁𭀨𜀩𛐹𞐩𛁤𚁶🠾𝀩𚐩𒠼𬀠`.replace(/u../g,'')))

Mais ideias. - Experimente o intervalo de dados de 3 bits de 0 a 6, com os raros 7,8,9 ganhando 4 extras cada: 60000N. - verifique as permutações do ciclo de cores em todas as direções e velocidades, exceto horizontalmente um pixel de cada vez. - tente várias passagens de renderização para que as cores possam ser colocadas em camadas.


Ah, ficou claro que se trata de caracteres, não de tchaus, então provavelmente poderia ter reduzido os dados pela metade novamente usando os caracteres de 16 bits.
Bumpy

1

Javascript, 253 240 238 236

Obfuscatweet ed source - 253 240 238 236

document.write(unescape(escape('🁳𨱲𪑰𭀾𘠵𫐲𫰹𫑨𜰰𞐷𫁯𩰹𜐰𜑰𪰹𮡰𝱵𞑶𭁸𭰹𜱱𭐸𞐸𝡷𭰹𭑯𩱫𞐳𨱳𬁨𞐶𪡭𪡥𞐶𬁬𫡵𞐶𭠷𮐲𞑭𝐸𜀹𭁨𮡯𞐳𨡥𨰵𘠮𬱰𫁩𭀨𞐩𛡦𫱲𡑡𨱨𚁦𭑮𨱴𪑯𫠨𨰩𮱤👤𫱣𭑭𩑮𭀻𨰽𬁡𬡳𩑉𫡴𚁣𛀳𝠩𛡴𫱓𭁲𪑮𩰨𝀩𞱷𪁩𫁥𚁣𛡬𩑮𩱴𪀼𜐲𚑣🐢𜀢𚱣𞱣𛡳𬁬𪑴𚀢𘠩𛡦𫱲𡑡𨱨𚁦𭑮𨱴𪑯𫠨𭠩𮱤𛡷𬡩𭁥𚀢🁰𘁳𭁹𫁥🐧𩁩𬱰𫁡𮐺𪑮𫁩𫡥𞱰𨑤𩁩𫡧𞠹𞱢𨑣𪱧𬡯𭑮𩀺𘰢𚱛𘠶𠠸𠱆𡠢𛀢𝡁𝡂𜀴𘠬𘡅𜰹𡀲𝐢𛀢𠠱𜰴𜠵𘡝𦰫𭡝𚰢𙰾🀯𬀾𘠩𯐩𞱤𛡷𬡩𭁥𚀢🁢𬠾𘠩𯐩🀯𬱣𬡩𬁴🠠').replace(/uD./g,'')))

Sem ofuscação - 395 370 365 361

<script>"5m2o9mh3097log9101pk9zp7u9vtxw93qu8986ww9uogk93csph96jmje96plnu96v7y29m5809thzo93bec5".split(9).forEach(function(c){d=document;c=parseInt(c,36).toString(4);while(c.length<12)c="0"+c;c.split("").forEach(function(v){d.write("<p style='display:inline;padding:9;background:#"+["6B8CFF","6A6B04","E39D25","B13425"][+v]+"'></p>")});d.write("<br>")})</script>

Agradecemos a @compass pelos <p>truques de tags e @xem por 2 (5) caracteres.

Demo

Ele converte dados da base 36 e converte para a base 4.


Não posso testá-lo, mas acho que não padding:9faz nada sem uma unidade depois dele. Você também pode usar um elemento de uma letra como aou qque esteja implicitamente embutido, em vez de p.
NinjaBearMonkey

@hsl Atualizei o link de demonstração e funciona bem pelo menos no meu Chrome, Firefox e Safari no Mac.
Snack

-2 bytes: substitua "|" por 9 na sequência e na divisão. Além disso, você usa 3 vezes "document.write", você deve colocá-lo em uma var para salvar, como, 24b)
xem

@xem Obrigado por me lembrar o truque de divisão de números. E como não podemos atribuir document.writea variável (devemos usar document.write.bind(document)), meu melhor foi atribuir documenta variável.
Snack

ou, você pode fazer isso na primeira vez: (d = documento) [w = "write"] (/ * coisas para escrever * /) e faça isso depois: d [w] ("Hi")
xem

1

JavaScript ES6 (HTML + CSS), 199307 3195 3630

Usando o Obfusc-a-tweet :

eval(unescape(escape('𬰽𦱝𒠧𜰹𮡲𬀳𝁤𩡬𜱪𩱴𜐴𨡷𭐵𝁢𪱣𩠴𝱰𜡨𜱦𫁹𭀳𪑮𪀱𝀵𝀸𞐶𫑳𫱡𞑰𩡥𝰹𭁺𝑲𞑤𝁢𜰳𝁨𩁸𝀵𩀴𞐶𫠹𩱱𙰮𫑡𭁣𪀨𛰮𮰵𯐯𩰩𛡦𫱲𡑡𨱨𚀨𫠬𪐩🐾𦰮𛠮𬁡𬡳𩑉𫡴𚁮𛀳𝠩𛡴𫱓𭁲𪑮𩰨𝀩𧐮𩡯𬡅𨑣𪀨𚁭𛁪𚐽🡳𛡰𭑳𪀨𪠫𜐫𙱰𮀠𙰫𚀫𪐫𜐩𚰧𬁸𘀣𙰫𦰧𠠱𜰴𜠵𙰬𙰶𠠸𠱆𡠧𛀧𝡁𝡂𜀴𙰬𙱅𜰹𡀲𝐧𧑛𚱭𧐩𚐩𒡤𫱣𭑭𩑮𭀮𭱲𪑴𩐨𙰼𬀠𬱴𮑬𩐽𘡷𪑤𭁨𞠱𬁸𞱨𩑩𩱨𭀺𜑰𮀻𨡯𮀭𬱨𨑤𫱷𞠧𚱳𚰧𘠧𚐠').replace(/uD./g,'')))

Isso exibe o sprite sem usar nenhuma imagem ou vários elementos; apenas utiliza indevidamente a box-shadowpropriedade CSS para criar cada pixel. Experimente em http://jsbin.com/pozohiyezo/ . Esta versão não ofuscada tem 307 caracteres :

s=[]
'39zrp34dfl3jgt14bwu54bkcf47p2h3flyt3inh1454896msoa9pfe79tz5r9d4b334hdx45d496n9gq'.match(/.{5}/g).some((n,i)=>[...parseInt(n,36).toString(4)].forEach((m,j)=>s.push(j+1+'px '+(+i+1)+'px #'+['B13425','6B8CFF','6A6B04','E39D25'][+m])))
document.write('<p style="width:1px;height:1px;box-shadow:'+s+'"')

Esta é a versão HTML original, simples de baunilha. Veja em ação em http://jsfiddle.net/gfeLn1ey/1/ .

<p style="width:1px;height:1px;box-shadow:4px 1px 0 #B13425,5px 1px 0 #B13425,6px 1px 0 #B13425,7px 1px 0 #B13425,8px 1px 0 #B13425,12px 1px 0 #6B8CFF,3px 2px 0 #B13425,4px 2px 0 #B13425,5px 2px 0 #B13425,6px 2px 0 #B13425,7px 2px 0 #B13425,8px 2px 0 #B13425,9px 2px 0 #B13425,10px 2px 0 #B13425,11px 2px 0 #B13425,12px 2px 0 #6B8CFF,3px 3px 0 #6A6B04,4px 3px 0 #6A6B04,5px 3px 0 #6A6B04,6px 3px 0 #E39D25,7px 3px 0 #E39D25,8px 3px 0 #6A6B04,9px 3px 0 #E39D25,12px 3px 0 #6B8CFF,2px 4px 0 #6A6B04,3px 4px 0 #E39D25,4px 4px 0 #6A6B04,5px 4px 0 #E39D25,6px 4px 0 #E39D25,7px 4px 0 #E39D25,8px 4px 0 #6A6B04,9px 4px 0 #E39D25,10px 4px 0 #E39D25,11px 4px 0 #E39D25,12px 4px 0 #6B8CFF,2px 5px 0 #6A6B04,3px 5px 0 #E39D25,4px 5px 0 #6A6B04,5px 5px 0 #6A6B04,6px 5px 0 #E39D25,7px 5px 0 #E39D25,8px 5px 0 #E39D25,9px 5px 0 #6A6B04,10px 5px 0 #E39D25,11px 5px 0 #E39D25,12px 5px 0 #E39D25,2px 6px 0 #6A6B04,3px 6px 0 #6A6B04,4px 6px 0 #E39D25,5px 6px 0 #E39D25,6px 6px 0 #E39D25,7px 6px 0 #E39D25,8px 6px 0 #6A6B04,9px 6px 0 #6A6B04,10px 6px 0 #6A6B04,11px 6px 0 #6A6B04,12px 6px 0 #6B8CFF,4px 7px 0 #E39D25,5px 7px 0 #E39D25,6px 7px 0 #E39D25,7px 7px 0 #E39D25,8px 7px 0 #E39D25,9px 7px 0 #E39D25,10px 7px 0 #E39D25,12px 7px 0 #6B8CFF,3px 8px 0 #6A6B04,4px 8px 0 #6A6B04,5px 8px 0 #B13425,6px 8px 0 #6A6B04,7px 8px 0 #6A6B04,8px 8px 0 #6A6B04,12px 8px 0 #6B8CFF,2px 9px 0 #6A6B04,3px 9px 0 #6A6B04,4px 9px 0 #6A6B04,5px 9px 0 #B13425,6px 9px 0 #6A6B04,7px 9px 0 #6A6B04,8px 9px 0 #B13425,9px 9px 0 #6A6B04,10px 9px 0 #6A6B04,11px 9px 0 #6A6B04,12px 9px 0 #6B8CFF,1px 10px 0 #6A6B04,2px 10px 0 #6A6B04,3px 10px 0 #6A6B04,4px 10px 0 #6A6B04,5px 10px 0 #B13425,6px 10px 0 #B13425,7px 10px 0 #B13425,8px 10px 0 #B13425,9px 10px 0 #6A6B04,10px 10px 0 #6A6B04,11px 10px 0 #6A6B04,12px 10px 0 #6A6B04,1px 11px 0 #E39D25,2px 11px 0 #E39D25,3px 11px 0 #6A6B04,4px 11px 0 #B13425,5px 11px 0 #E39D25,6px 11px 0 #B13425,7px 11px 0 #B13425,8px 11px 0 #E39D25,9px 11px 0 #B13425,10px 11px 0 #6A6B04,11px 11px 0 #E39D25,12px 11px 0 #E39D25,1px 12px 0 #E39D25,2px 12px 0 #E39D25,3px 12px 0 #E39D25,4px 12px 0 #B13425,5px 12px 0 #B13425,6px 12px 0 #B13425,7px 12px 0 #B13425,8px 12px 0 #B13425,9px 12px 0 #B13425,10px 12px 0 #E39D25,11px 12px 0 #E39D25,12px 12px 0 #E39D25,1px 13px 0 #E39D25,2px 13px 0 #E39D25,3px 13px 0 #B13425,4px 13px 0 #B13425,5px 13px 0 #B13425,6px 13px 0 #B13425,7px 13px 0 #B13425,8px 13px 0 #B13425,9px 13px 0 #B13425,10px 13px 0 #B13425,11px 13px 0 #E39D25,12px 13px 0 #E39D25,1px 14px 0 #6B8CFF,2px 14px 0 #6B8CFF,3px 14px 0 #B13425,4px 14px 0 #B13425,5px 14px 0 #B13425,6px 14px 0 #6B8CFF,7px 14px 0 #6B8CFF,8px 14px 0 #B13425,9px 14px 0 #B13425,10px 14px 0 #B13425,11px 14px 0 #6B8CFF,12px 14px 0 #6B8CFF,1px 15px 0 #6B8CFF,2px 15px 0 #6A6B04,3px 15px 0 #6A6B04,4px 15px 0 #6A6B04,5px 15px 0 #6B8CFF,6px 15px 0 #6B8CFF,7px 15px 0 #6B8CFF,8px 15px 0 #6B8CFF,9px 15px 0 #6A6B04,10px 15px 0 #6A6B04,11px 15px 0 #6A6B04,12px 15px 0 #6B8CFF,1px 16px 0 #6A6B04,2px 16px 0 #6A6B04,3px 16px 0 #6A6B04,4px 16px 0 #6A6B04,5px 16px 0 #6B8CFF,6px 16px 0 #6B8CFF,7px 16px 0 #6B8CFF,8px 16px 0 #6B8CFF,9px 16px 0 #6A6B04,10px 16px 0 #6A6B04,11px 16px 0 #6A6B04,12px 16px 0 #6A6B04,6px 6px 0 5px #6B8CFF"

TIL, você não pode fechar um <p tag :)
xem

esse código pode ter uma compressão muito boa em uma ferramenta como o regpack. Aqui está um exemplo no 729b (porém, o JS é usado para escrever o HTML): goo.gl/7fF7kx
xem

@xem Na verdade, eu nem tinha pensado em gerar o código com JS, mas consegui fazer uma compra muito menor, seguindo o padrão do código.
NinjaBearMonkey

1

Javascript, 256 ou 245252 ou 241

256

document.write("k6n56kcraqlaqasasjaqbsasibtdlstlb2cmc2b2cid5dra2q3q2au7u55rj4j4kclcidld".replace(/./g,function(x){return new Array((x=parseInt(x,36))&7).join("<li style=padding:4%;float:left;background:#"+['B13425','6A6B04','6B8CFF','E39D25'][x>>3]+">")}))

É triste substituir 256, mas 245 é possível se você usar caracteres não imprimíveis:

document.write(btoa(">§ç©­ª¥j¦¬jÈÚ©»²&ív[-½ÍÙÈåÚÚÚ­êÙ«»»køÉ\\Ù]").replace(/./g,function(x){return new Array((x=parseInt(x,36))&7).join("<li style=padding:4%;float:left;background:#"+["B13425","6A6B04","6B8CFF","E39D25"][x>>3]+">")}))

Há algum problema ao enviar a solução com caracteres não imprimíveis. O argumento de btoadeve ser o resultado de atob("ij6n56kcraqlaqasasjaqbsasibtdlstlb2cmc2b2cid5dra2q3q2au7u55rj4j4kclcidld")com 1 símbolo de comprimento adicionado para escapar a barra invertida.

Reduza as duas soluções em 4 símbolos: não precisamos de novas para a criação de matrizes.

252

document.write("k6n56kcraqlaqasasjaqbsasibtdlstlb2cmc2b2cid5dra2q3q2au7u55rj4j4kclcidld".replace(/./g,function(x){return Array((x=parseInt(x,36))&7).join("<li style=padding:4%;float:left;background:#"+['B13425','6A6B04','6B8CFF','E39D25'][x>>3]+">")}))

241

document.write(btoa("©ùêG+j©Z©«²6ªnƬ»]Ëeog&sför'yv¶¶«z¶jîîçãâ>$rVÚÙ]").replace(/./g,function(x){return Array((x=parseInt(x,36))&7).join("<li style=padding:4%;float:left;background:#"+['B13425','6A6B04','6B8CFF','E39D25'][x>>3]+">")}))

Não é necessário escapar nesta versão. O btoaargumento do é resultado deatob("k6n56kcraqlaqasasjaqbsasibtdlstlb2cmc2b2cid5dra2q3q2au7u55rj4j4kclbaidld")


Percebi o problema não imprimível nesse e no meu último desafio também. Eu pensei que só foi carboniza 8, 9 e 13 se isso ajuda (embora eu poderia facilmente ser confundido)
Bumpy

1

Perl, 266 260 257 249 245 bytes

$_="444111114444441111111114442223323444423233323334423223332333422333322224444333333344442212224444422212212224222211112222332131131233333111111333331111111133441114411144422244442224222244442222";s/\d/\033[4$&m  /g;s/.{84}/$&\033[00m\n/g;print

Usa uma abordagem semelhante à solução bash do user2485710 para gravar uma saída no estilo VT100. Retira o N explícito da nova linha, inserindo uma nova linha a cada 12 "vt100 pixels", 12 * 7 = 84.


1

SmileBASIC, 147 136 caracteres

P$="xxxxxxxx
FOR I=0TO 191C=ASC("xxxxxxxxxxxxxxxxxxxxxxxx"[I/8])>>I MOD 8*2AND 3GPSET I/16,15AND I,ASC(P$[C*2])<<16OR ASC(P$[C*2+1])NEXT

Saída (cortada): captura de tela

Substituí todos os caracteres nas cadeias de dados por x's, eis os códigos de caracteres (no UCS-2):
P$(Paleta): FF6B,8CFF,FFB1,3425,FF6A,6B04,FFE3,D925
Dados da imagem:0000,83F8,0A80,A3FA,8BE4,A5EA,BEA5,A55A,7EE5,0575,BFF5,0156,BFF5,0156,BBA5,0575,3AF4,A55A,3BC4,A5EA,0BC4,A3FA,0300,83F8

A paleta é armazenada em uma sequência, cada cor (32 bits) é armazenada em dois caracteres (16 bits cada). Os dados da imagem (2 bits por pixel) são armazenados em outra sequência (8 pixels por caractere)
Felizmente, o desafio é classificado em caracteres, pois esse arquivo é significativamente maior se salvo no UTF-8.


1

05AB1E , 87 bytes (Não concorrente)

•8,vkJíÝ1¢tt6,9XÂck$XSãõO©Ú"›qf®¸Ì#}„K0ÝCìxý}É~ð_áú•4BSvy•3«WKyÛòèz*Ðeb•16B6ôè'#ì})12ô»

Experimente online!

Saídas:

#B13425 #B13425 #B13425 #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #B13425 #B13425 #B13425 #B13425
#B13425 #B13425 #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #B13425
#B13425 #B13425 #6A6B04 #6A6B04 #6A6B04 #E39D25 #E39D25 #6A6B04 #E39D25 #B13425 #B13425 #B13425
#B13425 #6A6B04 #E39D25 #6A6B04 #E39D25 #E39D25 #E39D25 #6A6B04 #E39D25 #E39D25 #E39D25 #B13425
#B13425 #6A6B04 #E39D25 #6A6B04 #6A6B04 #E39D25 #E39D25 #E39D25 #6A6B04 #E39D25 #E39D25 #E39D25
#B13425 #6A6B04 #6A6B04 #E39D25 #E39D25 #E39D25 #E39D25 #6A6B04 #6A6B04 #6A6B04 #6A6B04 #B13425
#B13425 #B13425 #B13425 #E39D25 #E39D25 #E39D25 #E39D25 #E39D25 #E39D25 #E39D25 #B13425 #B13425
#B13425 #B13425 #6A6B04 #6A6B04 #6B8CFF #6A6B04 #6A6B04 #6A6B04 #B13425 #B13425 #B13425 #B13425
#B13425 #6A6B04 #6A6B04 #6A6B04 #6B8CFF #6A6B04 #6A6B04 #6B8CFF #6A6B04 #6A6B04 #6A6B04 #B13425
#6A6B04 #6A6B04 #6A6B04 #6A6B04 #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6A6B04 #6A6B04 #6A6B04 #6A6B04
#E39D25 #E39D25 #6A6B04 #6B8CFF #E39D25 #6B8CFF #6B8CFF #E39D25 #6B8CFF #6A6B04 #E39D25 #E39D25
#6A6B04 #6A6B04 #6A6B04 #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6A6B04 #6A6B04 #6A6B04
#6A6B04 #6A6B04 #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6A6B04 #6A6B04
#B13425 #B13425 #6B8CFF #6B8CFF #6B8CFF #B13425 #B13425 #6B8CFF #6B8CFF #6B8CFF #B13425 #B13425
#B13425 #6A6B04 #6A6B04 #6A6B04 #B13425 #B13425 #B13425 #B13425 #6A6B04 #6A6B04 #6A6B04 #B13425
#6A6B04 #6A6B04 #6A6B04 #6A6B04 #B13425 #B13425 #B13425 #B13425 #6A6B04 #6A6B04 #6A6B04 #6A6B04

Como o 05AB1E não pode executar cores ou gráficos de qualquer tipo ... Se isso não for aceitável, vou excluí-lo.


Você poderia escrever um wrapper Bash e dizer a sua solução éBash + 05AB1E
Pavel

1
@ Pavel Eu estava pensando em fazer isso, acho que vou acasalar esta solução com a de outra pessoa; P.
Magic Octopus Urn

Eu não posso dizer que "ganha" mas por favor mantê-lo, pois é uma grande pontuação de compressão :)
xem

0

Sinclair BASIC - 573 bytes

OK, o Spectrum não pode mostrar cores RGB conforme especificado, portanto, usou o mais próximo possível.

10 let x=0:let y=0:let i=0
20 let a$="1c2e1f2i1c4c6b461d4646c46c1b464b6c46c14b6d4d1d6g1d4b24c1e4c24b24c14d2d4d6b4262b6246e2f6e2c1b2c6b1b2c1b2c1c4c1d4c14d1d4d"
30 let l=len a$
40 let i=i+1:let c=1:let p=0:let k=val a$(i)
50 if a$(i+1)>="a" then let c=code a$(i+1)-96:let i=i+1
60 print at y,x;ink k;"\::":let p=p+1:let x=x+1:if x=12 then let x=0:let y=y+1
70 if p<c then goto 60
80 if i<l then goto 40

A string é a cor (1 = azul, 2 = vermelho etc) seguida por uma letra para representar quantas vezes esse bloco se repete (tomando o valor ASCII menos 96 para se tornar 1,2,3 etc). Um número sem letra depois de desenhar apenas um bloco.

"\::"na linha 60 é como inserir gráficos em um editor de texto antes de se transformar em um arquivo TAP para carregar no emulador de Fuse. (Mostra como um gráfico de bloco sólido na tela).

Cada palavra-chave é um byte no Sinclair BASIC, incluiu uma contagem de um comando PEEK após sua geração.

É um Mario


0

Perl - 399 171 bytes

use MIME::Base64;$_='R0lGODdhDAAQAKEEAGuM/+OdJWprBLE0JSwAAAAADAAQAAACNoSHaAvpaoQMQQRmLdUXZM55XCUJDIVSmDCUjMhKrQSzSamxAbKP+5P6PQaqBiSxcCVpuJWkAAA7';
print decode_base64($_)

Grava o arquivo gif em stdout.

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.