Esse post começou ao som de Calcination. Não, não é nenhuma paródia com a irritante Rebolation que você ficou pulando o carnaval inteiro, é Calcination mesmo, da Scout Niblett. Nada mais justo que compartilhar. Clica no play aí e curte (ou não)!

Scout Niblett - Calcination

Música é inspiração, creio que para a maioria dos mortais, não importa qual a sua natureza, estilo, gosto. O fato, é que nossos sentidos, emoções, espirito são alterados no momento que estamos expostos aos sons de guitarras, baixos, cavaquinhos, baterias, saxofones, pianos, flautas, gaitas...

Algumas pessoas nascem viciadas em música, achei essa playlist na internet, não mostra o autor, mas creio que pelo endereço da url não deve ser difícil de identificar o viciado em questão. Eu por exemplo gosto de trabalhar escutando música, nada melhor do que mesclar direção de arte com música, aliás, tudo é arte né? Vamos a alguns conceitos:

design
(palavra inglesa)
s. m.
1. Disciplina que visa a criação de objetos! objetos, ambientes, obras gráficas, etc., ao mesmo tempo funcionais, estéticos e conformes aos imperativos de uma produção industrial.
2. Conjunto dos objectos!objetos criados segundo estes critérios (ex.: vender design).
3. Aspecto de um produto criado segundo esses critérios (ex.: design inovador).
adj. 2 gén. 2 núm.
adj. 2 gén. 2 núm.
4. Criado, concebido segundo os critérios do design (ex.: móveis design).
Pl.: designs.

música
(latim musica, -ae, música, instrução, habilidade)
s. f.
1. Arte e técnica de combinar os sons de maneira agradável ao ouvido.
2. Teoria dessa arte.
3. Composição resultante dessa arte.
4. Execução de uma peça musical.
5. Conjunto de músicos. = filarmónica, banda, orquestra
6. Papel ou livro que contém notações musicais. = partitura
7. Sequência de sons harmoniosos cuja cadência ou ritmo lembram uma melodia.
8. Infrm. Fig. Choradeira, lamúria.
9. Lábia

Fonte: http://www.priberam.pt/dlpo/

Acho que os conceitos do dicionário ainda não foram o suficiente para chegarem no que quero dizer, explicarei. A verdade é que todo músico e todo designer precisam passar por um processo árduo para chegar ao seu objetivo: conquistar o coração do seu público com o seu trabalho. É muita semelhança, vejamos: brainstorm, leitura, inspiração, estar antenado com o que acontece no seu dia-a-dia, tudo para chegar no final e obter êxito, depois de longas noites em claros criando, compondo, desenhando, tocando...

Pegou o espírito da coisa? Então reafirmo, arte é arte, é tudo farinha do mesmo saco, seja na música ou no design. Desculpe, estou sendo um pouco egocêntrico ao associar a música com a minha área de atuação e a essa paixão que possuo por ela. Sei que não importa em qual parte do planeta, todos apreciam uma boa música, seja ela japonesa ou colombiana. Portanto, escute música e inspire-se! Para dar uma força, já que a Calcination deve ter acabado ou não ter sido do seu agrado, play na música Proibida Pra Mim interpretada por Zeca Baleiro. Aproveito e dedico a música para a Mariana que deu a sugestão para compor esse post.

Zeca Baleiro - Proibida Pra Mim

Para finalizar, exemplos de design em capas de discos, com muito bom gosto.

[iframe: src="http://www.aareis.com.br/wp-content/uploads/2010/03/musica_design/padrao.swf" frameborder="0" width="575" height="500" scrolling="no"]

Boletim Online versão antiga

Boletim Online versão atual

A data certa desse post seria 12/04/07 ou algo parecido, mas à dois anos atrás eu não brincava de blog; deveria, mas não brincava, tem coisas que aprendemos só depois de velho. Mas porque escrever sobre isso agora? Passado é passado e não se fala mais nisso certo? Bom, dependendo do caso é até válido resgatar, já outras, melhor que fiquem enterradas.

A pouco tempo, tenho recebido email, twitter, mensagens no msn, gtalk telefone ou qualquer outra forma de contato do pessoal da sala comentando alguns trabalhos que fizemos juntos, e isso rendeu boas gargalhadas. No vai e vem daquela conversa mole falei: seguinte galera vou postar essas brincadeiras no blog e mandar para vocês, se não registramos na época, vamos fazê-lo agora.

Todo mundo sabe que trabalho em grupo é uma dificuldade danada (para não falar outra coisa) rs. Alguns fazem pouco, outros fazem muito, tem os que não fazem nada e mesmo assim estamos sempre unidos, igual cão e gato, até o fim do curso. Alguns trabalhos que foram bem interessantes e o motivo desse post de 16/05/07 se referem a um spot e uma novelinha de rádio que criamos na faculdade. Esse era o assunto que discutíamos online, como citei acima.

Os trabalhos mais divertidos de um curso de Publicidade e Propaganda não são os que precisam desenvolver peças gráficas, pelo contrário, esses são chatos, estressantes, todo mundo briga com todo mundo e os meninos da criação sempre dormem as 03h da manhã.

A empolgação era com as matérias relacionadas à produções de áudio e vídeo. Era uma festa só, a criação do roteiro até a produção das peças. Até hoje chamamos o Guilherme Crespo, colega de grupo da época, de “Bluds”. Bluds foi um nome criado para uma coleção jeans, e o nosso amigo “Bluds” foi o locutor dessa brincadeira toda. Chega de blá blá blá e vamos ao que interessa. Confira aí o Spot Bluds e mais outras pérolas que gostávamos de inventar nos bons tempos da faculdade.

Bluds

Novelinha Voando com os Artistas

Sinaf Seguros

Single - Chocolate Diet

Nzinga - Coletivo de Mulheres Negras de Belo Horizonte

Na publicidade, a todo o momento idéias são lançadas para serem transformadas para todos saírem felizes e vencedores. É bem verdade toda aquela teoria que ensinam na faculdade, vamos lembrar. Leia bastante e de tudo, analise peças gráficas com olhar crítico, pergunte, pergunte novamente, assista vários filmes, vá ao teatro, visite blogs da área do seu interesse, enfim, mexa-se.

Mas acreditem, mesmo com tudo isso e tendo um briefing bem definido, às vezes o seu lado criativo resolve te abandonar naquele dia que você mais precisa dele. No ASTTTER Notícias de carnaval, jornal que faço a diagramação no meu trabalho, o ócio criativo pairou sobre o meu ser, e olha que o tema é quase óbvio.

Nesse trabalho, o meu problema foi com a capa, uma tentativa, duas tentativas, três tentativas e paramos por aqui não é possível .

Enfim junto com o meu colega de criação George, entramos em um consenso.

O interessante desse post é que nessa parte ele está parecendo um plágio ou cópia de idéia da categoria Capa da Semana da Revista Época, confira um exemplo aqui. Mas te garanto, não é jovem! Simplesmente me lembrei da idéia e como tem tudo haver com o tema, resolvi até homenagear! Bacana!?

Depois das opções acimas serem reprovadas, o resultado final:

Este artigo trata de aspectos de usabilidade em sites desenvolvidos com a ferramenta Adobe Flash. Sua finalidade é apoiar pesquisadores, desenvolvedores e estudantes da área a projetarem interfaces que propiciem aos seus usuários uma interação fácil e transparente. Em tempos de mudanças nas formas de interação na internet, iremos abordar também a evolução da ferramenta com o universo Web 2.0, tal estudo possibilitará analisar as funcionalidades de interação para executar uma tarefa de forma colaborativa devido à evolução que o Flash vem acompanhado até os dias atuais.

Clique aqui e leia o artigo completo.

Fonte: www.asttter.org.br

O jornal “Sede Social Informa” é uma das formas de divulgações que leva aos associados os diversos eventos e acontecimentos da Sede Social.

Algumas publicações:

Sede Social Informa 01

Sede Social Informa 02

Sede Social Informa 03

Sede Social Informa 04

<param name="movie" value="/arquivo.swf" /> <embed src="/arquivo.swf" quality="high" bgcolor="#ffffff" width="620" height="230" name="zen" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

Nos campos value e embeb src troque o nome do arquivo para o caminho do seu sfw. ex: www.seusite.com.br/flash/flash.swf

Nos campos width de heigh coloque a largura e a altura do seu swf respectivamente.

Faça o procedimento acima na guia HML do post, clique na guia Visual novamente, aparecerá o objeto inserido.

Para inserir um simples swf dentro do seu post, o código acima resolve o seu problema, funciona e todos ficam felizes. Não é necessário nenhum plugin para esse modo de inserção de arquivos flash no seu post, porém nem tudo são flores. No Mob Tube, post que precisei inserir um flash, esse cógido não funcionou corretamente, pois o swf principal chamava outros swfs externos que não proporcionaram leitura. Enfim, #fail.

Portanto esqueça tudo o que você leu acima, para agradar gregos e troianos achei pela net uma forma bem mais fácil e versátil.

1. Instale o plugin Insere Iframe

2. coloque o código abaixo no seu post, certifique que esteja na guia HTML.

[ iframe: src="http://www.seusite.com.br/imagens/teste.swf" frameborder="0" width="575" height="431" scrolling="no"]

Obs: retire o espaço na linha de códico entre a chave "[" e o "i" da palavra iframe.

Uma coisa boa que acontece ao utilizar alguns scripts desenvolvidos para questões específicas, é que os leitores de rss geralmente não lêem essas linhas. Vejam como fica no Google Reader.

Estrutura do trabalho

O Mob Tube é um projeto que visa trabalhar com algumas das maiores tendências da web 2.0, a participação colaborativa. Tomando o Youtube como referência bem sucedida na área de vídeos, resolvemos elaborar algo que une os vídeos a participação mais interativa e colaborativa dos usuários, tendo como base o celular, ou qualquer dispositivo móvel capaz de captar som e imagem.

Vivemos hoje na era da colaboração. A web 2.0 está proporcionando uma nova modalidade de construção de conteúdo, o que faz mudar também os meios para poder acompanhar e dar suporte a essa nova transformação. Os computadores estão tomando conta dos lares, e a internet torna-se cada vez mais um dos principais meios de entretenimento e comunicação. Os dispositivos móveis, como os celulares, são uma síntese dessa evolução. Neles foram incorporados funcionalidades que pareciam ser inconcebíveis na sua criação. Funções multimídia já não são nenhuma novidade, e sim, quase uma obrigação nesses aparelhos portáteis.

Hoje em dia, é bem facilitado a obtenção desses aparelhos sem precisar de grandes investimentos. Sua difusão teve grandes proporções, a gama de produtos voltado para esse tipo de mídia também acompanha essa evolução, enquanto os recursos de áudio e vídeo estão se tornando elementos básicos.

É nesse cenário onde o projeto Mobtube pretende atuar, criando uma interação maior entre dispositivos móveis, usuários e conteúdo colaborativo na web. O projeto consiste em um site de vídeos enviados pelos usuários, gravados preferencialmente através do celular. Esses vídeos serão usados para montar uma “história”, composta por 10 vídeos de no máximo 30 segundos. O resultado obtido será uma história contada inteiramente pelos usuários de  3 minutos aproximadamente.

Um tema será proposto pelo site, que por sua vez, publica o primeiro vídeo dando início a história. A partir daí, dá-se início a construção do segundo capítulo, os usuários enviam seus vídeos para dar continuação a história iniciada. Os vídeos enviados ficarão em votação no site por 5 dias, e o mais votado será escolhido para compor o segundo capítulo da história. Além do que, os usuários devidamente cadastrados poderão acompanhar do seu celular os vencedores de cada capítulo. Esse procedimento se repete até a conclusão da história. O vídeo final será disponibilizado para download ou para envio direto ao celular.

Com isso, pretendemos criar uma ambiente propício a construção colaborativa através de vídeos, votação e comentários, com uma ramificação para blog e uma conta no twitter.  Os usuários de quem esperamos uma adesão maior são, principalmente, aqueles que interagem ativamente na internet, seja, assistindo, postando ou indicando vídeos, participando de redes sociais, blogs, e que sempre estão atrás de novidades. Além do que, os conteúdos gerados serão bastante inusitados, com certo teor de humor, e cenas que presenciamos somente em vídeos da internet, por isso o público passivo tende a ser bem amplo também.

Enfim, esse projeto não visa “reinventar a roda” e sim lançar mão de ferramentas já disponíveis, fazendo uma integração entre elas, agregando criatividade e colaboração.

Projeto funcional do Mob Tube

Para simular a idéia, selecionamos alguns vídeos famosos da internet e produzimos uma história divertida como apresentação do trabalho. Essa brincadeira você pode ver abaixo.

[iframe: src="http://www.aareis.com.br/wp-content/uploads/2010/01/mobtube/intro.swf" frameborder="0" width="575" height="431" scrolling="no"]

Sou suspeito para fazer certos trabalhos acadêmicos, ainda mais se o assunto me deixar um pouco fascinado, música e games são exemplos. Continuando com a linha dos trabalhos mais divertidos da pós-graduação, outro que realizei junto com o Rodrigo Neiva na matéria Projetos em Ambientes Multimídia, foi a análise da interface multimídia do Guitar Hero III. A parte mais divertida do trabalho, sem dúvida foi a "jogatinha" na qual me encontrei para realizar o mesmo, o resultado você confere abaixo.

Estrutura do trabalho

Guitar Hero é um jogo que apresenta um controlador em forma de guitarra utilizado para simular a reprodução de uma música do gênero rock’n’roll. O jogo consiste no jogador pressionar os botões do controlador, de acordo em que as notas musicais aparecem na hora em que o deslocamento do ecrã exibe a cor do botão a ser pressionada. Para análise da interface, foi escolhida a música Bulls On Parade da banda Rage Against the Machine, na qual foi feita a análise nos níveis, fácil, médio, difícil e expert.

Facilidade de aprendizagem
Em cada dificuldade da música, o aprendizado é diferente, uma vez que cada nível é definido pelo número de botões que o usuário terá que pressionar e pela rapidez que a música apresenta de acordo com cada dificuldade. No modo fácil, o usuário tem como escolha a opção dos três primeiros botões do controlador, no nível médio a jogabilidade é dada por quatro botões e nos níveis difícil e expert pelos cinco botões do controlador. Isso torna o jogo adaptável de acordo com o grau de destreza do usuário.

Eficiência no uso
Assim como na facilidade de aprendizado, a eficiência no uso também possui seus parâmetros de acordo com cada nível de dificuldade. Entretanto a interface apresenta dificuldade no manuseio e controle do jogo até obter uma prática maior no mesmo. Em todos os níveis é necessário acostumar com a interface para obter um bom resultado no jogo.

Memorabilidade
Se tratando de uma interface bem dinâmica, na qual as notas musicais do ecrã são exibidas de forma não contínua, aleatória para cada tipo de dificuldade, fica quase impossível o conceito de memorabilidade se enquadrar a tal interface. Mesmo com a análise de uma única música do jogo, jogando durante vários dias, a memorização não é possível.

Minimização de erros
Durante o jogo, a possibilidade de se errar é grande, cada nota para ser reproduzido, o botão de o controlador dever ser pressionado no exato momento em que o ponteiro passar pela nota musical no ecrã. A rapidez e o dinamismo que a música possui devido às suas variações sonoras, contribuem para que o usuário tenha mais erros, caso o mesmo não possuir destreza e familiaridade com a interface.

Satisfação dos usuários
Guitar Hero além de ser um jogo hiper divertido, com uma inteface gráfica bem atraente, sua usabilidade não é de toda complicada, ao mesmo tempo em que também não é de facilidade imediata. A satisfação é garantida por se tratar de um ambiente voltado para o entretenimento, o game proporciona interatividade e disputa entre múltiplos jogadores.

Para não passar em branco, vale a pena ver um vídeo desses viciadinhos em Guitar Hero que encontrarmos pelo YouTube, jogando Bulls On Parade no modo expert e pontuando 100%. Um dia eu chego lá!

O Power Point é o software popular para montar apresentações (ponto final). Mas se você é um "flash maníaco" e gosta de usar efeitos além do fade in/out, sabe que o Flash é uma ótima opção para deixar suas apresentações mais divertidas. Porém é válido alertar, não use e abuse de efeitos aqui e acolá, isso cansa ao longo da apresentação e é totalmente dispensável. Use a criatividade ao seu favor.

O primeiro cuidado é definir o tamanho do palco e pensar na resolução de tela na qual deseja rodar a apresentação. Ao contrário do Power Point, no Flash não basta inserir o conteúdo e pronto, pequenos detalhes são importantes para que tudo funcione bem. Existem duas saídas para a sua apresentação, a primeira é fazer com que o conteúdo se ajuste em toda a tela do monitor automaticamente, e a segunda é fazer com um tamanho fixo e evitar que o conteúdo seja expandido.

Apresentação tela cheia e conteúdo ajustado

1. Abra um arquivo novo com "ActionScript 2.0". Na janela "Publish Settings (crtl+Shift+f12)", guia "Flash", certifique que a versão está configurada para "Flash Player 8", caso contrário os comandos de "fscommand" que iremos utilizar não funcionarão. Em "formats", marque a opção "Windows Projector" (a sua apresentação publicada em arquivo executável) ou "Macintosh Projector" (caso for rodar em mac).

2. Nas propriedades do palco, defina o tamanho (size) para uma resolução que achar adequada, no caso estou utilizando 1280x1024*. No primeiro frame da cena (shift+f2) "actions" (nome que criei para esta cena) coloque os comandos (f9):

fscommand("fullscreen", "true"); // tela em fullscreen
fscommand("allowscale", "true"); // permite que a apresentação se ajuste independente da resolução do monitor
fscommand("showmenu", "false"); // desabilita funções no clique direito do mouse

* utilizando a apresentação com o conteúdo ajustável, faça sua apresentação com a maior resolução que puder para garantir boa qualidade dos bimaps nela utilizados.

3. Crie quantas cenas forem necessárias, é recomendável criar uma cena para cada slide. Insira o conteúdo da sua apresentação (títulos, imagens, faça os efeitos, etc). Depois crie uma camada em cada slide denominada "stop", no último frame dessa camada pressione "f9" e coloque a função "stop();" para o seu slide pausar. Repita a operação para todas as cenas.

Obs: ao trabalhar com imagens dentro da sua biblioteca, importe as imagens já com os tamanhos certos e utilize posições absolutas nas coordenadas XY, veja exemplo.

4. Inserido todo o conteúdo, vamos para a navegação dos slides. Crie dois botões (Ctrl+f8) denominados, "proximo" e "anterior" (evite utilizar acentuação para nomear símbolos). Na janela de criação do botão, aperte "f6" na área "hit" e desenhe qualquer objeto nesta área, veja exemplo.

5. Na primeira cena e em todas as outras usaremos os botões criados para navegar até o próximo slide e para voltar ao slide anterior. Posicione os botões fora do palco (f11 para acessar a biblioteca de objetos) para facilitar a sua localização, o botão "anterior" no lado esquerdo do palco e o botão "proximo" no lado direito. Clique no botão "anterior", pressione "f9" e coloque a seguinte função:

on (keyPress "<Left>") {
prevScene();
} // essa função retornará ao slide anterior ao ser pressionado a tecla com uma seta esquerda do teclado

No botão "proximo", pressione f9 e coloque a seguinte função:

on (keyPress "<Right>") {
nextScene();
} // essa função avançará ao próximo slide ao ser pressionado a tecla com uma seta direita do teclado

6. Para finalizar, colocaremos na última cena um comando para que a apresentação feche automaticamente após o último slide. No primeiro frame da cena coloque o comando:

fscommand("quit");

Obs: nesta cena não é necessário colocar os botões "anterior" e "proximo".

Apresentação tela cheia e conteúdo fixo

A única (e grande) diferença desse modo de apresentação é fazer que o conteúdo se mantenha fixo, não se ajustando proporcionalmente com o tamanho da resolução de tela do monitor. A vantagem é ter o conteúdo com o tamanho idêntico ao que você está produzindo. A desvantagem é se limitar ao tamanho fixo, podendo “perder” espaço para utilização de conteúdo. É muito arriscado utilizar resoluções altas em apresentação com conteúdo fixo, portanto escolha uma resolução que você terá certeza do tamanho da utilização da tela. Uma dica nesse caso é fazer a apresentação na resolução 1024x768.

Nas propriedades do palco, defina o tamanho (size) para uma resolução que achar adequada, no caso estou utilizando 1024x768. No primeiro frame da cena (shift+f2) actions (nome que criei para esta cena) coloque os comandos (f9):

fscommand("fullscreen", "true"); // tela em fullscreen
fscommand("allowscale", "false"); // não permite que a apresentação se ajuste independente da resolução do monitor
fscommand("showmenu", "false"); // desabilita funções no clique direito do mouse

Note que o procedimento é o mesmo, porém na função "allowscale" o valor do campo será false, deixando o conteúdo fixo.

Faça o download exemplo.

Dica: em apresentações, seja em Flash, Power Point ou pdf gerado do Indesign por exemplo, sempre mantenha o leitor informado de sua localização. Insira numerações nas páginas, formas de navegação pelos slides, teclas de atalho, links. Isso é importante para deixar o leitor mais confortável e seguro na usabilidade do seu projeto.