DESIGNLAB

Design, Tipografia e Multimédia.

Archive for Software

Links do dia: alteração de estados com CSS

Há muito tempo que não faço esta rubrica aqui, mas com as aulas a acabar, posso dar-me ao luxo de voltar a ler as mais de 50 abas que tenho abertas no Firefox e descobrir coisas absolutamente deliciosas.

Uma destas coisas é este truque conseguido apenas com um pouco de imaginação e CSS: http://jsfiddle.net/DMNSn/

Simon Madine consegue mudar o aspeto (propriedades de CSS) recorrendo apenas a hiperligações, um pouco de lógica de Box model, e ao atributo “:target”. A solução é assustadoramente simples e absolutamente deliciosa! Permite inúmeras aplicações em layouts interativos, exploratórios, jogos… Ah!… já disse que ele não usa Javascript?…

Via Creative Bloq: http://www.creativebloq.com/css3/tips-breathe-new-life-your-css-61411880

Webinar Adobe InDesign CC

Screen Shot 2013-07-07 at 7.03.48 PM

Imagem retirada do site da Adobe

Para quem quiser  investir no Design Editorial e na publicação digital, recomendo o próximo webinar gratuito da Adobe: https://www1.gotomeeting.com/register/145221617?et_mid=626755&rid=3807420

Na próxima terça-feira, 19:00

Workshops de Tipografia

Pormenor do site

Ainda a propósito do III Encontro de Tipografia, aproveito para divulgar os workshops que se vão realizar como pré-programa da conferência. São gratuitos para estudantes (que é uma coisa rara nos dias que correm – a organização está de parabéns!) e para o público em geral fica bastante acessível.

Vai ser abordado o Type Design, o resgate tipográfico urbano e a composição em chumbo. Esta é daquelas oportunidades a não perder. Aqui fica a divulgação enviada pela organização da conferência:

Realização de 3 workshops em antecedência ao Encontro versando sobre as seguintes temáticas:

Workshop 1: Creating type: an introduction to type design
Workshop 2: Photo found typo
Workshop 3: Letterpress

A participação nos workshops é gratuita para alunos das escolas artísticas/design por ordem de inscrição até ao limite máximo de vagas disponíveis.

Público geral: 20€ por inscrição até ao limite máximo de vagas disponíveis.

Para mais informações e inscrições, por favor consultem o nosso website: http://www.esmae-ipp.pt/3et

Boas práticas para a edição de Blogs

Pormenor da estratégia editorial de publicação (in Tidwell, 2009: 416)

Este texto resume um conjunto de boas práticas para a redação de Blogs. Surge em resposta ao desafio do Prof. Hélder Caixinha, no âmbito das aulas de  Projeto, e em resposta às necessidades de outras disciplinas como Multimédia Editorial, onde parte do trabalho dos alunos passa por criar um blog de documentação de desenvolvimento e de acompanhamento dos projetos.

Por uma questão de conveniência, este resumo está organizado nos seguintes temas:

Deve ser usado como um manual de linhas orientadoras para a redação e manutenção de um Blog. Não como um manual de regras obrigatórias.

Cada autor deve refletir sobre estes princípios e adapta-los da melhor forma ao seu Blog.

Uma vez que se trata de um resumo, os assuntos podem ser consultados de forma mais completa e ilustrada nas referências fornecidas. Conhecem outras , ou melhores referências? Deixem-me um comentário.

Conteúdo

Anatomia de um Blog (About.com)

O conteúdo refere-se às entradas cronológicas (“posts”), páginas de informação estática, ou pequenas secções (como as “sidebars” do Blog).

As entradas devem fornecer o contexto necessário de forma curta. Devem filtrar a informação desnecessária e oferecer hiperligações para informação adicional (fontes originais, textos longos, outras entradas, sites, ou blogs com informação adicional).

Devem procurar uma redação correta, sem erros, com princípio, meio e fim.

Agrupar a informação semelhante em pequenos segmentos, grupos, ou unidades, com uma ou duas ideias por cada.

As entradas, ou secções, devem possuir títulos significativos, uma breve descrição (se possível), data (de redação e de atualização), autor(es), e estar categorizadas com etiquetas e categorias significativas.

Se o texto for longo, podem escrever um resumo prévio, ou dividir em múltiplas entradas.

As entradas mais antigas devem ser atualizadas, editando-as, comentando-as, ou ligando-as às entradas mais recentes, ou a outras fontes de informação (internas, ou externas).

Estrutura

Exemplo de um Feedreader (NetNewsWire)

A estrutura refere-se ao tipo de informação, a sua marcação, as suas funções e o uso pretendido (interação) no Blog.

Devem usar estilos (HTML) “standard” para hierarquizar a o texto (H1, H2, Parágrafo, etc.). Bem como estruturas formais de texto tradicional (itálicos para destacar, listas de balas, numeradas, etc.).

A formatação visual (tamanho, cor, etc) deve ficar a cargo do tema/CSS do Blog, ou do Feedreader do utilizador final.

Deve-se fornecer uma opção de pesquisa dentro do próprio Blog.

As hiperligações para os conteúdos devem ser simples, evitando alterações, ou ligações quebradas. Tentar fornecer as hiperligações por extenso, sempre que possível.

Verificar como os conteúdos estão a ser indexados nos motores de busca e corrigir a meta-informação de acordo.

Ritmo e edição

Exemplo de painel de objetivos editoriais (WordPress.com)

Um autor de um blog é um como um editor tradicional. Deve possuir uma agenda de edição e uma estratégia de publicação.

Deve-se optar por um mínimo de um entrada semanal, e um máximo de uma entrada diária. Publicar de forma regular, agendando as entradas, ou criando uma agenda de entradas temáticas, se possível.

Evitar o “overshare”.

Agilizar o ritmo e interligação das entradas do Blog com outros meios de publicação e partilha social como o Twitter, ou o Facebook, como formas complementares de publicação e atualização de conteúdos mais curtos e imediatos. Ou de conteúdos de outra natureza, como os canais de Vídeo, ou Podcasts.

Design e ilustração

Seleção de temas visuais (WordPress.com)

O Blog deve ter um tema visual apelativo, relacionado com o conteúdo do Blog, sem perder de vista a funcionalidade (design funcional, ou minimalista).

Sempre que possível, devem ilustrar as entradas com imagens, vídeos, ou outro elemento multimédia, mantendo a dimensão (Kb) da página baixa.

Créditos e hiperligações

Exemplo de licenciamento disponível (Creative Commons)

Todos os materiais utilizados (textos, imagens, vídeos, etc) devem ser identificados com legendas, referências no texto e creditados corretamente.

O Blog deve conter a informação de “copyright” sobre o conteúdo próprio.

A privacidade dos autores deve ser protegida, mas ao mesmo tempo fornecer o máximo de informação sobre o Blog, sobre os autores, ou sobre o conteúdo, de forma a obter credibilidade (tipicamente, na página “About”).

Deve-se fornecer uma forma de contacto (direto) com o(s) autor(es).

Deve-se fornecer formas de ligação social (“feeds”, subscrições por email, etc.) de forma a que seja fácil os leitores tornarem-se “seguidores”.

Aproveitar a natureza de rede da Web para embutir conteúdo no Blog, ou estabelecer hiperligações nos conteúdos utilizados, abreviando as entradas e fornecendo informação em profundidade.

Estabelecer um Blogroll que vos ajuda a identificar e a serem identificados pelos vossos pares.

Feedback e estatísticas

Exemplo de estatísticas fornecidas pelo WordPress.com

Os Blogs possuem vários mecanismos de validação social visível e invisível para os leitores. Enquanto autores, estes mecanismos são fundamentais para entender e fomentar a leitura do Blog.

Mecanismos de validação e partilha social

Encorajar a dinamização e participação no Blog (de amigos, colegas, docentes, orientadores, etc.), através da disponibilização e manutenção dos comentários, formas de avaliação (votação, “ratings”, “likes”, etc.) e de mecanismos de partilha social online.

Dispor de uma medição estatística que permita recolher dados sobre os utilizadores, sobre o conteúdo consultado e sobre a navegação. Melhorar o Blog com esta informação.

Referências

Referências adicionais "obrigatórias"

BARBOSA, E.; GRANADO, A. – Weblogs: Diário de bordo. Porto: Porto Editora, 2004.  ISBN 972-0-45252-8.

BLOOD, R. – The Weblog Handbook: Pratical advice on creating and maintaining your blog. Cambridge: Perseus Books, 2002.  ISBN 0-7382-0756-X.

BORDEAU, J. – Blogging For Web Designers: Editorial Calendars and Style Guides [em linha]. Smashing Magazine. [Consult. 2012-02-08]. Disponível na Internet: <URL: http://www.smashingmagazine.com/2010/08/30/the-importance-of-consistency-using-editorial-calendars-and-style-guides>.

CRUMLISH, C.; MALONE, E. – Designing Social Interfaces: Principles, Patterns, and Practices for Improving the User Experience. Sebastopol: O’Reilly Media, 2009.  ISBN 978-0596154929. Disponível na Internet: <URL: http://www.designingsocialinterfaces.com>.

FRANCO, G. – Como escrever para a Web [em linha]. S. l.: Knights Center fo Journalism, s. d. [Consult. 2012-02-08]. Disponível na Internet: <URL: http://knightcenter.utexas.edu/ebook/how-write-web>.

TIDWELL, J. – Designing Interfaces: Patterns for Effective Interaction Design. Sebastopol: O’Reilly, 2010.  ISBN 978-1-449-37970-4. Disponível na Internet: <URL: http://designinginterfaces.com>.

Dave Crossland @ Aveiro

Cartaz de divulgação @ DeCA

O Dave Crossland está em Portugal para ministrar um par de conferências e workshops nas Caldas da Rainha (ESAD.CR) e em Aveiro (DeCA). Vai passar no Departamento de Comunicação e Arte (DeCA) na próxima segunda-feira dia 9 de Janeiro para apresentar a conferência “Libre Fonts” às 11:30, e ministrar um workshop de desenho tipográfico “Type Sketching” às 14:30. Ambos irão decorrer na sala do Mestrado de Design (Catacumbas).

A assistência à conferência é livre a todos os interessados.

Workshop de Junho de 2010 @ Hacklaviva

A participação no workshop é livre e gratuita. Mas, como está limitada ao espaço disponível, os interessados devem inscrever-se, enviando-me um email, mencionando o nome, número mecanográfico e curso (alunos da UA). Ou com o nome, ocupação e filiação (se vierem de fora).

O workshop terá uma duração mínima de 2 horas e os participantes devem trazer consigo o seguinte material:
- papel de fotocópia (bastantes folhas);
- um par de lápis de grafite (B+) para esquissar;
- marcadores (pretos) finos para desenhar;
- marcadores de ponta larga (tipo edding) para preencher;

Não é obrigatório, mas pode ser útil trazer também:
- borracha;
- tesoura, ou x-ato;
- fita-cola de papel;
- duas esferográficas de cores diferentes (p. ex.: canetas bic verde e vermelha);
- aparos, pincéis espatulados, ou canetas caligráficas.

Mais informações sobre o Dave Crossland e sobre o workshop:
http://understandingfonts.com/
https://plus.google.com/107256173895795146408/about

Timeline de software e formatos de fontes

Timeline de formatos e de softwares de produção de fontes (versão 8)

[post atualizado em 2011-12-18]

Depois do feedback obtido de vários colegas e amigos, apresento aqui uma nova versão (8ª) da linha temporal que compila os principais softwares de edição e formatos de fontes desde 1967 a 2011.

Post original no Typeforge: http://www.typeforge.net/blog/2011/11/24/font-formats-timeline/ ‎

Muito deste trabalho de compilação, resulta de um dos capítulos da minha teste de doutoramento em curso, por isso, se utilizarem nos vossos trabalhos, digam-me qualquer coisa. Por outro lado, se encontrarem outros formatos, ou softwares, deixem-me um comentário ou mandem-me um email. Quem sabe não podemos começar uma página da Wikipedia, ou uma linha temporal interativa no Dipity?

Oferta de emprego: Bolsa de Investigação @ UA

Pormenor do cartaz de apresentação do Projeto SEDUCE

Não costumo fazer este tipo de divulgação no blog, mas pareceu-me apropriado face às circunstâncias atuais. Como estou envolvido no projeto, tenho um conhecimento básico sobre os requisitos necessários para a função – a oferta desta bolsa pretende encontrar um Designer Multimédia – programador com fortes competências gráficas, ou designer gráfico com competências fortes de programação (web).

Pessoalmente, acho a oferta bastante atrativa – o ambiente de trabalho do DeCA é porreiro, descontraído (e exigente!), mas para quem gosta de estudar, este é uma excelente oportunidade para investir num currículo de investigação!

Bolsa de Investigação no âmbito do projecto SEDUCE
Até 2 de Dezembro, está aberto concurso para a atribuição de uma Bolsa de Investigação (BI) no âmbito do projecto SEDUCE – utilização da comunicação e da informação mediada tecnologicamente em ecologias web pelo cidadão sénior (PTDC/CCI-COM/111711/2009), financiado por fundos nacionais através da FCT/MCTES (PIDDAC) e co-financiado pelo Fundo Europeu de Desenvolvimento Regional (FEDER) através do COMPETE – Programa Operacional Factores de Competitividade (POFC).

A bolsa terá a duração de 12 meses, com início previsto em 1 de janeiro de 2012.
O concurso encontra-se aberto no período de 17 Novembro de 2011 a 2 de Dezembro de 2011.

Mais informações:

 

Links do dia: Leituras e livrinhos…

Quem me conhece, sabe que sou um consumidor compulsivo de livros da Amazon. Ou porque ouço falar, ou porque vejo um link, ou porque apenas gostei do título e índice (Prof. Marcelo cuidado—qualquer dia quem faz a rubrica semanal dos livros sou eu!). Pode ser um problema na conta bancária de vez em quando, mas a verdade é que se vão apanhando alguns títulos interessantes que não dá para esperar que saiam em português. É o caso dos livros que adicionei ao carrinho de compras esta semana: In The Plex, de Steven Levy! Já não basta a biografia de Steve Jobs que estou desejoso por ler, mas consegui arranjar mais um livro de um dos meus autores favoritos. Apesar de ter apenas um par de livros, não estou a exagerar—ora vejam só a página dele na Amazon—confesso que se pudesse desgraçava-me…

Generative Gestaltung @ Vimeo

Outra desgraça em forma de livro à espera de acontecer (à minha conta bancária)—este ainda não tive coragem de comprar: http://vimeo.com/9273490

 

Processing 2.0 Alpha

Esta semana estive a trabalhar num novo sketch de Processing. Muito entusiasmante foi ver que Casey Reas anunciou o desenvolvimento da nova versão (2.0) do Processing. Ainda está em versão alpha, mas apesar de instável, pareceu-me mais rápido (com o modo 64bit). Vai conter ferramentas novas como o videomaker, mas que ainda não deu para testar. Disponível para download no Google Code: http://code.google.com/p/processing/downloads/list. Escusado será listar a quantidade de livros que há dedicados ao Processing… na minha prateleira conto oito, alguns já aqui listei. Por um lado espero que lancem um novo livro, com algoritmos novos e referências a mais autores e exemplos. Por outro lado a minha conta agradece que não o façam! ;) Uma coisa é certa, o código / sintaxe parece estar estável, o que é bom para poder evoluir na aprendizagem e não estar constantemente a reescrever coisas antigas.

Via @Reas

 

Internet—vantagens e desvantagens à luz de 1996

Por fim, —”Lembram-se do Netscape?”— Tinha feito esta pergunta há um par de semanas no início das aulas de Web e HTML da licenciatura. Ninguém, mesmo ninguém se lembrava, nem faziam a menor ideia. Confesso que também o usei pouco (só comecei a usar a Internet a sério a partir de 1999), mas isso só tornou o último link completamente inesperado e ainda mais divertido de ler: http://technologizer.com/2011/10/28/the-pros-and-cons-of-the-internet-as-taught-to-students-in-1996/. E é incrível verificar como ainda muita gente mantém estas opiniões… No comments…

Via (o incomparável) @Petrvanblokland

Links do dia: Jobs, virtual e aumentado

MacBreak Weekly: Inside Jobs

Aqui está mais uma edição dos links do dia. Esta semana, foi marcada pelo meu regresso aos podcasts… Com o iPhone carregadinho de vozes e vídeos, acabo por trazer uma maior variedade de links (vídeo, textos, áudio, tutoriais, aulas…). Os temas abordam os últimos eventos destas semanas que passaram (conferências e a morte do Steve Jobs), mas também uma série de links (sobre arte digital e programação) que têm ficado por mencionar. É o caso dos últimos links e referências sobre arte digital que têm origem nos vários ecos de conversas, tal como com o Ricardo M. no Facebook, ou com o meu colega de departamento João M. (já pareço um concorrente da casa dos segredos a falar!).

Obviamente a maior influência da semana foi o TWiT, mais concretamente o último episódio do MacBreak Weekly (acima). Até porque, o que (me) marcou a semana, ou melhor, as últimas semanas foi a morte de Steve Jobs. Foi sem dúvida uma grande perda e, pelos vistos, uma morte desnecessária (talvez se tivesse autorizado ser operado quando os médicos recomendaram…?).

Sem demoras, Walter Isaacson publicou a controversa e super-secreta biografia (escrita em colaboração com Jobs) que está a fazer correr muita tinta. Consta que não era uma pessoa fácil, chegando mesmo a ser desagradável com a própria equipa. Extremamente competitivo e arrogante, tinha por objetivo “esmagar a concorrência”, e acabou sentiu a pressão do “roubo” de ideias que o catapultou para a fama virar-se contra ele depois da década de 1990… O livro está cheio de episódios de pura loucura e arriscada gestão pessoal e profissional (para mim, o melhor eles todos é quando “dá uma tampa” à primeira dama Michelle Obama, quando esta o convida para ir jantar com o Presidente dos EUA Barak Obama!). Afinal Jobs não era um génio como os Mac-fan-boys gostam de o “pintar”… Aparentemente era apenas uma pessoa extremamente persistente, com uma grande capacidade de identificar e juntar as oportunidades às pessoas certas.

Agora, ao rever o post antes de o publicar, confesso que esta entrada começa a parecer um pouco esquizofrénica. Mas, mesmo faltando um pouco de direção e organização, não quis deixar de postar esta coleção de links da semana. Afinal de contas, prometido é devido!

 

Microsoft Holowdesk @ Youtube

“Beam me up Scotty!” Neste caso, diretamente para o futuro. Entre o James T. Kirk (AKA William Shatner) e Jean Luc Picard (AKA Patrick Stewart), a escolha pode não ser fácil. Mas uma coisa é certa, o Holowdeck da Enterprise é um dos brinquedos mais cobiçados de qualquer Trekkie. Ou deverei dizer Techie?

Tal como Jobs diria, “they’ve cracked it!”—a malta da microsoft juntou literalmente uma série de brinquedos (uma webcam, um computador e uma kineckt) e fez uma mesa de interação virtual: http://techcrunch.com/2011/10/21/microsofts-augmented-reality-3d-holodesk-lets-you-play-with-balls-in-real-time/.

Agora só falta juntarem o Asimo da Honda e a Siri da Apple… alguém consegue dizer Mr. Data? ;)

Via @johnmaeda

 

Tutorial de Cycles (Blender) por Andrew Price @ Vimeo

Por falar em virtual e simulação, finalmente o Andrew Price usa e explica o novo motor de render do Blender. Como sempre, os tutoriais dele são imprescindíveis. Têm um ritmo adequado à visualização e aprendizagem, são divertidos e em profundidade suficiente. E, porque às vezes é difícil mostrar exemplos de como o Blender é equivalente aos outros programas, recomendo vivamente este tutorial e as imagens e video que o ilustram—o resultado final de Price é impecável, como sempre: http://www.blenderguru.com/videos/introduction-to-cycles

 

ePubs interativos diretamente no InDesign CS5

Já que estou a mencionar tutoriais, aqui vai um podcast muito rápido acerca do uso do InDesign. Até agora era relativamente complicado criar interatividade com o InDesign para o formato ePub (formato editorial para dispositivos moveis como o iPad, iPhone, Kindle…). Existem vários plugins mais ou menos gratuitos como o Mag+, mas agora, basta atualizar os plugins do InDesign para ter funcionalidades básicas e fáceis de utilizar. Terry White explica isto no Podcast da Adobe: http://itunes.apple.com/podcast/adobe-creative-suite-video/id124921198

How to Create Scrolling Content in Your Digital Publication Using InDesign CS 5.5.
ReleasedOct 20, 2011

In this episode I’ll show you how to create Scrolling Content using InDesign CS 5.5 and the New Adobe Digital Publishing Suite. This scrolling content

Já descarreguei a atualização do InDesign, mas confesso que ainda não experimentei. Alguém quer experimentar e dar um feedback disto? É assim tão simples e rápido?

 

Resmas de Gajas! Nelo vs. Arrays @ Slide Share do Carlos Santos

Ainda no tópico de tutoriais, já Twittei e postei no Facebook este, mas é um link tão bom, que decidi publicar aqui no blog novamente.

O meu colega Carlos Santos disponibilizou as aulas de Javascript online (entre outras). De Javascript não percebo nada, mas ainda vou percebendo alguma coisa de introdução à programação. Os slides são claros, concisos e eficientes (até eu percebo!). Mas o que se destaca mesmo é abordagem de Santos—pura e simplesmente genial! Humorada, exemplificativa e com a profundidade suficiente para o nível introdutório. Vejam o drama do Nelo no Slideshare:

O Nelo tem “resmas de gajas” e precisa guardar os nomes em algum lado. Como ajudá-lo utilizando JavaScript? #arrays http://www.slideshare.net/csantos/labmm3-aula-terica-10

 

Marius Watz @ Eyeo Festival 2011 (Vimeo)

Acho que já aqui tinha deixado um link para o canal do Vimeo deste festival, mas nunca é demais relembrar quando se tem acesso a tantos registos de conferências dos nossos artistas digitais preferidos… Desta feita Marius Watz. Não é para todos os gostos. Sempre num registo abstrato, muita atitude freak (ou melhor, geek?), por vezes demasiado colorido nas suas criações. Mas uma coisa é certa, os gráficos dele não passam despercebidos. Para mim, verdadeira inspiração, autêntica arte digital. Vejam a conferência dele no canal do Vimeo do Festival Eyeo 2011: http://vimeo.com/30035982.

No canal do festival estão disponíveis vídeos de Amanda Cox, Aaron Koblin, Ben Fry & Casey Reas, Zach Lieberman e Nicholas Felton (entre outros).

O que é engraçado constatar, assim como com a maior parte destes artistas digitais do século XXI, o código (ou o ato de saber programar) é uma competência básica, uma literacia fundamental. Também defendo isto. Atualmente, um artista, um designer, um autor precisa de adquirir não só a literacia básica do século XX, mas também literacia visual  e literacia digital (ver mais aqui, aqui, aqui e aqui).

Sem me alongar muito mais (já passei em muito a minha conta neste link), outras referências e livros sobre autores, temas, movimentos e criações que tenho e que considero imprescindíveis para o tema são:

Mas enfim. Começo a achar que tenho que fazer um post dedicado só a estes autores e referências literárias sobre o tema… Por isso, se tiverem mais referências, deixem-me um comentário ;)

Workshop de Processing

Já sabem que sou um defensor incondicional do ensino e uso de Processing, por isso aproveito para ajudar a divulgar este Workshop: http://www.cada1.net/?p=104 [Link atualizado]

Via Arena

Follow

Get every new post delivered to your Inbox.

Join 129 other followers

%d bloggers like this: