Palíndromos hexadecimais

animation3

Eis aqui mais uma investigação sobre o tema dos hexadecimais. Essa “cachaça” é antiga e começou em A cor da palavra, desdobrou-se em Pi-xel e avança mais um passo aqui. E desta vez resolvi associar ao tema um outro elemento de q gosto muito: palíndromos.

Um palíndromo é uma palavra ou frase q pode ser lida de “frente pra trás e de trás pra frente”. Podemos pensar nos exemplos mais simples, como ovo ou arara, até evoluir para composições mais complexas, como socorram-me, subi no ônibus em Marrocos.

No livro A fórmula preferida do professor (já comentado em outro post), descobri q os palíndromos japoneses obedecem a uma inversão de sílabas, não de letras (como acontece em um palíndromo “ocidental”). Um exemplo extraído do livro: takeyabu yaketa (experimente separar em sílabas com 2 letras cada e veja o q acontece). A tradução da frase é o bambuzal pegou fogo. Se fosse em nossa língua, a palavra ‘casaca’ seria um palíndromo japonês. Para ser um palíndromo ocidental, acrescente apenas o artigo ‘a’ na frente da palavra (‘a casaca’).

Em Palíndromos Hexadecimais, criei um contador de “0 a F”, ou seja, um contador q abrangesse todos os “algarismos” formadores do sistema hexadecimal: os números de 0 a 9 e as letras de A a F. Na verdade o contador vai de 000 a FFF, pois em seguida em espelhei as combinações formadas para gerar um palíndromo. Por exemplo: para a combinação 31A, gerou-se também o seu “espelhado”, A13. No final temos 31AA13, um palíndromo hexadecimal. E o q fazer com isso? Associei a combinação alfanumérica ao parâmetro de background do código HTML da página. Como o contador é dinâmico, à medida q as combinações aparecem, a cor de fundo acompanha o palíndromo exibido.

Agora vamos lá. Se fosse um contador decimal (0 a 9), quantas combinações teríamos? Não faz muito tempo estudei análise combinatória para uma prova e este conteúdo me ajudou aqui. Um contador de 000 a 999 nos oferece 1000 possibilidades, ou seja 10x10x10. Para o contador de 0 a F, é como se o mesmo contasse de 0 a 15 (em decimal), o q nos oferece 16 possibilidades para cada casa do número. Portanto de 000 a FFF temos 16X16x16, o q dá 4096 possibilidades! Programei o contador para exibir cada número a 1s, portanto seriam necessários 4096 segundos para ver tudo, certo? 4096 segundos são aproximadamente 68,26 minutos, o q dá 1 hora e pouco mais de 8 minutos. Acho q é muito tempo para se passar em frente a uma tela, não acham?

Pensando q poucos (ou nínguem) ficariam tanto tempo assim em frente ao computador, fiz uma variação do contador: o Palíndromos Hexadecimais Aleatórios. A única diferença aqui é q as combinações geradas são escolhidas “ao acaso”, mas todas elas fazem parte do conjunto de 4096 palíndromos possíveis do contador. Basta ver algumas e seguir a vida.

 

Anúncios
Palíndromos hexadecimais

Presente de aniversário

Dia 29 de outubro foi meu trigésimo nono aniversário. Pois é, um “pré-quarentão”, nas palavras de um amigo meu. Também foi o final das minhas férias. “Coincidentemente”, elas começaram no dia do aniversário do meu pai, 12/10, e terminaram no dia do meu. Fui a Salvador e trouxe minha mãe para passar uns dias comigo no Rio de Janeiro.

Nas férias a gente sai da rotina. Bebi vinho quase todo dia, banquei o “tiozão” com meus dois sobrinhos, revi ex-colegas de trabalho e amigos em Salvador, acordei tarde quase todos os dias, engordei alguns quilos também. Mas uma coisa q tentei manter foi estudar. Este ano reservei mais tempo para vencer um antigo “medo” q era estudar HTML, CSS e essas outras coisas q não fazem sujeira e não ocupam espaço na escrivaninha, mas q exigem as mesmas (ou mais) doses de paciência, dedicação e perseverança para dar bons resultados. E fiquei até surpreso com a relativa facilidade com q entendi alguns conceitos e rapidamente lá estava eu fazendo minhas primeiras experiências nesta área.

Longe de me tornar um webdesigner, o q eu quero é aumentar meu repertório de linguagens e recursos para dar expressão às minhas ideias. E uma forma de estudar q encontrei foi revirar minha produção anterior e ver o que poderia resultar se eu somasse algo. Tempos atrás eu fiz uma série de “cartazes” abordando algumas das figuras de linguagem que utilizamos na comunicação oral e escrita. Meu desafio foi fazer a conceituação delas de forma gráfica. O resultado foi o Figurinhas de Linguagem, série de 9 imagens abordando 9 das figuras de linguagem q consegui resolver usando formas e cores.

Bem antes das minhas férias eu já havia começado a migrar o conteúdo estático dos cartazes para a linguagem HTML, sendo q desta vez meu desafio foi animar alguns dos elementos gráficos das imagens. Usei para isso o formato SVG, q, além de ser vetorial, ainda permite armazenar comandos de animação, abandonando o formato GIF, bastante conhecido e tradicional por também gravar animação. Mas como nem tudo são flores, os resultados foram muito bons quando vistos no navegador Chrome, mas no Firefox… Pesquisei na “grande rede” como solucionar o problema, mas a empreitada não foi das melhores. Portanto, se vc desejar a “melhor experiência visual” veja a página no Chrome. Outra coisa: aconselho a ver o material em desktop ou no máximo num tablet ou I-pad. Para celular eu não fiz a devida adaptação, sorry.

Fiz de tudo para terminar antes do dia 29/10, sendo o meu “auto-presente” e também uma lembrança para os leitores do meu blog, mas não consegui (sorry again!). Então, para começar o penúltimo mês do ano, segue o novo Figurinhas de Linguagem. Espero q curtam!

screen-shot-2016-11-01-at-9-21-01-am

Presente de aniversário

Testando novas possibilidades

Não sou programador. E por muito tempo, sempre tive certa aversão pelo webdesign. Muito por conta dos programas q trabalham com a matéria (o finado Front Page e o Dreamweaver); muito tb por medo mesmo, e a auto cobrança q me é peculiar. Mas acompanhando a evolução “estética” da internet e meio cansado de ter ideias e sempre esbarrar na barreira técnica, resolvi me dar mais uma chance. Longe de virar designer de sites ou interfaces. Quero apenas ver o q as ferramentas, as linguagens, os recursos podem me oferecer como alternativa para expressar ideias, passar mensagens, experimentar.

Há um bom tempo, quando fiz 37 anos, coloquei na capa do meu perfil do facebook uma imagem onde transformei os algarismos da minha data de nascimento e o dia do meu aniversário naquela época em código CMYK, onde os algarismos da data gerariam uma cor, ou seja, como nasci em 29 de outubro de 1977, transformei para 29/10/19/77, sendo q a cor resultante seria formada por 29% de C (ciano), 10% de M (magenta), 19% de Y (amarelo) e 77% de K (preto).

Tempos mais tarde, fui surpreendido com um site em q a ideia do autor foi pegar a hora presente e transformar em código hexadecimal, gerando a cor de fundo. Como a hora muda o tempo todo, o background assume novas cores, em transições suaves. O nome do site é What Color is it? Qdo vi, pensei: mais uma ideia q não consigo avançar e alguém passa na frente…

Independente deste pensamento de “passar na frente”, o fato é q ficamos frustrados qdo pensamos em algo e não conseguimos realizar. Podemos tomar algumas decisões. A minha foi tentar aos poucos. Estudando HTML e CSS como autodidata, comecei a “ler” os códigos fonte dos sites (coisa muito boa, pois basta digitar Ctrl+U no teclado e uma “partitura” se desenrola à nossa frente, mostrando q não há mágica por trás, só estudo e ciência).

Lendo o código do referido site, q é minúsculo, diga-se de passagem, “decifrei” o q seria HTML, CSS e o q sobrou foram algumas linhas q contavam a “magia”: um script q lia a hora do computador, realizava algumas condicionais, montava um número em hexadecimal, encaixava numa variável e voilà: renderava a cor no bakcground do site.

De posse disso, fui pesquisar e investigar algumas coisas q me pareciam lógicas: se havia código para hora, deveria haver para dias, meses, anos…

E como resultado, fiz a minha primeira experiência no assunto, uma página chamada A cor do dia, cuja ideia é pegar a data atual, transformar em código hexadecimal e gerar uma cor de fundo, (o número hexadecimal gerado representa concentrações das 3 cores primárias: o vermelho (R), o verde (G) e o azul (B). O resultado, visualmente falando, não me agrada tanto, pois os números das datas são algarismos “baixos”, o q quer dizer q estão mais próximos da cor “preta” (que é formado por 0 de R, 0 de G e 0 de B). Por exemplo, 04/05/16 gera uma cor muito escura. Dando um passo a mais, fiz a variação da página para a notação inglesa de data, invertendo os algarismos de dia e mês. O resultado foi a The color of the day. As duas páginas “conversam”, portanto, se vc quer saber qual a cor do dia em “inglês” ou “português”, basta clicar sobre o idioma (PT ou EN).

a_cor_do_dia

 

Testando novas possibilidades