Apaixonar-se pela Web: sites e ferramentas inspiradoras

A inspiração pode vir de lugares inesperados – as conversas que tivemos, os pontos que conectamos em nossas mentes e as pequenas coisas que vimos em algum lugar. E embora às vezes precisemos de uma boa ideia para um problema específico, outras vezes não há nada mais precioso do que dar um passo atrás na tarefa em que estamos trabalhando para deixar nossa mente vagar livremente.

Neste post, coletamos recursos que ajudam você a fazer exatamente isso. Você encontrará colírio para os olhos, ideias para sair da sua zona de conforto e se desafiar , bem como ferramentas e recursos para ajudá-lo quando estiver preso em um projeto. Apenas coisas que achamos inspiradoras e úteis e que podem estimular sua criatividade também. Aproveitar!

Um mundo de maravilhas em miniatura

Você já pensou que o brócolis que você está preparando para o jantar parece uma floresta de árvores? Ou que as folhas flutuando na superfície do lago de patos do seu parque local se assemelham a pequenos barcos? Quando você vê as coisas de uma perspectiva diferente , um mundo totalmente novo começa a se abrir. Um mundo de maravilhas.

Tatsuya Tanaka tem um olho muito especial para as pequenas maravilhas que estão bem na nossa frente. Desde 2011, ele cria cenas em estilo diorama em miniatura a partir de coisas simples do cotidiano e pequenas figuras impressas em 3D e pintadas à mão. No universo em miniatura de Tatsuya, você descobrirá cenas de churrasco onde clipes de papel se transformam em cadeiras e mesas de piquenique e grampos de metal na churrasqueira, você encontrará um pacote aberto de batatas fritas formando um skatepark, uma paleta de sombras e um batom se transformando em um pequeno escritório, ou um hambúrguer em um carrossel. A imaginação é o único limite. Tatsuya publica um novo diorama em miniatura todos os dias em seu calendário em miniatura. Agora, se essa não é a maneira perfeita de começar um novo dia pensando fora da caixa, o que mais é?

Flores de fogo

Saxões girando, pombos voadores, baterias de polca, fontes astecas, luzes de Bengala – a variedade de fogos de artifício é tão rica quanto os nomes que os descrevem. No entanto, se você já tentou tirar fotos de um show de fogos de artifício, sabe que pode ser bem difícil capturar essa riqueza. É exatamente isso que torna tão fascinante uma série de anúncios de catálogos de fogos de artifício japoneses do século XIX: sem nenhuma expectativa de fotorrealismo, as ilustrações nos catálogos evocam uma sensação única de admiração.

Digitalizados pela Biblioteca Municipal de Yokohama, os catálogos datam da década de 1880 e mostram não apenas fogos de artifício como os conhecemos hoje, mas também os chamados “fogos de artifício à luz do dia”. Os fogos de artifício à luz do dia tiveram suas origens no Japão e não usavam efeitos pirotécnicos, mas um projétil que continha um balão em forma de animal, pessoa ou outras formas que se abriam e inflavam ao retornar ao solo. Colírio para os olhos!

Paisagens urbanas baseadas em livros antigos

Os livros antiquários são conhecidos por terem títulos longos e páginas de rosto bastante despretensiosas, apesar da riqueza de conhecimento que guardam em suas capas. Para ilustrar o conhecimento único que os leitores encontrariam neles, Nicholas Rougeux iniciou um projeto muito especial: Title Cities.

Title Cities reinventa as páginas de rosto de livros científicos antigos como paisagens urbanas coloridas, com base apenas nas palavras da página de rosto. Seja em A Origem das Espécies , de Charles Darwin, ou Óptica , de Isaac Newton, para cada livro, Nicholas desenhou caixas ao redor das palavras na página de rosto e as codificou por cores pela primeira letra. Mantendo seus tamanhos originais um em relação ao outro, ele então organizou as caixas em paisagens urbanas abstratas. Um belo exemplo de que a inspiração pode ser encontrada em todos os lugares.

Ilustrações de mineralogia classificadas por cor

Alguma vez você já teve uma ideia surgindo na sua cabeça que você não conseguia largar? Quando Nicholas Rougeux se deparou com a enorme coleção de ilustrações minerais que o naturalista e ilustrador britânico James Sowerby criou no início do século 19, ele se perguntou como elas seriam organizadas por cores em uma grande colagem. E, bem, ele passou os quatro meses seguintes fazendo exatamente isso: organizando todas as ilustrações de Sowerby da série de 718 placas, British Mineralogy and Exotic Mineralogy .

O resultado é o impressionante projeto British & Exotic Mineralogy . Uma obra de arte fascinante que cria uma ponte entre o trabalho meticuloso de duas pessoas que vivem com dois séculos de diferença e as técnicas que usaram – da caixa de pintura às modernas tecnologias da web. Se você quiser saber mais sobre a abordagem de Nicholas e os desafios que ele enfrentou ao longo do caminho, há uma postagem no blog que acompanha ele, na qual ele compartilha uma visão dos bastidores.

Uma galeria de padrões com curadoria

Quando cores ousadas encontram paletas sutis, curvas orgânicas aparecem ao lado de formas geométricas afiadas e designs minimalistas enfrentam obras de arte divertidas, a inspiração não está longe. Se você está pronto para um saco surpresa de colírio para os olhos , o Pattern Collect é para você. O site seleciona padrões lindamente ilustrados criados por designers de todo o mundo.

Você pode navegar pela vitrine por tag e se gostar de uma obra de arte, um link leva você ao original no Dribbble ou Behance onde você pode saber mais sobre o ilustrador e seu trabalho. Quem sabe, talvez essa seja a oportunidade de encontrar talentos criativos para trabalhar em um próximo projeto?

A glória visual das fitas em branco

Você se lembra das fitas VHS em branco? Antony Terence dedicou-lhes um artigo no qual destaca porque continuam a ser uma masterclass em design visual ainda hoje, com a sua “ relação complicada entre tipografia e cor ” que “os torna ainda mais intrigantes”, como escreve.

Se você quiser mais inspiração do passado, bem, que tal fitas de música vazias? O blog japonês Tapefan é inteiramente dedicado à beleza dos antigos Sonys, TDKs, Fujis, Maxells e seus companheiros, que costumavam valorizar a música favorita das pessoas antes que as tecnologias modernas tomassem seu lugar. Uma viagem inspiradora no tempo.

Nova guia, nova arte

Por que não apimentar uma das ações mais mundanas que realizamos inúmeras vezes por dia e torná-la um pouco, bem, mais emocionante, inspiradora mesmo? Estamos falando de abrir novas guias do navegador . Se você está cansado de ver o mesmo plano de fundo sempre que abre uma nova guia, a extensão Google Arts & Cultures para Chrome pode ser para você.

Cada vez que você abre uma nova guia (ou pelo menos uma vez por dia), a extensão apresenta uma bela nova arte. As obras de arte variam de Van Gogh e Monet até obras contemporâneas de artistas de rua de todo o mundo. Se uma das obras-primas despertar sua curiosidade, você pode clicar na descrição da imagem para descobrir mais. Uma ótima maneira de respirar um pouco de cultura em seu dia.

Protetores de tela aéreos para Mac

Você está cansado do mesmo velho protetor de tela cumprimentando você quando você volta para sua mesa depois de uma pausa para o café? Aerial está aqui para mudar isso. O projeto de código aberto permite reproduzir vídeos do protetor de tela tvOS da Apple no seu Mac.

Entre os protetores de tela, você encontrará vídeos aéreos de alta qualidade filmados em várias cidades e locais como Nova York, São Francisco e China, vídeos da Terra da ISS, vídeos subaquáticos, bem como uma seleção de vídeos criados especialmente para Aerial. Todos eles são filmados em 4k, dando a sensação de que você realmente está experimentando o local como um pássaro pairando sobre a cena. As sobreposições de protetor de tela mostram descrições dos principais recursos geográficos exibidos nos vídeos e, se você quiser, também fornecem informações sobre a hora e o clima e o que está sendo reproduzido no Apple Music ou no Spotify.

Arte do Círculo Gerativo

Você se lembra dos espirógrafos? As pequenas rodas e anéis de plástico que permitem desenhar todos os tipos de formas de flores? A coleção de arte generativa de Nadieh Bremer, Rotae, é o irmão adulto do fascínio do bom e velho Spirograph. “Rotae” significa “rodas” em latim e é uma ode à vasta gama de formas que podem aparecer a partir do processo aparentemente simples de deixar círculos girarem em círculos.

A galeria Rotae é composta por 529 saídas, todas animadas para revelar os meandros do caminho subjacente. Como funciona? Cada uma das Rotaes usa um hash como sua semente, um gerador de números pseudo-aleatórios escolhe o número de rodas e qual simetria de m-fold criar. As rodas recebem aleatoriamente raios e frequências que criarão a simetria desejada. Em seu resumo do projeto, Nadieh compartilha mais informações sobre a tecnologia por trás das obras- primas visuais , bem como sobre como ela as animou.

Dicas e inspiração de arte generativa

Um projeto inspirador que preenche a lacuna entre uma tradição centenária e codificação de última geração é {Shan, Shui} . Criado por Lingdong Huan e inspirado nos rolos de paisagem tradicionais chineses, ele cria paisagens chinesas de rolagem infinita geradas processualmente em formato SVG . As montanhas e árvores na paisagem são modeladas do zero usando ruído e funções matemáticas. Fascinante!

Agora, se você está se perguntando como algo tão complexo pode funcionar, você não está sozinho. Victor Shepelev queria descobrir o segredo de {Shan, Shui}* e fez disso seu projeto de advento para entender como funciona. E, de fato, ele levou 24 dias para cavar completamente o código. Ele resumiu suas descobertas em uma série de artigos.

Se você está pronto para colocar a mão na massa em um pequeno projeto de arte generativa, os artigos de George Francis com dicas e truques para criar arte generativa são para você. Para mais inspiração, também não deixe de navegar pelo site de Andrey Andronov. Realiza algumas experiências fantásticas com estilos de arte famosos e novos - de Mondrian e Bauhaus ao suprematismo e arte geométrica.

Arte com CSS

Você já tentou criar uma arte CSS do zero? Caso contrário, Yosra Emad escreveu um tutorial fácil de seguir que pode inspirá-lo a começar. Nele, Yosra leva você passo a passo pelo processo de criação de um fantasma amigável apenas com CSS. Ela mostra tudo, desde dividir um esboço inicial em camadas e planejar a marcação até codificar cada detalhe da arte. Não é apenas um pequeno e divertido desafio de codificação, mas também ajuda você a levar suas habilidades de posicionamento CSS para o próximo nível.

Se você está procurando alguma inspiração para arte CSS, a conta do Codepen de Chuan Yuan é um baú cheio de padrões de fundo CSS impressionantes, bem como obras de arte CSS estáticas e animadas . Certifique-se de não perder o Codepen onde Chuan recriou os famosos gráficos do designer japonês Ikko Tanaka apenas com CSS.

Worklets inspiradoras de pintura Houdini

Houdini é um conjunto de APIs de navegador de baixo nível que fornecem acesso direto ao CSS Object Model e permitem escrever código que o navegador pode analisar como CSS. Se você já está um pouco mais familiarizado com o conceito, já deve ter ouvido falar em Paint Worklets. Eles oferecem uma maneira de desenhar imagens que respondem dinamicamente a mudanças no CSS.

Para se aprofundar em como os worklets funcionam, o Houdini.how apresenta alguns worklets de pintura interessantes para experimentar: fundos brilhantes , confetes, gradientes em pó, sublinhados, dicas de ferramentas e muito mais. Um tutorial ajuda você a colocar tudo em funcionamento e um polyfill resolve a falta de suporte no Firefox e Safari.

Um bot do Twitter que cria paletas de cores

A inspiração das cores está em todos os lugares. Às vezes até em uma imagem alguém incluiu em um tweet. Para essas ocasiões, Color Parrot é o seu novo melhor amigo. Basta mencionar o bot do Twitter em uma resposta e ele responderá a você com uma paleta de cores para a imagem.

Ao pedir ajuda ao Color Parrot, você pode especificar o número de cores que deseja obter do bot. Basta incluir o número em seu tweet. “@color_parrot quais são essas cores? Eu preciso de 6 deles.”, por exemplo. A história por trás do bot também é interessante: David Aerne, seu criador, está mantendo uma lista de nomes de cores de código aberto que é usada por muitos aplicativos e sites. Para medir, quais nomes são melhores que outros, ele coleta os gostos e reações a cada cor. Portanto, ao usar o bot, você está contribuindo ativamente para o projeto de código aberto. Ganha-ganha.

Gradientes de malha selecionados à mão

Gradientes bonitos? Sim por favor! Se você não tem tempo para criá-los sozinho ou está procurando uma nova inspiração, a coleção de gradientes de malha com curadoria manual de Gene Maryushenko certamente o cobrirá.

Insatisfeito com o que encontrou online, Gene criou 100 gradientes que farão seu site se destacar, sem ser barulhento. Os gradientes podem ser baixados gratuitamente como JPEGs. CSS e SVG serão adicionados posteriormente. Aproveitar!

Um gerador para microcópia amigável

Encontrar as palavras certas pode ser um desafio. Speak Human pode ser o lugar perfeito se você precisar de alguma inspiração para redação. Por exemplo, para mensagens de confirmação, interrupções respeitosas e lembretes gentis.

Para se inspirar, basta selecionar um objetivo em uma lista suspensa e o gerador apresenta uma microcópia inteligente e centrada no ser humano - uma maneira amigável de pedir aos usuários seu e-mail, por exemplo, ou um pequeno pedaço de cópia de comércio eletrônico que se destaca da multidão. Rápido e fácil.

Fontes em uso

Você precisa decidir sobre um tipo de letra para um projeto, mas está faltando alguma inspiração? Ou talvez você tenha um ponto ideal para todas as coisas tipografia? De qualquer forma, Fonts In Use pode ser exatamente o que você está procurando.

Fonts In Use é um arquivo de tipografia indexado por tipo de letra, formato, indústria e período. De faturas vintage e anúncios de jornal do início do século 20 a embalagens de doces e sequências de títulos de filmes de hoje, o site é um baú do tesouro de amostras tipográficas de todas as origens. Uma ótima maneira de descobrir novas fontes.

Padrões de rabiscos generativos

O que você pode criar a partir de formas geométricas básicas? De acordo com Sy Hong e Ye Joo Park, mundos inteiros! Os designers se uniram para criar o Tabbied, uma pequena ferramenta que gera rabiscos geométricos coloridos a partir de presets já pré-fabricados . Basta selecionar uma das predefinições, personalizar as cores e escolher configurações como a frequência de um padrão e a grade real e — ta-daa! — você pode baixar o PNG com seu doodle imediatamente.

Se você está procurando por algo um pouco mais avançado, Repper e MagicPattern também estão à sua disposição. E como não pode haver variedade suficiente quando se trata de padrões, você também pode dar uma olhada no Patternify, um gerador de padrões CSS que permite definir um padrão em uma grade 10×10, visualizar o resultado e baixar PNG ou CSS. Para mais inspiração, o Hero Patterns fornece uma coleção de padrões de fundo SVG repetíveis e o MagicPattern apresenta padrões de fundo CSS puros, como zig-zag ou diagonais.

Sites inspiradores ao redor do mundo

Com que frequência você se depara com sites cirílicos? E os sites japoneses? Ou sites de indústrias específicas, mas obscuras? Quando queremos explorar padrões de design incomuns, pode ser uma boa ideia procurar em lugares incomuns . Por exemplo, Cyrillic.Design mostra sites em cirílico que muitas vezes não aparecem em galerias populares. Todas as entradas podem ser filtradas com tags e novos sites são adicionados regularmente.

O SiteInspire organiza sites por setor e categoria, permitindo pesquisar sites relacionados ao setor de saúde ou projetos relacionados à arquitetura. Design Made in Germany mostra o trabalho feito por designers alemães e Responsive-JP destaca o trabalho brilhante de designers japoneses. Finalmente, você pode encontrar muitas páginas de destino no Land-Book e One Page Love, enquanto o Personalsit.es coleta sites pessoais pequenos e adoráveis. Agora, isso deve mantê-lo ocupado por um tempo!

Inspiração de IU para dispositivos móveis

Como outros designers resolveram um problema de interface do usuário específico? Stephanie Walter coletou alguns recursos úteis que certamente lhe darão um pequeno impulso de inspiração ao projetar para dispositivos móveis.

Na lista de Stephanie, você encontrará mais de 15 recursos para inspiração de UI móvel, organizados em diferentes categorias: recursos classificados por padrões de UI, tipo de visualização, componentes, fluxos específicos, bem como categoria de aplicativo e inspiração de ícone móvel . E mesmo que o conteúdo já tenha dois anos, ainda é um baú do tesouro para todos que trabalham em uma interface móvel.

Podcasts para se inscrever

Quais podcasts você está ouvindo? O que te inspira e o que te ajuda a descobrir coisas que você nunca conheceu? Estas são as perguntas que fizemos no Twitter, com muitas ótimas sugestões vindas da comunidade. Work-Life é um podcast adorável com conselhos sobre como melhorar seu trabalho , enquanto Darknet Diaries é uma fascinante audição sobre hackers, violações, crimes cibernéticos e todas as coisas que habitam as partes ocultas da Internet.

Você sempre pode encontrar uma visão melhor das coisas em A Bit Of Optimism e aprender a melhorar seu fluxo de trabalho de design com o Design Better Podcast. Há muito mais sobre todos os lados do design em Design Matters e 99% Invisible. Todos os ótimos podcasts para manter em sua biblioteca para uma caminhada no parque, corrida ou apenas um pouco de culinária à noite. Ah, e, claro, também temos o nosso próprio Smashing Podcast. Apenas dizendo'!

Desembaraçar sua bagunça de favoritos

Você tem um sistema dedicado para armazenar todas as ferramentas e artigos úteis que podem ser úteis algum dia, os livros que planeja ler, as receitas que deseja experimentar e todas as outras pequenas inspirações que você encontra ao navegar a teia? Se seus favoritos estão transbordando de itens preciosos, mas você os perdeu, uma pequena ferramenta está esperando para ajudá-lo a desembaraçar essa bagunça de favoritos: Raindrop.io.

Raindrop.io permite que você classifique seus favoritos em coleções e atribua tags a eles que facilitam a localização rápida do que você está procurando e, se quiser, você pode até compartilhar essas coleções com membros da equipe e amigos. A ferramenta funciona perfeitamente em todos os dispositivos e também está disponível em uma versão premium que vem com recursos adicionais, como um localizador de links duplicados e quebrados, pesquisa de texto completo para os sites que você salvou, backup na nuvem e muito mais.

Empacotando

Você se deparou recentemente com um site que o deixou inspirado? Ou talvez uma pequena ferramenta útil que o ajudou a superar uma depressão criativa? Adoraríamos ouvir sobre isso nos comentários abaixo!