{"id":261592,"date":"2023-09-03T14:45:00","date_gmt":"2023-09-03T11:45:00","guid":{"rendered":"https:\/\/inform.click\/9-deslizes-comuns-que-os-designers-tendem-a-cometer-durante-o-design-do-icone-do-aplicativo\/"},"modified":"2023-09-03T15:32:00","modified_gmt":"2023-09-03T12:32:00","slug":"9-deslizes-comuns-que-os-designers-tendem-a-cometer-durante-o-design-do-icone-do-aplicativo","status":"publish","type":"post","link":"https:\/\/inform.click\/pt-pt\/9-deslizes-comuns-que-os-designers-tendem-a-cometer-durante-o-design-do-icone-do-aplicativo\/","title":{"rendered":"9 deslizes comuns que os designers tendem a cometer durante o design do \u00edcone do aplicativo"},"content":{"rendered":"<p>\n  Os usu\u00e1rios m\u00f3veis s\u00e3o muito felizes. Afinal, eles podem escolher entre in\u00fameros aplicativos, que est\u00e3o dispon\u00edveis em v\u00e1rias lojas de aplicativos no mercado. O que isso diz a voc\u00ea? Obviamente, isso significa que h\u00e1 uma competi\u00e7\u00e3o acirrada entre v\u00e1rios aplicativos, com cada um deles disputando a aten\u00e7\u00e3o de usu\u00e1rios em potencial.\n<\/p>\n<p>\n  A solu\u00e7\u00e3o est\u00e1 em um aplicativo exclusivo que traz muitos recursos e funcionalidades para a mesa. No entanto, mesmo que voc\u00ea crie e desenvolva um dos melhores aplicativos do mercado, basta um \u00edcone ruim para prejudicar seus esfor\u00e7os. Isso ocorre porque o \u00edcone do aplicativo serve como seu valor nominal e, na maioria das vezes, garante uma venda bem-sucedida.\n<\/p>\n<p>\n  A l\u00f3gica por tr\u00e1s disso \u00e9 que os clientes em potencial tendem a procurar aplicativos relevantes para suas necessidades e um \u00edcone que chama a aten\u00e7\u00e3o certamente aumentar\u00e1 seus n\u00edveis de interesse, levando-os a fazer uma chamada \u00e0 a\u00e7\u00e3o. Voc\u00ea nunca sabe quem vai gostar do aplicativo puramente com base no design do \u00edcone e fazer o download. Isso resulta no aumento das vendas do aplicativo e, portanto, torna-o um sucesso.\n<\/p>\n<p>\n  Focar no design do \u00edcone \u00e9, portanto, mais um pr\u00e9-requisito no ciclo de vida de desenvolvimento do aplicativo. Este artigo discute alguns dos deslizes mais comuns que os designers tendem a cometer durante o design de \u00edcones de aplicativos m\u00f3veis.\n<\/p>\n<h5>\n  1 Os \u00edcones n\u00e3o s\u00e3o \u00fanicos<br \/>\n<\/h5>\n<p>\n  Projetar \u00edcones que parecem ser uma <strong>c\u00f3pia de outro \u00edcone j\u00e1 existente<\/strong> \u00e9 um erro que os designers cometem consciente ou inconscientemente. Muitos deles sofrem com a press\u00e3o de enviar designs de \u00edcones em um curto per\u00edodo de tempo. Enfrentando uma crise aguda de tempo, eles sucumbem \u00e0 press\u00e3o e se contentam com designs comuns.\n<\/p>\n<p>\n  Eles pegam o atalho para o sucesso seguindo dicas de aplicativos mais vendidos e projetando \u00edcones de padr\u00f5es semelhantes. Por exemplo, se houver um aplicativo popular na categoria Entretenimento, os designers gostariam de lucrar com sua popularidade e uma maneira f\u00e1cil de fazer isso \u00e9 criar um \u00edcone de aplicativo semelhante ao aplicativo popular.\n<\/p>\n<p>\n  O resultado? Uma grande quantidade de aplicativos com \u00edcones semelhantes \u2013 incluindo os esquemas de cores. Isso acaba gerando uma confus\u00e3o para o p\u00fablico-alvo, que n\u00e3o conseguir\u00e1 diferenciar entre dois \u00edcones, que possuem a mesma combina\u00e7\u00e3o de cores, principalmente em um wearable.\n<\/p>\n<p>\n  Saia da sua zona de conforto e crie \u00edcones de aplicativos que fa\u00e7am as pessoas se sentarem e prestarem aten\u00e7\u00e3o, sejam seus concorrentes ou p\u00fablico-alvo. Voc\u00ea n\u00e3o pode se dar ao luxo de ter uma abordagem med\u00edocre para criar \u00edcones de aplicativos exclusivos; um \u00edcone exclusivo oferece aos clientes algo para se lembrar do aplicativo.\n<\/p>\n<h5>\n  2 \u00edcones do mesmo grupo n\u00e3o mostram nenhuma semelhan\u00e7a<br \/>\n<\/h5>\n<p>\n  Para aplicativos que pertencem ao mesmo grupo, os \u00edcones tamb\u00e9m devem ter alguma semelhan\u00e7a. Veja o caso do conjunto de aplicativos da Adobe, como InDesign, Photoshop, Lightroom Mobile, Illustrator e Premiere, que apresentam uniformidade no design de seus \u00edcones. Uma olhada na tela e o usu\u00e1rio final saber\u00e1 imediatamente que o \u00edcone pertence ao conjunto de aplicativos da Adobe.\n<\/p>\n<p>\n  Pense <a href=\"http:\/\/www.smashingmagazine.com\/2014\/03\/28\/design-principles-visual-perception-and-the-principles-of-gestalt\/\" target=\"_blank\" rel=\"noopener\">na lei da semelhan\u00e7a da Gestalt<\/a>, segundo a qual a mente humana pode perceber e reconhecer objetos ou padr\u00f5es semelhantes. Implemente isso para criar uniformidade em grupos de \u00edcones desenhando \u00edcones com caracter\u00edsticas semelhantes, que incluem, mas n\u00e3o est\u00e3o limitadas a \u2013 cor, tamanho, tipo de letra etc. Dessa forma, seu p\u00fablico-alvo associar\u00e1 facilmente \u00edcones semelhantes de aplicativos que talvez sejam desenvolvidos pelo mesma companhia.\n<\/p>\n<p>\n  Vamos supor que um de seus aplicativos anteriores teve uma passagem bem-sucedida no mercado, ent\u00e3o h\u00e1 chances de que o sucesso desse aplicativo espec\u00edfico seja transferido para seu novo aplicativo, se os \u00edcones de ambos os aplicativos mostrarem semelhan\u00e7as no design. Portanto, siga o caminho de criar \u00edcones semelhantes para o mesmo grupo ou fam\u00edlia de aplicativos para que seu p\u00fablico-alvo encontre uma conex\u00e3o entre eles.\n<\/p>\n<h5>\n  3 Dando Pixels The Pink Slip<br \/>\n<\/h5>\n<p>\n  Focar nos m\u00ednimos detalhes \u00e9 a caracter\u00edstica dos grandes designers, que realmente sabem o que fazem. Da cor aos pixels, tudo precisa ser perfeito quando se trata de design de \u00edcones de aplicativos. Os pixels, em particular, s\u00e3o extremamente importantes no design de \u00edcones e ignor\u00e1-los pode criar uma m\u00e1 impress\u00e3o nos usu\u00e1rios. N\u00e3o prestar aten\u00e7\u00e3o aos detalhes pode resultar em imagens borradas e pixeladas e \u00e9 \u00f3bvio que n\u00e3o funcionar\u00e1 em qualquer marca e modelo de dispositivo m\u00f3vel.\n<\/p>\n<p>\n  Pense em termos de tecnologia avan\u00e7ada de exibi\u00e7\u00e3o de smartphones, wearables e outros dispositivos m\u00f3veis e voc\u00ea perceber\u00e1 que at\u00e9 mesmo o menor erro pode custar o sucesso de seu aplicativo.\n<\/p>\n<p>\n  Aqui est\u00e1 uma lista de verifica\u00e7\u00e3o de coisas que voc\u00ea pode considerar e, posteriormente, implementar ao projetar um \u00edcone sem ignorar os pixels:\n<\/p>\n<ul>\n<li>N\u00e3o crie um \u00edcone &#8216;universal', que pode ser dimensionado para se adequar a v\u00e1rias regras da loja de aplicativos porque n\u00e3o o far\u00e1.\n  <\/li>\n<li>Todos os \u00edcones n\u00e3o s\u00e3o criados iguais. Um \u00edcone aparecer\u00e1 completamente diferente em um smartphone, tablet e wearable. Certifique-se de seguir diretrizes r\u00edgidas para saber como criar \u00edcones adequados para diferentes plataformas m\u00f3veis.\n  <\/li>\n<li>Experimente o seu caminho para o \u00edcone perfeito. Voc\u00ea pode querer reduzir o tamanho da imagem raster, optar por fazer alguns retoques, mudar a cor se necess\u00e1rio e adotar toda e qualquer estrat\u00e9gia que torne o \u00edcone <strong>escal\u00e1vel<\/strong>.\n  <\/li>\n<\/ul>\n<h5>\n  4 Colocando Muitos Detalhes<br \/>\n<\/h5>\n<p>\n  Preencher muitos detalhes na pequena imagem do \u00edcone pode ser in\u00fatil. O \u00edcone de um aplicativo oferece espa\u00e7o limitado para mostrar suas &#8216;habilidades de design' e muitos detalhes podem estragar tudo. Parece barulhento e pouco profissional. Esta \u00e9 a raz\u00e3o pela qual voc\u00ea precisa ter certeza de que o design do \u00edcone \u00e9 simples e transmite uma mensagem ao p\u00fablico-alvo antecipadamente. A melhor op\u00e7\u00e3o \u00e9 ser minimalista como os designers de topo e optar por apenas elementos essenciais para o design do \u00edcone.\n<\/p>\n<p>\n  Por exemplo, se for um aplicativo de jogos, voc\u00ea pode incluir o personagem do jogo ou usar imagens minimalistas que d\u00e3o aos usu\u00e1rios em potencial uma dica do que \u00e9 o jogo. Se voc\u00ea incluir tudo de uma vez no \u00edcone, incluindo texto, isso criar\u00e1 confus\u00e3o e parecer\u00e1 desagrad\u00e1vel para clientes em potencial. Isso nos leva ao pr\u00f3ximo ponto.\n<\/p>\n<h5>\n  5 Ignorando o texto em um \u00edcone<br \/>\n<\/h5>\n<p>\n  O texto \u00e9 um aspecto crucial do design do \u00edcone; ele deve ser colocado em um \u00edcone se e somente se for absolutamente necess\u00e1rio.\n<\/p>\n<p>\n  \u00c9 bastante tentador incluir o nome do aplicativo ou outro texto relevante dentro do \u00edcone. Muitos designers incluem texto no design do \u00edcone, esperando que isso ajude os clientes em potencial a terem uma ideia instant\u00e2nea sobre o aplicativo, gerando mais downloads. Este \u00e9 um dos maiores erros da parte deles, j\u00e1 que duas das principais lojas de aplicativos &#8211; <strong>a Play Store do Google<\/strong> e <strong>a App Store da Apple<\/strong> t\u00eam o nome do aplicativo exibido ao lado do \u00edcone. Portanto, incluir texto \u2013 particularmente o nome do aplicativo s\u00f3 levar\u00e1 a dados duplicados, sobrecarga de informa\u00e7\u00f5es e, eventualmente, n\u00e3o levar\u00e1 a nada. Al\u00e9m disso, ter texto no \u00edcone dificulta a localiza\u00e7\u00e3o de um aplicativo.\n<\/p>\n<p>\n  Obviamente, isso n\u00e3o significa que voc\u00ea tenha que pular todo o texto no design do \u00edcone. Voc\u00ea pode inclu\u00ed-lo, mas apenas se for relevante para seu aplicativo. Veja o caso do Netflix, que tem um design de \u00edcone simples com apenas o nome do aplicativo no \u00edcone. Mas ent\u00e3o, tem uma tipografia e combina\u00e7\u00e3o de cores diferenciadas, que a tornam \u00fanica e ajudam o p\u00fablico-alvo a se relacionar com a marca.\n<\/p>\n<p>\n  Portanto, se voc\u00ea acha que o texto funcionar\u00e1 para o seu \u00edcone, deve faz\u00ea-lo.\n<\/p>\n<h5>\n  6 combina\u00e7\u00f5es de cores que n\u00e3o funcionam<br \/>\n<\/h5>\n<p>\n  A m\u00e1 escolha de cores ou a sele\u00e7\u00e3o da combina\u00e7\u00e3o de cores errada para o design do \u00edcone de um aplicativo \u00e9 outro erro. As cores desempenham um papel importante em influenciar a mentalidade do consumidor e, como tal, voc\u00ea precisa ter certeza de que n\u00e3o ser\u00e1 v\u00edtima de uma m\u00e1 escolha de cores. Pesquisar sobre os dados demogr\u00e1ficos e h\u00e1bitos\/prefer\u00eancias do seu p\u00fablico-alvo ajudar\u00e1 nessa dire\u00e7\u00e3o.\n<\/p>\n<p>\n  \u00c9 essencial que voc\u00ea selecione a paleta de cores certa, que n\u00e3o apenas pare\u00e7a esteticamente agrad\u00e1vel, mas tamb\u00e9m esteja de acordo com a imagem da sua marca. Para isso, consulte v\u00e1rios materiais online, que explicam tudo o que voc\u00ea precisa saber sobre <a href=\"http:\/\/www.instantshift.com\/2012\/01\/30\/the-psychology-of-color-in-design\/\" target=\"_blank\" rel=\"noopener\">a psicologia das cores<\/a> no <a href=\"http:\/\/www.instantshift.com\/2012\/07\/09\/what-do-your-clothing-colors-say-about-you-infographic\/\" target=\"_blank\" rel=\"noopener\">branding<\/a> e escolha a combina\u00e7\u00e3o de cores certa para o \u00edcone do seu aplicativo.\n<\/p>\n<p>\n  Voc\u00ea tamb\u00e9m pode usar algumas ferramentas incr\u00edveis, que s\u00e3o \u00fateis na sele\u00e7\u00e3o de esquemas de cores. Essas ferramentas incluem, entre outras: <a href=\"http:\/\/www.instantshift.com\/2015\/08\/18\/app-icon-design-slip-ups\/yyyyy\" target=\"_blank\" rel=\"noopener\">Color<\/a>, <a href=\"https:\/\/color.adobe.com\/create\/color-wheel\/\" target=\"_blank\" rel=\"noopener\">Adobe Color CC<\/a>, <a href=\"http:\/\/colllor.com\/\" target=\"_blank\" rel=\"noopener\">Colllor<\/a>, <a href=\"http:\/\/www.colourlovers.com\/\" target=\"_blank\" rel=\"noopener\">COLOURlovers<\/a>, <a href=\"http:\/\/paletton.com\/\" target=\"_blank\" rel=\"noopener\">Paletton<\/a> etc. Voc\u00ea pode realizar uma pesquisa para descobrir muitos outros recursos online e offline, que o ajudar\u00e3o nessa dire\u00e7\u00e3o.\n<\/p>\n<h5>\n  7 Esquecendo tudo sobre o p\u00fablico-alvo<br \/>\n<\/h5>\n<p>\n  Uma das principais caracter\u00edsticas dos designers especializados \u00e9 que eles levam em considera\u00e7\u00e3o seu p\u00fablico-alvo antes do design do \u00edcone. Isso \u00e9 importante porque, obviamente, um aplicativo direcionado a um segmento diferente de p\u00fablico, digamos, por exemplo, crian\u00e7as, ter\u00e1 uma certa apar\u00eancia, incluindo o design do \u00edcone, como os esquemas de cores brilhantes. Se voc\u00ea compar\u00e1-lo com um aplicativo voltado para empresas, ele ter\u00e1 uma apar\u00eancia completamente diferente \u2013 minimalista com esquemas de cores neutras ou tons pastel.\n<\/p>\n<p>\n  Voc\u00ea tamb\u00e9m precisa levar a cultura de v\u00e1rios lugares onde seu aplicativo est\u00e1 dispon\u00edvel. Isso ocorre porque alguns s\u00edmbolos podem ser usados \u200b\u200bno \u00edcone para alguns pa\u00edses, mas n\u00e3o para outros, onde podem ser considerados ofensivos ou ferir os sentimentos das comunidades.\n<\/p>\n<p>\n  <strong>Fa\u00e7a uma pesquisa completa<\/strong> sobre seu p\u00fablico-alvo e use a pesquisa para criar um \u00edcone que os atraia \u00e0 primeira vista. Voc\u00ea pode passar por v\u00e1rios aplicativos, que ganharam aclama\u00e7\u00e3o internacional e dar uma olhada em seus designs de \u00edcones para ter uma ideia melhor.\n<\/p>\n<h5>\n  8 Abandonar a Est\u00e9tica no Design<br \/>\n<\/h5>\n<p>\n  O \u00edcone do seu aplicativo precisa ser <strong>elegante e est\u00e9tico<\/strong> para atrair v\u00e1rios clientes em potencial nas lojas de aplicativos. Abandonar a est\u00e9tica do design \u00e9, portanto, um estrito n\u00e3o. Ent\u00e3o, como voc\u00ea garante que seu aplicativo seja esteticamente atraente para seu p\u00fablico-alvo? Aqui est\u00e3o alguns pontos \u00fateis que ir\u00e3o ajud\u00e1-lo.\n<\/p>\n<ul>\n<li>Acompanhe as \u00faltimas tend\u00eancias do mercado, como <strong>Flat Design<\/strong> (do iOS) e <strong>Material Design<\/strong> (do sistema operacional Android), que podem ser usados \u200b\u200bpara criar aplicativos para smartphones, tablets e, principalmente, vest\u00edveis.\n  <\/li>\n<li>Teste o design do seu \u00edcone antes de finaliz\u00e1-lo para o aplicativo. Por exemplo, os \u00edcones do Apple Watch s\u00e3o colocados em um fundo preto. Portanto, projete seu aplicativo para o wearable de forma que fique em contraste com o plano de fundo. Teste seus \u00edcones no dispositivo e n\u00e3o no simulador para garantir que estejam perfeitos.\n  <\/li>\n<li>Reduza a complexidade. Voc\u00ea pode criar um \u00edcone simples e, ainda assim, parecer totalmente est\u00e9tico. O minimalismo est\u00e1 na moda de qualquer maneira, ent\u00e3o voc\u00ea s\u00f3 se beneficiar\u00e1 desta etapa.\n  <\/li>\n<\/ul>\n<p>\n  No entanto, n\u00e3o apenas invista toda a sua energia no design de um \u00edcone bonito, mas tamb\u00e9m incorpore elementos que tornem o prop\u00f3sito do \u00edcone instantaneamente reconhec\u00edvel para os usu\u00e1rios-alvo. Pode ser uma forma ou imagem ou a inicial do nome do app (Pinterest, Vine, Facebook, Evernote), que diz muito sobre o app sem comprometer a parte est\u00e9tica.\n<\/p>\n<h5>\n  9 N\u00e3o Seguindo as Diretrizes<br \/>\n<\/h5>\n<p>\n  Diferentes plataformas m\u00f3veis t\u00eam diferentes conjuntos de regras para o design de \u00edcones. Seguir essas regras ou diretrizes ajuda os designers a criar \u00edcones que funcionar\u00e3o melhor para os aplicativos dessas plataformas. Voc\u00ea pode usar o exemplo das <a href=\"https:\/\/developer.apple.com\/library\/ios\/documentation\/UserExperience\/Conceptual\/MobileHIG\/Iconography.html#\/\/apple_ref\/doc\/uid\/TP40006556-CH59-SW1\" target=\"_blank\" rel=\"noopener\">diretrizes de interface humana da Apple<\/a> ou <a href=\"https:\/\/www.google.co.in\/design\/spec\/style\/icons.html\" target=\"_blank\" rel=\"noopener\">as diretrizes do Android<\/a>, que detalham como voc\u00ea precisa criar \u00edcones que funcionem em dispositivos iOS e Android.\n<\/p>\n<p>\n  Atenha-se a essas diretrizes ao projetar e isso ajudar\u00e1 muito a criar \u00edcones perfeitos, de forma consistente.\n<\/p>\n<h4>\n  Conclus\u00e3o<br \/>\n<\/h4>\n<p>\n  Criar um \u00edcone para um aplicativo m\u00f3vel n\u00e3o \u00e9 uma tarefa f\u00e1cil. Erros tendem a acontecer, mesmo pelos principais designers do setor. Mas sim, aprender com esses erros \u00e9 \u00fatil para designers iniciantes que desejam crescer. O artigo o lembra de algum outro erro de design no design de \u00edcones de aplicativos m\u00f3veis? Compartilhe seus pensamentos conosco.\n<\/p>\n<\/p>\n<div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">\n  Fonte de grava\u00e7\u00e3o: <a target=\"_blank\" rel=\"noopener nofollow\" data-pssr=\"\" href=\"http:\/\/www.instantshift.com\/2015\/08\/18\/app-icon-design-slip-ups\/\">instantshift.com<\/a>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Os usu\u00e1rios m\u00f3veis s\u00e3o muito felizes. Afinal, eles podem escolher entre in\u00fameros aplicativos, que est\u00e3o dispon\u00edveis em v\u00e1rias lojas de aplicativos no mercado. O que isso diz a voc\u00ea? Obviamente, isso significa que h\u00e1 uma competi\u00e7\u00e3o acirrada entre v\u00e1rios aplicativos, com cada um deles disputando a aten\u00e7\u00e3o de usu\u00e1rios em potencial. A solu\u00e7\u00e3o est\u00e1 em um aplicativo exclusivo que traz muitos recursos e funcionalidades para a mesa. No entanto, mesmo que voc\u00ea crie e desenvolva um dos melhores aplicativos do mercado, basta um \u00edcone ruim para prejudicar seus esfor\u00e7os. \u2026<\/p>\n","protected":false},"author":1,"featured_media":151590,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[202,150,59],"tags":[],"class_list":["post-261592","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-designer-de-web","category-dicas-e-truques-da-web","category-web-e-wordpress-2"],"_links":{"self":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts\/261592","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=261592"}],"version-history":[{"count":0,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts\/261592\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/media\/151590"}],"wp:attachment":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/media?parent=261592"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/categories?post=261592"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/tags?post=261592"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}