{"id":261560,"date":"2023-07-22T10:29:00","date_gmt":"2023-07-22T07:29:00","guid":{"rendered":"https:\/\/inform.click\/aplicativos-que-podem-reduzir-sua-carga-de-ciencia-no-design\/"},"modified":"2023-07-22T10:43:00","modified_gmt":"2023-07-22T07:43:00","slug":"aplicativos-que-podem-reduzir-sua-carga-de-ciencia-no-design","status":"publish","type":"post","link":"https:\/\/inform.click\/pt-pt\/aplicativos-que-podem-reduzir-sua-carga-de-ciencia-no-design\/","title":{"rendered":"Aplicativos que podem reduzir sua carga de “ci\u00eancia” no design"},"content":{"rendered":"

\n O que os web designers menos gostam? Provavelmente codifica\u00e7\u00e3o. E talvez um segundo pr\u00f3ximo seja a prototipagem para todos os dispositivos. E qualquer coisa que possa facilitar esse tipo de coisa permite que um designer gaste mais tempo nos aspectos criativos de seu trabalho.\n<\/p>\n

\n Com isso em mente, h\u00e1 uma s\u00e9rie de novos aplicativos excelentes que todo designer deve explorar como poss\u00edveis adi\u00e7\u00f5es ao seu kit de ferramentas!\n<\/p>\n

\n FRONTIFICAR<\/a>
\n<\/h5>\n

\n Que \u00f3timo site para voc\u00ea criar seus pr\u00f3prios guias de estilo e armazen\u00e1-los na nuvem para refer\u00eancia futura e compartilhamento. Existem modelos de guia de estilo para logotipos e imagens, paletas de cores, tipografia, \u00edcones e seu pr\u00f3prio texto e m\u00eddia. A outra grande vantagem aqui \u00e9 que voc\u00ea n\u00e3o precisa criar manualmente seus pr\u00f3prios guias de estilo em PDF \u2013 voc\u00ea os armazena no Frontify e eles podem ser convertidos em arquivos PDF para download, impress\u00e3o e compartilhamento. O controle de vers\u00e3o mant\u00e9m todas as vers\u00f5es mais antigas em segundo plano para serem acessadas a qualquer momento. Voc\u00ea pode come\u00e7ar com seus modelos ou pesquisar exemplos de livros de marcas para personalizar os seus. Todas as fun\u00e7\u00f5es s\u00e3o acess\u00edveis via API. Aqui est\u00e1 um exemplo do que voc\u00ea pode fazer apenas com um logotipo, usando o pr\u00f3prio Frontify:\n<\/p>\n

\n Este \u00e9 o logotipo b\u00e1sico. A Frontify decidiu que os “drops” eram a chave aqui, mas que eles poderiam fazer muitas outras coisas, ainda mantendo o logotipo consistente. Aqui est\u00e3o as mudan\u00e7as de cores:\n<\/p>\n

\"\"<\/a><\/p>\n

\n E aqui est\u00e1 um exemplo de varia\u00e7\u00e3o do logotipo b\u00e1sico:\n<\/p>\n

\"\"<\/a><\/p>\n

\n Este \u00e9 apenas um exemplo dos modelos de design e cores que voc\u00ea pode usar para criar guias de estilo exclusivos, e todos os componentes s\u00e3o intercambi\u00e1veis.\n<\/p>\n

\n COMPOSITOR VISUAL<\/a>
\n<\/h5>\n

\n Este aplicativo existe h\u00e1 algum tempo e voc\u00ea j\u00e1 deve saber dele, mas seria dif\u00edcil encontrar outro com o pacote de op\u00e7\u00f5es de design. Ele basicamente eliminou as \u00e1rduas tarefas de planejamento e codifica\u00e7\u00e3o. Voc\u00ea pode ter layouts de design em apenas alguns minutos, adicionando elementos com um \u00fanico clique. O pre\u00e7o de $ 25 vale bem a pena. Bot\u00f5es para tudo; muitas op\u00e7\u00f5es de anima\u00e7\u00e3o, op\u00e7\u00f5es de compartilhamento imediato e assim por diante. Mais de 40 elementos de conte\u00fado neste beb\u00ea! \u00c9 realmente uma ferramenta para todos os fins! Se voc\u00ea n\u00e3o tiver certeza sobre todos os seus recursos e como usar este aplicativo, confira os tutoriais em v\u00eddeo aqui<\/a>.\n<\/p>\n

\"\"<\/a><\/p>\n

\n Existem \u00f3timos recursos que permitem criar suas p\u00e1ginas muito rapidamente e voc\u00ea pode modificar quase qualquer elemento. Por exemplo, existem v\u00e1rios elementos de grade predefinidos que voc\u00ea pode modificar ou uma op\u00e7\u00e3o para criar sua pr\u00f3pria grade.\n<\/p>\n

\n Se h\u00e1 uma desvantagem no Visual Composer, \u00e9 que ele deixa muitos c\u00f3digos pequenos para tr\u00e1s quando voc\u00ea o desativa e precisa ser removido antes de iniciar um novo tema. Aqui est\u00e1 um exemplo de design criado por meio do Visual Composer.\n<\/p>\n

\"\"<\/a><\/p>\n

\n CA\u00c7A DE DESIGN<\/a>
\n<\/h5>\n

\"\"<\/a><\/p>\n

\n Quando sua inspira\u00e7\u00e3o acaba de parar, voc\u00ea provavelmente a procura procurando novos sites que possam lhe dar \u00f3timas ideias. Isso pode ser uma tarefa demorada, ent\u00e3o por que n\u00e3o usar um m\u00e9todo muito mais conveniente? A Design Hunt \u00e9 uma esp\u00e9cie de “c\u00e2mara de compensa\u00e7\u00e3o”, mas muda todo o seu repert\u00f3rio diariamente. Ele desenha \u00f3timos novos designs encontrados no Pinterest, Dribble, Designer News, DesignInspiraton e muito mais e os publica para designers que procuram novas inspira\u00e7\u00f5es e ideias. Agora, voc\u00ea pode ir a um lugar todos os dias e encontrar uma cole\u00e7\u00e3o totalmente nova.\n<\/p>\n

\n TOOKAPIC<\/a>
\n<\/h5>\n

\"\"<\/a><\/p>\n

\n Um rec\u00e9m-chegado relativo no neg\u00f3cio de fotografia, Tookapic agora tem mais de 11.000 fotos, a maioria de gra\u00e7a, o resto por um pequeno pre\u00e7o. Voc\u00ea pode realmente gostar mais disso do que da fonte de fotos que est\u00e1 usando agora – cor e clareza fenomenais e fotos realmente \u00fanicas. Acesse o site deles e confira o que eles t\u00eam. Voc\u00ea pode se surpreender!\n<\/p>\n

\n MARVELAPP<\/a>
\n<\/h5>\n

\n Esta ferramenta de prototipagem gratuita permite que voc\u00ea esboce e crie maquetes de seu celular ou qualquer outro dispositivo e veja imediatamente o prot\u00f3tipo. A partir da\u00ed, voc\u00ea pode reorganizar, modificar, adicionar cor, texto, alterar formas e fazer praticamente qualquer coisa, com compatibilidade imediata com qualquer dispositivo. Depois de nomear seu projeto, voc\u00ea vai imediatamente para a interface principal e come\u00e7a. Depois de conclu\u00eddo, voc\u00ea pode visualizar todo o design e interagir com ele para garantir que tudo funcione bem.\n<\/p>\n

\"\"<\/a><\/p>\n

\n Para saber mais sobre essa ferramenta fenomenal, visite o site e assista \u00e0 demonstra\u00e7\u00e3o \u2013 voc\u00ea ficar\u00e1 maravilhado com a facilidade de uso. Um dos melhores recursos \u00e9 a capacidade de inserir imagens de qualquer lugar (mesmo Dropbox e esbo\u00e7o) e de qualquer tipo de imagem. Voc\u00ea tamb\u00e9m pode adicionar uma equipe se este for um projeto colaborativo. A maior desvantagem da Marvel \u00e9 que existem limita\u00e7\u00f5es com a vers\u00e3o gratuita, ent\u00e3o voc\u00ea definitivamente precisar\u00e1 atualizar. Ainda assim, \u00e9 superf\u00e1cil de usar \u2013 t\u00e3o bom quanto o Justinmind.\n<\/p>\n

\n ANIMAR CSS<\/a>
\n<\/h5>\n

\n Se voc\u00ea cria muita anima\u00e7\u00e3o, com certeza vai querer essa ferramenta. Recursos muito legais sem ter que escrever nenhum c\u00f3digo. Existe uma biblioteca de efeitos de anima\u00e7\u00e3o pronta para uso – mais de 50 na verdade – e voc\u00ea pode personalizar facilmente o n\u00famero de loops e a dura\u00e7\u00e3o. A anima\u00e7\u00e3o adiciona grande envolvimento e entretenimento, desde que voc\u00ea n\u00e3o exagere!\n<\/p>\n

\n Se voc\u00ea est\u00e1 procurando uma gama realmente completa de recursos e op\u00e7\u00f5es, no entanto, o CSS sozinho n\u00e3o preencher\u00e1 a conta. Embora certamente o debate sobre CSS e JavaScript continue, definitivamente existem maneiras pelas quais eles podem ser usados \u200b\u200bjuntos. Por exemplo, voc\u00ea tem uma \u00f3tima anima\u00e7\u00e3o CSS projetada, mas deseja que ela deslize da esquerda quando um usu\u00e1rio chegar a um determinado ponto na rolagem para baixo. Voc\u00ea ter\u00e1 que adicionar JS para fazer isso. Entender que o CSS tem suas limita\u00e7\u00f5es e pode ser aprimorado pelo JS \u00e9 apenas um uso inteligente das ferramentas que est\u00e3o dispon\u00edveis.\n<\/p>\n

\"\"<\/a><\/p>\n

\n No entanto, o Animate CSS \u00e9 realmente f\u00e1cil de executar. Voc\u00ea faz o download, anexa CSS, bem como jQuery e quaisquer outros componentes que desejar e come\u00e7a a animar. H\u00e1 \u00f3timos tutoriais no YouTube para voc\u00ea come\u00e7ar.\n<\/p>\n

\n COOLORS<\/a>
\n<\/h5>\n

\n Se acontecer de voc\u00ea ser dalt\u00f4nico ou apenas desafiar o esquema de cores, esta ferramenta desenvolver\u00e1 um esquema de cores completo para voc\u00ea ou criar\u00e1 um se voc\u00ea souber por onde deseja come\u00e7ar. Quando voc\u00ea encontrar uma cor de sua prefer\u00eancia, bloqueie-a e continue clicando – voc\u00ea obter\u00e1 um esquema completo com quantas cores quiser. Isso \u00e9 especialmente \u00fatil se voc\u00ea quiser usar gradientes de cores. N\u00e3o h\u00e1 nada realmente controverso sobre essa ferramenta \u2013 os designers que a usam adoram; quem ainda n\u00e3o experimentou. A \u00fanica desvantagem? N\u00e3o \u00e9 mais gratuito e voc\u00ea precisa ter uma conta no iTunes para fazer o download.\n<\/p>\n

\"\"<\/a> Gerador autom\u00e1tico de esquema de cores para os que n\u00e3o gostam de cores<\/p>\n

\n CIRCLE.SVG<\/a>
\n<\/h5>\n

\n Esta n\u00e3o \u00e9 uma ferramenta abrangente com muitas op\u00e7\u00f5es, modelos e tal, mas aqui est\u00e1 uma maneira \u00fanica de criar um menu ou v\u00e1rios em quantas p\u00e1ginas voc\u00ea desejar! Tudo o que voc\u00ea faz \u00e9 inserir os detalhes do que deseja em seu menu. Voc\u00ea receber\u00e1 instru\u00e7\u00f5es detalhadas sobre como constru\u00ed-lo e incorpor\u00e1-lo em uma p\u00e1gina espec\u00edfica.\n<\/p>\n

\"\"<\/a> Um pouco de algo para envolver melhor os visitantes<\/p>\n

\n O SVG circular \u00e9 provavelmente superior ao CSS para criar esse tipo de elemento. Depois de fazer o download, voc\u00ea tem 3 op\u00e7\u00f5es: Voc\u00ea pode desenhar seus setores em um editor gr\u00e1fico, como o Sketch, e depois export\u00e1-los como SVG, adicionar intera\u00e7\u00e3o e incorpor\u00e1-los; voc\u00ea pode desenhar seus setores com c\u00f3digo; ou voc\u00ea pode usar o gerador Circulus diretamente no aplicativo.\n<\/p>\n

\n O CSS permite que voc\u00ea crie uma navega\u00e7\u00e3o circular, mas h\u00e1 alguns bugs no navegador, al\u00e9m de dar muito trabalho. Voc\u00ea tem que come\u00e7ar com um ret\u00e2ngulo, separ\u00e1-lo, depois inclinar e girar essas se\u00e7\u00f5es. E, se voc\u00ea usar mais do que apenas \u00edcones em seus setores, fica mais complicado.\n<\/p>\n

\n Usando SVG, voc\u00ea pode desenhar qualquer forma que desejar, usando linhas espec\u00edficas e comandos de arco para as “cunhas” que desejar \u2013 aqui est\u00e1 um exemplo:\n<\/p>\n

\"\"<\/a><\/p>\n

\n Depois de desenhar cada uma de suas fatias e seu \u00edcone e\/ou conte\u00fado incorporado, basta uni-los.\n<\/p>\n

\n METAFLOP<\/a>
\n<\/h5>\n

\n Cansado das mesmas fontes antigas e estilos de letras? Crie o seu pr\u00f3prio – sem necessidade de codifica\u00e7\u00e3o – basta clicar e arrastar. Mudar para fontes e estilos de texto exclusivos pode encorajar os visitantes a realmente ler o conte\u00fado! Este aplicativo \u00e9 t\u00e3o legal que voc\u00ea ter\u00e1 dificuldade em n\u00e3o brincar com ele por horas. E voc\u00ea nunca mais dir\u00e1 que a tipografia \u00e9 a parte menos sexy do web design.\n<\/p>\n

\n \u00c9 t\u00e3o simples. Voc\u00ea personaliza as fontes a partir de uma s\u00e9rie de slides que possuem caracter\u00edsticas diferentes \u2013 altura, abertura e contraste. Voc\u00ea ajusta at\u00e9 obter o que deseja e, em seguida, faz o download como um pacote de fontes da Web (gratuito). H\u00e1 tamb\u00e9m uma biblioteca de fontes pr\u00e9-constru\u00eddas para escolher. Continue jogando – voc\u00ea ver\u00e1 por que os designers de tipos podem ser uma “ra\u00e7a em extin\u00e7\u00e3o”.\n<\/p>\n

\"\"<\/a> Chame a aten\u00e7\u00e3o com fontes e estilos exclusivos<\/p>\n

\n FONTE DE FONTE<\/a>
\n<\/h5>\n

\"\"<\/a><\/p>\n

\n Este \u00e9 realmente um “novo garoto no quarteir\u00e3o”. O Fontflame tenta aliviar os designers de apenas mais um fardo – encontrar pares de fontes que realmente funcionem. No momento, ele tem 10 pares publicados em seu site, mas est\u00e1 adicionando diariamente. Exemplos de emparelhamento, usando a biblioteca de fontes gratuitas do Google, incluem “Lobster-Asap” e “Roboto-Open Sans”. Bibliotecas adicionais ser\u00e3o adicionadas em breve. Fique de olho neste site – ele ter\u00e1 muito a oferecer em pares em breve.\n<\/p>\n

\n PODCAST DE FREELANCER<\/a>
\n<\/h5>\n

\"\"<\/a><\/p>\n

\n N\u00e3o \u00e9 um aplicativo ou uma ferramenta \u2013 este \u00e9 um podcast semanal para designers e desenvolvedores que voc\u00ea n\u00e3o vai querer perder. Apresentado por Paul Jarvis, voc\u00ea ter\u00e1 acesso a novas tend\u00eancias, aplicativos e ferramentas, al\u00e9m de muitos conselhos realmente pr\u00e1ticos.\n<\/p>\n

\n IN-VISION<\/a>
\n<\/h5>\n

\n Aqui est\u00e1 uma \u00f3tima ferramenta de prototipagem que possui v\u00e1rios recursos n\u00e3o encontrados nas outras. Como todos os outros, voc\u00ea cria sua maquete para qualquer um ou todos os dispositivos – voc\u00ea escolhe os que deseja. Depois que seu prot\u00f3tipo \u00e9 criado, voc\u00ea pode visualiz\u00e1-lo em todos os dispositivos e envi\u00e1-lo aos clientes ou membros da equipe para revis\u00e3o. Eles podem comentar diretamente sobre o design em si, o que \u00e9 uma grande vantagem. Dois outros recursos interessantes do In-Vision s\u00e3o um modo de hist\u00f3rico, que permite ver todas as vers\u00f5es anteriores de um design, e 3 projetos de demonstra\u00e7\u00e3o para os designers trabalharem at\u00e9 que se sintam confort\u00e1veis \u200b\u200bcom todos os recursos.\n<\/p>\n

\"\"<\/a><\/p>\n

\n Ao comparar o In-vision com o aplicativo Marvel, as diferen\u00e7as importantes s\u00e3o provavelmente estas:\n<\/p>\n

    \n
  1. O InVision tem mais recursos que o Marvel, mas isso tamb\u00e9m o torna mais complexo. Por exemplo, ele possui mais recursos de colabora\u00e7\u00e3o ao vivo, uma ferramenta para capturas de tela de anota\u00e7\u00e3o e \u00f3timos elementos de hist\u00f3rico.\n <\/li>\n
  2. A Marvel tem um aplicativo para iOS e atualmente est\u00e1 trabalhando em aplicativos para Android e iPad \u2013 a InVision n\u00e3o os possui.\n <\/li>\n
  3. InVision \u00e9 provavelmente melhor para uma equipe maior, Marvel melhor para equipes individuais ou pequenas.\n <\/li>\n<\/ol>\n

    \n Os coment\u00e1rios dos usu\u00e1rios de ambos os aplicativos esclareceriam qual \u00e9 o melhor para quais fins.\n<\/p>\n

    \n Voc\u00ea provavelmente tem alguns aplicativos favoritos que outros designers adorariam conhecer. Conte-nos quais s\u00e3o e como eles lhe d\u00e3o mais tempo para ser um artista.\n<\/p>\n<\/p>\n

    \n Fonte de grava\u00e7\u00e3o: instantshift.com<\/a>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

    O que os web designers menos gostam? Provavelmente codifica\u00e7\u00e3o. E talvez um segundo pr\u00f3ximo seja a prototipagem para todos os dispositivos. E qualquer coisa que possa facilitar esse tipo de coisa permite que um designer gaste mais tempo nos aspectos criativos de seu trabalho. Com isso em mente, h\u00e1 uma s\u00e9rie de novos aplicativos excelentes que todo designer deve explorar como poss\u00edveis adi\u00e7\u00f5es ao seu kit de ferramentas! FRONTIFY Que \u00f3timo site para voc\u00ea criar seus pr\u00f3prios guias de estilo e armazen\u00e1-los na nuvem para refer\u00eancia futura e para compartilhamento. Existem modelos de guia de estilo para logotipos\u2026<\/p>\n","protected":false},"author":1,"featured_media":147533,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[202,150,124,605,59,657],"tags":[],"class_list":["post-261560","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-designer-de-web","category-dicas-e-truques-da-web","category-ferramentas-web","category-tecnologia-e-muito-mais","category-web-e-wordpress-2","category-web-sites"],"_links":{"self":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts\/261560","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/comments?post=261560"}],"version-history":[{"count":0,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts\/261560\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/media\/147533"}],"wp:attachment":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/media?parent=261560"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/categories?post=261560"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/tags?post=261560"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}