Adobe XD de iniciante a especialista — design, protótipo e colaboração | Muhammad Ahsan Pervaiz | Skillshare
Menu
Pesquisar

Velocidade de reprodução


  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x

Adobe XD de iniciante a especialista — design, protótipo e colaboração

teacher avatar Muhammad Ahsan Pervaiz, UI UX Visual Designer 15+ Years

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Aulas neste curso

    • 1.

      Introdução ao curso Adobe XD

      2:27

    • 2.

      O que é o Adobe Xd?

      7:28

    • 3.

      Faça o download e instale o Adobe XD

      2:31

    • 4.

      Por que o Adobe XD é incrível

      3:33

    • 5.

      Tela de boas-vindas

      2:56

    • 6.

      Introdução à interface adobe XD NOVO 2020

      6:13

    • 7.

      Interface do painel de adex XD

      2:53

    • 8.

      Adobe XD e ganhar as diferenças

      4:40

    • 9.

      Atualizações e recursos de atualização XD

      2:33

    • 10.

      Exercício - primeira atribuição simples

      6:47

    • 11.

      Pranchas e grades no XD

      7:48

    • 12.

      oito ferramentas no XD

      4:44

    • 13.

      Ferramenta de retângulo para criar botões

      5:46

    • 14.

      Fundo e desfoque para objeto

      3:20

    • 15.

      Ferramenta Ellipse

      1:49

    • 16.

      Noções básicas da ferramenta de caneta em XD

      2:43

    • 17.

      Ferramenta para criem ícones

      5:34

    • 18.

      Ferramenta de linha

      1:16

    • 19.

      Ferramenta de texto no Adobe XD

      3:25

    • 20.

      Ferramenta de Polygon — UPDATE

      1:54

    • 21.

      Cores e paletas

      3:50

    • 22.

      Gradientes de cores no XD

      5:58

    • 23.

      Usando coolors.io como criar esquemas de cores

      3:44

    • 24.

      Máscaras no XD

      5:41

    • 25.

      Estilos de personagens em XD

      4:48

    • 26.

      Como usar os guias no Adobe XD: ATUALIZAÇÃO no Adobe XD-

      2:54

    • 27.

      Repetição

      8:47

    • 28.

      Componentes no Adobe XD no UPDATE no

      5:28

    • 29.

      9:35

    • 30.

      Atalhos comuns

      5:47

    • 31.

      Mais teclas de atalho

      8:25

    • 32.

      O que é design de nível de blocos?

      12:15

    • 33.

      Esboço de primeiro design de papel de bloco de bloco de conceito

      8:14

    • 34.

      Primeiro protótipo de papel — adicionar detalhes

      4:06

    • 35.

      Protótipos verticais de T

      8:58

    • 36.

      Nível de fidelidade e protótipos

      4:06

    • 37.

      Como adicionar detalhes ao seu design de bloco no XD

      7:36

    • 38.

      Como usar padrões de design do Ui para acelerar o design

      6:04

    • 39.

      Criando o exercício de tela de inscrição

      14:04

    • 40.

      Iniciando preparações do design

      5:11

    • 41.

      Esquema e mole de cores

      5:27

    • 42.

      Resolvendo problemas de Ux do aplicativo antigo

      4:10

    • 43.

      Design de tela de boas-vindas

      9:42

    • 44.

      Como criar a tela de login

      14:28

    • 45.

      Tela de login no design

      11:39

    • 46.

      Inscreva-se no XD

      7:04

    • 47.

      Design do painel parte 1

      12:24

    • 48.

      Design do painel parte 2

      11:08

    • 49.

      Design de navegação da barra de lado

      9:03

    • 50.

      Design de tela de as Activações

      10:35

    • 51.

      Sincronize o design de tela

      8:13

    • 52.

      Sincronize a tela de atualização de status

      4:25

    • 53.

      Como usar as grades para melhorar os designs mais

      5:11

    • 54.

      Como refinar os guias de estilo no XD

      8:22

    • 55.

      Diretrizes de design para iOS

      8:58

    • 56.

      Como corrigir os limites do alvo

      6:14

    • 57.

      Protótipo de login e telas de inscrição e inscrição

      10:11

    • 58.

      Como fazer Prototyping e outras telas no XD

      11:14

    • 59.

      Compartilhando com outras pessoas

      3:51

    • 60.

      Como gravar o protótipo no Mac

      2:15

    • 61.

      Ferramenta de inspeção de design

      3:57

    • 62.

      Por que exportar em 1x 2x 3x?

      9:10

    • 63.

      Exemplo perfeito de 1x 2x 3x

      2:45

    • 64.

      Exporte de pranchetas para criar modelos

      7:31

    • 65.

      Recurso de exportação em lote no Adobe XD

      6:23

    • 66.

      Preview do seu aplicativo no Iphone no Iphone

      2:11

    • 67.

      Handoff do desenvolvedor com Zeplin com Zeplin

      12:57

    • 68.

      Handoff do desenvolvedor usando Avocode

      13:47

    • 69.

      Abra esboços, arquivos do Photohsop e Illustrator no XD

      7:38

    • 70.

      Atualizações do Adobe XD atualizando o abril de maio 2018

      4:10

    • 71.

      Junho de 18Adobe XD

      10:11

    • 72.

      Junho 2018 Atualização de a matemática

      3:02

    • 73.

      Ordem de empilhamento de 06

      4:37

  • --
  • Nível iniciante
  • Nível intermediário
  • Nível avançado
  • Todos os níveis

Gerado pela comunidade

O nível é determinado pela opinião da maioria dos estudantes que avaliaram este curso. Mostramos a recomendação do professor até que sejam coletadas as respostas de pelo menos 5 estudantes.

2.065

Estudantes

3

Projetos

Sobre este curso

Crie e proteja um aplicativo de iPhone do mundo real usando o Adobe XD do Scratch. Colabore com os desenvolvedores usando as ferramentas de Zeplin e Avocode

Cada design é uma solução para um problema e os designs são sem utilidade se você não pode converter em aplicativos codificados. Então, neste curso do Adobe XD, você vai aprender com o zero de como você pode criar o Adobe XD. Então como você pode criar e compartilhar seus prototypes com seus usuários instantaneamente e a parte mais importante como você pode colaborar e usar seus desenhos para a criação de quais a criação e a mão para que eles beije suas mãos

Mesmo que você seja iniciante ou iniciante, não terá dificuldade em aprender a ferramenta Adobe XD, pois que ele aborda todos os conceitos básicos passo a passo a a que a que para

Este principal tópicos principais do curso é que este curso

  • Todos os conceitos básicos e atalhos do Adobe XD (do zero) (do zero)
  • Como criar o aplicativo para iPhone em XD
  • Como criar guias de estilo para seu aplicativo para iPhone
  • Prototyping de papel (tipos e como desenhar no papel)
  • Prototyping interativa usando o Adobe XD
  • Como exportar todos os seus ativos e pranchas de arte em 1X 2X e 3X e 3X
  • Como colaborar com os desenvolvedores usando o Zeplin e Avocode
  • Arquivos de esboço aberto no Photoshop e Illustrator com o Adobe XD
  • Todas as atualizações e recursos mais recentes no Adobe XD
  • Aprenda especificações/guia do design da Apple

Então, se você for designer de design de design de gráficos ou é um designer de UI que usa o Photoshop ou quer aprender como criar um design de design de design e prototype com Adobe XD, este curso é para você. Sua ferramenta mais fácil e leve em todas as ferramentas de design em que você pode obter expert em nenhum momento. Acredite-me

A coisa mais sobre o Adobe XD é que ele está disponível em for de sistemas de operação do Windows e MAC e vou mostrar todos os sistemas de operação neste curso, não hesite e se inscreva agora para aprender tudo sobre criação de Prototyping e Adobe XD

Mesmo que você nunca tenha usado nenhuma ferramenta de design, ainda você pode aprender Adobe XD

Conheça seu professor

Teacher Profile Image

Muhammad Ahsan Pervaiz

UI UX Visual Designer 15+ Years

Professor

I started my Freelancing Career 10+ years ago and learned everything the hard way myself. I went from scratch to end up working for FORTUNE 500 companies like INTEL, PANASONIC and Coca-Cola.

In just 2 years of Serious UI Designing, I made my place on DRIBBBLE
Working with Art Directors from Coca-Cola and Project Managers from the UK, I learned a lot in short period of time.

Worked from App Icon Design to App UI Design, from wireframes, prototypes and Mockups Design. I have a hunger of perfecting User Interface from all aspects

What my students are saying about my Classes?

 

AWARDS & WINS

I am a multi-talented person who has won One Gold Medal, won a nationwide Poster Design competition from PANASONIC and won many Landing ... Visualizar o perfil completo

Level: Beginner

Nota do curso

As expectativas foram atingidas?
    Superou!
  • 0%
  • Sim
  • 0%
  • Um pouco
  • 0%
  • Não
  • 0%

Por que fazer parte da Skillshare?

Faça cursos premiados Skillshare Original

Cada curso possui aulas curtas e projetos práticos

Sua assinatura apoia os professores da Skillshare

Aprenda em qualquer lugar

Faça cursos em qualquer lugar com o aplicativo da Skillshare. Assista no avião, no metrô ou em qualquer lugar que funcione melhor para você, por streaming ou download.

Transcrições

1. Introdução ao curso Adobe XD: Bem-vindos ao meu curso sobre isso. Mais de 60 anos e nas escolas você vai aprender todas as coisas básicas e todas as coisas oferecidas mais de 60 nós vamos projetar, vamos criar protótipos, estávamos indo para o dedo do pé, estávamos indo para o dedo do pé, aprender tudo sobre prototipagem de papel e todos os diferentes protótipos interativos, protótipos ao vivo. E nós vamos colaborar com seus desenvolvedores. Então, o que a colaboração significa é que vamos entregar nosso design para desenvolvedores que usam Zeppelin e Advil cold. Então não se preocupe se você não sabe sobre este material avançado porque você vai aprender que neste curso eu vou cobrir todos os conceitos básicos. Atalhos? Quais são as diferentes ferramentas que você pode usar para construir seu design? E então vamos passar para a fase de prototipagem onde vamos gerar a gripe fora do aplicativo e diferentes skins. Vamos conectar os diferentes ecrãs uns com os outros. E, no final, usaremos nosso design para colaborar com outros desenvolvedores. Nós estamos indo para projetar, nós estamos indo dedo do pé, dar-lhes especificações de design e diferentes as distâncias entre diferentes elementos e os guias de estilo citados, que seus desenvolvedores podem usar instantaneamente lá nós design aplicativo ou Design de aplicativo para iPhone. Agora vamos cobrir muito sobre datilografia na fronteira. Você vai me ver criando diferentes protótipos de papel estavam indo para cobrir a parte de esboço ou o design de nível de bloco, que é o primeiro rosto fora de qualquer projeto. Portanto, este curso é uma mistura de técnicas de experiência do usuário, poucos deles. Eu tenho discutido em um monte de TD como prototipagem e também sobre Adobe X T. Como você pode usar e criar protótipos instantâneos originar protótipos instantâneos usando Adobe X'd . Agora, muitos designers fora, eu vi que eles nunca falam sobre diretrizes de design, I diretrizes de design dos EUA ou as diretrizes. Todo designer e desenvolvedor deve saber que a barra de navegação ou que eles estão fora do EUA aplicativo dos EUAdeve ter 49 pontos ou a carga deve ser 44 pontos. Todas estas especificações que vou cobrir neste curso. E, uh, se você tiver algum problema ou você enfrentar qualquer problema, você pode facilmente entrar em contato comigo. Por que são respostas a perguntas e você também pode me perguntar diretamente por mensagem. Vamos fazer muitas coisas juntos, então vejo você em breve nesse curso, e eu serei seu instrutor 2. O que é o Adobe Xd?: Olá, todo mundo. Hoje vamos conhecer a nova ferramenta fora da Adobe, que é um trabalho x d e eu estava lendo por um longo tempo para alguns recursos que o introduzido agora em X t. E agora eu vou mostrar alguns off as grandes características fora dele. E eles são a equipe Robur. Eles estão trabalhando mensalmente sobre isso e lançando cada recurso mensalmente com base na atribuição de diferentes designers e designers de experiência de usuário de todo o mundo. Ok, então isso é em mais de 60. Estou agora no Windows. Existem apenas algumas pequenas diferenças dentro da versão macro e versão do Windows, mas elas são quase semelhantes. OK, agora eu vou mostrar alguns fora dos grandes e legal recursos off X'd e por que você deve usá-lo como, ah design via quadro e ferramenta de protótipo em sua experiência de usuário, design, design, fluxo de trabalho ou seu você um trabalho de design. Ok, agora por que essas três ferramentas para esboço loja e atrás atrás D Eles são ótimos para o seu design ou experiência do usuário design porque a Apple são versão líderes U S, eles estão produzindo seus gráficos nestes três para Max Ok, Então agora eles estão ostentando para o esboço da loja e aeróbica T. E se você olhar para os tamanhos dos arquivos adobe X t tamanhos menores dos anos oitenta, 18,9 MB para que você possa ver que é muito perto do tamanho do arquivo de esboço, então é cinco tamanho é muito pequeno. Ok, então este é um grande ponto positivo porque você pode criar, tipo, centenas de diferentes quadros de arte nele. Ok, então telas diferentes, talvez centenas sejam 20 ou 30 telas diferentes, e o tamanho do arquivo ainda será pequeno. Ok, então é mais fácil compartilhar um off the grid características de um trabalho X t é. É repetição. Bom. Saber o quê? Repetir a ganância é que você cria o seu elemento de design uma vez, e você vai repeti-lo fazendo um grande Reino Unido Você pode ver neste exemplo de design que vamos criar um fim fora das pontuações. Você pode ver que esta é a nossa repetição cria. Então, se eu tentar os dedos curtos sobre ele, você pode ver que ele está removendo todos os outros, uh, estes, hum, modelos de conteúdo aqui. Ok, então ele está movendo estes. Ok, Então você pode estender sua grade em destruição e na direção vertical, ambos fora dessas direções e ele vai multiplicar seu único conteúdo e você pode alterá-lo. Você pode. Eu fiz isso. E você pode fazer o que quiser. E vai significar um grupo. Ok, então este é um ótimo recurso para criar origem. Leia o conteúdo instantaneamente. Ok. Então você não precisa gerar tudo de novo e de novo. Você pode ver por aqui. São duplicatas. Ok. Minha proteção infantil. Produção infantil, treinamento de proteção infantil. Então temos outro recurso que é chamado de prototipagem. Você pode vincular toda a tela que você pode ver ou ouvir. Aqui está um protótipo de seção, e você pode visualizar o protótipo em sua área de trabalho. Você pode ver seu cabelo. Aqui está um protótipo. Este é um ótimo recurso porque no design da experiência do usuário, você precisa testar seus protótipos com seus usuários. Você precisa ver como os usuários vão realmente usar isso. Se este botão é suficiente para o Tom deles ou se ele está faltando lá, Tom. OK, então todo o tipo de coisas, se o espaçamento entre esses dois elementos é bom o suficiente para que o usuário não esteja tocando neste e abrindo este. Ok, então estes são alguns grandes recursos fora do Adobe X'd, e ah, nós vamos cobrir um monte de coisas nele. Ok? Além disso, você pode se mover. Vou pré-visualizar seus protótipos. Você pode visualizá-los diretamente no seu celular. celular do seu usuário. Além disso, você pode compartilhar as especificações de design. Está bem, deixa-me mostrar-te as especificações do design. Aqui temos as especificações de design do mesmo projeto, e você pode ver se eu vou a algum desses. Está a mostrar-me que este verde está ligado a este. Então, se eu for para este, Ok, então ele está mostrando todas as cores usadas neste quadro de arte juntamente com todos os estilos er corretos . Então, se eu clicar em qualquer off thes item, ele vai mostrar os detalhes fora que Qual é a aldeia em altura fora deste item? Qual é a distância entre esses dois itens de eso? 16 pontos. Então todas essas coisas cores, redondeza. Esta é a redondeza deste botão. Certo, cantos arredondados. E está mostrando também outros fatos, como sombra e essas coisas. Ok, então isso é muito útil. Está agora em especificações amargas de design, Peter. Eles estão tentando melhorá-lo para o e eu espero que ele vai ser uma grande característica no futuro próximo. Ok. Ok. Agora de trás do dedo do pé, Adobe X'd mais alguns recursos, que eu realmente amo é esta biblioteca de símbolos. Você pode ver os ativos. Eu posso adicionar todas as cores que eu usei todos os diferentes têxteis, e, uh, estilos que eu usei nos símbolos símbolos é na verdade o elemento reutilizável. Você pode criar um símbolo e você pode multiplicá-lo ou usá-lo em qualquer tela. E se eu fiz algum fora dos símbolos, você pode ver sobrecarga. Sei que estamos mais no protótipo. Então aqui temos um símbolo. Certo, então isso é um símbolo. E se eu tentar mudar a cor fora do símbolo você pode ver que ele mudou em toda parte. Diferentes furos de arte em todo o design. Onde quer que eu tenha usado este símbolo, ele vai ser mudado. Então este é um ótimo recurso. Você pode mudar instantaneamente qualquer coisa em qualquer quadro de arte. Se for um símbolo, será atualizado em todos os quadros de arte. Então este lado está basicamente nos guias de estilo que normalmente usamos para criar em outro Softwares ou qualquer coisa em Zeppelin. Ou se você lavou meus outros cursos, você sabe o que são guias de estilo? Eles são basicamente os guias de estilo, coloração e tipográficos para usar diferentes quatro tamanhos, cores diferentes e como eles serão usados em nosso design. Ok, então estes são todos os grandes recursos fora do X t, e eu vou mostrar-lhe um monte fora do negócio e como podemos rapidamente gerar esses projetos em X t. No mundo real, situações criando designs com muita velocidade é realmente necessário. Você quer mostrar o seu protótipo ou você está trabalhando demonstração ab. Faça seu cliente ou seu usuário e você queria fazê-lo instantaneamente dentro de duas horas ou dois metros ou talvez quatro horas. Eu acho que este tipo de projetos com essas muitas telas, como uma porta nove telas. Eu acho que você pode fazer isso apenas no nosso. E você também pode compartilhar seus protótipos. Você pode ver o cabelo dela publicar protótipo. Ok, você pode compartilhar seu link de protótipo com qualquer fora de seu cliente ou cliente no instante, e eles podem fazê-lo em seus dispositivos. Ok, agora, na próxima lição, eu vou mostrar a vocês como baixá-lo e como comprar este software se você realmente quiser comprá-lo. Mas agora, se você está aprendendo, você só precisa baixar a versão de teste. Certo, então vamos para a próxima lição. 3. Faça o download e instale o Adobe XD: Ok, agora seguindo em frente. Nós vamos baixar em Obey X'd versão de teste. Então você está indo para ir para esta jóia adobe dot com produtos barra x ação artista TML ou eu vou compartilhar este mundo com você. Ok, então este é o teste gratuito. Você pode baixar a avaliação por um mês, e você também pode comprá-la. Então, se você clicar sobre isso agora, é sujeira barato agora, e está disponível para $10 apartamento. Ok, então este é apenas recentemente, Eu acho que há outros APS lá por US $20 por mês, mas na verdade está disponível para US $10 apartamento. Está bem, se queres mesmo comprá-lo. Ok. Agora chegando aos requisitos do sistema. Ok. Então, antes de instalá-lo em seu PC são Mac, isso é muito legal coisa sobre este aplicativo que ele está disponível para ambos os sistemas operacionais . Ok, então, se seu usuário ou seu cliente estiverem trabalhando em um PC ou Mac, eles podem ver seu design e podem brincar com ele. Ok, então aqui temos os requisitos de sistema para Mac OS, que é Mac os 10.11 e posterior. Ok, estas são a memória de G B, 1.4 gigahertz conhecido. Pronta? Não exibir. Retina recomendada. Ok. E então temos o Windows 10. Alguém? Três atualização. OK, então se você tem janelas simples, então e norte e atualização misericórdia ou qualquer coisa abaixo desta versão 16 07 ele está indo dedo do pé. Dar-te-ei problemas. Você não pode instalá-lo muito fora de estudantes. Eles me perguntaram como instalá-lo no Windows 10. Certifique-se de que você tem qualquer atualização de misericórdia ou a versão mais recente do Windows 10. Ok. E estes são os requisitos CPU, dois gigahertz memória para G B A, G B, fora do espaço de instalação e exibição. E desça lá. Ok. Eu realmente prefiro que você tenha uma boa placa gráfica em Leeds. Pelo menos ter Koji bi ou um GB off ram em sua placa gráfica. Ok? Porque é necessário para a maioria deles projetar aplicativos intensivos. Ok, agora, estes são os requisitos, então certifique-se de ir em frente. Se você ainda não instalou o Baxter. Tente instalar a versão de avaliação gratuita e baixe-a e instale-a, e eu o verei na próxima lição. 4. Por que o Adobe XD é incrível: três e vou apresentar-te. Com fio será extinto é tão popular entre os designers de interface de usuário. Vocês são designers e designers de experiência de usuário. Existem várias coisas ou você pode dizer, recursos que devem estar presentes em qualquer tipo fora ferramenta de design para torná-lo perfeito para a experiência do usuário . Designers gostam de designers. Agora. A primeira característica é que ele deve gerar protótipo Você é? Eu crio ou tela fora de qualquer aplicativo rapidamente para que possamos construir rapidamente nele. Podemos projetar. Certamente. Não deve demorar como o dia inteiro para criar cinco ou seis coisas, muitas vezes aplicativo. Ok, então isso é uma coisa. A segunda coisa é que podemos facilmente compartilhá-lo e podemos é um fantástico com os usuários, que é também você pode construir um protótipo rápido droga, Protótipo fora de seu produto X Testá-lo com seus usuários rapidamente. Então, se você está testando com o usuário e mostrando-lhe ou coração sua primeira idéia fora do seu aplicativo e hey não gosta de algo ou ele diz que isso é isso não é o que eu quero. Você pode instantaneamente alterá-lo em adobe X T e gerar outro protótipo passeio de distância e mostrou que você realmente quer este. Ok, então esta é outra característica. Terceiros recursos, que eles realmente introduziram agora, são para desenvolvedores. O que os desenvolvedores precisam é que eles realmente precisam de especificações, cores os cabos off cores em valores acessíveis ou valores RGB ou às vezes algum outro valor rgl para valor. Ok, então eles estão mais interessados nas especificações que as cores que precisamos usar em nossa equipe fora deste aplicativo ou site. E quais são as especificações diferentes que exultavam com? Ok, então estes foram introduzidos recentemente na Adobe, na verdade, que é que você pode extrair seu gerar seus elementos, suas especificações de design, que este elemento está muito longe deste botão. Ok, você pode gerar nele dentro dentro do elemento inspecionar, que é, eu acho que eles são recurso da Adobe na divisão B agora. Além disso, eles introduziram recentemente que você pode exportar seus designs extras de adobe no Tow Zeppelin , que é outra ferramenta para criar em especificações de design e gravado qualquer menção fora do seu design. E, em seguida, eles também introduziram que você pode exportar suas camadas para sempre legal. Ok. E também há mais um. Eu acho que proto por para criar qualquer missão fora do seu protótipo. Mais detalhes e emissões são micro animações. Certo, então isso é tudo sobre essa lição. Espero que você tenha gostado da minha introdução txt operacional e o que você pode fazer com ele e por que ele está ficando popular entre outras ferramentas. Porque há mais uma razão para o tamanho do arquivo ser realmente pequeno. Acho que é ainda menor do que o esboço. Se você conhece um mapa de esboço, ele é menor do que esboçado. Então, ele está se desenvolvendo em um rápido e paz e um monte de recursos são adicionados todos os meses nele. Então eu realmente aconselho que se você gosta designer estão em algum design UX sentir que você realmente deve aprender a, você sabe, misturar-se com esta mão longe oferta excesso. Ok. É muito fixe. Leve, e espero que você vá adorar. Está bem, vejo-te em breve. Em outro menor 5. Tela de boas-vindas: Espero que até agora, você já tenha instalado o Adobe XD em seu computador. Agora vamos ver o que esta tela de boas-vindas aqui. Então, sempre que você executar o Adobe X D, esta é a primeira tela que você verá. Aqui na parte inferior, podem ver que estes são os meus arquivos recentes. Então estes são meus projetos recentes ou arquivos que abri. Posso reabri-los clicando em qualquer um deles. À esquerda, temos diferentes áreas como aprender em casa. Saiba se você deseja ver alguns dos vídeos da empresa Adobe sobre como usar este Adobe XD. Então temos documentos em nuvem. O Adobe XD foi recentemente transferido para a nuvem. Assim, sempre que você abrir ou salvar qualquer arquivo, ele também é salvo na nuvem. Então ele traz as mudanças e o histórico modificado do seu documento. Então, o que você projetar, por exemplo, como uma hora para ir para o nosso atrás, se você o salvou, ele refletirá todas as mudanças que você fez com o tempo. Então ele vai atualizá-lo automaticamente na nuvem. Então, estes são documentos em nuvem. Se eu clicar aqui você pode ver que estes são todos os documentos que eu carregei para a minha nuvem. Você pode ver aqui, estes são poucos documentos. Se você quiser excluí-los, você pode clicar aqui. Você pode excluí-los assim. Além disso, você pode classificá-los. Estas são opções diferentes. E então nós temos dab compartilhado com você. Então estes são os arquivos se alguém compartilhou seus projetos comigo e eu estou trabalhando com eles nos documentos da nuvem. Isto vai ser por aqui. Estes são todos os ficheiros apagados. Então eu recentemente o exclui, levantou este arquivo. Então, isto está tudo aqui. Agora, se você clicar em Gerenciar links, ele vai para a sua nuvem aqui você pode ver este Macleod e uma vez que você clicar no gerenciamento, mas, em seguida, estes são todos os protótipos publicados ou especificações de design ou projetos I ter compartilhado com eles. Então você pode ver se você olhar de perto aqui na parte inferior ele diz protótipo, protótipo, protótipo, protótipo de projeto protótipo de especificações de design. Então, esses são arquivos diferentes que compartilhei com outras pessoas. Você pode ver aqui, estes são links publicados, então estes são todos os que eu compartilhei com os outros. Você pode gerenciá-los aqui. Você pode clicar aqui, você pode copiar esse link e compartilhá-lo com outras pessoas. Você pode excluir permanentemente esses links compartilhados ou publicados. Agora, vamos voltar para nossa tela do Adobe XD e você pode ver se voltamos para casa, isso é tudo que temos aqui, nossos documentos de nuvem compartilhados comigo, arquivos excluídos, LINCS gerenciados, links gerenciados para os arquivos que compartilhei com outros. Então isso é tudo sobre esta tela de boas-vindas. Espero que tenham gostado desta lição. Vamos mais longe e discutir a interface na próxima lição. 6. Introdução à interface adobe XD NOVO 2020: Agora vamos abrir um novo arquivo para isso. Temos modelos diferentes aqui. Aqui temos iPhone, diferentes poucos querem projetar um aplicativo para iPhone ou Google App ou Android app, você vai e aqui, se você quiser ir para web design, você estará usando alguns dos modelos aqui. Se você quiser projetar algo para mídias sociais, postagens do Instagram, postagens do Twitter, desvanecimento do cabeçalho do Twitter, postagens do Facebook, filmar seu vídeo. Você vai para cá. Agora mesmo. Vou selecionar algo daqui. Como, vamos selecionar este Google Pixel para, para Excel. Agora, este é o nosso quadro de arte aqui. Então vamos maximizar este. E você pode ver no topo ele diz sem título e aqui está um pequeno login na nuvem e ele está me mostrando o tempo aqui. Então, vamos clicar aqui e alterar o nome para o nosso, digamos primeira visita ao XD salvar. Então agora você pode ver que eu já tenho alguns plug-ins e estrela, então ele está me mostrando que um plug-in precisa de atualização que temos agora eu vou fechar este. E esta é a nossa interface simples ou Adobe X à direita você pode ver que temos poucas opções aqui como este é o nível de zoom. Podemos ampliar até 100%. Este é um 100% deste design. Esta é a nossa pré-visualização da área de trabalho para o protótipo. Esta é a nossa pré-visualização móvel. Se instalamos o aplicativo móvel e queremos ver esta tela em nosso celular. Isto vai ser o aqui. Se eu quiser convidar outra pessoa, outra pessoa , algum outro designer, eu posso clicar aqui. Isso ainda está na versão beta, então eu posso habilitar a edição. Então outro designer pode editar meu projeto dois. À esquerda aqui, temos três abas, design, protótipo e cisalhamento. Design é onde estaremos projetando gabar-se de nossas telas, estaremos colocando diferente. Mas como vamos fazer coisas diferentes por aqui. Por exemplo, este botão aqui. E na seção do protótipo, estaremos ligando duas ou três telas. Por exemplo, se eu tiver outra tela onde aprendemos cada atalho e tudo mais, eu só estou tentando explicar. Então agora você pode ver que temos duas telas. Um é este 11 é este segundo. Posso conectá-los assim. E isso vai estar no nosso protótipo. Então, nossos protótipos interativos serão sobrecarga. Nossos arquivos de projetos serão sobrecarga. Compartilhar será quando quisermos compartilhar nossos projetos com alguém. Assim, você pode ver que temos diferentes opções onde revisão de design para obter feedback sobre seu design ou protótipo. Então temos um desenvolvimento onde vamos compartilhar nosso documento com desenvolvedores para mostrar-lhes o código que temos para todos esses elementos aqui. Então, para a apresentação, talvez queiramos mostrar aos nossos clientes. E, em seguida, para testes de usuário e, em seguida, para configurações personalizadas. Portanto, essas são configurações diferentes para compartilhar seu documento. Não, vou voltar para casa. E se eu clicar em Início, você pode ver que podemos voltar para esta tela inicial onde podemos abrir qualquer outro documento recente. Novamente, temos algum menu aqui, você pode ver à esquerda no Adobe XD é versão Mac, temos o mesmo menu no topo do MAC aqui. Então eu posso clicar aqui, você pode ver que temos um novo documento aberto. Então temos diferentes portões de interface do usuário. Em seguida, temos documento recente, renomear este documento, salvar como salvar como documento local. Assim, você também pode salvar este como seu documento local. Agora o problema será se você tentar salvá-lo como seu documento local, suas alterações são histórico não serão salvas aqui. Então vocês podem ver que estas são as duas mudanças que eu fiz às 302 PM e 03:04 PM. Três nossas 15:00 e quarto minuto, Eu realmente adicionei esta segunda tela. Então ele está realmente salvando todas as minhas alterações na nuvem. Então, sempre que eu quiser acessá-lo, eu posso voltar, por exemplo, para este aqui. Posso reverter de volta. Você pode ver aberto em uma nova janela. Então, se eu tentar abrir isso em uma nova janela, você pode ver que ele terá apenas uma tela. Então você pode ver que temos este mutuário tempo aqui. E é a primeira tela com a qual eu acho que comecei. Esta é a diversão. Começamos com tela vazia. Então ele vai salvar todo o histórico de todas as mudanças que você vai fazer ou talvez salvar depois de quatro ou cinco minutos. Eu não tenho certeza de qualquer maneira. Então, à esquerda, temos todas as ferramentas. Estas são as ferramentas que vamos usar nas próximas lições. Vou explicar cada um deles. Então, na parte inferior aqui temos ativos, temos painel Camadas, temos nossos plug-ins aqui. Portanto, quaisquer plugins que você vai instalar, estes são plugins gratuitos. Alguns deles são pagos. Você pode instalá-los aqui e você pode usá-los assim. Então, se você clicar aqui, você pode ver que diz um erro. Escala de cores muito larga. Vamos criar, você pode ver que esta é uma escala de cores aqui. Então, esses são os plug-ins que eles vão automatizar e aprimorar seus recursos do Adobe XD. Então estas são as ferramentas. Estes são os três que vamos principalmente olhar para este quadro de arte aqui a bordo de Arbor, Pelham. Estes são quadros de arte, na verdade, estes são chamados de quadros de arte. E isso é tudo sobre a interface do Adobe XD. Temos três abas principais aqui, design, protótipo e compartilhamento. E este é o nível de zoom. Vamos usá-la muito. Este é o botão play para pré-visualizar o nosso tempo de distância perfeito. Você pode ver nesta janela, isso também vai ser usado muito. Então essa é toda a introdução sobre a interface. Vamos aprofundar mais as mensagens de texto da Adobe na próxima lição. Vamos pular para o próximo S E agora. 7. Interface do painel de adex XD: Então, se eu voltar a este projeto, você pode ver aqui nós temos outro painel, que é o nosso painel de propriedades. Ok, então se eu clicar neste quadro de arte então este quadro de arte é selecionado, e esta linha azul mostra que este quadro de arte está ativo, eu vou mostrar um ver todas as opções alegadas. Faça este quadro de arte, como com na posição desta placa de arte altura a estibordo. O que é será a rolagem e a altura da placa de visualização. Quanta altura é visível, então temos aparência, a cor de preenchimento. Eu também posso mudar a cor se eu quiser. Oh, e quero dizer, eu preciso clicar nisso. Ok, então eu também posso criar grades e Leo está nele. Vamos falar sobre os layouts da Gretchen mais tarde. Só estou mostrando que este é o painel de propriedades. Ok, então se eu clicar neste retângulo arredondado, ok, então se eu clicar neste ângulo de rejeição redondo, você pode ver todas as opções mais tarde para isso, como alinhamento. Uma repetição da nota. Este ataque e essas raiva relacionam tudo bem, então isso está tudo aqui. Ok. Na barra superior serão alinhamentos. do que temos. A repetição criou nossa união. São opções? Não quero explicar agora. Só você precisa saber que esta área é para controlar seus objetos de design. Ok, então se você tem um quadro de arte, você pode controlar sua altura e outras características. Se você tem ah, retângulos, você pode criar diferentes efeitos e tamanhos diferentes e arredondamento diferente e capacidade diferente como usando painéis de propriedade do. Ok, então tudo, a maioria das coisas sobre qualquer objeto será deste lado. Você pode ver o que aqui. Agora, eu selecionei este texto e o texto. As opções são por aqui. Você pode ver. E se você selecionar a arte embarcada, propriedades relacionadas ao quadro de arte estarão aqui. Então é assim que usamos um emprego. Um x T. OK, Agora, há mais dois ícones à esquerda. Na parte inferior, você pode ver ou ouvir camadas e ativos. Ok, agora, esses ativos estão lá vai ser todas as cores. Estilos de personagens são símbolos que vou usar em todo o meu design ou em todas as placas de arte. Ok, então se eu tentar adicionar isso como o estilo da tia Corrector, você pode ver, ele adicionou um estilo de trator R nesta área de ativos. OK, então não confunda este design e protótipo com estes dois. Ok? Estes vão mostrar todas as camadas e isso vai mostrar todos os ativos que você usou em seu design. Ok, então esta é a introdução à interface do Adobe X'd. Espero que tenham gostado desta lição. Vamos passar para o próximo exercício. 8. Adobe XD e ganhar as diferenças: Ok, agora neste ouvir, vamos ver quais são as diferenças entre a versão Max desligada. Não, B, x d e B. versão B, x d e B. C é desligada, então seja extra. Ok, então a primeira coisa que você vai notar é esta barra de parada, que é barra de atalho aqui, que não está presente nas janelas. E embora os atalhos sejam muito fáceis de lembrar, mas ainda assim vai ajudar muito. Ok, então você pode ver que você sabe o que você pode fazer com esses objetos. Você pode adicioná-los. Você pode. Há opções de texto do que temos um intervalo e tudo mais capa sobre. Então temos uma data e um arquivo. Ok, então esta é a primeira grande diferença. Então temos mais algumas diferenças. Como você pode ver o recentemente adobe X t. Eles têm pelo menos alguns, hum, plugins que são suportados, ou as ferramentas de terceiros que são suportadas pelo Adobe X'd em. E se eu for para esta exportação, você pode ver que ali está Zeppelin. Agora, Zeppelin é uma ferramenta, e uma outra ferramenta é sempre chamada e duas, ou ver essas ferramentas tipo off que são usadas para gerar cabo e gerar especificações e documentos especificações. Se você não sabe sobre Zeppelin, você deve tirar meu fluxo de trabalho fora mais do que representar curso onde nós geramos todos os guias de estilo , cores , equipes, tudo dentro Zeppelins usando para a loja. Ok. Não, estamos todos prontos. Eu tenho um criado, um parágrafo um cabeçalho em um botão, e nós vamos exportá-lo. Dedo do Zeppelin. Vamos ver o que vai acontecer aqui. Ok, então vamos selecionar este quadro de arte, e vamos exportá-lo para Siplin. Ok, então isso é importante. Então eu criei em um X. Então eu vou importá-lo em um próximo, e ele está carregando o design agora. Ok, então tudo está feito. Vamos ver isto. Certo, isso é muito legal. Eu realmente gosto. Ok, então este é o nosso título, e este é todos os tamanhos que você pode ver nos pontos que são para desenvolvimento móvel. Você pode ver por aqui. Então temos isso também, a cor também está vindo em RGB. Acho que é para nós. Então você pode ver aqui como podemos exportá-lo para Ah Zeppelin. Certo, então veremos isso mais tarde. Estamos indo para o pé. Veja isso em detalhes mais tarde. Nas últimas lições agora, só queria mostrar que você pode fazer muitas coisas com o Adobe XY. Então, o que o Adobe Extra faz é que eles normalmente lançaram seus novos recursos primeiro para minha pergunta, e depois de um ou dois meses, ele vai ser incluído no reboque. A pergunta das janelas. OK, então não se preocupe se você tem janelas que você está faltando atrás. Ok, então isso não é uma grande diferença. Ok, então há mais uma diferença que eu esqueci de dizer se você criar um protótipo aqui , então eu vou duplicar isso reprimindo minha chave de opção artística. E eu vou dar o pé. Basta criar um protótipo simples. Eu iria ligar essas duas telas, parecer tão dissolvido, e apenas mudar a cor deste botão. Então sabemos que estamos lá dentro. Outro passou por aqui. Ok, então tudo feito. Agora vamos tocar isso e você pode ver aqui. Uh, então o que você pode ver aqui é um pequeno botão, que é recorde. Ok. Então eu posso pressionar isso e eu posso gravar um vídeo na minha pré-visualização. Ok? E depois posso exportá-la assim. Vai ser um vídeo. Ele vai salvar uma renovação de vídeo, tipo brutal. E você pode compartilhar esse vídeo com qualquer um. Ok, Neste momento, este oficial não está disponível no Windows. Espero que venha logo neles. Os próximos upgrades, talvez no próximo mês ou talvez de março ou Apple. Eu não sei. Este é também um recurso puro que só está presente na versão Adobe X'd Mex. E espero que tenham gostado desta lição para os usuários do Mac. Acho que este é um criador, Will e você pode fazer muitas coisas com ele. Espero que tenham gostado desta lição. Se tiver alguma pergunta a me fazer, a menos que passe para a próxima lição. 9. Atualizações e recursos de atualização XD: uma das melhores coisas sobre aeróbica T é que ele é atualizado regularmente. Então, adobe uma empresa e eles estão trabalhando nele um dia a dia e noite a noite e quase dar-lhe uma atualização a cada mês. Ok, então você pode ver a última atualização. WAAS 11 de dezembro de 2017 e o mais recente é geralmente 22 de 2018. OK, então eles têm melhor desempenho na zona. Visualização do Dropbox para alternar arquivo extra entre cor morse três cores diferentes morse que eles estão oferecendo agora e novos INTs gananciosos. Realmente Ingredientes melhorar a exibição de especificações de design mental são limitados 100% e novo recurso, que é chamado de exportação em lote. Além disso, eles estão começando o trabalho de terceiros através de integrações como Zeppelin. Nunca corte. Basta colocar uma torta e guia composto. Ok, então ah, você pode ver aqui eles mostraram que disponível para Mac no Lee. Portanto, há poucas características que eu vou mostrar a vocês na próxima lição. Algumas das diferenças que você vai ver na minha pergunta. A versão para Mac é como, uh, 10%. Ou talvez eu possa dizer 5% de visão de janelas. Ok, então eles têm mais recursos no Mac. Primeiro eles os lançaram no Mac primeiro, e depois eles lançam no Windows. Ok, então isso é sobre as atualizações. Deixe-me mostrar mais uma coisa que eles estão trabalhando em muitas solicitações de recursos. Ok, então este é o formulário de solicitação de recurso extra da Adobe, e você pode ver aqui as pessoas estão votando para diferentes novos recursos, como texto para acasalamento. E então temos o objeto fixo estático entre tradições. Então você pode ver que esta é a revisão de um debate? Eles estão dizendo recurso em revisão. Ok, então eles estão revisando esse recurso do que eles têm recurso precisa de mais informações do que eles têm destaque no backlog. Ok, então há poucos recursos que eles já têm funcionando, começou, começou a trabalhar, como você pode ver ou ouvir sobre os recursos esportivos de refugiados iniciados, então espero que eles vão perdê-lo em No próximo mês, ou talvez dois meses depois disso. Comece a trabalhar nisso. Então você pode dizer que este é muito legal recurso. Você pode se manter atualizado com o que está por vir em uma porta. X'd. Ok, vamos passar para a próxima lição onde nós vamos ver como começar a usar X d. Ok, então nós estamos realmente indo para começar a usá-lo 10. Exercício - primeira atribuição simples: - Não. Vamos conseguir algumas coisas práticas com o Adobe Extra. Ok, nós conversamos muito sobre isso, e agora eu vou mostrar a vocês como você pode criar algumas coisas simples nele. OK, então vamos fazer esta primeira tarefa. Esta vai ser a sua missão. Vou criar uma tela simples. Deixa-me mostrar-te. Então eu abri este quadro de arte, que é o iPhone 678 e eu vou pressionar o controle zero, comando zero, zoom in. Ou você também pode ir até aqui e zoom 200%. Está bem. Agora, o que eu quero que você faça é apenas clicar neste banco de elipse e apenas arraste e segure sua tecla shift para que você possa fazer uma circular proporcional. Estamos aqui, e agora vamos pressionar isso, selecione nós e vamos fazê-lo no meio. Ok, então uma vez que está no meio, você pode ver que há ah, linha rosa ou guia inteligente, que está nos mostrando que ele está no meio. Então nós vamos para aqui nesta área e este é o tamanho da nossa fronteira. Podemos aumentar o tamanho da borda para quatro assim. E eu vou pegar minha imagem Jewel na frente, e eu vou arrastá-la e soltá-la dentro deste círculo assim. Ok, então eu quero que você faça algo assim. Você pode usar sua própria imagem. Você também pode alterar a cor da borda. Clique aqui e eu posso mudar o dedo do pé do assassino da fronteira para 7 para 7 para 7. Algo assim. E depois quero que escreva uma mensagem aqui. Por exemplo, este é o meu título. Como Mohammed s e CES. Algo assim. E quero que datilografe sua quadra favorita aqui. Ok, então talvez Ok, então se o seu texto é um pouco mais, então eu estou indo para o pé este vai é tamanho de ataque aqui. Não se preocupe, eu sou isso. Eu vou entrar em um monte de detalhes na próxima seção, então não muito agora. Apenas vendo o tamanho do texto para algo como 16 como este, você pode ver Não, quando eu tento me mover, ele está me mostrando as distâncias entre diferentes elementos. Além disso, eu posso selecionar este e eu posso ir daqui para o pé qualquer coisa, ok? E eu também posso alinhá-los no meio assim. Isso já está no meio. Ok? E depois quero o dedo do pé. Tem o botão ah aqui. Então vamos criar um botão com a ferramenta de ângulo distrital. Clique no ângulo da seita. Este é um exercício muito simples. Não se preocupe que você é “Não”. Você vai se meter em problemas. Remova a borda e para o campo. Eu quero a cor. E eu vou usar minha ferramenta fiscal para criar algo nele. Como me contratar. Ok, então eu tenho escape de mama ou V 2 selecionado. E então eu vou selecionar outro lugar. Sim. Mova-o para o meio assim. E eu vou mudar a sua sensação. A cor está ali à direita. Vou torná-lo nulo. Ok? Você também pode selecionar ambos fora deles como esta folga dragão, e você pode alinhá-los no meio assim. Mas normalmente eu gosto disso. Eu deveria movê-lo para cima. E eu selecionei comprou fora deles novamente assim e movê-los para cima assim. É muito simples Ferramentas, design dos dedos e trabalho aqui. K Além disso, se você quiser, você também pode digitar algo aqui como este. Então, se eu quiser um parágrafo fora do texto é um monte de texto, eu vou clicar e arrastar assim e blá, blá , blá, blá, blá, blá, blá, blá, blá, blá. Muito bem, é uma bela poesia. E eu vou mudar a cor de preenchimento. Ok, então primeiro eu preciso selecionar este texto e assistir a cor do filme para algo assim. Ok, então eu não quero que você escreva blá, blá. Ei, então eu vou com o normal e eu estou indo para o pé. Obtê-lo? 18 saídas fora do tamanho. Ok, então vamos escrever algo aqui. Eu vou pular isso. Ok, então eu escrevi algo sobre mim. Ok, então eu vou remover este, e eu vou usar este aqui assim. E você pode usar isso no meio. Algo como isto? Sim, porque é muito deitado no meio, e eu posso usar algo assim. E agora você pode ver aqui nós temos Vamos mudar a cor de preenchimento dedo cor mais escura como esta. Ok, então esta vai ser a sua primeira tarefa. Só seu nome, o que você ama e o que você faz e o que você gosta e o que você assistiu em apenas duas linhas e Abberton. Ok, então se você quiser mudar o raio do fardo quer o dedo do pé, faça os cantos arredondados você pode fazer aqui como eu queria ser. Oito pixels arredondados. Você pode ver seu cabelo Se eu quiser adicionar um pouco de sombra, você pode clicar nesta sombra não mudar nada, Não jogar muito com esses valores estavam indo para cobrir Ah, muito no detalhe. Então esta vai ser a sua primeira tarefa que você quer criar algo parecido com isso. Basta criar uma elipse. Arraste sua imagem para ele seu nome, o que você gosta. Você também pode mudá-lo dedo do pé um pouco de cor graça. Então há um contraste entre estes dois e um fardo agradável e alguma sombra em torno dele. Você também pode arredondar os cantos, se quiser, e você também pode usar algo assustadores. Então eu vou usar quatro para os cantos arredondados. Vamos fazer a capacidade 100%. Está bem. Então você pode fazer algo assim. Deixe-me mudar essa cor para algo assim. Então isso é mais profissional. Ok, então eu quero que você crie algo assim e ah, postado na próxima tarefa. E verei você em breve na próxima seção. 11. Pranchas e grades no XD: Agora, a primeira coisa que eu vou falar é sobre quadros de arte, porque esta é a primeira coisa que você vai encontrar no Adobe X'd. Ok, então eu sou para este exemplo. Vou selecionar esta teia, e eu vou selecionar esta placa de 12 80 jardas e vamos ampliar o comando ou controle mais ou apenas pressionar comando ou controle zero dedos. Umit dedo do pé o ajuste e dentro desta tela. Então aqui temos sobre a nossa prancha. Este é o nome do quadro de arte. Se você quiser fazer você pode clicar duas vezes, e você pode editar como design do site ou algo assim. Ok, Agora, sempre que você quiser selecionar um quadro de arte, você precisa clicar em seu nome, então clique uma vez e ele vai ser selecionado e você pode ver diferentes opções e mais tarde toe este quadro de arte sobre Aqui. Esta é a largura e a altura. Se quiser medalhão, pode se quiser. Olha, vai bloquear a proporção. E uma vez que você aumentar isso, o segundo valor também vai ser aumentado, o que normalmente não queremos. Ok, então nós temos este retrato e paisagem mais, o que não é uh, faz sentido em Web design, mas em aplicativo móvel, então faz sentido. Certo, então temos essa rolagem. Ok, então rolagem é que quando você cria um protótipo fora deste design, se você quer uma barra de rolagem aqui para rolar o design deles e ok, então algo assim. Então Vieux Port Height vai decidir onde o corpo de rolagem. Então, se eu tiver esse, uh, Vieux Port Heights disse para 600 você pode ver aqui é a minha parte da escola. Ok, então este é o meu você pode dizer página cheia de gesso em web design. Dobra de tempo é a área que está indo dedo do pé visível na primeira vez, e alguém visita. Certo, então até esta área, o site estará visível em seguida, vamos bater rollerball. Certo, agora passando para essa aparência. Aparência é basicamente a cor de fundo de todo o seu design. Você pode configurá-lo para o que quiser, mas eu acho que mantê-lo branco é a melhor opção. Ou aqui. Certo, vamos clicar de novo. Certo, agora temos as grades. Estes são conceitos muito importantes, e isso é usado principalmente em web design. Um monte. Ok, então, mesmo em design gráfico, existem dois tipos de layouts fora da grade. Um deles é esse layout, que é baseado em coluna, e o 2º 1 é quadrado melhor. Ok, então o tamanho quadrado é normalmente feito para abdominais móveis. Não é bom para eu acho que Web design, mas pode rapidamente colocar objetos, se você quiser. Oh, assim. Ok, então isso é muito, você sabe, ele vai quebrar os dedos de cada caixa. Ok, então é mais fácil o seu dedo assim. Ok, mas faz mais sentido no design móvel veio e você está projetando para laboratórios móveis. Faz mais sentido. Vamos deletar de novo. Vá para a praça e este é o tamanho fora do azulejo. Você quer, se quiser, como 24 porcos, analfabetos, susto duro, tamanho quadrado. Você pode configurá-lo para 24. Você pode configurá-lo para 64. Tudo depende da sua própria escolha. Então nós estamos indo para o pé. Discuta este outro layout, que é baseado em coluna. Nós normalmente usamos em Web design. Um layout de 12 colunas e o bom disso depende de sua própria escolha. Mas normalmente, se você usar as configurações de bootstrap, será de 30 pixels. Então vamos para essas margens. As margens são basicamente este todo o espaço à direita, este espaço em branco ou e à esquerda. Então eu vou ajustá-lo para 30 algo assim. Está bem, então está a mostrar-me isso. Você quer margens diferentes em cada lado ou mesmas margens? Então, se eu clicar na mesma margem vai defini-lo 31 pixels, então um pixel não importa muito, então eu vou viver com isso. Ok, então esta é a nossa ganância estilo quase bootstrap. E se você quiser que você congee no tamanho do dedo 12 abaixo de 11 70 algo assim. Está bem. E se você quiser margens diferentes em cada lado, esta é a opção que você vai usar Stop, passo inferior e margem esquerda. Está bem. Você também pode torná-la a coluna padrão mais tarde Configurações. Ok, assim, e ele vai ser definido como padrão. Então, sempre que você começar a usar algumas colunas, será dito para esta configuração Defar. Então este é o básico. Propriedades básicas de qualquer placa de arte. Agora, se você quiser outro quadro de arte, talvez eu queira outro quadro de dardos. Então clique nesta ferramenta de quadro de arte e eu vou clicar em um. Então, o que? Aqui? E ela vai gerar outra arte agora. A segunda opção é que, se eu quiser dedo do pé, basta clicar em V. D. Selecionado primeiro e clicar na placa de arte novamente e você pode ver diferentes opções de inicialização arte . Então, se eu quiser e iPhone seis soar um modelo aqui, eu posso clicar sobre isso, e será paralelo ao meu Web design. Ok, então se eu te visse, eu cliquei mais uma vez. Então vamos mover o dedo do pé isso novamente, moveu tudo e eu vou diminuir um pouco para que possamos ver comprado os furos de arte. E agora, se eu quiser movê-lo, eu apenas selecionei e então eu posso movê-lo, ok? Então eu posso colocá-lo aqui, ou eu posso colocá-lo aqui sempre que eu quiser. OK, então é assim que você cria diferentes pontos de vista fora do mesmo site Noray e eu vou clicar fora e selecionar a ferramenta de placa de arte pressionando um e eu também posso clicar tablet android . Ok, então, não, eu tenho três visualizações. Um é um site ou desktop você do que temos modelo, vista, e então temos vista iPhone. Se eu clicar aqui, eu posso mudar seu layout toe quatro colunas, que normalmente usamos no Mobile APS e superou. Vai ser 16 e eu quero as margens à direita e à esquerda para 24 s. Então eu estou indo toe select 24 ou aqui. Está bem. Então, ok, então ele está cercando a 25, o que é bom. Ok, então aqui está a minha configuração para Web versão fora do mesmo site um jogo. Então eu vou usar quatro colunas aqui, e então eu vou usar oito colunas aqui, então você pode ver que é definido muito longe para oito colunas, que é muito criar. Eu realmente amo esse software. Eles têm valores padrão muito bons, então vamos defini-lo como 32. Ok, então isso está ótimo. Então é assim que eu vou configurar meus furos de arte se eu estou projetando diferentes pontos de vista do meu site . Está bem. Então visão móvel, Andhra tablet visualização e visualização desktop. Está bem. Então eu não vou entrar em detalhes e criar um design de site para isso, mas é assim que você vai configurar seus crudes. Agora, se você quiser excluir um quadro de arte, você pode selecionar e pressionar excluir, e ele vai excluir este quadro de arte. Ok, então é assim tão simples. Além disso, você pode selecionar a partir daqui e excluir. E também você pode duplicar cópia e comandos diferentes que você pode ver aqui. Ok, então é assim que você usa esses livros de arte. Espero que tenham gostado desta lição. Vamos passar para a próxima lição e nos vemos em breve. 12. oito ferramentas no XD: nesta lição. Vamos aprender sobre essa barra de ferramentas que temos no Adobe X'd. Então eu vou passar rapidamente em torno de todos esses objetos e da barra de fezes. Ok, então vamos começar com este iPhone 678 Vamos ampliar. Comando zero no controle zero. E aqui temos a nossa bola dura. OK, então esta é a ferramenta de seleção mais rica do V, que é, uh, isso você pode selecionar qualquer coisa com ele. Ok, então nós temos a ferramenta de ângulo da seita, que é o nosso r e você pode criar, mas termina com ela. Basta pressionar são, e aqui temos apenas arrastar e soltá-lo no meio. E isto é fronteira. Estas são propriedades diferentes fora dele. Vamos chegar a esta área mais tarde. OK, então estes são alinhamentos. Repetir alturas de grau com aparência e diferente este raio de canto raio sentir borda. Vamos olhar para eles em outra lição agora. Vou apresentar-vos todas as ferramentas aqui disponíveis. OK? Temos ferramentas muito limitadas e esta é a coisa de rua sobre este extra de adobe. Ok, então nós temos esse eclipse e você pode compartilhar o dedo do pé, você sabe, tê-lo em uma proporção proporcional e você pode pressionar arte com ele são opção dedo chave do dedo do pé fazer e crescer em destruição. Ok, então ele vai crescer a partir do centro assim. Então, cabe a você. Vou colocá-lo no meio. Certo, então temos essa ferramenta de linha. Você pode usar esta ferramenta de linha em qualquer lugar que você quiser. Certo, então aqui temos essa linha. Então temos o combustível gasto e esses atalhos são muito fáceis. E ah, o que chamamos na experiência do usuário. Design, mapeamento, mapeamento É mais fácil de lembrar. Ok, então ps pentti é texto nossas fronteiras um Exumas E. Então estes são auto-explicativos. Você não precisa se lembrar deles. Certo, então temos essa ferramenta de texto do que essa ferramenta de caneta com mental, você pode criar formas diferentes como essa. Apenas continue girando. E, em seguida, também podemos clicar e arrastar. Clique e deixe assim. Em seguida, clique e arraste para que possamos criar muitas formas diferentes. É quase semelhante ao de uma loja. Ok, vamos chegar a ele mais tarde em profundidade. Ok, então isso é têxtil. Você pode apenas selecionar o 30 ou e você pode escrever algo aqui como algo. O que tem imprensa escapar e é isso. Pressione V, e você pode selecioná-lo e movê-lo. Agora, as opções de alinhamento. Ou você pode dizer que o alinhamento inteligente é muito sofisticado para o novo futuro. Seu software de design é como um esboço, e será extra Reino Unido. Uma vez que você mover algo, ele vai mostrar a distância fora com todos os elementos diferentes aqui em relação a eles. Ok, então ele está me dizendo que agora ele está alinhado com este aqui. E a distância entre estes dois é de 15 pixels. Certo, então temos essas ferramentas de arte. Penso que já discutimos este assunto. Você acabou de selecionar e criar outro quadro de arte. Esta é a placa de arte para iPhone X. E então esta é a ferramenta de zoom que você pode ampliar em qualquer elemento. Isso é algum de volta? Eu pressionei o comando zero zero, e você pode ampliar toda a porta de arte assim. Ok, então isso é muito simples. Você também pode definir o nível da zona daqui em diante. Reduza o zoom. Estes são você pode ver diferentes teclas de atalho. Controle um controle do dedo do pé mais e controle mais menor. Zoom out e ah, zoom para seleção, Controle ou comando três. Então, se ele estava usando Mac, ele vai ser substituído por comando. Muito bem, muito simples. Muito fácil. Teclas de atalho. Eu vou dar o dedo do pé. Crie uma lição separada para todas as teclas de atalho utilizáveis. Ok, então podemos usar e começar a usar rapidamente o Adobe X'd. Então estas são todas as ferramentas. 3456 e oito ferramentas que você tem sobre ele. E a maioria deles é justiça. 123456 Então, seis ferramentas uma é placa de arte e um zoom, que é uma espécie fora de um utilitário para usar. Amplie e diminua seus quadros de arte. Isso é tudo sobre a barra de ferramentas. Aqui nós temos. Se você tem alguma pergunta para me fazer, vamos para a próxima lição. 13. Ferramenta de retângulo para criar botões: à distância. E eu vou falar sobre essa ferramenta de retângulo e como podemos usá-la e como existem propriedades diferentes. Deixe-o esperar e como podemos criar um botão bonito olhando com a direção. Ok, então eu vou apenas selecionar nossa imprensa são e nós vamos arrastar até aqui e criar um retângulo como este. E você pode ver no lado direito que temos a largura e a altura. Vamos passar para 75 na altura de 60. Picks está aqui. Então nós ajustamos para 60 e hiato para 75. Agora vocês podem ver aqui que temos o primeiro controle, que é essa opacidade, que é como estão de volta. Vai ser. E eu vou deixá-lo 200%. Então o próximo é o raio do canto. Então, se eu quisesse estar por perto, eu vou dar o pé. Use algum raio de canto como seis por aqui. Você pode ver agora que são 100. Então, se eu d selecionado para conceder Ok, se você quiser diferentes por diferentes razões para cada canto, você vai selecionar este. Ok, então se eu pressionar zero aqui e também zero para este aqui. Ok, então você pode ver agora nós temos dois cantos de carga ou truncado. Ok, então é assim que você pode fazer isso. Então, se eu quiser 32 aqui, eu posso ter algo assim. Ok, então eu vou pressionar este aqui. Então, se você quiser uma forma de pílula, você pode aumentá-la para, tipo, 39 ou algo assim. Soy este 1939 e você pode obter isso foi enviado. Mas temos essas duas propriedades, que é uma delas, Phil, que é a cor. Então eu vou preenchê-lo com uma bela cor azul. Talvez esta loja Buchler aqui assim. Certo, então temos essa fronteira. Acho que vamos removê-lo agora mesmo. E se você olhar para as propriedades da borda, você pode ver aqui é o quanto você quer que a borda em torno dele e preencher a borda será Deve estar em um acidente vascular cerebral. O Bader deve estar lá dentro. Estes estão do lado de fora do nosso, no centro. Ok, S. Então eu vou usar o lado de fora e vamos mudar o tamanho do dedo 10 pixels. Ok, então agora você pode ver aqui nós temos a seleção e a fronteira é fora disso. Ok, então eu vou usar um pouco de borda fora desta cor como esta só para mostrar a você o que podemos fazer com ela. Certo, então temos essa sombra e sangue de fundo. Não vou falar sobre o sangue de fundo. Nós vamos falar sobre isso na próxima lição agora, nós vamos adicionar um pouco de sombra do dedo do pé este botão, e vocês podem ver que temos esta posição e este sangue. Então este é basicamente o raio do sangue. Até onde vai desfocar o sangue do raio. Esta sombra. Ok, então se eu definir para 20 você pode ver agora que a sombra está mais borrada nesta área. Se você olhar de perto, ok, por que a posição é estes dois machados? E por que a posição está fora da sua sombra? Ok, então se eu quiser dedo do pé, torná-lo um pouco mais abaixo da minha forma, eu vou adicionar mais de eu e você pode ver Não, é nesta área. - É. Eu não sei. Ok, então também, eu posso movê-lo horizontalmente na direção. Então, se eu adicionar 50 você pode ver agora ele está no lado direito. Então X é o momento da destruição. Você também pode colocar valores negativos aqui menos 10 e ele vai ser nesta área então você também pode usar menos nove. Se você quiser, ele vai se mover no topo. Então é assim que você vai definir a sua sombra? - Não. Se você quiser a cor fora da sua sombra, você pode clicar nesta área e você pode definir a cor fora da sua sombra. Talvez eu queira alguma sombra na gama de cervejas de cor azul. E essa é a opacidade da sua sombra. Eu queria o Toby com 20% de desconto, 30% transparente. Então você pode ver agora que a sombra é assim. Então é assim que você vai usar as sombras e coisas diferentes com sua forma, retângulo e ah, isso é tudo sobre esse retângulo. Você também pode alinhar o alinhamento deles. Vou falar sobre alinhamento em outra lição. E você também pode alcançá-lo. Mas normalmente não precisamos repetir assim. Mas se você quiser, você pode fazê-lo. Ok, então eu vou voltar. Vamos lá. Vê o teu controlo, Z E estas são todas as propriedades. Se você tem alguma pergunta para me fazer e tentar criar alguém assim, eu vou dar o pé. Ponha um texto sobre ele. Olá, querida. Certo, algo assim. E eu vou pressionar V e a exportá-lo no meio e mudar sua cor de preenchimento biqueira branca. Ok, então vamos mover um pouco para baixo. Ok, então 16 porcos estão no topo e 17 picaretas na parte inferior. Então, se você pode limpar algo assim, eu adoraria vê-lo e tentar o dedo do pé. Mostre-me os botões que você pode criar nele. E eu adoraria revisá-los e ver o que você pode inventar. Ok, Então isso é tudo sobre como você pode criar diferentes tipos de botões arredondados, arredondados , canto quadrado ou Bill salvo, mas ansf usando x d. Vamos passar para a próxima lição. 14. Fundo e desfoque para objeto: Vamos falar sobre objeto. Sangue e fundo borrão. Fato em Adobe X'd. Estes dois