{"id":1353,"date":"2019-03-05T10:00:00","date_gmt":"2019-03-05T13:00:00","guid":{"rendered":"https:\/\/www.postdigital.cc\/blog\/adobe-xd-o-que-e-e-como-usar\/"},"modified":"2023-07-13T11:28:35","modified_gmt":"2023-07-13T14:28:35","slug":"adobe-xd-o-que-e-e-como-usar","status":"publish","type":"post","link":"https:\/\/www.postdigital.cc\/blog\/artigo\/adobe-xd-o-que-e-e-como-usar","title":{"rendered":"Adobe XD: o que \u00e9 e como usar"},"content":{"rendered":"

Considerar o comportamento do usu\u00e1rio na internet, prevendo e se antecipando ao que seus visitantes precisam e ir\u00e3o fazer em sua p\u00e1gina, \u00e9 essencial em uma estrat\u00e9gia de Marketing Digital. Neste ponto, o design responsivo e a utiliza\u00e7\u00e3o de aplicativos e t\u00e9cnicas relacionadas visa adequar a navega\u00e7\u00e3o de usu\u00e1rios na internet, seja atrav\u00e9s de celulares,\u00a0 tablets ou desktops.<\/p>\n

Uma quest\u00e3o importante, inclusive considerada como fator de ranqueamento nas avalia\u00e7\u00f5es do Google, \u00e9 o tempo de carregamento das p\u00e1ginas. Em experi\u00eancias mobile, fotos, tabelas, bot\u00f5es e outros elementos visuais que n\u00e3o se adaptam ao tamanho da tela e \u00e0 velocidade da conex\u00e3o s\u00e3o penalizados, perdendo posi\u00e7\u00f5es para as palavras-chave relacionadas.<\/p>\n

E al\u00e9m do ranqueamento, imagens sem dimensionamento adequado para telas menores, bot\u00f5es pequenos demais para o clique com o dedo e sites que simplesmente n\u00e3o carregam s\u00e3o alguns dos problemas mais comuns observados tratando tamb\u00e9m da experi\u00eancia do usu\u00e1rio, ou User Experience<\/em>.<\/p>\n

A visualiza\u00e7\u00e3o de p\u00e1ginas, formul\u00e1rios e aplicativos atrav\u00e9s de prot\u00f3tipos \u00e9 fundamental para testar sua estrat\u00e9gia e garantir que a experi\u00eancia do usu\u00e1rio seja confort\u00e1vel e atinja objetivos de navegabilidade e usabilidade, seja qual for o seu objetivo.<\/p>\n

Neste artigo, antes de apresentar o Adobe XD e as particularidades desta ferramenta, vamos cobrir o que \u00e9 o design responsivo, o que \u00e9 User Experience<\/em> e mais alguns fatores importantes. Ent\u00e3o, vamos l\u00e1!<\/p>\n

Design responsivo e web design: por que devem andar juntos?<\/strong><\/h2>\n

Pensar em Web design<\/em> sem pensar em responsividade pode ser um erro que compromete toda a cria\u00e7\u00e3o do layout de um site ou aplicativo.<\/p>\n

O celular \u00e9 inegavelmente parte da vida do brasileiro e \u00e9 quase uma unanimidade em acessos a internet, como divulgado pelo IBGE em 2018<\/a>. E 49% da popula\u00e7\u00e3o acessam a internet utilizando exclusivamente esse dispositivo, segundo a pesquisa realizada pelo Centro Regional de Estudos para o Desenvolvimento da Sociedade da Informa\u00e7\u00e3o (CETIC.Br)<\/a>. Impressionante, n\u00e9?<\/p>\n

O que \u00e9 design responsivo?<\/strong><\/h2>\n

\"O<\/p>\n

Por defini\u00e7\u00e3o, o design responsivo \u00e9 aplic\u00e1vel apenas para internet e outros meios digitais que permitem imers\u00e3o e intera\u00e7\u00e3o direta do usu\u00e1rio. A responsividade que citamos aqui \u00e9 uma abordagem que utiliza t\u00e9cnicas mescladas de design e programa\u00e7\u00e3o para que uma p\u00e1gina web seja renderizada (ou carregada) corretamente em diferentes dispositivos e seus correspondentes tamanhos de tela.<\/p>\n

J\u00e1 foi comum que as marcas criassem um site mobile a parte, com link redirecion\u00e1vel (que come\u00e7a com m.<\/em>). Com a programa\u00e7\u00e3o certa e com as t\u00e9cnicas para otimizar os elementos da p\u00e1gina, sejam textos, bot\u00f5es, imagens ou players de v\u00eddeo, voc\u00ea faz um investimento mais assertivo e com uma melhor experi\u00eancia para visitantes – e poss\u00edveis clientes.<\/p>\n

Nesse sentido, a utiliza\u00e7\u00e3o de ferramentas que facilitem o processo de cria\u00e7\u00e3o de design responsivo e aplicativos para plataformas mobile, \u00e9 essencial para quem trabalha com web design<\/em>. Conhe\u00e7a agora a ferramenta lan\u00e7ada pela Adobe que vai facilitar esse processo.<\/p>\n

O que \u00e9 o Adobe Experience Design (Adobe XD)<\/strong><\/h2>\n

\"O<\/p>\n

A criatividade \u00e9 um elemento chave para cria\u00e7\u00e3o de um site e aplicativos responsivos, e o aplicativo Adobe Experience Design criado pela Adobe Systems veio para ajudar designers na cria\u00e7\u00e3o de mockups para projetos do g\u00eanero.<\/p>\n

A interatividade \u00e9 a principal caracter\u00edstica dessa ferramenta criada pela gigante empresa de softwares Adobe, respons\u00e1vel tamb\u00e9m pelos j\u00e1 conhecidos Photoshop, InDesign, Illustrator, Premiere, Lightroom e Dreamweaver. O Adobe XD est\u00e1 integrado ao Pacote Adobe Creative Cloud e permite aos profissionais de design organizar todo o processo de cria\u00e7\u00e3o, desde o projeto aos prot\u00f3tipos de sites e aplicativos para desktops e mobile.<\/p>\n

A ferramenta tamb\u00e9m permite ao designer integrar a outras ferramentas como o Sketch e ao Photoshop CC, tamb\u00e9m com visualiza\u00e7\u00e3o de mockups diretamente no dispositivo. O pacote Adobe est\u00e1 dispon\u00edvel para a Windows e iOS, al\u00e9m de contar com alguns aplicativos para utiliza\u00e7\u00e3o em smartphones <\/em>e tablets.<\/p>\n

A Adobe preparou um v\u00eddeo que apresenta mais funcionalidades da ferramenta.<\/p>\n