Category: Web Design

Dicas para melhorar o UI Design do seu e-commerce de nicho e vender mais

Dicas para melhorar o UI Design do seu e-commerce de nicho e vender mais

Um bom UI Design aumenta as chances de levar o usuário até o fechamento da venda / Autor: rupixen.com / Fonte: Unsplash.com

Eae, tudo bele?

Você conhece a importância do UI Design para seu e-commerce nichado?

Antes de falarmos sobre isso, vale a pena lembrar que UI Design é uma sigla em inglês para User Interface Design, que em português quer dizer Design de Interface do Usuário. 

Na realidade, o conceito basicamente se preocupa em facilitar a navegabilidade do usuário através dos botões – e outros fatores – disponíveis no site. 

Tá curioso para saber mais? Vamos nessa!

Neste artigo você vai aprender:

Importância de um bom UI DesignDicas práticas para melhorar o UI Design no seu e-commerce e vender mais

Importância de um bom UI Design

Um bom projeto de UI Design vai permitir que o usuário navegue facilmente dentro do seu e-commerce. O projeto precisa pensar em botões que sejam intuitivos e conduzam sua audiência para seus produtos. Afinal, o objetivo final é transformar seus visitantes em clientes, não é mesmo?

A importância é bastante simples: um e-commerce organizado tem grande potencial de vender mais. Para isso, ele precisa garantir uma ótima acessibilidade,cuidar da usabilidade, proporcionar uma boa experiência de uso e ser responsivo e eficiente.

Um ponto importante também é ser honesto e evitar usos de más práticas como o uso indiscriminado de dark patterns. 

Dicas práticas para melhorar o UI Design no seu e-commerce e vender mais

Não importa qual seja o seu negócio na vida real, a sua loja virtual precisa alinhar os objetivos de negócios com o os anseios do seus clientes. Para ficar mais fácil, vamos pensar em um exemplo, imagine que você possui um sex shop online, ok? (caso você não saiba, esse mercado é um dos que mais faturam todos os anos em todo o mundo).

O padrão importa: mantenha a consistência.

Diferente da leitura com livro, jornal e revista, na web as pessoas tendem a ler no formato de F. Isso quer dizer que a maioria dos usuários vai passar os olhos primeiramente no sentido horizontal, no topo do site. Depois, um pouco abaixo vai ler em horizontal novamente, sem ir até o fim da tela. Por fim, seguirá no sentido vertical na parte esquerda, formando um F com os olhos. 

Um e-commerce bem diagramado deve colocar o conteúdo mais importante dentro desse padrão. Nunca insira informações essenciais do seu sex shop online fora desse campo de visão. 

Ainda sobre padrão, aposte em um e-commerce organizado por categorias. Esse formato é chamado de breadcrumps. Ele simplifica a navegação, indica ao usuário onde ele está e o leva facilmente para onde deseja ir. Pensando no padrão F, você pode posicionar essas categorias no topo do site para a leitura da primeira linha horizontal. 

Outro ponto super importante é manter a consistência visual do design. Não crie variações desconexas entre uma página e outra. Mantenha uma padrão nos tamanhos dos textos, nas cores, no uso de grafismos e imagens, no posicionamentos, espaçamentos…Deixe o design consistente ao longo de toda a interface.

Diminua os esforços do seu usuário sempre que possível

Você precisa prever as possíveis ações do seu visitante e conduzi-lo para compra da forma mais fácil possível. Se ele está visitando seu e-commerce é porque deseja comprar acessórios eróticos para apimentar sua relação ou quem sabe utilizar sozinho.  

Quanto menos esforço ele precisar fazer, quanto menos botões encontrar em seu caminho e quanto mais curta e clara for a mensagem para chegar ao carrinho, mais chances você tem de vender. 

Imagine que ele tenha o interesse de comprar um vibrador, sendo esse um dos produtos mais vendidos, uma solução simples – mas efetiva – pode ser deixar todos os modelos acessíveis com apenas um clique na página principal do site. Lembra das categorias e do formato F? Você pode criar uma categoria inteira para diferentes vibradores ao alcance da primeira batida de olhos na tela.

Outro botão que merece sua atenção nesse aspecto é a barra de pesquisa. Posicione a ferramenta em um local facilmente visível e use cores que contrastem para chamar atenção. Visitantes que usam a barra de pesquisas são compradores em potencial, facilite o caminho até a compra. 

Crie CTAs atrativos

Call To Action (CTA) ou Chamada Para Ação são botões que convidam o usuário a tomar uma ação, bem como o nome sugere. Eles fazem uma diferença enorme nas taxas de conversão. Aposte em cores chamativas e use palavras imperativas, como “Compre agora com 1 clique”.

Um bom CTA precisa ser atrativo e se destacar dentro do site. Seu cliente pode adorar ver os brinquedos eróticos mais recentes, que tal criar um Call To Action “Veja as novidades mais quentes”?

O carrinho precisa ser alterado facilmente

A página do carrinho precisa ser editada facilmente, sem que para isso, o usuário precise voltar muitas etapas ou ficar abrindo novas abas. 

Pode ser que seu visitante – que está tentando se tornar um cliente – tenha se arrependido do vibrador que escolheu, ou quem sabe queira adicionar mais um do mesmo modelo. Um bom UI Design vai proporcionar alterações facilmente executáveis na página de check out, porém, mais do que isso, essas ações precisam ser intuitivas. 

Outro exemplo prático é permitir que o usuário calcule o frete sem dificuldade. Não há nada mais desestimulador do que tentar concluir a compra e não conseguir saber o preço total incluindo o valor do frete ou quantos dias o seu vibrador levará para chegar na sua casa em poucos cliques. 

Ele não deve perceber a facilidade, e sim não sentir dificuldade em realizar ações que deveriam ser simples. 

Uma página de check out simples tem mais chances de ser concluída com sucesso / Autor: PhotoMIX Company / Fonte: Pexels.com

Seja claro, criativo e amigável na sua linguagem

Para se comunicar com eficiência você precisa entender seu visitante e usar a linguagem que ele utiliza. Se ele está comprando on-line pode ser que tenha vergonha de comprar produtos eróticos. Então imagina receber uma encomenda na portaria do prédio com o selo da sua loja? 

Nesse caso, é importante entender suas necessidades e oferecer discrição e segurança na entrega. E para isso, você precisa comunicar isso de forma clara, amigável e criativa na sua página. Quando você compra em uma loja física nota a qualidade do atendimento. No e-commerce não é diferente. 

O UI Design coloca em prática as ações planejadas para melhor experiência do usuário. 

Considerações Finais.

Desenvolver uma boa interface de e-commerce é um desafio. Existe muito conteúdo e ações para serem pensadas, organizadas e planejadas a fim de encontrar a convergência ideal entre as questões de negócios e os desejos dos usuários.

É óbvio que este artigo não tem a pretensão de ser o manual que explica sobre todos os vários aspectos que compõem um projeto dessa magnitude, mas as dicas expressas aqui com certeza vão ajudar a sua loja virtual a chegar mais perto do patamar ideal.

Se você tiver mais alguma dica ou sugestão, deixe nos comentários a sua opinão.Até mais.Forte abraço.
The post Dicas para melhorar o UI Design do seu e-commerce de nicho e vender mais appeared first on Chief of Design.

Dicas para melhorar o UI Design do seu e-commerce de nicho e vender mais
Fonte: Chef of Design

O que é Product Design? O que faz um Product Designer?

O que é Product Design? O que faz um Product Designer?

Eae, tudo bele?Neste artigo vamos falar sobre o que é, e o que faz um Product Designer. Você provavelmente chegou até aqui, para entender mais sobre Product Design e neste artigo irei te explicar sobre área, e sobre exatamente o que faz um Product Designer e quais são as habilidades necessárias para ser um.

E já te antemão, mais uma informação importante!

Não se trata de uma profissão nova! Apesar ser recente, o uso do termo Product Designer (se você tem uma conta no Linkedin, você deve saber disso), trata-se de uma profissão que já existe desde a Revolução Industrial.

Fique até o final deste artigo para que você consiga entender exatamente tudo o que compreende o trabalho de um Product Designer.

O que é Product Design?Quais são as etapas da criação de um produto?O que faz um Product Designer?Onde estudar Product Design?Quais as habilidades para se tornar um Product Designer?Vídeo – O que faz um Product Designer?

O que é Product Design?

Product Design, em tradução literal, significa Design de Produto. E como talvez você já saiba, design de produto não é algo super, mega novo. Aqui no Brasil era utilizado o termo Design Industrial para se referir a essa área.

E é fundamental entendermos como surgiu um termo, e para isso recorrermos à história. Vale a pena nos atentarmos há alguns aspectos da história do design.

O design, como um todo, teve o inicio a partir da revolução industrial. A criação de produtos que era de forma artesanal passou a ser produzido em série proporcionando que a criação de produtos tivessem processos de produção industriais.

Um dos primeiros registros de um design, e de um Product Designer é de Michael Thonet (1796-1971), grande produtor de móveis e máquinas industriais alemãs dando destaque a sua criação: a máquina de fabricar móveis de madeira curvada, sendo um de seus projetos mais conhecidos a cadeira Bentwood.

Poderíamos citar vários designers ao longo do tempo que trabalhavam como product design mesmo antes da internet. Como nos trabalho do Designer Alemão Dieter Rams, do Designer da Apple Jonthan Ive e do casal de designers Charles e Ray Eames. Sem falar que também encontramos muito sobre design de produto na maior escola de Design que já tivemos: a Bauhaus.

Tudo isso nos mostra que o Product Design já existia antes da era digital. O termo ganhou força, e inclusive sendo usado apenas em inglês, por causa dos produtos digitais que temos nos dias atuais. Então denominou-se, por convenção, utilizar o termo Product Design quando se trata também de produtos digitais.

Quais são as etapas da criação de um produto?

A seguir veremos um exemplo de processo simples de criação de um produto. Essas etapas são comuns, mas isso não significa que precisam ser seguidas a risca ou que todo o projeto necessitam tê-las exatamente da forma como será explicado aqui.

Etapa 1: Entendimento

É de fundamental importância saber o que é a persona, para qual se destina o produto que irá ser desenvolvido. Caso você não saiba o que é uma persona, irei dar uma breve explicação. 

Trata-se de um indivíduo fictício, que representa o seu cliente ideal. A persona tem nome, desejos, dificuldades, dores, planos, sonhos, dúvidas, hobbies e etc. Ou seja, é uma variável muito mais detalhada que o tão conhecido público-alvo. 

Por que um Product Design deve se preocupar com isso? O motivo é simples! Se você busca criar um produto que vá agradar o cliente final, que vai atender as necessidades dessa pessoa, é fundamental partir de uma persona bem feita.

Etapa 2: Ideação

Depois que você já definiu a persona, já conseguiu entender as dores, os planos, os objetivos e todas as demais característica do seu cliente ideal. Chegou a hora de criar o máximo de hipóteses que você puder.

É o momento de idealizar como será o produto que a persona irá receber.

Etapa 3: Definição

Agora que você já fez o seu brainstorming, é necessário escolher as melhores ideias que você teve, para conseguir definir a melhor hipótese para o projeto e assim ter um protótipo, que será usado na próxima etapa.

Etapa 4: Prototipação

Aqui é o momento em que o Product Design crie um protótipo do produto, para testar as hipóteses que você levantadas e escolhidas na etapa anterior. Mas cabe lembrar que não se pode perder muito tempo nessa etapa.

Afinal de contas é um protótipo e não o produto final.

Etapa 5: Validação

Quinta e última etapa! Agora é hora de pegar seu protótipo e validar. Lembra do trabalho realizado na primeira etapa? Então, agora é o momento de pegar sua persona e buscar pessoas que se enquadrem nela. 

Essas pessoas irão testar o produto de forma a validar todo o projeto. Cabe observar que se a primeira etapa não foi executada com maestria, inevitavelmente a etapa de validação será um fracasso.

O que faz um Product Designer?.

O Designer de produto nada mais é do que a pessoa que concebe a criação de um produto, seja ele físico ou digital, participando de todo o processo.

Ele (o Product Designer ou Designer de Produto) tem como função criar um produto ou resolver um problema, utilizando uma abordagem, e se engajando nessa construção desde o início. Os passos utilizados são muito semelhantes aos citados em Design Thinking (Entendimento, Definição, Ideação, Prototipação e Teste).

O Product Designer não necessariamente vai trabalhar com pixels, diretamente com softwares gráficos. Ele é uma espécie de gestor das etapas fundamentais na criação de um produto.

Basicamente o Designer de Produto trabalha de forma mais generalista, preocupado com as etapas da criação de um produto. É necessário que cada uma dessas etapas seja executada de forma excelente, para o final do processo seja positivo.

Imagine que um Designer de Produto seja como um maestro de uma orquestra. Não será que tocará os instrumentos do concerto, mas ele sabe como cada um funciona e dirige para quais melodias onde eles devem ir, como eles devem soar. Um Product Designer funciona mais ou menos assim.

Claro que em muitos caso, principalmente em projetos menores, um Product Designer pode fazer todo o processo, desde a ideação até a parte prática, porém dificilmente, principalmente em projetos digitais, ele estará sozinho, pois estará dentro de um equipe, comumente, multidisciplinar que ajudará no processo de concepção do projeto.

Portanto, um designer especializado nessa área deve ter uma visão holística de todo o processo de criação, desde a criação até questões como custos de manutenção, operação, industrialização, desenvolvimento e entrega. Ele também precisa saber ouvir e acolher os feedbacks que os usuários podem dar sobre o produto.

É válido ressaltar, mais uma vez, que grande parte dos produtos advindos desse ramo do design, atualmente, são em sua maioria digitais. Dessa forma, há uma diferenciação entre o design de produtos e as demais áreas como UX e UI Design. Essa diferença está justamente em acompanhar todo o projeto, do início ao fim, e o produto final em si, já que ambas as áreas possuem habilidades parecidas.

Onde estudar Product Design?

Infelizmente, atualmente não existe uma faculdade específica para se tornar um Product Designer, no que se refere a produtos digitais.

Antigamente as universidades voltadas para o design, o curso se denominava Desenho (Design) Industrial, que era específica para produtos físicos e industriais.Também encontramos faculdades de Design onde eram cursadas disciplinas comuns nos 3 primeiros anos, e em seguida, o estudante deveria optar por design gráfico ou design de produtos físicos.

Hoje, existe a faculdade de Design, mas ela não busca profissionalizar alguém para a área específica de Product Design. Por isso, muitos dos designers de produtos conhecidos migraram de outras áreas, como UX e UI.

Portanto fazer uma faculdade de Design vai te ajudar se capacitar, assim como fazer outros cursos, porém você vai precisar continuar prosseguindo com os estudos e especializar em Product Design.

Quais as habilidades para se tornar um Product Designer?

Como vimos, o designer de produtos é alguém que transita por outras áreas do design, então ele trabalha desde a criação de produtos até a pesquisa com usuários e análise de dados.

Além da formação, um bom designer de produtos dever ter as seguintes habilidades:

Visão holística sobre um projeto de design;Visão macro sobre fatores internos e externos;Conhecimentos gerais em design e processo de design;Alinhamento e estratégia de negócios;Design de serviço;IA (Arquitetura da informação).UI Design (Design de Interface)IxD Design (Design de Interação)UX, ou seja, entendimento do público, sabendo o que usuário necessita e deseja.Design visual.

Vale ressaltar que ele não precisa ser especialista em todas elas, mas deve sim ter conhecimento para saber gerenciar as pessoas dessas áreas (como citado no exemplo do maestro).

Portanto, esse profissional deve saber liderar grupos, administrar bem o tempo, os recursos e as atividades, e conseguir ter uma boa interação com pessoas.

Não basta o Product Designer dominar questões técnicas específicas de sua formação. É necessário que ele desenvolva competências acessórias, ou seja, habilidades extras que serão cruciais no processo de criação e inovação de um projeto.

Abaixo vou explicar as principais competências para atuar na área de Product Design, mas que talvez você nem imaginava:

Liderança

O Product Designer precisa ser um líder, ainda que não esteja formalmente como líder de uma equipe. Uma das características desse profissional é conseguir com que as pessoas façam o que for necessário para o alcance de um objetivo.

Ou seja, para que uma equipe consiga trabalhar junto em um projeto é importante que todos entendam a importância desse projeto e isso o líder consegue fazer, através do uso da empatia.  

Gestão de processos

Se o Product Designer não consegue gerir o processo de criação e inovação de um produto, ele corre o grande risco de não ter sucesso em seus projetos. Uma vez que cada etapa é essencial. 

Alinhamento e estratégia de negócios

Todo produto que é gerado precisa satisfazer o cliente e também as questões de negócios da empresa. Por isso, o Designer de produto precisa estar alinhado com as estratégias da empresa para que ele possa criar algo útil para os usuários, mas também algo que venda, algo que gere algum bem, seja ela financeira ou não, para a empresa.

Inovação e criatividade

Pode parecer algo básico, mas é importante reforçar que um Product Designer trabalha com inovação e por isso ele necessita utilizar da criatividade para propor novas soluções e criar novos produtos.

Vale ressaltar, que inovação não está ligado necessariamente a criação de novos produtos, ou seja, inovar é tornar uma ideia possível e essa ideia pode ser uma melhoria, uma atualização, uma nova visão sobre algo que já existe.

Trata-se de tirar do campo das ideias algo útil e que vai solucionar o problema, seja com a criação de algo novo ou com uma proposta de alguma melhoria, por exemplo.. É isso que um Product Design precisa ser, pois não adianta pensar numa ideia, é preciso torná-la possível.

Vídeo – O que é O que é Product Designer?  

Para complementar e acrescentar mais informações a todo o conteúdo apresentado aqui, eu deixo um vídeo que gravei para falar especificamente sobre o que é e o que faz um Product Designer. Assista abaixo o vídeo para aprender mais.

Considerações finais

A profissão de Product Designer ou Designer de Produto, se pensarmos um pouco e analisando tudo o que foi dito aqui, não é algo novíssimo como às vezes se coloca, talvez apenas o termo estrangeiro que passou a ser mais usado por nós brasileiros.

E por mais que tenhamos agora produtos digitais, que esses sim é um fato mais recente em nossa história, basta olhar para trás e ver que possuímos diversos produtos que foram criados por designers de produtos, tais como câmeras, cadeiras, micro-ondas e mais uma infinidade de objetos que utilizamos no dia a dia.

Por isso, se você quer ser Product Designer, estude um pouco sobre história e tudo que cerca, mesmo antes da era digital, essa ofício. Para ser um profissional de Design de Produto é preciso não se fechar em apenas uma única área do design ou do conhecimento. Além de dominar a sua área, também entender de outras áreas e assuntos, porque um Designer de Produtos é um profissional multidisciplinar e disso não tem como escapar.

E você já atua ou pretender ser um Prodcut Designer?

Aproveite o espaço abaixo para deixar o seu comentário.

Até mais.

Forte abraço.

Referências

UILAB. Product designer: quem é e o que faz? Disponível em: https://medium.com/ui-lab-school/product-designer-quem-%C3%A9-e-o-que-faz-64be9cd88358. Acesso em: 7 abr. 2020.

O que é Product Designer?  https://www.youtube.com/watch?v=ZUuiGwre0N0
The post O que é Product Design? O que faz um Product Designer? appeared first on Chief of Design.

O que é Product Design? O que faz um Product Designer?
Fonte: Chef of Design

O que é Design System?

O que é Design System?

Eae, tudo bele?Neste artigo você vai aprender o que é e a importância do Design System em um projeto de design que visa manter a consistência visual e de interação de uma organização.

O termo Design System vem ganhando cada vez mais notoriedade, principalmente graças aos produtos digitais que vem sendo criados nesse cenário tecnológico que vivemos.

Antes de começar, quero salientar que este artigo não tem a pretensão de definir ou determinar todos os aspectos de um Design System, já que se trata de um complexo trabalho de design e que pode sim ter variações e abordagens diferentes dependendo da forma de pensar e de criá-lo.

A ideia aqui é te apresentar para que você aprenda sobre o que é, para que depois você mesmo possa continuar estudando, fazer seus experimentos e testar as suas decisões de design, ok?

Portanto, neste artigo você aprenderá sobre:

O que é Design System.Como surgiu o Design System Quando construir um Design SystemO Design System e Atomic DesignA diferença entre Design System e Style GuideOs elementos que compõem um Design System

O que é um Design System?

Design System – ou sistema de design – trata-se de um conjunto de padrões de componentes de design elaborados a fim de manter a consistência visual e funcional de um certo produto, sistema ou organização.

Um exemplo clássico para se explicar o Design System é pensar em peças do brinque Lego.

Seguindo essa analogia, imagina esse sistema de design, como um conjunto de pecinhas padronizadas, que seguem a mesma consistência de design. Cada pecinha poderia ser considerada um componente.

Mas não para por aí. As peças de lego (ou componentes) já estão predefinidas, você precisa apenas selecionar as que você precisa e montá-las dentro de um padrão. Esses componentes podem se relacionar, se juntando e criando a partir disso novos componentes. E esses novos componentes por sua vez poderiam se juntar com outros e assim por diante.

Outro exemplo que temos, e que lidamos no dia a dia, são alguns softwares, como o Microsoft Office e o Creative Cloud Adobe. Essas famílias de programas seguem uma linha visual e todos estão dentro de uma consistência de visual e funcional, por exemplo, desde o visual até atalhos pré-definidos por seus criadores .

Independente de quando você adquiriu o programa ou de que país seja ou de que língua você fale, esses padrões serão os mesmo para cada ferramenta. Isso facilita bastante a vida de quem vai utilizar esses programas, pois possibilita a uma coerência de uso e estética.

Com isso essa famílias formam um padrão que facilita a execução de tarefas, além de tornar o sistema atrativo e organizado visualmente.

Uma frase muito famosa dita por Nathan Curtis sobre o assunto é que “o Design System é um produto servindo outros produtos”.

Portanto o Design System é um projeto de design que abastece outros projetos visando sempre manter a consistência de design e proporcionando mais rapidez para as equipes de design e de tecnologia criarem os projetos ou protótipos. O Design System é um documento de extrema importância para empresas que querem uma maior integração de suas ideias no desenvolvimento de produtos.

Como surgiu o Design System?

Não se tem uma definição fechada do que seja o Design System, porém sabe-se que não se trata de um conceito tão inovador como se vende. Ao longo da história encontramos projetos de sistemas de design.

Se você procurar sobre a escola alemã “Bahaus”, se estudar os manuais de marca de projetos do grande Designer Gráfico brasileiro Alexandre Wollner, se olhar o projeto para as olimpíadas de Munich de 1972, Otl Aicher , ou analisar o projeto de design do metrô de Nova York…Entre tantos outros exemplos que temos por aí… Você encontrará Design System, ou seja, algo que foi planejado de forma pragmática, calculada afim de manter uma consistência visual.

A demanda por produtos bem construídos, marcas consolidadas e design cada vez mais inovadores fez com que os grandes designers buscassem automatizar o máximo possível sem perder a consistência de design em grandes projetos.

E nos dias atuais, com o avanço da tecnologia, e o advento de produtos digitais, o ramo tecnológico precisou se adaptar e começou a utilizar cada vez mais o Design System.

O Design System e Atomic Design

O Design System conversa muito com outra abordagem de design que é conhecido como Atomic Design (design atômico). O Atomic Design, como o próprio nome já nos indica, utiliza de uma analogia entre elementos e componentes de um projeto de design com o comportamento dos átomos, moléculas e organismos.

Portanto, assim como vimos no exemplo do brinquedo lego, aqui lidamos com os componentes de forma crescente, saindo do menor para o maior. Portanto temos dentro dessa ordem os átomos, moléculas, organismos, templates e páginas (como visto na imagem dentro deste tópico).

Átomos: aqui podemos incluir ícones, botões, cores, imagens, tipografia etc.Moléculas: aqui seria o resultado da interação dos itens pertencentes a categoria átomos. Então poderíamos citar como exemplo uma sidebar, um card, uma barra de menu.Organismos: aqui se enquadra os resultados da interação das moléculas, como exemplo podemos citar um header de um site, que contém um menu e outros ícones.Templates: aqui seria o resultado da interação de todos os componentes citados anteriormente, montando um produto modelo que pode ser utilizado por qualquer pessoa, sofrendo alguns ajustes.Páginas: já essa etapa seria mais próximo do produto pronto final, sendo o mais completo do que um template

Essa forma de lidar com os elementos do design, dentro de um projeto, trata-se de uma metodologia estruturada, racional e lógica de dar função e forma ao projetos, com base conceitual e de forma relativamente simples de entender.

O pensamento do Atomic Design encaixa bem com o que se propõe quando estamos criando um Design System. Por isso, um bom caminho para iniciar um sistema de design é justamente começar estudando sobre design atômico.

Quando construir um Design System?

Imagine que uma empresa sempre está modificando seus times, seja demitindo ou contratando novas pessoas. Imagine também que sempre que novas pessoas aparecem, também surgem novas ideias e palpites acerca de um projeto.

Muita das vezes essas ideias que surgem, já foram discutidas e definidas; mas com a correria da rotina e a falta de um documento contendo essas informações, um membro do time de design – por exemplo – irá gastar mais tempo testando novas ideias, que talvez nem tenha coerência com o projeto. Para evitar situações como essas, é necessário ter um bom Sistema de Design.

Outro ponto que já citamos aqui no artigo é para manter uma consistência e coerência de design, seja visual, funcional e até mesmo de padrões de códigos. A ideia é manter um organismo homogêneo, mesmo ele sendo composto por elementos diferentes.

Portanto a construção do Design System é ideal para projetos maiores, onde existem vários produtos ou pontos de contato com a marca e é preciso evitar uma incoerência visual. Também quando envolvem várias profissionais e é preciso criar uma padronização para ser seguida pela equipe.

Por demandar mais tempo e estudo, para projetos menores é mais provável que um Style Guide (guia de estilo) já seja o suficiente.

A diferença entre Design System e Style Guide

Ao estudar o design, nos deparamos com o Style Guide, que é facilmente confundido com o Design System. Na prática, o Style Guide também compõe com informações dentro do Design System.

O Style Guide ou Guia de estilo é um sistema de organização menor e mais restrito para a parte visual que o Design System. Isso porque ele é responsável por criar um estilo de trabalho de um produto, permitindo que apenas os designers e criadores entendam o que está acontecendo.

É como se o Style Guide fosse uma fatia e o Design System uma pizzainteira. O Sistema de Design é um apanhado de informações de várias áreas do design, como o Motion, UI e até códigos de programação.

A ideia é que o Design System seja um documento que garanta uma melhor consistência nos projetos, produtos e que dialogue com todas as áreas envolvidas, não somente a identidade visual ou com características visuais.

Os elementos que compõem um Design System

Como dito anteriormente, o sistema de design é como se fosse uma pizza e cada fatia é um setor que agrega informações. Sendo assim, é essencial que o Design System possua:

Objetivos e valores

Antes de pensar em grid, tipografia e cores precisamos pensar nos objetivos e valores da empresa. Esses fundamentos guiarão todas as escolhas feitas, evitando projetos sem coesão com os princípios da instituição.

Guia de Estilo

Aqui os designers irão pensar na identidade visual, seguindo os objetivos e valores. Um guia de estilo é fundamental para definir os princípios de design, identidade da marca, cores, tipografia, etc. Esse é o momento de definir diretrizes, para que todos os designers envolvidos usem as combinações estabelecidas.

Em um primeiro momento, isso pode soar como se precisasse seguir rigidamente regras determinadas e deixar de fora a criatividade dos designers. Pode ter certeza que a criatividade não ficará de fora.

Na verdade quando esses elementos visuais são definidos, a criatividade será utilizada para definir combinações e como será usado as cores, ilustrações, ícones, tipografias, animações – por exemplo – criando, assim, uma identidade visual coesa.

Biblioteca de componentes e padrões

Após ter estabelecido a identidade visual, é hora de definir como será construído esse projeto e, nesse momento, uma biblioteca de componentes e padrões podem ajudar.

Na prática, uma biblioteca de componentes e padrões são elementos que serão utilizados no desenvolvimento de um produto. Imagine que você precise de um componente para criar um site, por exemplo, e lembra especificamente de um que utilizou em projetos anteriores. Até você procurar os projetos que ele foi utilizado, observar como ele se comporta, custaria um tempo precioso dentro do seu prazo.

Para aumentar sua produtividade, uma boa solução é ter em mãos todos oscomponentes e padrões que serão utilizados na construção do seu produto. Para criar essa biblioteca podem entrar desenvolvedores e UI Designers.

Os componentes e padrões são essenciais na construção do sistema e em como ele irá funcionar. Ui/Web kit: esses seriam um kit desses componentes citados acima, interligados, formando um template construídos com base nos componentes do sistema.

Portanto, estamos falando sobre UI kit, que seria um kit de componentes de UI Design citados acima, e também estamos falando sobre os estados dos componentes que aqui é relativo ao estado dos componentes citados, se estão ativos, se são o padrão, se estão inativos, dentre outros.

Ao criar uma biblioteca com esses elementos, você irá garantir uma experiênciaconsistente no seu produto. Não acaba por aqui, você pode adicionar mais informações que achar necessário.

Isto é somente um pontapé inicial, ajudando a condensar todas as ideias, princípios e valores da empresa em todos os seus produtos.

Códigos

Dependendo do projeto podemos incluir padrões de códigos, como nome de classes, ids, indentação, formatação e organização. Um projeto de um sistema de design pode lidar com a integração entre design e a parte de desenvolvimento front-end.

É super importante, quando há a necessidade, que a integração entre as áreas para que o Design System funcione como o esperado. Apesar do nome (Design System) poder lembrar em um primeiro momento apenas a questão visual, design não se trata apenas disso e questão funcional também é importante.

Você pode conferir alguns exemplos de Design System disponíveis na internet no site Adele UX Pin.

Vídeo – O que é Design System

Para complementar esse artigo eu gravei um vídeo para explicar de forma mais didática e também para complementar o que foi dito neste artigo. Então, confira o vídeo abaixo e complemente os seus estudos sobre Design System.

Considerações Finais

Percebemos que o Design System é uma forma de
organização para grandes empresas que não é novidade. Novidade mesmo é sua
forma de uso na atualidade, aplicada a produtos digitais.

O uso desse sistema traz inúmeros benefícios para o produto, bem como para a equipe engajada no projeto, permitindo que todos contribuam para o produto final, mesmo tendo visões e profissões diversas, mantendo a consistência do projeto.

Por isso, o Design System possui inúmeros benefícios, tais como dinamicidade, fácil atualização, redução de custos e de tempo de trabalho, otimização de tarefas e da força de trabalho, dentre outros.

Você já criou o particiou de um projeto de design ssytem? Qual a sua opinião sobre o assunto? Você pode deixar aqui nos comentários a sua dúvida ou relato sobre.

Até mais.

Forte abraço.

Fontes:

Diego Prado – Design Systems: organização e escalabilidade para design e desenvolvimento: https://medium.com/trinca137/design-systems-organiza%C3%A7%C3%A3o-e-escalabilidade-para-design-e-desenvolvimento-6a0a4d8780b

Ux Collective Br – Entendendo Design Systems : https://brasil.uxdesign.cc/entendendo-design-system-f375bbb6f704
The post O que é Design System? appeared first on Chief of Design.

O que é Design System?
Fonte: Chef of Design

Curso de Elementor WordPress – Crie sites, landingpages ou blogs de forma descomplicada!

Curso de Elementor WordPress – Crie sites, landingpages ou blogs de forma descomplicada!

Eae, tudo bele? Eu sou David Arty e neste artigo vamos falar sobre curso de Elementor WordPress.

Este artigo é especialmente para você que está pesquisando sobre o plugin e também sobre como aprender a usar o Elementor.

Veremos aqui tudo o que você precisa saber, antes de qualquer coisa, tanto sobre o page builder mais famosos do mundo, ou seja o Elementor WordPress, quanto sobre o que você deve se atentar antes de adquirir algum curso de Elementor WordPress.

Vamos nessa?

O que é Elementor WordPress?

Antes de qualquer coisa você precisa saber o que é o Elementor WordPress e porque ele é tão popular na área de criação de sites.

O Elementor WordPress é plugin de page-builder (construtor de página web, em português) para o CMS WordPress. Com ele é possível criar páginas de sites em uma interface real-time e do tipo “drag&drop”, ou seja, clicando e arrastando.

O plugin Elementor é um dos mais populares na comunidade WordPress, se tornando o principal page-builder da plataforma. Para utilizar o Elementor, basta ter um site em WordPress.

Apenas para te introduzir no assunto, caso ainda não conheça, o WordPress é o CMS mais popular do mundo. Estima-se que mais de 70% dos sites de todo o mundo utilizam o WordPress.

CMS é o acrônimo de Content Management System, ou seja, estamos falando de uma plataforma de Gerenciamento de conteúdo, onde podemos criar vários tipos de sites, desde blogs, sites institucionais até lojas virtuais e redes sociais.

Caso você não saiba instalar o WordPress ou nem sabe do que se trata, sugiro que leia esse outro artigo.

O Elementor é um plugin que adiciona recursos fantásticos para a criação de sites em WordPress.

Abaixo você pode conferir uma live que fiz utilizando a ferramenta e como em pouco menos de 1 hora eu criei um site sem mexer em código, praticamente apena “clicando e arrastando”.

Por que o Elementor WordPress é tão popular?

A resposta é simples: pela sua qualidade. O Elementor foi um dos primeiros pages builders a funcionar de forma mais estável, com o código cada vez mais otimizado e com uma usabilidade facilitada.

Se hoje em dia temos vários plugins de pages builders no mercado, muito se deve ao sucesso obtido pelo Elementor.

O Elementor nos possibilitou poder criar páginas de modo rápido, simples (clicando e arrastando) e sem precisar mexer em código. Por isso existem vários benefícios que o plugin proporcionou para quem trabalha com Web Design, como:

A curva de aprendizagem é relativamente rápida e simples;Você não precisa comprar a versão pro (mas é muito bom se puder);Existem vários produtores de temas, plugins e addons;É um dos plugins mais utilizados pela comunidade do WordPress;Não precisa de conhecimentos em programação (mas é bom se souber);Não precisa de conhecimentos em HTML e CSS (mas é muito bom se souber);Ele funciona independente do tema que estiver utilizando, permitindo adicionar e deletar elemento em páginas e posts.

O que preciso para começar a usar o Elementor WordPress?

A primeira coisa que você precisa é instalar o plugin. E isso é muito simples!

Ele possuí versões gratuita e paga. Para instalar o Elementor, independente da versão, é preciso ter um site em WordPress. Depois basta instalar o plugin pelo próprio repositor de plugins do WordPress e pronto. Você já pode começar a utilizá-lo.

É possível criar coisas incríveis na versão free e existem muitos plugins gratuitos que adicionam recursos ao Elementor. Mas é óbvio que existem certas limitações, por isso, caso tenha condições super indico que você adquira o Elementor PRO.

A segunda coisa necessário para iniciar é saber como usar o Elementor WordPress. Para isso você tem a chance de fazer um curso focado em Elementor que pega na sua mão e te mostra o passo a passo da utilização da ferramenta, para que você não perca tempo pesquisando inúmeros conteúdos por aí e já comece o quanto antes a criar os seus sites e até fazer dinheiro com eles.

A seguir vamos falar sobre como você pode escolher um curso de Elementor WordPress.

Como aprender a usar o Elementor WordPress?

O Elementor WordPress pode ser um divisor de águas para você que deseja criar sites. O mercado de sites sempre se mantém ativo e quente, pois a todo momento surgem empresas e profissionais que necessitam de sites institucionais, sites para campanhas de marketing, sites de vendas de produtos e etc.

Por isso, para acelerar o seu aprendizado eu te apresento o Curso de Elementor WordPress do Chief of Design o WP ELEMENTOR

Neste curso você aprenderá criar projetos de websites que realmente funcionem, de uma maneira simples e objetiva. Sem enrolação! E o melhor de tudo: aplicando o seu design, criando o site de forma personalizada e não com cara de template.

O curso de Elementor WordPress é 100% online, com um conteúdo prático e direto com foco na criação de sites utilizando de design estratégico.

Ele é ideal para designers, criativos, freelancers, publicitários, donos de agência,  empreendedores digitais que desejam, ou melhor, que necessitam alavancar seus resultados através de páginas personalizadas, feitas com o seu design, de forma simples e otimizada, sem precisar mexer em códigos ou ficar dependente de temas.

O nosso blog é uma parceiro oficial do Elementor graças a qualidade e alcance do conteúdo de Elementor que produzimos.

O que você vai aprender no curso de Elementor WordPress?

O curso de Elementor WordPress traz um conteúdo prático e direto com foco na criação de sites utilizando o WordPress mais o plugin Elementor. O curso é indicado para designers e donos de agência de marketing digital que desejam aprender a criar as suas páginas de forma mais rápida e prática. Dentro do curso você irá aprender:

Configurar e instalar o Elementor, pago ou gratuito, no WordPress;Trabalhar os diferentes widgets e elementos;Criar templates, importar e exportar templates;Composição na criação de sites;Slides de Imagem e Vídeo;Design responsivo com Elementor;Criar menus responsivos;Instalar pixels do Facebook e Google;Criação e integração de formulários;e muito, muito mais…

O conteúdo do curso tem aproximadamente 7h de duração. E você pode aprender com o curso mesmo use apenas o a versão gratuita do curso.

Além dos módulos tradicionais, você conta com uma série de bônus que auxiliaram você ainda mais no seu processo de aprendizagem como:

Guia de WordPress;Hospedagem e Domínio;Design para Conversão ;Processo Criativo;Design responsivo com Elementor;Fluência em HTML e CSS.

E um super bônus dentro do curso é a possibilidade de adquirir chaves do Elementor WordPress com desconto.

Também disponibilizamos no curso templates prontos, para você baixar e instalar no seu WordPress, editando e adaptando do jeito que você quiser.

Qual a Garantia do curso WP Elementor?

Você pode ficar tranquilo, pois o risco é todo nosso. Isso mesmo que você leu! Satisfação garantida ou o seu dinheiro de volta.

Se você por algum motivo não quiser mais o curso, nós vamos devolver 100% do seu dinheiro de volta. Sem enrolação, basta me mandar um e-mail e pronto.

Para isso você tem até 7 dias de garantia. Dentro desse período, você tem a nossa garantia e também a do sistema de pagamento.

O curso Elementor WordPress tem certificado?

Sim, o curso de Elementor conta com certificado digital de conclusão do curso. Ao concluir as aulas e apresentar as atividades você receberá um certificado de especialista em Elementor WordPress.

Vale a pena curso de Elementor?

Sim, pois ele vai acelerar e potencializar o seu caminho na criação de sites. Você pode tentar aprender tudo sozinho, estudando por conta, garimpar os conteúdos espalhados pela web e etc; todavia, como você deve saber, tempo é dinheiro e o tempo de aprendizagem que você pode economizar com o curso, você pode usar para vender os sites que você construiu, por exemplo.

Além do mais, existem recursos e conhecimentos que são exclusivos e que raramente você achará por aí e o curso conta com suporte para você te ajudar no seu processo.

E o curso conta com bônus exclusivos, dentre eles, a possibilidade de adquirir a chave do Elementor PRO por um preço super baixo, pago em real e não em dólar.

EU QUERO O CURSO WP ELEMENTOR

Agora é com você!

O Elementor page builder é um ótima ferramenta e que vai te ajudar a criar os seus sites de forma mais simples e rápida. Todas as novas landing pages do Chief of Design utilizam o Elementor PRO e eu utilizo em projetos freelancers também, ou seja, faço dinheiro com ele e conheço várias outras pessoas que fazem dinheiro seja em produtos digitais, seja produzindo sites em Elementor para seus clientes e agências.

Para que você aprenda a utilizar todo o potencial do Elementor, para que você possa acelerar a sua curva de aprendizagem, para que você comece com um auxilio de quem sabe o que faz, o curso de Elementor WordPress está a sua disposição.

Faça a decisão sábia e opte pelo seu crescimento. Clique aqui e conheça agora o melhor Curso de Elementor WordPress.

Te espero do outro lado 😀

Forte abraço!

Até mais.

The post Curso de Elementor WordPress – Crie sites, landingpages ou blogs de forma descomplicada! appeared first on Chief of Design.

Curso de Elementor WordPress – Crie sites, landingpages ou blogs de forma descomplicada!
Fonte: Chef of Design

Google Tag Manager. O que é? Para que serve?

Google Tag Manager. O que é? Para que serve?

Você já precisou inserir manualmente um pixel do Facebook em algum site? E precisou repetir o processo para inserir qualquer outro tipo de código de terceiros? E se você pudesse gerenciar todos esses códigos em um só lugar sem precisar mexer nos arquivos hospedados no servidor? É então hora de você conhecer o Google Tag Manager.
Eu sou Ed Francisco e estou aqui para te mostrar como você pode adicionar e gerenciar scripts de terceiros em seus sites e sites de clientes de forma simples e sem riscos com o Google Tag Manager.
Antes de entendermos como funciona esta ferramenta devemos primeiros conhecer as tags. Vamos começar?
O que são tags?
Existem ações fundamentais no marketing digital. Muitas destas ações visam aumentar o número de vendas. Entender o comportamento do usuário que visita um site, alimentá-lo com publicidade pós-visita e acompanhar e otimizar conversões se destacam entre as estratégias para alavancar as vendas.
Para que essas estratégias funcionem é necessário adotar de rastreadores que acompanham as ações. Se tratam de pequenos códigos javascript inseridos nos sites que realizam uma infinidade de tarefas, muitas delas relacionadas a estratégias de marketing digital. Esses códigos são tratados como tags.
Alguns tipos de tags famosas que possivelmente você já teve contato são:

Código de acompanhamento do Google Analytics;
Pixel de acompanhamento de conversão do Google Ads;
Pixel de remarketing do Google Ads;
Pixel de acompanhamento de conversão do Facebook Ads;
Pixel de remarketing do Facebook Ads.

O que é Google Tag Manager?
O Google Tag Manager é uma ferramenta gratuita que permite que você inclua os scripts de terceiros apenas em um lugar e sem a necessidade de acessar seu servidor.
Por que usar o Google Tag Manager?
A inserção das tags é um processo corriqueiro para quem trabalha com Marketing Digital. E esse processo não é uma tarefa fácil para quem não tem familiaridade com códigos HTML.
Existe um grande risco de quebra do site se uma pessoa sem conhecimento adequado mexer em algum arquivo que está n o servidor.
A adoção do Google Tag Manager traz a grande vantagem de não precisar acessar esse arquivos dependendo apenas de inserir um pequeno código uma vez e todos os outros que futuramente você precise inserir pode ser executado de forma simples e prática dentro da interface gráfica do Google Tag Manager.
E com uma outra vantagem de que se algo der errado você pode recorrer à uma versão anterior instalada.
Com a possibilidade de você administrar suas tags, pixels e scripts em um só lugar as pessoas que administram esse códigos terão mais autonomia sem precisar buscar ajudas de profissionais de TI que já podem estar bastante atarefados.
Como começar?
Para começar é preciso possuir uma conta no Google e logar com seus dados no site do Google Tag Manager.
Depois disso você precisa criar uma conta que pode ser o nome de sua empresa. Em seguida criará um contêiner que pode ser o nome de seu site ou aplicativo.
O processo continua com aceitação dos termos e a inserção de códigos específicos em seu site. Lembrando que depois destes os próximos códigos serão inseridos na interface do Google Tag Manager.
A seguir apresento um vídeo que além de falar sobre o Google Tag Manager demonstra como fazer essa configuração inicial.

Principais funcionalidades do Google Tag Manager
As principais funcionalidades do Google Tag Manager consistem na criação das tags e de acionadores que disparam quando é preciso que as tags entrem em ação.
Criação de Tags
Basicamente tags são os scripts que você que você quer incluir em um site, O Google Tag Manager oferece uma gama de tipos de tags pré-configurados como o Google Analytics, as tags de remarketing do Google Ads.
Caso o Google Tag Manager não ofereça uma pré-configuração para um script específico é possível adicioná-lo a partir do HTML personalizado. Caso este na inserção dos Pixels do Facebook.
Criação de acionadores
Os acionadores determinam em quais eventos uma tag deve funcionar. Um bom exemplo de acionador é quando determinada tag é acionada quando o usuário visita uma página.
Esta página foi definida na criação do acionadores. Lá você pode definir diferentes tipos de eventos e quando ele deve ser acionado.
Caso escolha o evento visualização de páginas você pode definir que o evento ocorra em todas as páginas ou em algumas específicas.
É indicado você criar os acionadores antes das tags porque eles deverão ser selecionados durante a criação das tags.
Modo de visualização
Quando configuramos nossas tags basta clicar em publicar para que as mesmas entrem em funcionamento. Mas é aconselhado que antes de publicar você ative o Modo de Visualização para que averigue se as tags estão funcionando no devido momento ou não.

Instalação de scripts do Google e pixels do Facebook no Google Tag Manager
No vídeo a seguir eu demonstro como criar e suas tags e pixels do Google e Facebook para que sejam instalados em sites WordPress. Confira!

Conclusão
O uso do Google Tag Manager se mostra uma ação vantajosa para inserção de scripts de terceiros de forma prática.
Ao adotar essa ferramenta a equipe de marketing passa a ter mais autonomia para gerenciar suas tags a não depender de outros profissionais para inserção dos códigos.
Agora me diga. Como você instala suas tags? Você já utilizou o Google Tag Manager?
Deixe seu comentário e aproveite e compartilhe esse artigo com os amigos.
Abraço!
The post Google Tag Manager. O que é? Para que serve? appeared first on Chief of Design.

Google Tag Manager. O que é? Para que serve?
Fonte: Chef of Design

O que é design digital? O que faz um designer digital?

O que é design digital? O que faz um designer digital?

Eae? Td bele!

Existem tantos nome e terminologias referentes ao Design, que vira e mexe temos que abordar sobre elas nos canais do Chief, na web, para esclarecer as dúvidas dos Galuchos. A terminologia da vez é o Design Digital.

Se você atua com criação e utiliza os fundamentos do design você verá que o Design Digital tem muita similaridade como por exemplo, o Design Gráfico e o Web Design.

E se você quer saber mais sobre a profissão de Designer Digital, neste artigo você encontrará as principais informações sobre esta profissão e poderá assim decidir se esse caminho que você quer seguir profissionalmente.

E neste artigo você saberá:

O que é Design Digital?;Diferenças e semelhanças entre o Design Digital e o Design Gráfico;O que faz um Designer Digital?;O Perfil de um Designer Digital;Conhecimentos fundamentais;O Mercado de trabalho;Quanto ganha um Designer Digital?;Precisa de diploma para ser Designer Digital?Quais outras opções de cursos?

O que é Design Digital?

Design Digital é um segmento do Design Visual em que o Designer projeta soluções funcionais para telas de dispositivos diversos.

Para que as soluções se tornem funcionais, nessas telas, o profissional da área utiliza-se da aplicação de conceitos e técnicas específicas para desenvolvimento de layout em telas e dos fundamentos de design necessários.

Entenda-se que o Design Digital tem como uma peculiaridade de fazer com que os layouts projetados funcionem, na maioria dos casos, em dispositivos de diferentes tamanhos. Hoje no mercado temos uma variedade de tamanhos de telas que vai desde telas dos Smartwatches, passando pelos smartphones e chegando até as Smart TVs.

Design Digital versus Design Gráfico

Existe muita similaridade entre o Design Gráfico e o Design Digital, isso porque ambos usam praticamente os mesmos fundamentos. O que diferencia é onde os fundamentos são aplicados, já que cada um deles trabalha em “plataformas” diferentes. Sendo assim, o Designer Gráfico atua em processos gráficos, impressão e podendo até criar peças digitais. O Designer Digital é mais específico para projetar para telas de dispositivos.

O que faz um Designer Digital?

O Designer Digital é o profissional especializado em programação visual que aplica-o em diversos meios digitais.

Ele utiliza recursos como imagens, textos e ilustrações que são distribuídos harmoniosamente aplicando-se os fundamentos do design necessários para expressar os objetivos de comunicação do projeto.

Com esses recursos em mãos esse profissional desempenha importante papel em tarefas que envolvam o planejamento e produção de comunicação visual para:

Sites;Interfaces digitais;Animação/Motion Design;eBooks;Editoração eletrônico;Social Media;Games.

Mas podendo também fazer:

Identidade visual;Peças gráficas;Direção de arte;UX;Arquitetura de informação;Outros.

Perfil de um Designer Digital

Os desafios encontrados em áreas correlacionados do Design são muitos parecidos e geralmente são focados em soluções de problemas, e na maioria dos casos, relacionados a pessoas.

Por isso acredito que as que as principais característica que te favorecem a ser um bom Designer Digital são a vontade de aprender, a empatia e gostar de resolver problemas de forma criativa.

Mas logicamente que existem outras características podem indicar se você tem o perfil para atuar na área. Dentre elas se destacam:

Gostar de artes e eventos culturais – Quanto maior é o seu repertório, mais abrangente de elementos visuais, mais a sua criatividade aflora e contribuí na composição de seus projetos. Portanto assistir filmes, ir em exposições, ler livros e revistas, e até analisar a composição gráfica destes podem aumentar seu repertório.

Ter bom senso estético – Você precisa saber julgar e decidir não só o que é belo, mas também agradável aos sentidos do ser humano.

Saber expressar ideias através do desenho – Isso não quer dizer que você precisa ser um exímio desenhista, não é isso. Basta que com alguns traços você consiga rascunhar uma ideia.

Gostar de tecnologia – Atualmente Design e tecnologia caminham juntos. Um Designer passa boa parte do tempo manuseando softwares gráficos e pesquisando referências na internet.

Saber trabalhar em equipe – Você pode até trabalhar de forma independente como freelancer, mas de qualquer forma em muitos projetos você precisará interagir com profissionais de outras áreas e equipes para debater sobre planejamento e outras questões.

Comprometimento com os resultados – Se comprometer com o que foi acordado garante que você entregue de acordo com os requisitos e dentro do prazo.

Conhecimentos fundamentais

Para que você possa entregar soluções que tragam resultados a seus clientes você precisa se munir de conhecimentos fundamentais. Vou apresentar alguns deles dividindo em duas categorias: os fundamentos e as ferramentas.

Fundamentos:

Me refiro aqui a fundamentos como proximidade, alinhamento, unidade, equilíbrio, formas, ergonomia, semiótica, gestalt, cor, tipografia, grids, diagramação,imagens, etc.

Ferramentas:

Fundamental também é dominar softwares diversos que vão desde editores gráficos, passando para editores de vídeo, até construtores de interfaces e editores de códigos. 

Destacamos o Photoshop, Illustrator, Corel Draw, InDesign, After Effects, Premiere, Figma, Adobe XD, Invision, Sketch e Sublime Text.

Mercado de trabalho – Onde trabalha um Designer Digital

Basicamente o Designer Digital atua com Web Design, Design para APPs, Animação Digital, Design de informação, Design de interação, Edição de vídeo, Social Media, Criação de Games, entre outros.

O Designer Digital é requisitado por empresas de comunicação e indústrias de diversos setores. Ele pode trabalhar tanto em Instituições públicas, privadas e do terceiro setor que demandem criação projetos de comunicação visual.

Ele pode atuar em:

agências de publicidade;empresas de TI;departamento de comunicação e marketing de empresas;escritórios e estúdios de design;produtoras de vídeo e cinema, emissoras de TV;produtoras de games e animações;startups;empresas que precisam de programação visual em geral.

Ele também pode atuar como freelancer pessoa física ou jurídica.

Quanto ganha um Designer Digital?

Segundo o site Glassdoor, plataforma que ajuda profissionais a encontrar a empresa ideal e a descobrir salários em mais de 100.000 empresas, o salário de um Designer Digital está entre R$ 5.000,00 a R$ 6.000,00.

Mas esse valor pode variar por causa de fatores como a região, segmento da empresa, sua experiência, entre outros.

Precisa de diploma para ser Designer Digital? Precisa ter Curso Superior?

Para que uma pessoa trabalhe como Designer Digital não é exigida a formação superior, pois a profissão ainda não é regulamentada. 

Portanto a experiência de mercado e um bom portfólio que comprove que você é capaz de executar as tarefas inerentes a área, podem ser (normalmente são) mais importantes e os suficientes para que você atue no mercado de trabalho.

Óbvio que um curso superior sempre terá um peso extra. Inclusive se você quiser saber mais sobre faculdade de Design Digital, sugiro pesquisar no Quero Bolsa.

O site Quero Bolsa disponibiliza bolsas com até 75% em cursos superior, tecnólogo ou bacharel ,e de pós-graduação em design.

Se você vai entrar na faculdade, antes de qualquer coisa sugiro fortemente que acesse agora o Quero Bolsa e veja se não tem nenhuma bolsa na faculdade que você deseja entrar. Eu mesmo usei o Quero Bolsa e foi muito útil na minha época. Não perca tempo! CLIQUE AQUI e saiba mais.

Quais outras opções de cursos o mercado oferece para mim?

Além do Curso Superior (Bacharelado e Tecnólogo), as outras opções de aprender sobre Design Digital são:

Cursos livres (presenciais): cursos presenciais de curta duração;Cursos online: cursos no formato EAD, onde você pode estudar de casa com um preço, comumente, mais barato. Aqui no Chief of Design nós possuímos o curso Web Designer PRO que apesar da nomenclatura, ele oferece um sua grade importantes conceitos e técnicas para quem quer atuar com Design Digital.Curso Técnico;Curso de Especialização, Pós-Graduação;Mestrado.

Material complementar

Para mais detalhes sobre a área de Design Digital eu disponibilizo a seguir uma material extra em vvídeo a seguir.

Considerações Finais

A área de Design Digital é uma área dinâmica que vai de encontro com as tecnologias mais modernas abrindo espaço para o profissional possa até se aventurar por ramificações do design como UX Design, UI Design, Web Design, Design de Games só para citar alguns.

Caso você queira contar com uma fonte de conteúdos que abrange conhecimentos fundamentais do Design Digital eu te indico conhecer o Curso Web Designer PRO onde você será apresentado a técnicas e fundamentos importantes para construção de interfaces para diferentes dispositivos.

⭐️Curso Web Designer PRO⭐️

Saiba mais ➡ https://www.webdesignercursos.com.br/

Então é isso, Galucho! Se você gostou desse artigo deixe o seu like e compartilhe com seus amigos eu tiverem interesse 😀

Deixe a sua opinião, dúvida e/ou experiência na área de Design Digital, nos comentários abaixo, bele? 😀

Até mais.

Forte abraço.
The post O que é design digital? O que faz um designer digital? appeared first on Chief of Design.

O que é design digital? O que faz um designer digital?
Fonte: Chef of Design

Canva Online – O que é? Como usar? Vale a pena? Funciona?

Canva Online – O que é? Como usar? Vale a pena? Funciona?

Eae, tudo bele?

Você conhece o aplicativo Canva Design? Neste artigo vamos falar sobre esse software de Design que é gratuito e totalmente online.

Muito provavelmente se você não trabalha com Design e procurou na internet por algo para te ajudar a criar alguma peça gráfica, sem a necessidade de contratar um Designer, você deve ter encontrado a opção do Canva Online.

Independente do que você tenha necessidade de criar, como por exemplo, um post no Instagram ou Facebook, a capa para o seu canal no Youtube, um flyer para a balada que você tá agitando ou até mesmo um banner para o trabalho da faculdade… O Canva sempre aparece nos resultados de buscas, não é mesmo?

Por isso neste artigo eu destrinchar esse software e mostrar como você pode usá-lo. Lembrando que o que será apresentado aqui pode ser até para Criativos e Designers, pois essa ferramenta pode acelerar o seu processo de criação, além de ser mais uma opção e que você acessar e usar independente da configuração do seu computador. Dá para até para fazer pelo celular.Então vamos ver se o Canva Online é realmente bom e como funciona! Vamos nessa?

O que é o Canva Design Online?

O Canva Design é uma das ferramentas de criação de peças gráficas para diversas mídias. Com o Canva você pode criar artes para redes sociais (Instagram, Youtube, Facebook, entre outras), panfletos, cartazes, currículos, capas de livro, mural de fotos, infográficos, convites, cartão de visitas, entre muitos outros.A ideia é que qualquer um possa criar as suas própria peça sem precisar de conhecimentos rebuscados em Design. Para isso, para que você possa usar de forma mais simples, existem milahres de templates que você pode usar como base para a sua criação.

O Canvas Online pode ser uma alternativa para quem não domina o Adobe Photoshop, Adobe Illustrator, conhecimentos de Design, mas que deseja começar a criar por si só as suas peças gráficas.

Com uma interface bem simples de utilizar e sendo acessado diretamente pelo navegador, ou seja, não precisa de instalação de nada, a proposta é pluralizar e tornar mais acessível o acesso a ferramentas gráficas de edição.

E como já dito, com ele você pode criar inúmeras artes. Segue a lista com algumas delas:

Capa para Facebook Capa para KindleCapa para YoutubeCapa para TwitterCapa para eBBoksSocial MediaAnimações para Social MediaPinterestArtes para BlogFlyersApresentações e slidesConvitesCartões de VisitaPostersConteúdos com medidas personalizada.Entre outros.

Para quem é Canva Online?

O Canva é para basicamente para aquelas pessoas que precisam criar alguma arte, mas que não querem, ou não podem, contratar um profissional para fazê-lo.

É uma ferramenta muito utilizada por pequenos empreendedores, produtores de conteúdos, freelancers, redatores, entre outros. Mas qualquer um pode utilizar o programa.

Também é um aplicativo que serve para quem precisa de algo pontual ou esporádico, como criar um convite para um evento.

O Canva Design também pode ser a porta de entrada para alguns que desejam se aventurar no ramo do Design, mas que estão no começo e por isso não tem condições de adquirir outras ferramentas mais complexas. E o mais legal é que ele é totalmente em português brasileiro.

O Canva pode ser útil até para quem trabalha com Design, como Designer Gráfico, Web Designer, entre outros. Por ser totalmente online, de fácil uso e acesso, pode ser uma alternativa a ferramentas como o Adobe Photoshop. Aliado ao conhecimentos conceituais e técnicos que um Designer tem, é possível criar no Canva peça profissionais e prontas para serem publicadas.

Ao contrário que alguns possam alegar, de maneira nenhuma o Canva prejudica ou toma trabalhos de um Designer, pois nada substitui o conhecimento e a criatividade humana. Então encare o aplicativo como mais uma ferramenta que pode otimizar o seu trabalho no dia a dia.

Como começar a usar o Canva?

Para começar a usar Canva Online, é muito simples. Mais fácil que roubar doce de criança. Siga os passos a seguir:

Acesse agora o site do Canvas Design Online (CLIQUE AQUI)

Depois você vai criar um login e senha. Para agilizar você pode acessar através da sua conta do Google ou Facebook.

Feito isso, você já estará logado no Canva Online e pronto para começar a criar!

O Canva Online é pago?

Não. Você não precisa pagar nada para usá-lo. Obviamente que a ferramenta oferece a versão paga, que conta com uma infinidade de recursos, mas ela não é obrigatória.

Com a versão PREMIUM do Canva Online você tem direito a:

Garanta a uniformidade visual da sua marca com o Kit de Marca. Transforme uma imagem em várias graças ao redimensionamento com um único clique. Crie fundos transparentes para poder usar o seu design em qualquer lugar. Acesse milhões de imagens e templates exclusivos. Além de muitos outros recursos que vão agilizar o seu trabalho.

E caso você goste do aplicativo e queira testar antes de comprar a versão PREMIUM, saiba que é super possível.

Você pode testar por 30 dias a ferramenta na sua versão completa. Isso mesmo: sem compromisso. Se por acaso você não gostar ou quiser mudar, não terá que arcar com custo algum.

Vale a pena usar o Canva Online?

Sim, com certeza. Após a apresentação de todos esses benefícios, não tem como dizer o contrário, não é?

Como diz no próprio site do Canva Online:

Diferente de outros geradores de gráficos online, o Canva não é complicado nem demorado. Não existe uma curva de aprendizagem. Você consegue criar um gráfico ou diagrama em minutos para deixar os dados brutos visualmente atraentes e fáceis de entender. canvas.com

Sem falar da variedade de templates gratuitos, criados por profissionais, que o Canva Online te oferece.

Para começar a criar, tudo o que você precisa fazer é alterar o conteúdo para criar peças gráficas de forma simples e rápida.

Simples, rápido, direto e confiável. O Canva proporciona a melhor experiência quando o assunto é gerador gráfico online.

Acessa agora o site do Canva e confira por você mesmo. Você não vai se arrepender.

Até mais.

Forte abraço.
The post Canva Online – O que é? Como usar? Vale a pena? Funciona? appeared first on Chief of Design.

Canva Online – O que é? Como usar? Vale a pena? Funciona?
Fonte: Chef of Design

Gutenberg WordPress – O editor de conteúdos do WordPress

Gutenberg WordPress – O editor de conteúdos do WordPress

Gutenberg é o editor de conteúdo introduzido no core do WordPress a partir da versão 5.0 e nesse artigo eu vou apresentar o funcionamento deste editor que promete trazer uma experiência mais simples para produção de conteúdo.

O que você acha de inserir diferentes tipos de conteúdos, mídias ou funcionalidade em seu post através de uma biblioteca inteira de opções e em um só lugar, com muito pouco conhecimento técnico e sem ter que se preocupar em lidar com códigos? Então é isso que o editor Gutenberg WordPress fará pra você.

Então siga comigo aqui no artigo para entender como as coisas funcionam no Gutenberg.

O que é o Gutenberg WordPress?

Reforçando o entendimento, Gutenberg é o editor introduzido na versão 5.0 do WordPress, substituindo o editor clássico, para criação, organização e estilização de conteúdos de posts e páginas através da inserção de blocos.

O nome Gutenberg deriva de Johannes Gutenberg. Ele que foi o inventor do processo de impressão com tipos móveis.

Como tudo era antes do Gutemberg?

Editor Clássico versus Editor Gutenberg

Antes do editor Gutenberg o WordPress fornecia o editor conhecido como “clássico” por estar presente durante anos.

O editor clássico tinha estrutura similar aos editores de texto dos sistemas operacionais onde tínhamos acesso a botões para formatação no modo visual, como como colocar negrito, sublinhado, inserir lista, links, entre outras funções básicas e também possuía o editor HTML para que tem conhecimento nessa linguagem.

O fato do editor clássico ser parecido com outros editores poderia ser considerado uma vantagem pois se tratava de algo familiar ao usuário. Entretanto se existisse a necessidade de inserir um recurso avançado no corpo do artigo era necessário a requisição de desenvolvedor com conhecimentos avançados para mexer no tema. Daí que vemos que pensar em um recurso como o Gutenberg se tornou necessário para comunidade WordPress.

Por que usar o Gutenberg?

Por que o Gutenbeg proporciona uma experiência de criação de postagens e páginas que facilita a criação de layouts avançados.

Para que isso possa ocorrer o Gutenberg permeia os seguintes princípios:

Possibilidade de criação de posts ricos; Tornar as funcionalidades principais mais fáceis de descobrir, reduzindo a dificuldade de encontrá-las; Os usuários não precisam escrever códigos de acesso ou HTML personalizado; Os usuários só precisam aprender como o bloco funciona para usar todos os seus recursos; Os blocos unificam recursos e tipos de interação em uma única interface.

Como podemos ver a grande peculiaridade do Gutenberg são os blocos. Então vamos entendê-los melhor no tópico a seguir.

O que são blocos do Gutemberg?

Os blocos possibilitam a inserção de conteúdos personalizáveis dentro do editor através do sistema de simples adição no editor.

Com ele que qualquer tipo de conteúdo, mídia ou funcionalidade pode ser adicionado diretamente ao site de maneira mais consistente e utilizável.

O botão “adicionar bloco” dá ao usuário acesso a uma biblioteca inteira de opções em um só lugar, em vez de ter que procurar menus ou saber códigos de acesso.

O processo de adição de bloco começa com um clique no botão de símbolo de adição (Adicionar bloco) no campo superior esquerdo do Gutenberg.

O Gutenberg permite a manipulação direta, o que significa que as opções primárias de como um elemento é exibido são controladas no contexto do próprio bloco.

Assim, por exemplo, um usuário pode adicionar uma imagem, escrever sua legenda, alterar sua largura e layout, adicionar um link em torno dela, tudo a partir da interface de bloco na tela. 

O WordPress suporta um grande número de blocos e mais de 30 incorporações.

Por dentro do Gutenberg WordPress (Tutorial)

Com os blocos do Gutenberg o usuário tem a possibilidade de colocar no layout de páginas e posts diversos elementos comuns em páginas web. Entre eles:

Parágrafos; Títulos; Imagens; Galerias; Vídeos; Áudios; Listas; Citações; Botões; Colunas, entre outros.

Introdução

Para começa a criar um conteúdo com o Gutenberg o processo inicia-se de forma similar ao que antes era feito no editor clássico. Definimos qual tipo de conteúdo iremos construir, por exemplo, post. Clicamos em inserir post e o editor ser´aberto.

Assim que ele abrir é aconselhado já inserir o título.

É aconselhável também salvar o conteúdo. No canto superior direito do editor é possível ver os botões de publicar e visualizar. Podemos ver também também o ícone (engrenagem) de configurações. Ele é responsável pela exibição das configurações do documento aberto e o do bloco que estiver sempre editado no momento.

Estando na aba documento você definir a visibilidade do conteúdo (público, privado ou protegido por senha) e o status, e de mais configurações do documento que já eram comum no editor clássico como imagem destacada, link permanente, nome do autor, categoria, entre outras.

Faça suas configurações publique conforme a visibilidade que mais se aplique no momento.

Campo para de opções para visualização, publicação e acesso para configurações do documento e blocos.Aba para configurações do documento.Configurações do documento.

Inserção e tipos de blocos

O processo de inserção de blocos é bem simples. Vá ao editor e no topo a esquerda e clique no ícone de adição +. Neste momento abrirá uma lista de opções de categorias de blocos.

Você notará que os blocos estão categorizados da seguinte forma:

Mais usados – É um recurso para se ganhar tempo onde mostra os blocos que você mais utiliza;

Blocos Comuns – Mostra os blocos de elementos mais comuns em interfaces web como título, subtítulo, parágrafo, imagem, galeria, etc;

Formatação – Mostra os blocos que possibilitem a formatação de conteúdo. Nesta categoria você encontrará o bloco para inserção de HTML personalizado, editor clássico, código pré-formatado, entre outros;

Elementos de layout – Mostra blocos para inserções de elementos de layout da página como por exemplo inserir colunas, botões, quebra de página, espaçador, etc;

Widgets – Esta é uma opção para fácil inserção os widgets disponíveis no tema de seu site, como por exemplo lista de postagens, lista de categorias, etc;

Códigos incorporados – Mostra todas as integrações disponíveis para você incorporar códigos de redes sociais e serviços web diversos.

Depois que você encontrar, dentro da categoria, o bloco que você pretende inserir, basta clicar nela que ele aparecerá dentro do editor para inserção e configuração do conteúdo.

Exemplo de inserção de bloco comum

Então caso você queira inserir um simples parágrafo você vai na categoria “Blocos Comuns” e escolher o bloco de parágrafo.

O bloco será inserido dentro do editor. Daí tudo que você tem que fazer é digitar o conteúdo do parágrafo.

Campo do bloco para inserção do conteúdo do parágrafo. Atalhos para blocos usados recentemente.Adição de novos blocos.Quando um bloco é adicionado ou selecionado no editor a coluna de configurações ativa a aba bloco.Com a aba bloco ativada você tem acesso as configurações do bloco inserido.

Personalização do conteúdo do bloco

Depois que você adiciona o bloco é possível fazer personalizações no seu bloco. No exemplo do parágrafo basta clicar no conteúdo para o bloco exibir opções para formatações comuns de texto.

Configurações do bloco

Uma grande vantagem da utilização dos blocos é essa manipulação direta onde podemos configurar as opções primárias de como um elemento será exibido.

Como já dito, o elemento quando adicionado ou selecionado ativa a aba de configurações do bloco onde podemos mexer com mais características do elemento.

No caso do parágrafo podemos configurar o texto mexendo na altura e no capitular, nas configurações de cor do texto e do fundo e ainda podemos mexer em uma opção avançada que possibilita adicionar uma class para estilização posterior via CSS.

Cada bloco de conteúdo do Gutenberg tem suas configurações particulares. Nem tudo que se aplica ao parágrafo se aplicará a outro elemento. Portanto é preciso que investigue as diferentes configurações de cada.

Exemplo de inserção de bloco formatação

Um exemplo de bloco de formatação é o bloco para inserção de códigos. Nele é possível a inserção de códigos de linguagens diversas (HTML, CSS, JavaScript, PHP, entre tantas), ou seja, apresenta um pequeno fragmento de código de computador utilizando tag HTML code.

É bastante útil para aqueles artigos técnicos em que é necessário apresentar um código de alguma linguagem, mas sem que eles acionem algum tipo de evento quando interpretado no navegador. É somente para que apresente o código para entendimento do leitor.

Vá até a o sinal de adição, categoria formatação e escolha o bloco código.

No bloco inserido no editor você terá a opção de inserir o código pretendido.

A seguir o resultado apresentado no navegador.

Imagem de código inserido com bloco Code

Exemplo de inserção de bloco de elementos de layout

O blocos desta categorias são bem interessantes porque possibilitam inserir elementos que precisariam de certo conhecimento técnico em outras linguagens para atingir os resultados esperados ou que são encontrados geralmente em page builders.

Elementos que ajudam muito a organizar conteúdos no layout e que não era possível desenvolver no editor clássico sem o conhecimento de certas linguagens são as colunas. Através de Gutenberg você consegue inserir e configurar facilmente colunas.

Na imagem abaixo vemos que o editor inseriu duas coluna e sugere que você coloque conteúdo em alguma delas. 

Você pode tanto adicionar um texto ou o mais bacana ainda inserir outros blocos dentro das colunas. Ver imagem abaixo.

Inserção de bloco dentro de uma coluna

E se eu quiser inserir mais colunas? Selecione e bloco e vá em configurações do bloco para definir mais colunas (máximo de 6).

Abaixo vemos um layout com 4 colunas

A comunidade WordPress preocupada com melhorias já está pensando no Gutenberg 6.0. Nele será apresentado um seletor de layout para o bloco Colunas, permitindo que o usuário escolha a partir de layouts predefinidos ou inicie do zero. Isso permitirá maior controle na largura das colunas.

Exemplo de inserção de bloco de elementos widgtes

Você quer inserir um widget do tema do seu WordPress dentro do post? O processo começa sempre clicando no sinal de adição.

A seguir listas de posts de um widget WordPress.

Exemplo de inserção de bloco de códigos incorporados

Um recurso que com certeza será bastante usado no Gutenberg serão os blocos de códigos incorporados que possibilitam embedar dentro do post códigos de terceiros provindo da web, como por exemplo, das redes sociais.

Um bom exemplo é a incorporação de vídeos do Youtube. Basta inserir a url dentro do bloco e clicar em incorporar para embedar um vídeo.

Outras funcionalidades do Gutenberg

O Gutenberg possui outras funções interessantes que se encontram no menu do canto superior esquerdo.

É possível desfazer e refazer uma ação clicando nas setas.Você também pode ver a estrutura do documento.E você pode navegar pelos blocos.

Existem outras funcionalidades específicas dentro de cada bloco. Uma delas é a possibilidade de mover o bloco dentro do post para cima ou para baixo, ou arrastá-lo para outra posição.

Outra funcionalidade interessante que é possível mexer dentro do bloco é alterar o tipo seu tipo por outro similar. Por exemplo; você tem três parágrafo simultâneos e gostaria que esse conteúdo fosse uma lista com três itens. Basta então seleciona-los e clicar em “Alterar tipo ou estilo do bloco”

Ainda existe no bloco o ícone de 3 pontos, que oferece mais opções de funções. Com ele você consegue:

Esconder as configurações do bloco;Duplicar um bloco;Inserir bloco antes e depois; Adicionar aos blocos reutilizáveis. Útil quando você sabe que usará muito este bloco. Para criá-lo você deve inserir um bloco qualquer, fazer as configurações necessários, clicar em “Adicionar aos blocos reutilizáveis” e salvar com um nome que possa ser lembrado; Você pode remover o bloco; E por fim editar o bloco com HTML se tiver essa opção.

Utilizando HTML no Gutenberg

Como foi dito no tópico anterior é possível editar certos blocos com HTML. Veja a seguir um exemplo utilizando um bloco de título.

Mas você pode também editar o post completo com HTML. Para isso você precisa:

Ir em “Mais ferramentas e opções” no canto superior direito do editor;Escolher a opção “Editor de códigos”; Após isso os blocos no Gutenberg serão substituídos por um campo com códigos HTML. Para retornar a posição inicial deve-se escolher a opção “Editor Visual”.

Edição HTML dentro do editor Gutenberg

Tutorial introdutório Gutenberg WordPress em vídeo

Para encerrar este artigo disponibilizo um vídeo onde mostro a utilização de alguns blocos dentro do editor Gutenberg. Dê uma conferida!

Conclusão

Como podemos ver neste artigo o editor WordPress Gutenberg trás inúmeras possibilidades de fácil personalização de blocos de conteúdos interferindo assim diretamente no layout dos posts e paginas.

Isso contrasta com forma de editar conteúdo nos tempos do editor clássico em que este tipo de personalização exigia a contratação de um desenvolvedor para criar a funcionalidade.

Gutenberg é que temos daqui para frente nesta era de Page Builders, apesar do Gutenberg não ser necessariamente como um construtor de páginas, mas sim um editor de conteúdos com algumas características de Page Builder.

Acredito que ele veio para facilitar a vida do usuário e é muito útil, apesar de alguns relatos de pessoas com dificuldade de adaptação ao editor. Eu, como produtor de conteúdo achei ele muito mais prático e rápido para publicar meus posts que muitas vezes possuem muitos detalhes comuns em interfaces web. Coisa que exigia mexer no HTML quando usava o editor clássico.

Agora quero saber de você sua opinião sobre o Gutenberg. Você já o utiliza? Ou ainda trabalho com editor clássico? Qual facilita mais seu trabalho?

Te aguardo nos comentários. Aproveite e compartilhe este artigo com os amigos!

Abraço!
The post Gutenberg WordPress – O editor de conteúdos do WordPress appeared first on Chief of Design.

Gutenberg WordPress – O editor de conteúdos do WordPress
Fonte: Chef of Design

Curso de SEO Online [Completo] Do básico ao avançado

Curso de SEO Online [Completo] Do básico ao avançado

Eae, tudo bele?
Você sabe o que é SEO? Sabe da importância dele para a visibilidade do seu negócio? Você pensou em aprender sobre o tema e até mesmo cogitou fazer um Curso de SEO?
Se sim, ou se não, fica comigo porque eu vou apresentar para você pontos importantíssimo que talvez estejam fora do seu radar sobre SEO, além de mostrar o melhor Curso de SEO, tanto em relação custo benefício quanto de material didático, que você poderá encontrar na internet.
Se não também fica comigo, pois eu vou te mostrar a importância do SEO e como ele pode ser fundamental para o seu negócio, pois tráfego pago (aquele que investe dinheiro em propaganda) é útil sim, mas não é escalável e ainda te deixa refém das redes sociais que cada dia mais cobram mais caro  para receberem simples anúncios.
O que é SEO?
SEO significa Search Engine Optimization, e se baseia em métodos e estudos para fazer o seu site visível para os motores de busca.
Quando trabalhamos pensando em SEO queremos que nossas páginas atinjam os melhores posicionamentos nos resultados dos motores de busca, como Google e Bing, quando as pessoas pesquisam por palavras chaves relevantes nestes sites. E principalmente pensamos em estar mais bem posicionados do que a concorrência.
Entenda-se como “Palavras Chaves” as palavras e/ou frases que os usuários digitam na caixa de pesquisa de sites buscadores,como Google e Bing, para encontrar o que desejam.
Estrategicamente você pode posicionar estas palavras dentro de seu documento HTML de forma que os buscadores possam medir e encontrar relevância e similaridade entre os termos pesquisados na consultas e o documento HTML.

Os resultados que se almeja através de SEO são denominados orgânicos e são representados na imagem acima na área demarcada com cor. Os resultados que você vê nas outras áreas são decorrentes de anúncios pagos
Por que é importante aprender sobre SEO?
Aprender e aplicar as técnicas e táticas de SEO é simplesmente MEGA IMPORTANTE, se você tem um negócio online, um site ou simplesmente deseja melhorar a sua presença na internet.
Sabe aquele ditado que diz: “Quem não é visto não é lembrado?”
Isso também vale para a internet.  Eu não sei se você sabe, mas de acordo com Hubspot, 75% dos usuários não passam da primeira página de resultados a segunda página de pesquisa do Google e apenas 1% acessam a terceira página.
O Google é responsável por uma parcela GIGANTE do volume de pesquisas na web. Segundo levantamentos, do próprio Google, por ano ele recebe mais de  2 trilhões de buscas são realizadas.
E eu não sei se você sabe sobre como funil de vendas, ou se pelo menos já ouviu algo parecido, mas melhorar o SEO do seu site pode interferir diretamente no seu faturamento.
Para entender mais sobre SEO, você pode conferir esse vídeo abaixo onde o Daniel Imamura fala sobre SEO. Confira:

A importância do SEO dentro de um Funil de Vendas.
O funil de vendas é um modelo estratégico que mostra o caminho que o cliente faz a partir do primeiro contato com a sua empresa, ou produto,  até a concretização da venda, ou seja, você fechar uma venda. Sabendo disso, você pode criar ações para conduzir ou acompanhar a jornada do seu cliente desde o primeiro momento de contato, com a sua empresa ou produto, onde descobre o que você oferecer, até a conclusão do negócio, que seria a concretização de uma venda.
Existem várias coisas a se falar sobre o tema e sabemos que o processo de compra nem sempre é algo linear, muito pelo contrário. Todavia, a fins de explicação para esse artigo sobre a importância de um curso de SEO, saiba que existem 3 etapas básicas dentro do funil, que são:

Topo do funil:
Essa é a parte onde o cliente descobre o seu produto. Ele pode estar ou não buscando pelo assunto quando ele entra em contato pela primeira vez com o seu produto.
Meio do funil:
No meio do funil o cliente já entendeu a necessidade e como a sua solução pode resolver a questão dele, e aí ele começa a considerar uma possível compra.
Fundo do funil:
Após toda essa jornada, aqui é onde acontece a decisão de compra do cliente e, consequentemente, a concretização do negócio.
Só que nem todos os potenciais clientes que chegam no funil de vendas, realmente se tornaram clientes. Veja um exemplo que o Daniel Imamura, responsável pelo curso de SEO – Everest de Visitas, sobre essa relação do funil de vendas:

Na imagem acima podemos perceber o número de visitas no topo do funil. São 10mil visitantes, porém apenas 0,9% desse total se tornaram efetivamente clientes, totalizando 90 vendas.
Portanto, podemos concluir que quanto mais visitantes você tem, maior será o seu faturamento. E levando em consideração que, segundo pesquisas,  68% de todos os cliques da busca orgânica vão para os primeiros três resultados, você deve fazer tudo para estar no topo do SEO.
E ainda temos um abismo entre o número de visitas do primeiro colocado para o terceiro. Veja só esse print sobre o Chief of Design. O nosso artigo está em primeiro no Google para o termo ” o que é design”. Note a diferença de visitas que temos em comparação com o terceiro colocado, eu tenho quase 3x mais visitas que o terceiro colocado.

E você até pode utilizar de anúncios par ase manter em primeiro, o problema é que o investimentos em anúncios, para se manter no topo, nunca diminui, pelo contrário, só fica mais caro a médio e longo prazo.  Em contrapartida o investimento em SEO é mais baixo e com o tempo ele diminui enquanto o tráfego só aumenta.

E além da questão de investimentos, existe ainda a qualidade da visita. QUando o visitante está procurando por algo e encontra você, ele já é qualificado, pois ele realmente está procurando uma solução para o problema que ele tem. Você não precisa mostrar para ele, pois ele já sabe.
No caso de links patrocinados e outras opções de tráfego pago, em grande parte você precisa apresentar para o usuário a oportunidade e como o seu produto ou serviço é bom e que pode ajudá-lo. Você tem mais esforço e também acaba gastando mais dinheiro com pessoas que não tem nada a vê, que não compraram o seu produto.
Por isso  o melhor caminho para equilibrar tráfego e investimento, performando cada vez melhor ao passar do tempo é justamente aprender! Você precisa obter conhecimentos de SEO e gerar visitas orgânicas para o seu negócio e para isso pode iniciar fazendo um curso de SEO online.
A seguir eu vou te mostrar o caminho das pedras para você aprender SEO e gerar visitas para o seu site.
Curso de SEO – Everest de Visitas
Como vimos, SEO é algo fundamental para a vida digital do seu negócio. Todo mundo está na internet e você não pode perder visitas e principalmente fechamento de negócios e oportunidades por causa de tráfego.
Investir em SEO é investir na saúde do seu negócio. E como você sabe, conhecimento é poder, por isso que indico o Curso de SEO – Everest de Visitas.
Aprenda com quem realmente faz SEO e gera resultados reais todos os dias. Procure no Google por ‘Otimização de Sites’ ou ‘Consultoria SEO’ e veja que a empresa, a CONSULTORIA DIGITAL, é a primeira nos resultados de pesquisa. Daniel Imamura é professor de SEO na escola Digital House, além de CEO da agência CONSULTORIA DIGITAL, que é especialista em SEO.

Neste curso de SEO, Daniel Imamura, especialista em SEO há mais de 9 anos e CEO da agência CONSULTORIA DIGITAL, vai lhe ensinar a sua metodologia que já foi aplicada e testada em sites como Pontofrio, Casas Bahia, Extra, InfoMoney, Portal Solar e centenas de outros sites, gerando resultados orgânicos reais.
Você aprenderá um passo a passo completo desde o planejamento do seu projeto de SEO, levantamento de palavras-chave, modelos de análises e relatórios e muito mais. São aulas práticas para que você possa começar a aplicar desde a primeira aula. Atualmente, Daniel Imamura é professor de SEO na escola Digital House.
Para quem é indicado o Curso de SEO  – Everest de Visitas?
O curso de SEO – Everest de Visitas, é indicado para pessoas que:

desejam aumentar as visitas orgânicas em seu site;
almejam aumentar o tráfego do site para vender mais;
desejam aprender, mesmo que estejam no absoluto zero, sobre a área de SEO;
buscam para trazer tráfego orgânico e qualificado para o seu site;
que já tiveram algum contato inicial, mas que desejam e necessitam aprender
mais sobre SEO para alcançar seus objetivos online;
que estudaram  ou conhecem ´técnicas de SEO , mas que necessitam se
atualizar para não ficar atrás da concorrência.

Vantagens do Curso de SEO Online – Everest de Visitas.

Curso feito por quem sabe e faz – O Daniel Imamura é grande especialista de SEO e tem vários cases de sucesso trabalhando com otimização para buscadores.
Curso Online – Você faz as aulas no conforto de sua casa, nos horários e dias que você quiser. Você não precisa se locomover ou ficar preso a um horário para aprender.
Suporte  – Você pode tirar dúvidas e aprender com outros alunos que estão fazendo o Curso de SEO, além do auxilio de um Instrutor Experiente
Exercícios – Após as aulas você poderá aplicar os conhecimentos aprendidos em exercícios mais a ajuda de checklists para lhe ajudar no aprendizado e na prática dos  conceitos e boas práticas de SEO.
Instrutor Experiente – O instrutor do Curso de SEO Online Grátis, Ludy Amano, possui mais de 10 anos de experiência em Marketing Digital
Certificado de Conclusão – Ao término do curso você receberá o certificado de conclusão. Essa é a prova que você completou toda a grade do curso, sendo uma excelente habilidade para você adicionar no seu currículo ou perfil do Linkedin.

O que eu vou aprender no Curso de SEO Online – Everest de Visitas.
O Curso é formado pela matriz curricular:

 Introdução – Entendendo a estrutura do curso e Nivelando conhecimentos
 Análise e Planejamento
Análise do Cenário Atual
Definição de metas de um projeto de SEO
Checklist do Planejamento
Plano de Ação
Checklist de Validação de Problemas Graves para SEO
Pesquisa de Palavras-chave e Estratégias de Priorização
Checklist – Revisão do Planejamento e Plano de Ação
Análise de SEO Completa – Passo a Passo
Validação do Estado Atua
Análise da Oferta
Otimização On-Page
Otimização de Conteúdo
Planejamento do ConteúdoLinkagem InternaLink Building – IntroduçãoLink Building – Estratégias para ganhar backlinks de qualidade
Orientações Finais da Análise + Dicas de Gestão da Implementação das Melhorias
Mensuração de Resultados
Conta de Demonstração do Google Analytics Relatórios sobre Público-Alvo
Relatórios sobre Aquisição
Relatórios sobre Comportamento
Relatórios sobre Conversões
Resolução de Problemas
Introdução a Resolução de Problemas
Migração de Sites e Trocas de Plataforma
Sitemap.xml
Estratégias AvançadasMVP
Mindset de SEO
Comandos Avançados de Pesquisa no Google
Como melhorar a Usabilidade da Página – UX
Revisão Geral do Curso

Garantia incondicional do Curso de SEO  – Everest de Visitas?
O Curso de SEO conta com uma garantia de 30 dias para te deixar seguro sobre o que está adquirindo.
O Prazo de Garantia é o período que você tem para solicitar a devolução integral do valor pago pela sua compra, caso você ache que o curso de SEO não é para você.

Para isso basta mandar um e-mail para a equipe do curso que eles tomaram as ações necessárias. Sem ressentimento e sem burocracia.
Depois disso, o seu reembolso será processado automaticamente pela plataforma de pagamentos Hotmart.
Considerações Finais: vale a pena adquirir o Curso de SEO – Everest de Visitas?
O Chief of Design só tem os acessos que tem, a reputação e autoridade em seu segmento graças ao nosso trabalho em SEO. Mais de 70% das visitas do nosso site vem através de SEO.
O tráfego orgânico é o melhor que existe para o seu negócio, pois ele
Não existe formula mágica e nem receita de bolo matadora para isso, mas existe sim a possibildade de adquirir conhecimento e fazer um ótimo trabalho para que o seu site e negócio recebam mais tráfego, gerando assim mais oportunidades.
O Curso de SEO  – Everest de Visitas é ministrado pelo Daniel Imamura, meu amigo que ministra aulas na Digital House, escola de inovação cujo o diretor é o famoso Interney, junto comigo. E é raro você achar cursos de pessoas do calibre dele, que atuam efetivamente no mercado e que tem resultados efetivos para mostrar.
Por isso eu super indico o curso de SEO online – Everest de Visitas.
E antes de terminar, claro, não esqueça de conhecer o curso de SEO online – Everest de Visitas.  Acesse o site e tire todas as sua dúvidas referentes ao curso.
Deixe também o seu comentário abaixo sobre a sua experiência SEO.
Forte abraço.
Até mais.
The post Curso de SEO Online [Completo] Do básico ao avançado appeared first on Chief of Design.

Curso de SEO Online [Completo] Do básico ao avançado
Fonte: Chef of Design

O que é Elementor WordPress page builder?

O que é Elementor WordPress page builder?

Eae, tudo bele?

Este artigo é para você está procurando por Elementor WordPress. Aqui eu vou te mostrar o que é esse page builder e como você pode utilizar o WordPress Elementor Page Builder em seus sites.

O Elementor é uma ferramenta do WordPress, CMS do mundo. CMS é o acrônimo de Content Management System — que traduzindo significa, sistema de gerenciamento de conteúdo, existem vários no mercado, porém nada supera o WordPress em termos de possibilidades, suporte e ferramentas.

Os gerenciados de conteúdo permitem criar sites mesmo sem saber programar, eles contam com templates, plugins e outras ferramentas que nos possibilitam tal facilidade. E no caso específico do WordPress, temos milhares de possibilidades de criação, desde blogs até lojas virtuais e grandes sites. Aqui no Brasil, temos alguns exemplos como o site da Toyota, da editora Abril, do Rock in Rio, da Gisele Bündchen e até mesmo o blog do Wix (vejam só hehehe) é feito em WordPress.Só para você ter uma ideia, mais de 30% dos sites em todo o mundo são feitos com o WordPress. E o Elementor é o plugin mais utilizado (ou um dos mais, depende de quando você estiver lendo esse artigo) e baixados e utilizados de toda a plataforma.

Então neste artigo você verá como utilizar esse page builder e começar a criar os seus próprios sites de forma simples e intuitiva.

O que é o Elementor WordPress?

Caso você não saiba Elementor WordPress é plugin de page-builder para o CMS WordPress. Com ele é possível criar páginas de sites em uma interface real-time e do tipo “drag&drop”, ou seja, clicando e arrastando.

O plugin Elementor é um dos mais populares na comunidade WordPress, se tornando o principal page-builder da plataforma. Para utilizar o Elementor, basta ter um site em WordPress. Caso você não saiba instalar o WordPress ou nem sabe do que se trata, sugiro que leia esse outro artigo.

Abaixo você pode conferir uma live que fiz utilizando a ferramenta e como em pouco menos de 1 hora eu criei um site sem mexer em código, praticamente apena “clicando e arrastando”.

Quais os benefícios do Elementor WordPress?

O principal benefício é poder criar páginas de modo rápido, simples (clicando e arrastando) e sem precisar mexer em código. Podemos listar como alguns, dos vários benefícios que o Elementor pode proporcionar para você que precisa criar páginas web, como:

A curva de aprendizagem é relativamente rápida e simples;
você não precisa comprar a versão pro (mas é muito bom se puder);
existem vários produtores de temas, plugins e addons;
é um dos plugins mais utilizados pela comunidade do WordPress;
não precisa de conhecimentos em programação (mas é bom se souber);
não precisa de conhecimentos em HTML e CSS (mas é muito bom se souber);
ele funciona independente do tema que estiver utilizando, permitindo adicionar e deletar elemento em páginas e posts.

Como instalar o Elementor WordPress?

A instalação é bem simples. Basta você acessar o site diretório de plugin do wordpress, procurar pelo Elementor e depois clicar na opção “download”.

Você também tem a opção de acessar o próprio painel de controle do seu site em WordPress, depois ir em: Plugins> Adicionar Novo. NO campo de pesquisa você deve procurar por “Elementor“.

Abaixo deixo um vídeo tutorial que gravei mostrando como você instala o Elementor em seu site WordPress.

O vídeo acima faz parte de um curso de Elementor WordPress que gravei aqui para os seguidores do Chief of Design. Caso queira aprender mais, clique aqui.

Como usar o Elementor WordPress?

Após instalar o Elementor, basta você criar uma nova página ou post. Depois, clique em “Editar com o Elementor” e pronto. A partir disso você será redirecionado para a tela de criação da página, onde você poderá configurar e construir a página sua maneira.

Como já dito, o Elementor é um construtor de páginas to tipo “clica e arrasta”.Para você começar a criar a página, você vai adicionando elementos e literalmente construindo a sua página dessa maneira.

Em meu canal no Youtube eu tenho uma playlist onde mostro o passo a passo para você começar a trabalhar com o Elementor. Caso queira aprender mais, clique aqui.

O Elementor WordPress é pago?

Sim e não. Você pode usar tanto a verão free quanto a paga. Existem essas duas versões, gratuita e paga, do software, porém em ambas você consegue as suas páginas. É isso mesmo que você leu! Caso você não tenha dinheiro para comprar o plugin, é possível instalá-lo e utilizá-lo.

Também é possível, mesmo na versão free, instalar “addons” e outros plugins que atuam em conjunto com Elementor WordPress, potencializando as funcionalidades e possibilidades de criação de páginas.

A grande diferença entre a versão paga, chamada de Elementor PRO, e a gratuita está nas funcionalidades da ferramenta.

A versão paga do Elementor é muito mais completa, pois contém várias funcionalidades que a verão gratuita não tem. Para conhecer a versão PRO e todos os seus benefícios, clique aqui.

Quanto custa a versão paga do Elementor WordPress?

A versão paga do Elementor está disponível atualmente em três planos.

O plano “Personal” para uso ilimitado em 1 site, está por $49.
O plano “Plus” para uso ilimitado em até 3 sites, está por $99.
O plano “Expert” para uso ilimitado em até 1000 sites, está por $199.

Em todos os planos você tem 30 dias de garantia e 1 ano de suporte e atualizações. A licença é perpetua e você pode utilizá-la para sempre.

O preço sempre é aplicado em dólar americano, então dependendo do câmbio do momento, o valor pode ser maior ou menor.
Para conhecer a versão PRO e todos os seus benefícios, clique aqui.

Vale a pena comprar a versão paga do Elementor WordPress?

Sim, super vale a pena. O Elementor facilita de mais a construção de páginas web e sites completos. E o mais legal que você pode criar os sites dos seus clientes com ele. Não tem problema algum. Por isso, o investimento tende a se pegar ao longo do tempo, caso você atue como freelancer.

Caso você não trabalhe com sites, mesmo assim a versão Elementor PRO vai te ajudar, pois vai te ajudar a poupar muito tempo e com as funcionalidades exclusivas da versão paga você terá mais agilidade e controle sobre o seu projeto.
Você pode conhecer a versão PRO e todos os seus benefícios, clique aqui neste link.

Considerações

O Elementor WordPress com certeza está entre os melhores page-builders da atualidade,na minha opinião é o melhor e mais completo que existe.

A facilidade que o Elementor nos dá na hora de criar páginas, a sua versão free com bastante recursos e mais todo o suporte da comunidade com a criação de novas ferramentas e resoluções de bugs é muito grande.

Se você deseja aprender a utilizar essa ferramenta, eu tenho uma boa notícia para você.

Em meu canal no Youtube eu tenho uma série de vídeos onde mostro como você pode começar a criar os seus próprios sites com o Elementor. Clique aqui para conferir.

E você já utiliza o Elementor? Deixe abaixo a sua opinião, relato ou dica sobre esse plugin.

Forte abraço.

Até mais.
The post O que é Elementor WordPress page builder? appeared first on Chief of Design.

O que é Elementor WordPress page builder?
Fonte: Chef of Design