Curso de Sketch para design de UI | Greg Rog | Skillshare

Velocidade de reprodução


1.0x


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

Curso de Sketch para design de UI

teacher avatar Greg Rog, Always learning

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

      3:25

    • 2.

      Arquivos de de curso e de fonte

      2:33

    • 3.

      Navegação por meio do documento

      8:04

    • 4.

      Como fazer seleções

      6:00

    • 5.

      Páginas e pranchetas

      7:02

    • 6.

      Organização de camadas

      4:06

    • 7.

      Operações de boolean em formas

      7:09

    • 8.

      Trabalhando com formas

      9:54

    • 9.

      Ferramentas de vetores

      10:20

    • 10.

      Como transformar formas

      8:33

    • 11.

      Transformações avançadas

      7:27

    • 12.

      Alagem de elementos

      11:30

    • 13.

      Como Resizing as opções no esboço

      9:58

    • 14.

      Como usar máscaras

      9:21

    • 15.

      Como exportar os ativos

      11:29

    • 16.

      Operações de Mathmatical

      5:59

    • 17.

      Grade de pixel

      5:07

    • 18.

      Trabalhando com os símbolos

      15:23

    • 19.

      Esboçar bibliotecas

      10:50

    • 20.

      Trabalho em escala 1x

      9:11

    • 21.

      Layout de diagrama

      7:51

    • 22.

      Desças e de modelos e de modelos

      7:03

    • 23.

      Como escolher as cores

      14:16

    • 24.

      Cores e símbolos

      7:56

    • 25.

      Ferramentas de tipografia

      7:30

    • 26.

      Como criar uma rampa de tipos

      8:19

    • 27.

      Como criar o top

      11:31

    • 28.

      Adicione as de casa

      10:30

    • 29.

      Como organizar e a organização e a nominar de ativos

      12:05

    • 30.

      Diferentes de telas de casa

      10:34

    • 31.

      Variantes de botões

      7:25

    • 32.

      Pré-visualização no iOS

      2:59

    • 33.

      Tela de login

      12:05

    • 34.

      Tela de casa

      9:31

    • 35.

      Tela principal

      9:17

    • 36.

      Tela de configurações

      12:24

    • 37.

      Tela de dispositivos

      14:25

    • 38.

      Tela de ações

      10:48

    • 39.

      Tela de detalhes de ação

      5:26

    • 40.

      Menu de baixo

      7:48

    • 41.

      Tela de alarme

      11:48

    • 42.

      Pontos e a tela e a de de Senses

      11:27

    • 43.

      Tela de lâmpada

      14:14

    • 44.

      Configurações de temperatura

      6:13

    • 45.

      Telas de câmeras

      10:26

    • 46.

      Como fazer as

      12:50

    • 47.

      Introdução à marela

      7:58

    • 48.

      Como definir os hotspots e transições

      13:32

    • 49.

      Protótipo de leitura

      5:39

    • 50.

      Como usar o esboço

      6:03

    • 51.

      Outro

      0:49

  • --
  • 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.907

Estudantes

1

Projetos

Sobre este curso

Esboço é uma aplicação que já ganhou os os designers de UI e de UX ao redor no mundo, mesmo de que qualquer pessoa pode aprender como usá-lo. de todas as vantagens, de todos os tipos para a listagem aqui, o Sketch em e de de a de de e de de que a e e a que você em e a maioria de que a lista de e a e a que a e a e a que se de um de que a listar e a que ela tem uma e a e a de que a Se você for um dos de sorte de um Mac, é um are para não usar o potencial do esboço. Vou de que a forma de fazer a criação de interfaces nunca foi tão rápido e a maioria de todos — agradável!

Destaques do curso:

  • Projeto de A-Z do design de aplicativos
  • Dicas e truques, faça a maioria das ferramentas de esboço
  • Ferramentas e símbolos e em vetores
  • Cores, de as cores, de letras e de a tipografia
  • BônUS! Como criar um protótipo de trabalho e interativo

O curso foi projetado para mostrar a você a a funcionalidade completa do esboço, para ensinar como usar seu de melhor uso do seu potencial. Alguns dos tópicos são mais apresentados no curso de algumas aulas teóricas, por exemplo, de exportação de gráficos. Outros, como a preparação de recursos para um novo projeto são mais explicados na prática. Por que a por isso em as duas partes. O primeiro é um compêndio muito de centenas de técnicas importantes, de atalhos, de de que a de e de de em que Como fazer o vasto o conhecimento de condensado no vídeo, foi gravado com a narração rápida, se você in não a que a de e a maioria de o de de que a A outra outra a de curso é totalmente praticada. Nós nos nosso nos nossos as técnicas de aprenda para criar algumas em sobre as técnicas de o de aprender de uma casa inteligente. a de um estudo do curso a que a sua e de de que a de e que nós a sua de prática em seu trabalho de casa em seus projetos de em de a de que o a e a

A segunda a de o curso é focado em criar um a a a segunda parte do curso do de celular Primeiro Ele vai servir como um de de teste para combinações de técnicas que você deve aprender e usar em projetos reais. Primeiro, de a de Grid e de de de artboard, e vamos para criar os ícones e símbolos e a nossa para criar quadros de aplicativos de a Testando todas as funções do esboço de que você aprendeu na Sketch vai mostrar seu uso prático e ensinar a você de seus hábitos de design.

Conheça seu professor

Teacher Profile Image

Greg Rog

Always learning

Professor

Habilidades relacionadas

Design Design de UI/UX Prototipagem
Level: Intermediate

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: Ei, tenho o prazer de convidá-lo para um curso de oito horas completo. Conhecimento prático e Secrets Off Interface Design Sketch já ganhou o coração você, eu e designers de UX, mesmo que qualquer um possa aprender. Realmente. O up foi saudado por uma coisa, Onley extremamente eficiente você um design gráfico fora do curso. Ele pode ser usado para diferentes tarefas. Mas então você percebe que o número fora de projetos de interface criados no esboço no ano passado superou mesmo cheio de lojas. Graças ao seu foco singular e design do site, Sketch ganhou uma vantagem distinta sobre as aplicações menos deficientes sobrecarregadas com várias funções. Sanchez Photo Shop e ilustrador, Assim como um cirurgião que está no seu melhor usando um único par preciso em vez de uma faca de snipe doce com uma variedade confusa de ferramentas, operações mais rápidas, arquivos menores, melhor eficiência dedicada seus sinais vitais e centenas de plugins criados pela comunidade útil vai fazer você definitivamente cair para esboço. O curso foi projetado para mostrar a funcionalidade fora do esboço para ensiná-lo a fazer melhor uso de seu potencial. Vamos começar com um conjunto de pequenos exemplos sobre como encontrar o seu caminho em torno da UPS, interface e ferramentas. E então passamos para um projeto prático onde as ferramentas serão usadas criativamente. Dividi o curso em duas partes. O 1º 1 é um compêndio muito comprimido de centenas de técnicas importantes, íngremes de cartão curto chave, intrigas e outras coisas. O outro irá levá-lo através de um projeto de design muitas vezes até interface fora de uma casa inteligente a partir do zero. Você vai experimentar todo o potencial fora do esboço e aprender a trabalhar com símbolos reutilizáveis . Como usar captura para projetar layouts, que podem ser facilmente dimensionados para vários dispositivos e resoluções. Como criativamente ferramentas de ator USV e projetar seus próprios ícones, entre outras coisas, também irá discutir a tipografia, ícones e extradições para ajudá-lo em seu trabalho. Até o final do curso, vai telas de maçã para se maravilhar, a fim de criar um protótipo interativo. Adicionando animações e transições nos permite apresentar nossa composição como espetacular, mas também clara . Este curso é essencialmente uma nova abordagem para projetar interfaces de usuário mãe. Mal consigo conter a minha excitação pela direção dita por tudo o que preparei para você. Existem dezenas de técnicas e materiais adicionais adicionados ao curso. E confie em mim, é divertido fazer tudo isso até perceberes que é só o começo. Uma aventura maravilhosa no mundo fora Mãe sabia que eu e UX ferramentas de design. Em seguida, você será cativado pela funcionalidade fora das ferramentas para criar prototipagem de micro interações e, finalmente, exportar seu design para o desenvolvimento. Quão rápido pode chegar ao outro lado do espelho depende inteiramente de você. Você vai aceitar o desafio ansioso para ver na primeira lição? 2. Arquivos de de curso e de fonte: Ei aí! E bem-vindos à próxima lição. Estou super animado que você decidiu fazer meu curso de camisa de habilidade. Obrigado mais uma vez por isso. E nesta lição, vou falar sobre o projeto do curso. Portanto, é muito importante que você tome medidas para recriar o que criamos no curso. É muito útil que você faça seus próprios projetos no esboço e envie o projeto. Assim, o projeto e a atribuição do curso está fazendo um mobile up. Nós vamos estar focando e mobile up que eu criei aqui e você pode ver o estudo de caso em ser mãos é muito arrumado com, ah, alguns recursos legais e também animações que você pode aprender com os outros cursos que eu ter em habilidades. Claro, mas basicamente vamos desenhar um belo lugar. E eu quero que você crie isso sozinho também e envie isso como o projeto do curso para que você possa seguir as lições e você possa fazer exatamente o que eu faço. Teoh cumpra esta tarefa. Mas também eu encorajo você a dar alguns outros passos e talvez ajustá-lo um pouco. Talvez você, algumas outras cores, talvez use algumas fotos diferentes. Ou talvez você decida criar a versão completamente diferente fora do up. Não precisa ser a casa inteligente que eu criei, mas é muito importante que você treine e envie o projeto. Agora. Outra coisa que eu quero mencionar aqui são os arquivos fonte. Assim, os arquivos fonte deste curso estão nos comentários desta lição. Se você der uma olhada na linha do tempo da lição, você pode ver um pequeno avatar aqui. Essa é a minha outra mão, basicamente um comentário com o link para soltar livros que você pode usar para baixar todos fora do dispositivo que eu concordei com este curso agora. Nem todas as lições têm seus arquivos iniciais e arquivos acabados, e também nem todos os ativos que eu uso metade arquivos nos arquivos fonte, mas eu encorajo você a usar os links que eu forneci. Alguns recursos são apenas sob algumas licenças, então eu não poderia fechá-los aqui. E para alguns exemplos, eu sinto que é melhor que você comece do zero e crie esses recursos junto com o curso. Então desejo-lhe tudo de bom e ah boa sorte para criar este projeto de curso. Como eu disse, esta tarefa é muito importante. Portanto, certifique-se de criar sua própria versão do up e você submeteu na discussão para discurso. Muito obrigado, então. Vejo você na próxima lição. 3. Navegação por meio do documento: esta lição é tudo sobre navegar em seus documentos de programação. Então, cada vez que você lam esboço, você vê esta tela de boas-vindas com algum uso, e também você pode acessar os documentos recentes, bem como os modelos que são criados para você usar. Por exemplo, para IOS você eu projeto ou design de material. Você também pode criar seus próprios modelos. Você pode desativar a tela de boas-vindas, mas eu acho que é muito útil, então deixamos por enquanto, e criamos nosso primeiro documento com esquema de design de material. Então, quando você trabalha a partir de documento pronto, você pode ver que você tem todos os guias de estilo prontos, acasalar em camadas de esboço grupos e também símbolos, e você pode facilmente reutilizá-los. Então esta é uma maneira muito eficiente. Se você estiver criando algum material, crie os sites ou aplicativos para o Google Play. Se você tiver alguns outros arquivos com pontos catch, você pode abri-los clicando duas vezes. Mas o que você recebe isso em vez de abrir os incêndios na mesma janela que você começa em seguir loja ou ilustrador. Você tem outra janela fora do esboço, e é muito útil porque agora você pode obter os componentes de um arquivo e, por exemplo, apenas arrastá-los para outro arquivo. Ou você pode vir e ver. Venha na TV apenas co p e colá-los também. Outra janela fora do curso. Você sempre pode trabalhar com os tops também. Você tem tops que você pode aqui, e você pode raramente reorganizar os tops. Você pode fechar os topos daqui, e você pode, ah, apenas pegar o topo de uma janela e, em seguida, apenas fazê-lo preso a outra janela para que você tenha que tops em uma janela. Certo, vamos fechar essa janela que não precisamos. Podemos pressionar o comando W e então vamos fazer essa janela maior. Nós não queremos entrar em tela cheia, por isso apresentamos saúde segurar no teclado e mudanças de tela cheia para Plus Eu venho para que possamos inserir este molde que vai assustar nossa janela. Então, agora a janela de esboço é maximizada, e você pode navegar por todas as páginas do nosso aplicativo móvel e quadros de arte com alguns atalhos de teclado úteis. Então, se você quiser ampliar algum objeto ou alguma camada ou o motor de popa, basta clicar no nome do artigo e pressionar o primeiro atalho. É um comentário para quando você pressiona o comando para você. Obtenha a visualização em tela cheia do que você selecionou recentemente. O segundo atalho é um comentário e comentário. Um permite que você veja tudo o que você tem em seu projeto, por isso assusta até agora até 14% para lidar com entrevista que você tem tudo o que você tem no projeto. Em seguida, você pode selecionar algum outro item, e você pode pressionar o comando para ampliar. É outra vez. E como você vê isso não tem que ser no quadro de arte. Você pode selecionar qualquer item, e ele amplia tanto quanto possível. Assim, o próximo atalho é livre de comandos e comum. Congele o atalho de atalho usado para trazer o objeto selecionado, por exemplo, este para o centro da porta de exibição. Então a razão pela qual fazemos isso ISS porque quando selecionamos algum outro item e apenas pressionamos vindo, além de mineiros de comando, ele não funciona porque não está no centro, então você tem que pressionar o comando livre, e então você pode usar a família lá atalhos fora plantas comuns e milhas comuns porque eles zoom exatamente para o centro fora da vista para que o fluxo de trabalho mais rápido é selecionar um elemento, e, em seguida, pressione o comando para ele amplia e você pode usar os sinais de mais e menos aqui no em cima. Ou você pode usar mais comum e comentários comuns menos. Em seguida, você pode pressionar zero comum para ampliar para 100%. E também você pode dobrar rápido neste ícone de zoom para trazer para o 100% de você. Então, essas são duas maneiras de conseguir isso. Ao anoitecer. Ok, mais uma coisa que eu gosto de mostrar a vocês é quando você seleciona um item e você está certo nível de zoom . Você sempre pode pressionar e segurar a barra de espaço, o que permitirá que você altere a exibição. Então você apresenta segurar barra de espaço do que você pressionar o botão esquerdo do mouse e você simplesmente droga e você pode ver alguns outros objetos no outro barco. Então esta é uma ferramenta carregada por mola. Então isso significa que quando você pressiona, você tem que segurá-la. Você tem que segurar a rebarba espacial, e quando você liberá-la, você não pode mais usar essa ferramenta. Então você volta para a ferramenta que você tem usado e s O que você tem essas técnicas muito comuns para navegar. Para esboço, você tem comando livre, além de menos comum. Vamos lá, um comando para e venha em zero e tudo o que você tem neste dinheiro vista também. Ok. E há mais uma coisa que gosto de mostrar nesta lição. E isso é chamado de exibição de apresentação. Não é o modo de tela cheia, mas esconde todo o barulho do lado esquerdo e direito, bem como a barra de ferramentas, e você acessá-lo pressionando o ponto de comando no teclado. Então agora você tem uma parte que sente tela inteira, e você tem você pode trabalhar no esboço. Se você conhece os atalhos de teclado, você pode usar todos os atalhos para acessar as ferramentas e também todos os atalhos que discutimos nesta lição. Você poderia fazer uma apresentação ou, por exemplo, se você tem uma pequena tela imobiliária, você pode trabalhar desta forma no esboço. Então você pressiona o comandante para voltar ao molde de esboço normal com todos os painéis, e basicamente é isso. Agora é pressione comando e para criar uma nova instância fora do esboço e o que eu gosto de mostrar a vocês e esta é a parte que eu gravei mais tarde. Depois de gravar este curso após a nova versão do flagelo foi lançado, eu gostaria de mostrar-lhe as diferenças em termos fora da interface do usuário do esboço porque ele mudou ligeiramente porque o cronograma atualizar sua interface no cronograma. Versão 52 Eu estava gravando no anterior. Mas honestamente, não há necessidade de re gravar quase nada, e você vai encontrar as lições atualizadas em todo o curso. Mas eu quero que você dê uma olhada nos novos recursos fora do esboço e a nova interface e como ele é organizado. Então, basicamente, essas são apenas pequenas mudanças com todo o estilo e bordas, e tudo é um pouco melhor e um pouco melhor olhando do que na versão que você pode ver no curso. Mas o que é realmente legal é que agora você pode ir para as preferências do sistema e alterar o modo em seu sistema para que você possa aplicar aparência clara ou escura para dispersar. Se você mudar da luz para a escuridão, você imediatamente muda para a versão escura fora do esboço e deixe-me mostrar-lhe como você pode alternar entre luz e escuro. Esta é uma opção do sistema para que você possa facilmente selecionar o que se adequa a você. Por outro lado, você tem um layout diferente um pouco diferente fora dos painéis e ferramentas. Basicamente, eles melhoraram a clareza dos ícones e a clareza fora da interface geral. Mas para ser honesto, você encontrará quase todas as opções no mesmo lugar. Então, se você está trabalhando com o esboço de desvio U. S com este curso de vez em quando, você vai saber essas pequenas diferenças nos ícones que você tem no painel e talvez alguns cantos arredondados e provavelmente colocando fora o dados aqui. Mas você vai descobrir rapidamente, e não deve haver grandes diferenças e como as coisas se comportam. E isso explicará no curso? Se há apenas me avise e eu vou corrigi-lo, eu vou continuar atualizando este curso com cada nova atualização fora esboço que traz algo fresco e algo novo. Portanto, tenha a certeza de que você conhece todas as ferramentas e técnicas modernas que você pode aplicar ao esboço. E continuarei fazendo isso até perceber que não faz mais sentido dessa forma , e então começo de novo e gravamos esse curso do zero. Então acho que está em boas mãos. Vejo na próxima lição 4. Como fazer seleções: Olá e bem-vindo a esta próxima lição em que eu vou mostrar-lhe como selecionar as coisas no esboço e isso é conhecimento bastante básico. Mas se você já trabalhou especialmente com o pai loja ou outro projeto de lei um straight antes, você pode encontrá-lo bastante surpreendente porque ele não funciona da mesma maneira. Então, basicamente, e isso será para a loja ou ilustrador. Você pressiona o wiki para entrar neste dedo de seleção, e se você apresentar Vicky no esboço, você basicamente vai para um dedo vetorial. Então, são ferramentas diferentes. Então, pressionamos escape e mesmo se você estiver desenhando retângulos ou sobre, você simplesmente pressiona escape e então você está neste dedo eleitoral para que você possa saber passar o mouse sobre a camada. Como você pode ver, ele é destacado tanto no painel de camadas quanto na tela, e você pode clicar no grupo. Você pode expandir o grupo, você pode ir para dentro, e como você vê todas as camadas estão sendo ah, destacadas. E se você quiser selecionar qualquer camada, você pode clicar, e se você clicar quer selecionar o grupo primeiro, Então, para entrar no grupo, você tem que clicar duas vezes, então você clicar duas vezes em um grupo para entrar e lá vai você. Há outro grupo lá dentro. Então agora este segundo grupo foi selecionado e ainda assim. Filho, eu tenho que DoubleClick DoubleClick dentro desses grupos e agora estou neste campo. Então eu selecionei o campo, então eu tive que clicar seis ou sete vezes para selecionar esta camada. E você pode basicamente fazer é você pode alterar o comportamento selecionando este rápido através ao selecionar no grupo para que você não tem que dobrar rápido. Basta clicar uma vez para entrar neste grupo. Então, quando eu fiz isso no meu grupo principal, eu cliquei uma vez. Agora o segundo grupo tem que ter essa fruta de clique ao selecionar, habilitado também e o primeiro grupo. Na verdade, se eu entrar no grupo para o grupo Sun também, eu preciso clicar nele também. E agora, se eu voltar para o grupo Golden Gate Bridge, eu posso clicar em Lee uma vez para selecionar o sol. OK, então você pode ter isso habilitado para todos os grupos por padrão. É muito fácil. Você tem que ir para preferências, então pressione comentário vírgula. E agora, na seção de camada, basta clicar em ativar frutas rápidas para novos grupos. E cada vez que você cria um novo grupo, você tem esse comportamento para que você não precise clicar duas vezes. Você apenas riacho uma vez e para entrar nesta camada há uma segunda maneira, embora você vai ter que habilitar esta opção em preferências para entrar em qualquer grupo e selecionar qualquer camada com um clique. O que você faz é pressionar e segurar o comando enquanto faz isso. E se eu pressionar e segurar o comando como você vê todas as camadas dentro, esses grupos são realçados, e quando eu clicar, esta camada Castell é selecionada. Então é basicamente assim que eu faço. I comando Clique para selecionar qualquer camada, mas você também pode passar o mouse sobre algumas camadas e, em seguida, clique com o botão direito ou contra, clique e, em seguida, camada de pico, e você tem o mínimo fora de todas as camadas que se sentam logo abaixo do mouse, e você pode selecionar qualquer camada como então sim, então é assim que você faz. Basta pressionar comando e selecionar qualquer lugar, mesmo que esteja aninhado dentro de um grupo. Então, há também outra maneira, Teoh selecionar uma camada e editá-la. Então, se você tem uma camada vetorial, você vem e clica na camada para selecioná-la, e então você pode fazer algumas operações simples. Uma escala tão grande. Você também pode pressionar comentário e sobre um dos cantos para girar. Mas se você quiser entrar no modo de edição, basta pressionar Return. Se você pressionar Return no teclado, como você vê, agora você pode entrar e acessar todos os pontos vetoriais e alterar um ponto vetorial em conformidade com o que você deseja alcançar. Então este é um modo de edição Eddie, e você vai para este modo tudo pressionando Return. Agora eu pressiono escape, e se você pressionar escape algumas vezes, você volta para você. Volte sempre para esta ferramenta de seleção para que você possa selecionar algumas outras camadas no esboço. Então vamos fazer um resumo rápido. Você pode riacho no grupo para acessar as camadas. Você pode clicar duas vezes sobre os grupos, e você clicar duas vezes se houver grupo aninhado, e você também pode ativar este clique através da opção nos grupos, ou você pode simplesmente coman clique em qualquer camada para selecioná-lo. E há também mais uma técnica que eu gosto de mostrar a vocês que é selecionar várias camadas ao mesmo tempo. Vamos mudar para esta próxima imagem, eo que eu vou fazer é que eu vou selecionar esta primeira camada com comando e agora eu pressionar comando e também botão shift para selecionar mais de uma camada. E se eu comando shift, clique na segunda camada. Como você pode ver, ambos os incêndios estão selecionados agora, então eu posso selecionar as camadas com deslocamento no painel camadas, bem como você vê todas as camadas selecionadas entre as camadas que eu cliquei e eu posso co mês clique nas camadas em o painel também para selecionar algumas camadas múltiplas. Além disso, havia outra técnica que permite que você apenas riacho e droga para selecionar qualquer grupo. Como você vê, o grupo é selecionado. Mas se você pressionar comando enquanto faz isso, você pode selecionar qualquer camada que esteja nessa seleção. Então você pode simplesmente droga para selecionar o grupo ou você pode comandar droga para selecionar cada camada. Deixe-me copiar esta moto mentirosos por enquanto. Então vamos, C, vamos na TV e eu vou movê-lo para lá e vamos eleger essas camadas arrastando. E como você vê todas as camadas dentro da moto são selecionados quando ele está fora fora de qualquer grupo, Dessa forma, eu posso selecionar todas as camadas. E se desejar, Teoh selecione todas as camadas. Exceto, por exemplo, este você pode clicar com o botão direito sobre esta camada e vendedor e bloqueá-lo para que você também possa mudar de peito comando l para olhar a camada e que enquanto drogging você não vai selecionar este campo 30 mais tarde. Então isso é basicamente na medida em que selecionar jogadores e grupo em esboços diz respeito. Então, obrigado pela sua atenção e vejo você na próxima lição. 5. Páginas e pranchetas: Ok, agora vamos nos concentrar na estrutura fora de seus documentos de esboço, então a principal coisa na estrutura é a página, para que você possa ter muitas páginas em seu documento e em cada página. Você pode ter, por exemplo, uma seção do seu aplicativo, ou você pode ter uma versão móvel. E as páginas também são boas para a velocidade porque você parabéns a muitas placas de arte em páginas, e você pode otimizar a velocidade fora esboço dessa forma. Então, como você pode ver, você pode recolher ou você pode mostrar as páginas. Pelo menos você pode clicar neste pequeno ícone ao lado do nome da página para alternar as páginas também. E as páginas contêm quadros de peças. Você pode ver todos os outros barcos pressionando o comando um. Você pode mudar a segunda página que temos aqui. Estes são os símbolos da página, e lá temos um símbolo também. Fale sobre os símbolos da próxima vez. Agora que mudar de volta para este duPage e você pode ter muitas placas de arte em uma página. Então agora eu estou rangendo através dos quadros de arte e dentro dos artigos temos os grupos e dentro dos grupos temos outros grupos ou camadas então o que acontece se você selecionar o grupo ou uma camada e ele tentar movê-lo para o lado do quadro de arte como você vê o grupo Clips Audible para que você não possa mais ver o conteúdo que está fora do Archibald. Mas se você pegar o grupo e colocá-lo fora da arte, mas como você vê agora, não está no tronco do nosso barco. É só sentar sozinho nessa cadela para que você possa transformá-la em um parafuso de arte . Se você selecionar qualquer grupo que está na página, você pode pressionar A e A é ferramenta inaudível. E se você pressionar A, você pode ir para o esboço do lado direito e você pode basicamente criar o Archibald em torno seleção. Então você tem esta primeira opção aqui em torno da seleção, e enquanto o seu grupo de marcas está selecionado, você pode simplesmente clicar nisso. E aí você tem uma nova arte. Mas esse é o tamanho desse grupo, então você pode voltar para este artigo. Ele também permite pressionar um novamente, e você pode acessar diferentes tamanhos e diferentes predefinições. Então eu tenho dispositivos IOS aqui, um design de material de web design responsivo bem e se eu acessar, eu era dispositivos lá você tem iPhone 7. Você tem iPods e outras coisas para que possamos criar uma placa de arte para iPhone 7. Assim, tudo o que você pode simplesmente me deixar voltar a esta uma ferramenta, e você pode simplesmente clicar nos dispositivos do Iowa para criar toda a arte. Mas a partir desta seção eso você tem agora todos os iPods, você tem todos os iPhones, e você pode liderar as nossas placas pressionando backspace no teclado. Então vamos voltar a isto. Encontrei um quadro de arte. E se você quiser duplicar a placa de arte agora você tem reboque selecionar este papelão e você simplesmente clicar no nome das placas de arte e comando, o para duplicar. E agora temos uma cópia deste quadro de arte, e este está realmente vazio. Podemos mudar os Morgans. Podemos comandar o novamente para fazer outra cópia, mas também você pode duplicar placas de cartão existentes com conteúdo para que você possa duplicar todo o conteúdo dentro do quadro de arte. Basta selecionar a arte a bordo da mercadoria de imprensa e lá está. Há uma duplicata dessa arte muito dita, mas com todo o conteúdo, agora você pode mudar o tamanho do quadro de arte. Você pode fazer algumas alterações. Por exemplo, se você quiser alterar e comparar duas exibições diferentes de sua página, você pode fazer a cópia, e você pode trabalhar nessa cópia facilmente se quiser se livrar do artigo. Mas você quer manter o conteúdo, você pressionar Shift comando G e agora na arte a bordo Scone e você tem apenas o conteúdo dos grupos e as camadas. Você pode selecionar o grupo e, em seguida, você pode voltar para este artigo, ferramentas para cima. Basta pressionar um e criar a arte. Mas, novamente, selecionando em torno da opção de seleção. E aí você tem, você tem um novo quadro de arte, e também podemos fazer isso quando você tem algum conteúdo dentro do quadro de arte. Por exemplo, vamos criar um retângulo simples aqui, e você quer fazer marcha. Os suspiros audíveis para este conteúdo. Basta clicar na opção de redimensionar para caber, e primeiro você tem que selecionar a arte sobre. Em seguida, você clica em recita dois pés e re tamanhos dedo do pé Seja qual for o conteúdo que está dentro. Ok, vamos explorar algumas outras opções que são como o quadro de arte, e o que você pode fazer é você pode alterar a propriedade de cor de fundo, então isso significa que seu quadro de arte pode ter avermelhado, por exemplo, cor de fundo, e você também pode incluir essa cor na exportação. Então isso significa que se você quiser salvar esta arte a bordo como um ativo gráfico, você pode selecioná-lo e você pode apenas fazer exportável selecionar o sinal de mais, e você não pode exportar isso como um gráfico. E se você d selecionar, incluindo exportação, ele irá exportar com fundo transparente. Então, vamos tentar exportar esta camada, e eu vou exportar iPhone sete cópia agora. E como você vê, você pode salvá-lo como um arquivo PNG, e agora ele conterá esse fundo vermelho. Isso é pressione escape para sair desta função, e eu vou mostrar-lhe como selecionar vários quadros de arte. Então aperte Shift e Shift. Clique em cada uma das camadas fora dos nomes de Alborz, e aí você tem. Você pode selecioná-los. Você pode definir várias cores de fundo e também pode exportar várias imagens também. Neste momento, você pode exportar barcos de arte gratuitos para que imagens livres imagens PNG livres serão salvas, e também há recurso legal no menu de arquivos, e isso é exportar nossas placas para pdf, e você pode realmente exportar todos das placas de arte para um arquivo PDF e a ordem fora. As placas de arte podem ser definidas nas propriedades, bem como, para que você possa acessar as propriedades pressionando coma de comando. E aí está. Você pode acessar a banheira geral, em seguida, ir para a nossa exportação de bordo e selecionar como as palavras são aparecerão no fogo de mídia para que você tenha da esquerda para a direita, direita para a esquerda do fundo. Você pode selecionar diferentes opções, e você também pode reorganizar as placas de arte. Você pode fazer o seu próprio pedido apenas rangendo no nosso tabuleiro, mesmo e drogando para o lugar que você deseja que ele apareça. Então eu mostrei a vocês como exportar as placas de arte para ativos PNG para lutas BNG, e você pode realmente fazê-lo simplesmente rangendo nos outros barcos. Nome. Então isso é como, por exemplo, isso são comprados e você pode tornar este nosso barco exportável. Você pode mudar clique em muitos são barcos para exportá-los como livre, diferentes arquivos PNG. Mas se você quiser mostrar a alguém todos os quadros de arte em uma imagem, você pode fazê-lo simplesmente criando outro quadro de arte em cima deles. Então eu aperto um e eu tento colocar todo esse barco de arte em um quadro de coração extra que vai em cima. E como você vê, ele não os agrupa, mas você pode e ir para as opções de exportação. E lá você tem uma imagem com para artigos. Então isso era necessidade. Foi um belo truque, e vejo vocês na próxima lição. 6. Organização de camadas: no lado esquerdo da interface de esboço. Existe uma camada espinhal na qual você pode organizar as camadas. Você pode filtrar as camadas, apenas digitou o nome fora da camada ou grupo, e lá você tem os resultados. Você também pode acessar os grupos. Você pode acessar as placas de arte, e também temos as camadas que você pode selecionar grupo ou selecionar várias camadas com a tecla Shift. E se você quiser criar um grupo fora, selecione as camadas, você pressiona o comando G. Então, quando você o agrupa, você pode também agrupá-lo. Você pode pressionar a mudança de comando G dedo do pé no grupo das camadas, e se você clicar no grupo blogado, eu posso mudar o Comando Jichuan Group. Uma vez que o comandante de turno no grupo todos os grupos dentro e ela está vindo G dedo no grupo ainda mais, e agora você tem todas as camadas que são simplesmente colocadas no topo desta arma. Elementos não são quadros sem nenhum grupo, então conosco você pode ocultar camadas com este pequeno ícone ao lado do nome, ou você pode mudar a idade do comando para ocultá-los, ou você pode deslocar o comando para bloquear as camadas para que você não possa mais editar nem selecione. Esta camada parecia. E há também um pequeno triângulo ao lado do grupo, bem como ao lado deste do pseudo grupo. Este é um grupo de itens que são, na verdade, camadas vetoriais para que você possa selecionar camadas vetoriais, e você pode colocar essas camadas em outra camada para criar uma forma combinada. Esta é uma forma vetorial combinada, e este não é, ah, um grupo apropriado. Este é um grupo de vetores, que você pode, por exemplo, usar Teoh. Combine essas formas com operações booleanas. Você pode clicar neste pequeno ícone e você pode fazer operações booleanas como sindicatos subtrair. Você pode cruzar a diferença, e eu mostro-lhe as opressões nas próximas lições. Mas basicamente nas camadas. É assim que você pode criar um conjunto de vetores moldados fora com a gente que você tem aqui. Este pequeno ícone é um símbolo, ícone e símbolo. É ótimo conceito e esboço que você pode notar em seus símbolos diretamente neste quadro de arte, você tem que clicar duas vezes no símbolo, e então você vai para esta página de símbolos especiais e todos os seus símbolos pousam no símbolo. Fale especial sobre isso mais tarde, Mas basicamente, neste espaço de símbolo, você pode editar o símbolo. E quando você retornar à página Elementos da Web, você terá as alterações feitas neste símbolo . Então lembre-se disso. Eu venho no painel de camadas A funcionalidade seguinte está a alterar os nomes das camadas. Você pode clicar duas vezes sobre o nome para alterá-lo, mas você também pode pressionar o comando são, que é um bom trabalho para Deus em você também pode clicar com o botão direito e selecionar renomear a partir deste menu, mas é sempre melhor usar. O comando está agora. Você está no modo de edição. Você pode alterar o nome fora desta camada, e ele também irá pressionar tab para ir para a próxima camada. E você ainda está nesta edição mais para que você possa editar os nomes de várias camadas ao mesmo tempo. Além disso, você pode oprimir o stub shift para subir o painel de camadas para que você possa descer com o topo. Você pode subir com o top do turno. Também camadas. Hierarquia é bastante óbvia. Se você tem um mentiroso que está por cima. Ele cobre tudo o que está abaixo, e se você quiser alterar a posição das camadas no painel de camadas, você pressionou o comando de opção e, em seguida, você pressiona a seta no teclado para compactar o comando de opção para cima para movê-lo em o comando de resposta tardia ou opção e seta para baixo para mover a sua para baixo. Você também pode pressionar o controle. Por que manter este comentário e opção para movê-lo para o topo ou para a parte inferior do painel de camadas. Então, isso é o mesmo que usar os ícones dos dedos para trás e para frente que você pode usar para mover a camada no painel de camadas. E também você pode pressionar e segurar a opção enquanto faz isso para mover seus dois frente ou para movê-lo para trás. Então, para o topo, fora do painel de camadas ou para o fundo fora da camada espinhal. E basicamente esta camada pobre está agora no final da lista, então ninguém concebeu. Então isso é tudo o que eu disse ao Teoh sobre o painel Camadas no esboço. Vejo vocês na próxima lição 7. Operações de boolean em formas: Vamos agora falar sobre operações lógicas ou, em outras palavras, em outras palavras, booleanas no esboço. Então você precisa de duas ou mais formas que são formas vetoriais no esboço e, em seguida, você pode usar união , subtrair, interseção ou diferença uma operações lógicas. Você tem que selecionar todas as camadas. Então eu seleciono tanto sobre 5/5 cópia eo primeiro 1 é união. Então, como você pode ver, eu tenho agora uma forma combinada e todas essas operações são reversíveis. Então, posso sempre voltar atrás. Eu posso clicar neste pequeno retângulo e eu posso mudar esta operação booleana. E uma coisa muito importante a notar é que esta forma é mesclada de modo que a camada superior para que este mais de cinco cópias herde todos os estilos da camada na parte inferior. Alguns eso a mais de cinco presentes curso ou a cor de combustível frio para a camada no topo. Enquanto você usou esta união uma operação lógica. Próxima 1.000.000.000 operação está subtraindo para que você possa subtrair e mesclar duas camadas em uma, e agora você tem uma forma combinada para que a camada que está no topo para que este geral poderia ser livre, corta tudo fora de as camadas inferiores. Assim cópia geral para, neste caso, prevalece é sempre a camada superior. Então você tem que lembrar que isso não é um mascote. Você pode ver que há um derrame aqui também. Então esta é uma operação booleana. E então geralmente eu mantenho as maiores formas na parte inferior para que eu possa cortar com as formas que estão no topo. Então, por favor, tenha em mente que tanto em subtrair como em camadas de união. A ordem é muito importante porque na união tivemos esta forma superior que herda todas as propriedades, cores e traços dessa forma abaixo. Agora temos o Intersect. E se selecionarmos ambas as formas, usaremos essa opção de interseção e deixaremos palavras comuns nessas duas camadas. E, na verdade, diferença é bem o oposto, porque tudo o que está em comum para essas camadas será cortado. Então, aí está. União subtrair, cruzar e a diferença Operações lógicas. E lembre-se que você sempre pode voltar e você pode realmente reverter o que você fez com operações de ouro. E agora eu vou mostrar a vocês como criar ícones simples usando essas operações de barras e vamos usar formas simples, bem como um dedo de operações lógicas. Criar esboços de ícones. Então primeiro isso é criar o ícone da nuvem e vamos usar a ferramenta oval. Então eu pressiono Oh, isso com o turno. Eu mantenho as proporções fora de cima e lá eu tenho esta primeira forma, então a segunda forma será a segunda mais. Eu apresento mantém deslocamento para manter proporções de modo que é círculo perfeito novamente, e lá temos esta forma superior. Agora vamos criar o último, e eu pressiono o deslocamento geral para proporções e também ao criar formas no esboço. Você pode pressionar e segurar a barra de espaço sem soltar a parte inferior mais esquerda e mover a forma ao redor para que eu possa mudar a posição e eu ainda posso desenhar a forma. Agora você pode ver a linha vermelha que sugere que ela está perfeitamente alinhada com as outras formas para que eu possa terminar esta forma de nuvem com retângulo então eu pressionar estão no teclado e vamos desenhar um retângulo aqui para que tenhamos toda a forma fora da nuvem. Então isso é apenas operações básicas, desenho básico de forma. Você também pode pressionar a opção enquanto desenha uma forma, também. Dirigi por dentro e agora seleciono todas as formas e posso mudar a borda. Posso mudar o campo. Como você pode ver, eu posso mudar propriedades antigas fora das formas completamente. Se eu selecionar camadas agora, podemos usar a operação de barras para mesclar todas essas formas. Então vamos selecionar todas as formas e vamos usar operações de barras de união. E como você pode ver, agora combinamos forma no painel de mentirosos e podemos torná-lo maior para que o zoom com mais comum e vamos para o modo de edição para vetores para refinar essa forma. Então eu pressiono retorno no teclado e como você pode ver, eu posso agora uma droga em torno de alguns pontos vetoriais. Posso ajustar as alças para que o meu ícone fique perfeito. Preciso ajustar esse cara e movê-lo para a esquerda. Como você pode ver, eu tenho esses caras inteligentes também para os pontos vetoriais para que possamos basicamente brincar. Você pode selecionar os pontos vetoriais e movê-los com a boca. Você também pode clicar nos pontos vetoriais e usar as setas no teclado para ajustar a posição, você pode ajustar alças. E, basicamente, isso está quase pronto para o nosso eu fui. E o melhor é que essa forma combinada ainda é credível e você pode editar cada camada separadamente. Agora, mais uma coisa que eu gostaria de acessar são as propriedades da fronteira. Então eu vou para o lado direito da fronteira e eu clicar neste pequeno ícone e que nós podemos mudar as formigas, bem como a articulação. Então deixe-me clicar sobre estas juntas arredondadas, e agora este ícone parece ainda melhor. Então agora você tem este pequeno ícone de nuvem bonito que foi feito no esboço usando as operações booleanas . Certo, bem, aqueles que temos aqui, talvez seja chuva ou neve. Sim, neve, provavelmente. Então vamos fazer neve e usar um mais. Vou segurar o turno por proporções. Vou desenhar um segundo lá dentro. Vou segurar a barra de espaço para ajustar a posição. Mas, para ser honesto, é muito melhor ajustar a posição com as opções de alinhamento no topo. Então você os tem no topo, certo? E vamos alinhar horizontalmente e verticalmente também. Então, se você selecionável flares, é muito, muito fácil centralizá-los usando as opções de alinhamento. Agora, posso usar operações booleanas e preciso de alguns rastreados. E porque minha ordem de empilhamento fora camadas estava correta de modo que o total sete, que é a camada com um círculo menor, estava no topo. Consegui cortar isto por sete de mais de seis. A camada que estava abaixo de sete. Então agora precisamos mudar a cor que seleciona mais de sete. Vamos selecionar cor preta. Então, uma última coisa que precisamos é duplicar essa camada. E basicamente, eu te disse que você pode fazer isso com o comando da opção. Você também pode selecionar a forma combinada e você pode movê-la para o lugar certo. E depois você pode usar a tecla de opção para duplicar as camadas. Então eu não vou soltar o botão esquerdo do mouse. Estou segurando a tecla de opção, e agora tenho a duplicata para que você possa refazer essa ação duplicada simplesmente pressionando Comandante D agora. E como podem ver, todas as formas estão agora no lugar. Eu tenho o ícone da nuvem, bem como a neve, e eu uso operações booleanas para criar formas combinadas e sua cópia. Então isso é tudo por enquanto. Vejo vocês mais tarde. 8. Trabalhando com formas: na lição anterior. Criamos um ícone de nuvem que consiste em formas combinadas, bem como ovais. Há formas dentro de tantas formas lá e se você selecionar as camadas dentro combinado forma da nuvem Você pode ver que quando eu vou para um modo de edição e eu pressionar voltar aqui para entrar nos pontos vetoriais. Há muitos usuários pontos vetoriais aqui e forma que eu não necessariamente preciso tão bem, você pode dio Você pode achatar todas essas camadas e eu recomendo que você faça isso antes de exportar para, por exemplo, arquivo SPG e você pode ir para ah menu camada e, em seguida, a partir dos banhos que você selecionar opção achatada. Agora dê uma olhada na estrutura de forma combinada. Temos um retângulo e ovais livres lá. Então, se selecionarmos caminhos e depois achatarmos e tentarmos acessar os pontos vetoriais com o retorno em nosso teclado, como você pode ver que eles foram otimizados e não temos mais pontos vetoriais eso dinheiro, mas também não temos mais este formas dentro. Então eu não posso acessar este retângulo ou mais, ou eu não posso mudar as operações booleanas dentro dessa forma combinada. Então, é melhor manter algum tipo de backup fora dessa forma combinada antes de achatar. E engorda é realmente a opção que você gostaria de fazer no final do seu trabalho antes exportar esses isqueiros vetoriais como, por exemplo, como arquivos VG para um aplicativo ou site, porque ele terá um desempenho muito melhor se otimizado. Mas como eu disse, você perde essas opções elegíveis. E também, se você já trabalhou com o traidor dos Beatles, você pode estar disposto a achatar todos os seus vetores e todas as suas formas no esboço. Mas não é que bom esboço praticando ao contrário de outro ilustrador quando você está achatando muito, então no esboço, basicamente, você gostaria de manter as camadas auditáveis o maior tempo possível, que você gostaria de manter essas formas combinadas. E é muito fácil trabalhar com esses jogadores de forma combinada. E, por outro lado, algumas formas simplesmente não se achatam tão facilmente. Então, se você tem uma forma como esta, se eu for para camada e eu vou para puffs do que achatar, nós recebemos a mensagem de que nós não podemos plana nessas camadas. E por que isso aconteceu? Bem, isso é só porque essas camadas estão apenas dentro uma da outra, então você não pode achatar as camadas quando uma camada está contendo inteiramente a outra camada. Por outro lado, você não pode fazer isso se eles não tiverem nenhuma porta correspondente também. E mais uma operação que eu gosto de mostrar é ir para este menu de camadas e ir para caminhos e, em seguida, dividir a forma combinada. Então, se você quiser reverter esta operação e você quiser voltar para as camadas originais, você pode usar esta opção e então você pode subtrair novamente para ter esta forma. Há também mais um problema que eu gosto de abordar neste ponto quando você tenta combinar formas , especialmente quando você tenta achatar formas. Às vezes você em vez desse resultado pretendido você obtém algo assim. Então você começa esta questão sobreposição vontade. Esses pontos vetoriais só ficaram confusos, e às vezes você simplesmente tem esse problema porque fora da natureza fora das formas vetoriais que você cria no esboço. Então, se você tentar criar uma forma, por exemplo, são retângulo, eu pressiono são e eu crio um retângulo. Então eu pressiono voltar para entrar nos pontos vetoriais no modo de edição, você tem este pequeno ponto que está no canto superior esquerdo, e não é uma coincidência que este ponto é selecionado por padrão. Este é, na verdade, o ponto de partida fora do seu vetor, e agora você é placa gráfica foram montes vetor. A partir deste ponto, em alguma direção, ele pode ir para a esquerda, ou pode ir para a direita. Então, para verificar, se ele vai para a esquerda ou para a direita, você pode pressionar a tecla tab no seu teclado e esboço. E como você vê, ele vai direto para o próximo ponto, em seguida, de cima para o próximo ponto e de cima para o último. E esta questão sobreposta está ligada à direção para onde o seu lucro está indo. Então, às vezes, você boa as formas, que são invertidas para que eles vão da esquerda para a direita ou da direita para a esquerda. E se você tentar combinar essas formas, você terá problemas sobrepostos. Então você pode basicamente corrigir esse problema indo caminhos do pé e, em seguida, indo para opção de ordem inversa se reverter a ordem fora do caminho que criamos. Então vamos como essa opção, e entramos nessa forma em um modo de namoro com retorno. Como você pode ver, eu tenho este ponto certo selecionado por padrão, e se eu pressionar o topo do teclado, eu vou para a esquerda em vez de ir chorar. Então este é apenas um pequeno hin. Mas às vezes, quando você tem esse problema sobreposto, quando você vê que os pontos vetoriais vão ser confusos. Depois de combinar algumas camadas, você simplesmente vai para a camada e você inverte a ordem fora vetores. OK, então agora vamos nos concentrar neste segundo ícone e vamos tentar recriar este ícone. Você pode pressionar O no teclado, mas você também pode ir para este menu de inserção na parte superior. Deixe e lá você tem todas as formas fora esboço e todas as ferramentas de esboço para que você possa selecionar ovais, retângulos, linhas, linhas, retângulos arredondados e tese. Lembre-se de atalhos também. Este retângulo arredondado. Eu não uso muito porque eu sempre uso retângulo simples. E então eu disse que os rais usam à direita. Então acho que é mais conveniente. Caminho fora Fazendo isso porque você nunca colar um valor fora do dedo ao redor das bordas, você precisa ajustá-lo um pouco, então se você deseja copiar os estilos especialmente sentir e bordas entre diferentes formas, você pode desenhar algumas outras formas e vamos tentar copiar estas propriedades a partir desta forma que você possa clicar com o botão direito na forma e, em seguida, selecionar estilos de cópia deste menu, e você pode depois, como ambas as formas com shift e clique direito ou controle. Clique na seleção e basta colar collants, e ele funciona em Lee para campos e bordas. Como você pode ver, o Raio da Borda não foi copiado. Você também pode usar ah, atalho de teclado prático. Por isso. Você pode pressionar comentários de opção, veja, então venha e veja para copiar, mas também você pressiona a opção. E ao colar Que também pressione opções, Então opção Command V. E se você encontrar-se usando os mesmos estilos de forma mais e mais, você pode selecionar a forma e você pode ir para o menu de edição no esboço. E aqui você tem a opção de definir este tempo como padrão para que ele irá predefinir todas as ferramentas. Então, mesmo se eu desenhar mais agora, eu tenho a mesma fronteira e o mesmo campo que foi dito padrão EUA. Então agora isso é fazer isso fora um pouco maior. Isso tem uma sensação de branco nesta forma, e nós vamos criar esta pequena forma de nave que temos aqui com abrasão de barras. Então vamos desenhar outro de todos sem turnos agora, então não sei quais são as proporções. E agora vamos selecionar as formas e escolher o Intersect. Então, como você pode ver, teremos essa forma superior usando operações booleanas. Vamos fazer outra forma com Oh, e lembre-se que você sempre pode pressionar a barra de espaço para posicionar a forma. Por quê? Desenhar a forma eso sem soltar o botão esquerdo do mouse. E então vamos posicionar isso corretamente e vamos mover isso sobre quatro sob a forma combinada. E como você pode ver, temos nesta forma combinada que temos sensação de branco para que ele cobre as camadas abaixo e agora podemos entalhar esta forma para que possamos usar incrementos de um pixel com setas do teclado pode pressionar para baixo ou para cima para mover a forma por um pixel. Se quiser se mudar, meus 10 nos escolhem, aperte Shift. Então mude para baixo ou seta para cima. E você também pode encaixar com um fora das opções de retenção de incrementos de 10 pixels. Então opção para baixo seta para cima vai 0.10 ponto dois bigs para cima. Ok, então o que vamos fazer agora é pressionar L para o dedo do pé da linha e vamos criar nossa linha simples. Precisamos combinar esta forma, a posição correta e, em seguida, precisamos selecionar a forma e a mercadoria de imprensa para duplicar esta linha. Então, queremos usar a mesma forma, mas eles vão clicar com o botão direito na forma e selecionar a transformação que você tem. Rotações fogem sendo curso inteiramente ou verticalmente. Então vamos inverter isso horizontalmente. E vamos entalhar esta forma a posição corretamente sob a espaçonave A. E vamos usar outra linha para a última forma. Ok, então agora está quase pronto. Só precisamos de algumas formas emprestadas do nosso anterior. Eu vou entrar naquelas formas e eu vou imaginar para que eles pisem debaixo da nave espacial e lá você está. Então agora precisamos posicionar os elementos corretamente, e essas são basicamente todas as operações que você precisa lembrar. Em ordem. Teoh criar formas no esboço também para gerenciar as formas e criar operações booleanas. Às vezes é muito mais fácil e muito mais gratificante criar seus próprios ícones no esboço. Em vez de procurar ícones prontos na Internet. Ou às vezes você só tem um, Nikon disse. Mas você não tem esse ícone em particular que você quer usar em algum caso, e essa é a razão pela qual você pode recriar os ícones e usar essas formas, operações de barras e todas as coisas que eu mostrei no esboço. É muito, muito fácil agora. Mais uma coisa que quero te mostrar. Posso ir para este menu de exibição e selecionar mostrar réguas. Você também pode pressionar o controle, estão no teclado para acessar as réguas, e você tem réguas à esquerda e à direita. Você pode clicar na régua para outro cara inteligente, mas às vezes é apenas mais fácil dedo do pé sobre e ver se as formas estão alinhadas corretamente. Então isso se molda dentro do nosso OVNI. Você pode criá-los entre as lições. Encorajo-te a fazê-lo, e isso é tudo por enquanto. Obrigado por assistir Vejo você na próxima lição. 9. Ferramentas de vetores: Nesta lição, eu vou mostrar a vocês como usar um esboço vetorial do dedo do pé. É um dedo muito poderoso, mas precisa de alguma prática para ser dominado. Então você pressiona V no teclado para chegar ao dedo do vetor, e agora você pode clicar quer criar seu primeiro ponto vetorial. Estes pontos vetoriais podem ser retos. E, como você pode ver, quando eu criar o próximo ponto, eu vou desenhar uma linha reta. Então isso é criar uma linha reta aqui também. E se você quiser criar o ponto de curva, você clicar e segurar o fundo esquerdo do mouse e eles precisam de drogas para a esquerda ou para conduzir para criar que alças. E como podem ver, tenho duas alças. Há uma alça direita que determina o caminho que foi realmente criado, mas eu também tenho essa alça esquerda, e isso determina a posição fora dos próximos pontos vetoriais do caminho que será criado pelos próximos pontos vetoriais. Então deixe-me riacho e segurar lá, e eu vou usar maçanetas segunda vez. Além disso, dê uma olhada que as alças mais longas você tem, mais do cuidado. Se você criar isso agora, eu vou criar o próximo ponto e este sopro está correto. Mas o próximo bônus vai direto para a parte inferior da letra, e é por isso que eu preciso mudar o comportamento dos pontos vetoriais. Então agora eu tenho essas alças de espelho, e o que isso significa é que eles estão no mesmo caminho e eles são simétricos agora, de modo que eles estão na mesma linha. Mas eu também posso selecionar isso conectado ou um simétrico e onde opressor desconectado. Eu posso mover cada alça separadamente para que agora eu possa mover a alça direita para que ele defina a direção para o próximo caminho. E como você vê agora, eu posso criar esse caminho suave para o fundo da minha carta. Então eu trouxe este ponto vetorial com alças vencedoras desconectadas. Preciso que essa alça seja um pouco maior, e agora posso clicar e segurar para criar as próximas alças. E o comportamento padrão é que as alças são espelhadas e isso é basicamente o melhor , porque você pode criar formas que são extremamente suaves e têm essas lindas linhas que você não pode nem dizer que os pontos vetoriais estão lá . Mas muitas vezes não é o caso, e às vezes você só precisa desconectar os pontos ou criar pontos simétricos. E também outra dica profissional é que você pode segurar o shift enquanto arrasta essas alças. E agora, como você pode ver, você obtém resultados muito suaves também para que você possa arrastar com o dedo do pé, segurar a linha, e é por isso que você gera muito pequeno Fine. Então ele basicamente precisa de alguma prática e o que nós você pode fazer. Você pode clicar duas vezes sobre o ponto vetorial Teoh alterar esses períodos de espelho para reto, e se você for reto você não tem qualquer cuidado para que você não tem quaisquer alças, e você pode clicar duas vezes novamente para mudar de volta para uma opção espelhada. Então agora você pode selecionar, por exemplo, desconectado para que você possa modificar o ângulo de uma alça sem modificar o ângulo fora do 2º 1 E você pode mudar a posição fora das alças como para que seja muito o direção fora da curva que precisamos. Eu vou criar mais um ponto vetorial aqui, e eu vou fechar o caminho agora, e eles podem fechar acima clicando nos primeiros pontos vetoriais para que você tenha, e a melhor coisa sobre isso é que agora você tem um caminho no e você sempre pode acessar esse caminho pressionando Return, e você pode alterar quaisquer pontos vetoriais dentro. Então, se você decidir que este ponto vetorial é não, é perfeito e você não vai ajustar as alças que você pode fazer para que possamos clicar no ponto reitor e então você pode mover as alças em conformidade. Se você mover as alças para que elas estejam em uma linha, possivelmente você terá a melhor curva. Então, voltando para as opções que você tem em linha reta sem quaisquer alças que você tenha espelhado quando as alças estão na mesma distância e o mesmo ângulo dos pontos vetoriais, você também desconectou onde cada alça se move separadamente, e você tem esta uma opção simétrica quando eles estão no mesmo ângulo. Mas cada um pode estar em uma distância diferente dos pontos vetoriais, e também lhe dá resultados muito suaves. Você também pode excluir ambos os pontos vetoriais, e você pode clicar no identificador até mesmo um identificador, e você pode excluir mesmo enquanto manipulado. Se você pressionar backspace nos pontos vetoriais, o caminho ainda será fechado e o segundo vetor transportado se tornará o primeiro. Então, para abrir o catalisador, você clica nos pontos vetoriais. Você seleciona caminho aberto e agora você pode pressionar Return. Ou você pode simplesmente terminar a edição para escapar sem fechar o caminho. Então, às vezes você precisa apenas de uma forma sem o caminho mais próximo, e se você decidir mais tarde que você quer fechar este caminho, você pode pressionar return. Entrar para acessar este qualquer coisa, moldar qualquer concreto no primeiro ponto para fechar o caminho. Você também pode ter os pontos vetoriais para os caminhos. Então, quando você passar o mouse sobre este caminho, você tem este ponto azul e ele permite que você clique no caminho para outro ponto vetorial. E também uma grande profundidade é manter o comando enquanto passa o mouse sobre esta linha para obter os pontos vetoriais diretamente no meio desta linha. Então, ele está diretamente centrado entre dois outros pontos vetoriais, e agora podemos combiná-lo com shift com setas no teclado e posicioná-lo onde quiser . Você também pode mover essas alças. Como você pode ver, eles são um simétrico por padrão para que você possa movê-los e By the way, se você quiser posicionar o vetor manipulado na posição X e Y exata, você pode fazê-lo. Então você tem coordenadas X e Y para cada ponto vetorial, mas também para cada vetor manipulado. Então você pode decidir que isso pode ser 830 para o punho e para o ponto. Você tem uma posição diferente. Você pode pressionar o backspace para excluir esses pontos vetoriais. Você pode selecionar ambos os pontos vetoriais. Por que o turno de espera em casa? Você também pode arrastar e soltar esses pontos como muitos pontos vetoriais, ou até mesmo usar esta pequena ferramenta à direita para selecionar muitos pontos vetoriais ao mesmo tempo. Então vamos em frente e nem um pouco. Este vetor aponta usando as teclas de seta no teclado e vamos para o interior do nosso copo e criar mais alguns pontos vetoriais para criar a forma interna da letra A. E vamos terminar esta forma. Eu vou usar isso conectado aqui e vou terminar isso. Mas como você pode ver, não há alças, então só há uma alça aqui, então eu tenho que clicar duas vezes nesta parte vetorial, e agora eu tenho duas alças. Eu posso desconectar as alças, e agora eu posso facilmente desenhar uma curva e a segunda curva assim, a propósito, há um atalho útil para usar espelho reto, desconectado e um simétrico. Você pode pressionar 123 ou quatro ou no teclado para acessar qualquer modo para que você possa pressionar dois para espelhos. E agora podemos selecionar qualquer ponto. Você pode empurrá-lo com a boca, e às vezes você obtém este guia inteligente que permite posicionar um ponto de acordo com o outro, e às vezes ajuda. Às vezes, não. E então quando não acontece, quando você quer desligá-lo temporariamente, você pode pressionar e segurar o comando, e agora você pode entalhar meu pixel. Você não vai ter esses Guias inteligentes que às vezes apenas às vezes são irritantes. Ótima. Vamos fazer isso com a maçaneta. E como você pode ver com alça, você também tem este guia inteligente e Teoh se livrar dele. Basta pressionar e segurar os comandos, e agora você pode usar o dedo do pé livremente para posicionar o seu manipulado. Então, como você pode ver, este vetor para é extremamente poderoso, mas também é bastante difícil, então você tem que praticar um pouco. E lembre-se, nas fitas profissionais e também nos atalhos de teclado que eu te dei, eles são muito importantes. Então você pode pressionar. Quer ir direto para espelhado, livre, desconectado. E para um simétrico, é muito mais fácil. E também quando você escolhe qualquer modo, por exemplo, espelhado ou um simétrico, e você move um fora das alças e você decide que deseja mover este identificador separadamente do outro, e você deseja desconectá-lo. Basta pressionar e segurar o comando para não ter que ir para desconectado. Ele vai lá automaticamente quando você pressiona o comando enquanto move um fora das alças para que você possa experimentar e dar uma olhada no botão shift. Nem sempre funciona 45 graus, mas será útil criar formas suaves. Além disso, você pode definir a posição fora dos pontos vetoriais, bem como as alças separadamente. Como você pode ver, essas coordenadas estão sempre em células de pico total, mas às vezes você precisa de extrema precisão, e é por isso que você quer definir esta opção para não chegar a pizzas mais próximas. Eu costumo ficar com as bordas de pizza surround padrão de tofu, e é uma espécie de útil quando você quer exportá-lo como um mapa bit e você não tem muito bordas. Mas se você está criando um ícone muito sofisticado, por exemplo, às vezes você quer imaginar de modo que você tem essa precisão extrema e, em seguida, você seleciona esta opção. Agora, deixe-me fazer uma linha mais grossa no dia. Eu também vou selecionar ambos fora da forma. Então eu vou definir um caminho para dentro e fora para e clique em alguma operação booleana trilha que eu possa ser lido fora deles fora desta forma e eu posso usar um campo para sentir letra inteira. Vamos usar uma cor esverdeada e vamos sair menos deísmo. Vou definir o fundo para a nossa carta. Então vamos criar um retângulo simples. É mudança de uso e opção para dimensionar proporcionalmente e também a partir do centro. Agora eu vou vender assim, centralizá-lo com uma letra e usar a sensação mais legal. Deixe-me mudar para uma cor rosada e emais uma coisa que vou fazer. Vou me livrar da fronteira, e a propósito, você pode arrastar a borda para fora deste painel e liberá-la para se livrar da fronteira. E a série também funciona para sentir em suas sombras, gás e borrões e outras coisas que você tem abaixo sentir neste direito. Ligue para eles. Então nossa carta está pronta. Encorajo-o a praticar e, por exemplo, a criar a primeira letra do seu nome. E vejo vocês na próxima lição. 10. Como transformar formas: nesta lição, vamos dar uma olhada em formas mais sofisticadas e também vamos usar a ferramenta tesoura . Mas primeiro, vamos dar uma olhada na barra de cima do esboço. Isto é uma barra de ferramentas. Na verdade, temos algumas ferramentas lá, mas podemos personalizar esta barra de ferramentas e podemos acessar suas opções. Então, se você clicar com o botão direito em qualquer esporte vazio na barra de ferramentas e selecione este botão personalizar barra de ferramentas agora você pode selecionar qualquer droga icônico jeez -lo dentro e um arrastá-lo para fora da barra de ferramentas. Então, se você se encontrar usando carros muito, você pode simplesmente arrastar essas cores na barra de ferramentas. Além disso, você pode mover esses divisores. Este é um espaço vazio, e você pode mover as ferramentas de, Mesmo se eles são grandes para fora, você pode movê-los para fora da barra de ferramentas e se livrar deles da mesma forma. Então você também pode se livrar dos divisórias. Você tem, ah, espaço simples, e você também tem este espaço flexível que você pode usar para ajustar o espaçamento entre os ícones. E se você quiser apenas redefinir para um ícone padrão e espaçamento, você pode arrastar o conjunto padrão para a barra de ferramentas. E este padrão disse, está na parte inferior, você pode pegar o conjunto padrão e simplesmente colocá-lo na barra de ferramentas para redefini-lo. Teoh o quê? Foi originalmente quando você inicia o esboço pela primeira vez, então você tem uma opção para selecionar. Eu só posso ou apenas texto, ou texto e ícones que eu costumo usar nos ícones. Mas para este curso eu vou usar Eu tenho um texto para que você possa descobrir os nomes fora das funções também. E vamos mover este César ainda aqui, porque vamos usar a tesoura nesta lição. Então vamos mudar para uma forma de desenho como esta, e você vai encontrar-se fazendo isso muito, muito frequentemente, e você precisa usar a porta geral. Então, isso é a imprensa. Oh, e vamos segurar o turno. Mantenha proporções. Mas às vezes você não vai criar uma forma simétrica e mudança. Não é suficiente que você queira tirar diretamente do centro. Em vez disso, a partir da borda superior esquerda fora da forma e dirigiu a partir do centro. Você vai pressionar a opção enquanto arrasta para que você possa prosseguir toda a proporção. E se você quiser desenhar do centro, você pressiona a opção. E, claro, você pode começar com a opção e, em seguida, mantenha o deslocamento para criar uma forma que é tanto jogado do centro e que é proporcional e é um círculo perfeito. Agora entrou. Os governantes com controle são que você sempre pode mudar os governantes com você humano também. E às vezes quando você quer criar um círculo como este, você está precisa de algumas réguas e você precisa clicar sobre a régua para, disse o guia. E esse cara está exatamente no centro, fora do nosso topo, e agora eu tenho régua horizontal também, e eu posso ir com os pés. Eu posso colocar o cursor do curso diretamente no meio, e eu posso pressionar a opção enquanto arrasta para desenhar a partir do centro. Às vezes você quer uma forma simétrica como esta, e é muito fácil desenhá-la com as réguas habilitadas. Então eu pressiono vir. Controle são muito esconder tanto as réguas e as guias, e se você quiser se livrar das guias horizontais ou verticais, você direito, clique ou controle, clique sobre as réguas e selecione remover todas as guias verticais. Você também pode selecionar em um guia e unidade, assumir este guia e selecionar remover guia. Então, outra maneira é apenas arrastá-lo para fora da régua para que eu possa fazê-lo com guia horizontal e vertical, ou eu posso remover todos os caras que eu tenho no meu documento. Então, agora o que vou fazer que aumentou a espessura disto, vou selecionar seis. E eu vou selecionar a cor verde para a borda e que o que precisamos é que vamos dificar em outro círculo que será uma duplicata fora do anterior. Então eu pressiono os comandos D e mudei a cor. Então isso é meio que combina com a cor daqueles overs em cima. E agora eu preciso me livrar de uma parte dessa fronteira em mais de cinco cópias para que você possa pressionar Returns”. Esta é uma maneira de fazer isso. Você não pressionaria Return, e você pode selecionar qualquer ponto vetorial e pressionar backspace ou delete para excluir esse ponto vetorial . E agora você pode simplesmente abrir o caminho para que você tenha, por exemplo, metade fora desta fronteira. A segunda abordagem seria criar, por exemplo, por exemplo, um retângulo ou qualquer forma que fosse uma forma de 1/4 ou 1/2 hora e, em seguida, selecionar ambas as formas e selecionar subtrair. Mas há um problema que temos essa fronteira acontecendo no centro. Então a melhor maneira de abordar este tipo de exercício é usar as ferramentas de tesoura que você exclui esses segmentos entre pontos vetoriais. Isso significa que se você selecionar o sobre e você sobre o dedo da tesoura sobre qualquer caminho, você pode excluir o caminho entre quaisquer pontos vetoriais. Então, neste mais por padrão você tem quatro pontos vetoriais, então você pode pelo menos quatro segmentos e fazer um dos trimestres fora disso sobre. Mas também você pode adicionar pontos vetoriais e o cinco, talvez, ou 1/4. Agora podemos ir para a fronteira, e você também pode mudar a borda e para que eles são arredondados e esta forma parece ainda melhor, é como a tesoura funciona. Mas há muito mais no banco, eu posso criar formas e ícones muito mais sofisticados usando a tesoura. Então deixe-me criar algo mais avançado. Vou usar uma ferramenta geral para criar um ícone WiFi simples. Deixe-me Dragon em primeira forma. Agora eu vou comandar o duplicado e eu vou fazer muitas duplicatas. Vou escalá-los usando a tecla de opção para escalar a partir do centro, bem como a tecla shift para dimensionar proporcionalmente. Você também pode opção de drogas e, em seguida, usar o dedo do pé commodities tem várias formas também. Então vamos selecionar todas as formas e você pode drogar Se você não pode arrastar porque você tem este retângulo livre no fundo, você simplesmente pressionar Shift comando l para olhar este retângulo. E agora você pode selecionar todas as formas que centralizam as formas usando a barra de espaço para ajustar a exibição. E o que eu preciso é de mais formas. Vou usar falas. Por favor, lembrem-se dos atalhos para a linha. Sou eu , então vou usá-la para fazer isso. Mas preciso que o Teoh tenha o centro exato do meu ícone. Então vamos usar as réguas e vamos dizer os guias. Vou definir o guia vertical e também o guia horizontal para que eu tenha o centro exato . Agora vamos colocar o cursor no centro e desenhar a primeira linha. Talvez assim. Ok, agora isso é duplicar esta linha, então eu vou usar o Comando D. E agora eu tenho a cópia fora da linha no painel de camadas para que eu possa usar o sono aqui para virar horizontal ou verticalmente. E eu mostrei mais uma maneira de fazê-lo, para acessar este direito como dinheiro, e disse a transformação. Mas as garrafas são muito e mais eficientes. Então agora vamos mover as camadas para o topo. E o nosso próximo desafio é fundir toda esta camada. Então, se eu selecionar uma e duas linhas, eu vou usar um sindicato de 1.000.000.000 Operação Off. E como você pode ver, isso funciona como esperado. Então eu tenho uma boa forma. E agora este comando de imprensa z para desfazê-lo e selecionar todas as ovais. E agora vamos tentar a operação sindical. E agora não funciona. Por quê? Não funciona semana porque, como eu disse há pouco, eles não têm nenhum ponto em comum. E neste caso, você realmente não pode usar a operação sindical porque você obtém um resultado que é inaceitável para isso. Então eu vou desfazer isso, e em vez disso, fora do sindicato, vou usar diferentes operações booleanas que às vezes você só precisa experimentar. Vamos usar a operação de barras de diferença. E agora dê uma olhada na forma combinada. Isso é exatamente o que queremos. Então temos todas as linhas e temos todos os caminhos conectados para que possamos usar a tesoura para excluir os segmentos que não precisamos aqui. Ok, eu vou Cathcart bonés e acelerar o filme para que o ícone do WiFi esteja quase pronto. Então, como você pode ver com grande no ícone, usando as operações de barras em formas, bem como usando a tesoura dedo do pé e agora podemos fazer esta borda mais espessa. Podemos mudar a cor e acessar as propriedades ao redor das formigas fora da fronteira. E o ícone está pronto. Então, obrigado por assistir. E vejo-te no próximo filme. 11. Transformações avançadas: nesta lição, vou falar sobre as opções de transformação, bem como sobre o alinhamento de itens. Então vamos ampliar este artigo e vamos criar nossa primeira forma será um retângulo. Vamos fazer o lado direito. Temos posição aqui ciência, transformação e todos os rótulos têm os campos de entrada. Você pode inserir os campos de entrada, bem como você pode pressionar as setas para alterar a posição acordo. Então, se você clicar na entrada, agora você pode usar as teclas de seta nos teclados da tecla de seta para cima e do dedo do pé da tecla de seta para baixo , não os valores por um pixel. Se você pressionar e segurar deslocamento para que tenhamos uma seta de deslocamento você não pode valores por 10 incrementos. E também por que segurando opção. Você pode ter este dolt um incrementos. Então é assim que você altera os valores em todos os campos de entrada. Você também pode sobre o rótulo fora do campo de entrada, então passe o mouse sobre. Por que rotular. Então você rija com o botão esquerdo do mouse e você pode usar drogas para a esquerda ou para a direita com o grampo inferior , e então você muda os valores de qualquer campo de entrada no esboço. Então, se você quiser Teoh selecione o campo capaz à direita, e você atualmente tem este de selecionado. Basta selecionar a camada e você pode usar o atalho de teclado, que é a opção tub. E quando você pressiona a opção tub, você selecionou o primeiro campo, que é nesta posição caso, você possa pressionar o topo novamente para acessar qualquer outro campo, e você pode digitar os números. Você pode usar as setas no teclado. Você também pode pressionar Shift Tab para sair do campo para que você possa pressionar Tab ou deslocar até o excesso de qualquer campo sem sequer ranger com as bocas. A próxima opção que você tem aqui é este pequeno ícone de cadeado, e isso está entre os rótulos de largura e altura. E como você vê isso, olha que eu tenho permite que você registre as proporções do objeto. E se você disse que o trigo, a altura vai mudar de acordo. Quando você pressiona Return, as mesmas coisas acontecem se você tentar modificar a largura ou a altura da forma usando as alças. Então, se você arrastar sobre o que qualquer uma das alças, você vai ver que o trigo e esconder muda de acordo. E isso porque temos esse pequeno ícone de cadeado que impede que você altere as proporções dessa camada. E se você não precisar, basta clicar no ícone de olhar. Como vê agora, está desbloqueado, então posso mudar o trigo e esconder-me separadamente para mudar a proporção da camada. Então agora você não precisa acessar nenhum modo de transformação especial ou algo assim. Você apenas grego na camada, e você tem as alças que você pode ajustar em conformidade, e você também pode acessar este banco girar a partir do topo, e agora, se você passar o mouse fora da camada, você pode ver muda, e você pode alterar o raio. Você também pode acessá-lo a partir do dinheiro da mão direita, e você tem esta opção de rotação aqui para que possamos digitar 40 graus e ele gira, e você também pode acessar o dedo de rotação flutuante com uma chave comum. Então, quando você passar o mouse sobre o canto e pressione o comando para entrar temporariamente neste dedo do pé de rotação e coisa é quando você gira como então você também pode pressionar deslocamento para ter rotação ah com incrementos de 15 graus, e é assim que você faz isso. Na verdade, há uma vantagem em usar um dedo de rotação em vez de pressionar o comando, porque quando eu clico na rotação, você pode acessar este pequeno ponto de rotação no meio, e você pode mudar a posição de pontos de rotação. Então, se você for para fora da rotação, dedo do pé e pressionar o comando, você não tem este pequeno ícone. E se você for girar, você pode alterar a posição fora da origem da rotação, e agora você girar de acordo com a posição fora deste ponto. Então, uma última coisa que temos em termos de transformações é a ferramenta de transformação que está no topo. Portanto, é basicamente bastante diferente dos manipuladores de transformação padrão, e você também pode acessar para transformar com o menu do botão direito. E darei a este povo opções ressentidas e verticais. Mas você tem uma rotação aqui, bem como transformar que podemos acessar a partir daí ou do ícone no topo. Então vamos para o modo de transformação e este modo. Vamos mudar a posição de cada um dos pontos. Como você vê, os pontos agora são arredondados e você pode fazer algumas transformações pseudo-Freedy 2.5 a transformação para que você possa distorcer o objeto. Você pode transformá-lo de uma maneira diferente, modo que é transformação. Agora eu gostaria de mostrar-lhe alguma outra opção para alterar as camadas de trigo e amarrado, e isso está usando o teclado para que você possa mudar qualquer camada e você simplesmente pressionar o comando opção e, em seguida, você não com as setas para que você possa pressionar a seta esquerda para fazer o trigo menor em um pixel ou a seta para a direita para aumentar em um pixel. Você também pode impressionado comando shift, seta para a esquerda ou para a direita para ter incrementos de 10 pixels. E esses atalhos. É muito útil. Por exemplo, quando você tem muitos objetos e é bastante difícil selecionar camada individual em seu artigo, você pode selecionar a camada a partir das camadas menos e, em seguida, você pode usar o dedo de atalhos. Ajuste a altura ou o trigo ou para ajustar a posição. Agora este dedão de couve. É uma das minhas ferramentas favoritas no esboço porque ele permite que você dimensione qualquer objeto, ar ou grupo ou um set off camadas, e em vez disso fora dessa escala tradicional, que não escala, por exemplo, e borda para que você possa ver que se eu escalado mesmo com opção e mudar toda a proporção e escala do centro na espessura fora da borda ainda é 15 pixels, e na verdade, todos os efeitos que você tem aqui para bordas em suas sombras. Ghassan desfoca, e também as sombras permanecerão as mesmas. Então, se eu outra sombra e você tem alguns valores rasos lá. Então eu tenho essa Blair, por exemplo, que são quatro pixels, e se eu tentar dimensionar a camada, ela sempre permanece por pixel. Neste comportamento, você provavelmente não quer, eu não sei 80% do seu tempo, porque você quer escalar seus ícones com todos os efeitos. Tem tanto medo. As fronteiras escalam as sombras. Vamos nos livrar da sombra. E vamos nos concentrar nessa propriedade fronteiriça, que é 15% acho que sim. Quando eles patinaram, isso não muda. Mas se eu acessar a ferramenta de escala e este é provavelmente um dos atalhos de teclado mais importantes , esse é o comando K, então você pode agora redimensionar a camada e você pode dar o valor adequado em porcentagem para que eu possa patinar 50%. Eu também posso dar peça exata de valores para largura e altura, bem, mas geralmente eu uso porcentagem e dar uma olhada na borda agora, por isso era 15 e agora é 7,5 pizzas. Por isso funciona também para as fronteiras e esta função de pequena escala. Você vai usá-lo o tempo todo. É especialmente útil quando você, por exemplo, importar alguns ícones no esboço e você quer assustar as bordas proporcionalmente toe os ícones que eu usei o tempo todo, realmente, Então você também pode visualizar os valores e você pode assustar do centro da esquerda para baixo para que ele possa escolher qualquer posição de escala. E é super útil. Então a boa notícia é que isso é provavelmente tudo o que você precisa saber sobre escalabilidade e transformação no esboço. Então deixe-me aceitar essas mudanças e redimensionar essa camada e passar para a próxima lição. Vejo vocês aí. 12. Alagem de elementos: Olá e bem-vindo na próxima lição em que eu vou mostrar-lhe muito simples, mas muito poderosos recursos fora esboço, que são opções de alinhamento. Então, temos as opções de diamante no canto superior direito da interface, e você pode usá-las para alinhar grupos, camadas, camadas, quadros de arte. Você simplesmente seleciona qualquer coisa, e como você vê alguns fora do alinhamento, as opções estão agora disponíveis. Então eu selecionei este grupo de planeta e há um pequeno quadro novas opções de alinhamento, e isso significa que você vai se alinhar de acordo com um mundo da arte. Então, se você tiver um elemento selecionado e ele não estiver dentro de um grupo, você pode alinhar de acordo com esses ícones de espaço espião. Copiar, também, são sobre. Então deixe-me aliar neste para a esquerda, para a direita para o fundo superior, e você também pode enviar sua vertical e horizontalmente no artigo. Então, é muito fácil, e você também pode alinhado usando esses caras inteligentes. Como você vê, se eu for para o centro, Eu tenho guia vertical, bem como guia horizontal que vai me deixar colocá-lo diretamente no centro fora do artigo, e se por acaso, você quer posicioná-lo. Não sei, talvez conhecia o centro, mas não no centro. E você quer pular um estalo. Você mantém o comando enquanto arrasta, e é isso. Ok, vamos mudar para alguns outros quadros de arte que eu tenho. Então agora eu tenho alguns grupos. Eu tenho quatro ícones, e se você tem mais de um elemento na arte sobre, como você pode ver, você tem mais sorriso, pessoal. Então você tem guias inteligentes para a placa de arte aparecendo no corpo central também tem guias inteligentes para as bordas de cada grupo que temos aqui, e também podemos desativar os caras inteligentes enquanto arrasta. Você só precisa pressionar e segurar a parte inferior do comando no teclado. Mas aqueles caras inteligentes que podem se tornar muito úteis, especialmente quando você quer posicionar os grupos dentro do outro e quando você quer marchar as margens entre diferentes camadas ou grupos diferentes. Então, como você vê, eu tenho as medidas agora, e se eu chegar perto de 91 eu tenho snapping e isso me permite posicionar seu grupo corretamente que você também possa medir essas distâncias entre diferentes camadas e diferentes grupos. Pressionando a parte inferior da opção. Portanto, o primeiro caso de uso é quando você apresenta tecla de opção de espera e você passa o mouse sobre este grupo selecionado . Agora você mediu as distâncias entre as bordas da arte abortar. O que você pode fazer é você também pode passar o mouse sobre a próxima camada ou um grupo, e agora você mediu a distância entre este grupo e o segundo grupo. Assim, você pode facilmente medir diferentes distâncias entre as tábuas de arte ou entre os próprios mentirosos ou agrupar-se. Então lembrem-se do atalho de teclado e a próxima coisa que eu gosto de mostrar a vocês é alinhar esses ícones com nove opções. Então, vamos selecionar todos os itens. Então vamos eleger todos os grupos. E agora, como você pode ver, temos todas as opções disponíveis aqui porque temos vários objetos para que possamos distribuir o espaçamento também. Então, agora, se você selecionar qualquer fora das opções de alinhamento, ele não está posicionando dentro do cartão. Está se posicionando entre esses objetos, então se eu os alinhou como você pode ver, eles se alinharam na borda esquerda do primeiro grupo, e agora eu posso centrá-los na arte. Mas assim, e se eu quiser que Teoh distribua dentro da arte, mas eu preciso ter um grupo diferente para todos esses objetos. Então eu pressiono o Comandante G enquanto tenho esses objetos selecionados para criar outro grupo. E agora só tenho este grupo selecionado. E no painel Alinhar, eu tenho essas pequenas bordas ao lado do detestável. Então isso significa que eu vou trabalhar agora com todo o grupo e posicioná-lo dentro do parafuso de arte . Então, vamos pressionar o comando Shift, G dedo no grupo os elementos. E agora eu tenho mais de um elemento selecionado, então as opções da companhia aérea são diferentes. Então vamos mudar para este primeiro nosso conselho. E como você pode ver, há muitos grupos e cada grupo é um ícone diferente. Então deixe-me selecionar a primeira linha fora ícones eso 1º 7 ícones e eu vou usar o alinhamento faz corretamente no alinhar esses ícones. Então agora vamos usar esta primeira opção alinhada verticalmente. Teoh tê-los em uma linha, e então eu preciso distribuir as margens entre o ícone. Então eu vou clicar em distribuir horizontalmente, e isso é pegar está dizendo que basicamente ele não pode movê-lo para seus picos completos nós. E ele pergunta se eu quero movê-los para sub picos nós algumas fotos de posições no eixo X, ou eu quero distribuí-los uniformemente? E para ser honesto, eu não me importo de distribuí-los uniformemente porque você nem vai notar a diferença. Enquanto você tem todos os ícones no completo escolhe-nos sobre os picos são grandes, que é bastante importante. Então eu clico em distribuir até mesmo a opção. E lá vamos nós. Temos até distribuição desses ícones, até margens entre os grupos. Então, mesmo que haja negativo, você pode fazê-lo assim E agora o que eu vou fazer, eu vou selecionar o último ícone porque eu quero que Teoh distribua a tosse I para que eles sintam todo o espaço fora do nosso quadro. Então eu vou selecionar o último ícone. Vou apresentar o turno de espera para manter a linha. E agora eu vou selecionar todos os ícones enquanto este ícone lista para a direita e novamente eu vou distribuir de forma desigual para que eu tenha a primeira linha fora dos ícones e agora eu posso ah agrupar este ícone. Então pressiono o comando G para agrupá-los. Agora eu pressionar o controle são para as réguas e eu disse que o guia para que eu tenha os guias para a esquerda e para a direita fora meus ícones em. Deixe-me pegar os próximos ícones do primeiro na próxima linha e disse aqui. E eu também vou posicionar este último ícone neste segundo arremesso. E como você vê, é muito melhor posicioná-lo opticamente do que matematicamente. Então eu vou agitá-lo com seta para a direita no teclado. E agora está perfeito. Eu vou selecionar sobre os ícones e antes de agrupar eu preciso definir a distribuição como Então agora eu posso agrupar esses ícones para que eu pressione. Vamos lá, G e eu podemos pegar os outros ícones e fazer o mesmo pelo federal. Precisamos do Teoh não só um pouquinho com o teclado. Vou selecionar todas as camadas com a tecla shift no teclado e distribuir o espaçamento, então posicioná-los no eixo vertical, bem como distribuir as marcações entre os ícones . Então o que eu preciso fazer agora é dizer a última linha fora ícones, Eu vou selecioná-los todos e distribuir o espaçamento, bem como a posição. Agora eu posso comandar o G, Eu disse que o próximo grupo e este federal também precisa ser um grupo fora ícones. Agora, se eu tiver todos esses grupos, eu posso selecionar os grupos, e agora eu posso trabalhar com os grupos para distribuir o espaçamento verticalmente. Então deixe-me clicar neste ícone que eu vou usar de forma desigual e eu tenho todos os ícones para falar e estender posições incorretas. Nunca usamos a ferramenta de texto, mas é muito fácil. Vou vender como o chá no teclado e desenhar um campo de texto simples. Eu vou dizer ícones de espaço como um título do meu quadro de arte, e nós vamos falar muito mais sobre propriedades de texto mais tarde. Agora, como você pode ver, temos esse quadro de texto longo e podemos alinhar o texto dentro deste amigo de texto. Assim, os grandes atalhos de teclado são shift comando mais direita ou esquerda colchetes chave para alinhá-los para a esquerda ou para a direita. Ou você pode usar a barra de deslocamento comum para alinhá-la ao centro. Então você tem todo o tempo e opções para os grupos para o texto, e também você pode acessar as mesmas opções de alinhamento no menu organizar. Você pode selecionar uma opção de objetos de linha e tem todos os ícones que estão neste painel marcados no menu. E isso é muito importante porque agora eu gostaria de mostrar como criar seus próprios atalhos de teclado para esboço, e você pode aplicar atalhos de teclado a qualquer item que apareça no menu de esboços. Então, se tivermos opções de alinhamento que temos, podemos ir direto para as preferências do sistema e das preferências. Vamos para o teclado e há um talho de atalho. Então, a partir da parada de atalho, você vai pisar atalhos, e agora você pode adicionar novos atalhos. Você seleciona o aplicativo, e isso é basicamente esboço. Então, isso é pressione como no teclado e selecione o agendado para cima. E agora temos que reescrever o título do menu. Então temos que colocar exatamente o mundo deles. É esse o nome da função no menu? Então vamos nos certificar de que sabemos o nome correto. Então vamos para organizar objetos de linha, e temos horizontalmente, bem como vertical. Então vamos definir os dois atalhos. Ambas as opções. E vamos como ambas as opções Toe disse que os atalhos nas preferências. Então eu vou colocar horizontalmente como um primeiro Deus curto e no atalho do teclado, você apenas puxou o atalho que você quer usar. Então eu vou colocar coma e suporte esquerdo. Eu estou indo. Vamos, colchete esquerdo para centralizar horizontalmente. E, claro, você pode usar qualquer atalho que quiser. Por exemplo, use Come on, quatro para horizontal e comando cinco para alinhamento vertical. E eu vou colocar vertical aqui, então precisa ser uma ortografia correta. Precisa ser escrito da mesma forma que em um esboço. E vou pressionar o comando do colchete direito. E depois deste atalho, Então agora eu posso fechar as preferências e eu nem sequer tenho que reiniciar o aplicativo de esboço. Eu posso facilmente usar este comentário colchete esquerda colchete seco para disse distribuição adequada e deixe-me fazê-lo na outra arte a bordo e habitual, Um cenário é que você use quaisquer duas formas, então eu vou ritmo lá um ícone e eu tenho estes duas formas e eu quero centralizar este ícone dentro do retângulo. Então eu mudo o grupo selecionado e o ICOM, e agora eu posso usar as opções de alinhamento para fazer isso. Mas, em vez de opções de alinhamento, agora posso usar meu atalho. Então vamos como ambos os jogadores e pressione o comando colchete esquerdo e comando colchete direito para centralizar o ícone horizontalmente e verticalmente. E também, se você estiver usando as versões mais recentes do Sketch, há um bom Adam nisso. Deixe-me colar, talvez livre ou para ícones alienígenas, e agora você pode selecionar esses objetos, sejam eles camadas ou grupos, e o que você pode fazer é rápido nesta pequena batalha arrumada. Ele vai arrumá-los assim, e também você não pode passar o mouse sobre as marcações entre esses elementos, e você pode ver pequenos ícones que indicarão que você pode clicar e alterar as marcações como este. E isso é muito legal, então você pode fazer isso para alinhamento vertical. Você pode fazer isso para alinhamento horizontal como este, e isso está ficando muito inteligente se você selecionar vários elementos ao mesmo tempo. Então você pode gostar disso, e ele até sabe que você tem que subir lá dentro. Você nem precisa ter outro grupo. É inteligente o suficiente para dizer. Então é basicamente isso. Este é o fundo arrumado e também os alinhamentos inteligentes. Além disso, nas versões mais recentes do Sketch, eles melhoraram o encaixe muito e aqueles guias inteligentes que permitem distribuir itens um ao lado do outro um pouco melhor. Mas isso não precisa de uma vitrine. Então, basicamente, é isso. Nesta lição, vejo-te na próxima. 13. Como Resizing as opções no esboço: Ei, antes que eu comece essa lição. Só um aviso de isenção de responsabilidade. Esta é a versão mais recente fora esboço e re opções de dimensionamento que eu vou falar sobre mudança ligeiramente no layout. Basicamente, é a mesma coisa. Então Pinto é do mesmo tamanho e fixo. Você tinha duas garrafas, uma para este acesso e outra para aquela. Agora é um “S O.” É basicamente isso. Eu não vou re gravar esta lição, então aproveite o resto no layout mais antigo, mas ainda assim o mesmo investir. Ouça, vamos falar sobre opções de dimensionamento no esboço. Então basicamente tudo o que você cria no esboço, seja um grupo montado ou uma camada que você pode acessar, é redimensionar opções à direita. E você tem diferentes opções de Redimensionar Inc, que são responsáveis por como esse objeto será dimensionado dentro de seu pai e, na verdade, para cima e para retângulo. Seu pai é esse grupo para o grupo. Seu pai é o quadro de arte. Mas vamos nos concentrar no grupo agora, e vamos nos concentrar nas propriedades desativadas, redimensionando para cima e retângulo. Então, se selecionarmos este grupo e tentarmos alterar minhas menções fora do grupo como uma nota geral , você deve lembrar que tudo escala em porcentagem. Então, se tentarmos escalar o grupo doce como você vê as escamas mais doces em conformidade. Então, se você tem 50% de desconto no grupo doce, você tem 50% de desconto no oval. Doce. E se você tiver 50% de desconto na altura do grupo, você também tem 50% de desconto na supervisão. Então é por isso que isso acabou está sendo deformado agora. Mas quando você tenta alterar o padrão para re opções de dimensionamento, então quando definimos algumas dessas opções são Very Size Inc, podemos, por exemplo, decidir que isso acabou será, eu não sei, Talvez peões no canto superior direito. Então vamos tentar movê-lo para o canto superior direito primeiro. E depois eu vou usar essas opções de exercício padrão, e nós vamos nos concentrar nessas pequenas alças. Então, dentro desta alças, podemos definir o alinhamento para percorrer qualquer elemento para a parte superior esquerda, direita ou para a parte inferior. Então, se eu quiser dedo do pé estar no canto superior direito, Eu seleciono ambos Olá, parar e direita. E agora, como podem ver, o oval está sendo escalado. Então ele muda de acordo com a porcentagem fora do grupo. Mas também é pinos dedo do pé do topo e feijão para a direita, modo que a margem entre o topo e a direita é fixa. Então, uma parte dessas funções. Eu também posso corrigir a largura e altura dos meus objetos. Então eu vou clicar, consertar trigo e consertar apertado dentro do over. Agora eu vou selecionar o grupo para que seu pai e eu vamos assustar o grupo. E, como você vê, o geral não está dimensionando. E, além disso, também é fixado na borda superior e direita para que as marcações permaneçam sempre as mesmas. Então nós temos as margens fixas, OK, e agora vamos imaginar algumas outras situações. Então talvez você queira colocar o objeto no centro direto de seu pai. Então agora o “over “está no centro do grupo. Mas quando tentamos assustar o grupo, como você pode ver, não fica no centro. E por que está acontecendo fora do curso? Isso está acontecendo porque definimos as opções Resize Inc e puxamos essa opção e decidimos que ela deve ser fixada à direita, e se foi à direita. Tem sempre a mesma Margon na fronteira direita dos pais. Então o que temos que fazer, temos que liderar esses pinos. Então temos que ampliá-lo, especialmente a partir da direita. Então agora nós temos trigo fixo e corrigir couro e nós não definir quaisquer opções aqui no redimensionamento Nós não podemos realmente dizer o significado esquerda e direita porque ele iria esticar o objeto. E temos o conjunto de trigo e couro fixo. Então é impossível. Então deixamos em branco e selecionamos o grupo. Vamos tentar redimensionar o grupo agora mesmo. E como podem ver, isto permanece no centro. Então, basicamente, esboço cuida deste objeto ainda estar no centro. Por que re dimensionando para que possamos colocá-lo no centro tanto vertical como horizontalmente e tentar Agora você pode redimensionar e você pode ter este objeto no centro exato fora de seu pai. Enquanto ainda as opções de redimensionamento estão desativadas e corrigir trigo e corrigir altura estão ativados . Então é assim que se faz. Ok, então agora que mudar para algum outro exemplo e eu vou desenhar o nosso retângulo aqui suprimir nosso eu vou desenhar um retângulo clique direito e copiar STAIs de cima para o retângulo. Lembre-se, você também tem esse atalho, que é turno comum See e Contrave. Agora vou esconder o “over “e vou mudar para o meu grupo. E eu tentei redimensionar o departamento como você pode ver, o objeto três tamanhos e também a esquerda e a direita Margon todos os tamanhos também. Então, se você quiser Margon corrigido, você pode definir a opção de recitação para que você possa fixá-lo para a esquerda e fixá-lo para a direita . Obviamente você não pode dizer a correção com essa opção. Mas agora, quando você tenta recitar o grupo, você tem belamente dimensionado objeto com margens fixas da esquerda e da direita. Então agora o que podemos fazer é esticar este objeto para que ele não seja apenas dor, mas também toque as bordas do nosso grupo. E agora se você tentar redimensionar um grupo, você tem comportamento muito bom, que é como, eu não sei, talvez rodapé fixo ou o menu em seu aplicativo móvel E mais uma coisa que podemos pedir que isto seja perfeito. Competimos para o fundo, e também podemos dizer que as alturas a serem fixadas para que a altura não muda com a altura fora do pirata. E agora você tem ah, componente bem projetado que você pode usar, por exemplo, em diferentes tamanhos de tela. E mais uma coisa que eu gosto de mostrar é que você pode desligar a altura de correção, e você pode realmente fixar este objeto em cada canto desse grupo para cada lado de seu pai. E para fazer isso, você tem que clicar no centro desse ícone. Então, se você ribeirinha no centro, você pode saber a escala, e lá você tem. Há o efeito Se você tem retângulo que é tinta para a esquerda, direita, direita, inferior e parada e por que não está se comportando assim. Então vamos mudar por um segundo para este modo que eu tinha. Então vamos entupir de cima que tentou redimensionar. Agora é margem zero da esquerda, zero da parte inferior e zero da direita. Mas quando você bebe para cima, bem, você tem a marcação fixa de cima. Então nós temos a marcação sobre, eu não sei, talvez 500 pixels do topo. E é por isso que esta forma se comporta assim. Então agora todo o texto está experimentando. Então, uma polícia tenta experimentar um pouco com as opções de redimensionamento e tentar, por exemplo, definir esse cara para ser paeanos no topo, no fundo e à direita. Então agora, obviamente, a altura fixa não está disponível. Isso é porque é feijão para o topo para o fundo para que ele se estica com o recipiente . Então você obviamente não pode ter a altura fixa, e talvez você possa ter o trigo fixo e vamos selecionar a correção doce por enquanto. E vamos tentar escalar esse grupo. Então vamos assustar os pais. E como vê, agora é 18. Mas não muda o trigo. E se você desligar esta função, então desligue o trigo fixo, você tem as ervas daninhas variáveis, e o com irá mudar de acordo com a mudança percentual de seu pai. Então é muito fácil contra. Então a última coisa que eu gosto de mostrar a vocês é como o conteúdo dos quadros de arte pode ser redimensionado com os quadros de arte dentro do Exército. Então, como você pode ver com o novo cronograma é e você é capaz de minhas notícias para que você possa mudar através de design de material, ele pode mudar para Responsive e, por exemplo, dispositivos Apple, e você pode selecionar o nosso barco. Então é muito parecido com o que eu mostrei a você. E agora você pode decidir que este nosso barco deve ser de tamanho diferente, então enfraquecer. Você pode acessar a arte sobre e você pode clicar no nome do iPhone Sevens, e você pode escolher o tamanho diferente da obra de arte. Então é bem semelhante, e agora você tem essa opção adicional aqui, que é um conteúdo justo sobre as recitas. Então, aqui está. Não vamos ligá-lo por enquanto. E vamos criar uma forma de sombra simples dentro deste quadro de arte. Então eu vou desenhar, e eu vou colocá-lo no centro do nosso barco. E agora, quando eu tentei redimensionar o quadro de arte, como você pode ver, o geral permanece no lugar para que ele não mude sua posição. Mas se eu disse que o conteúdo de ajuste na opção precisa e disse, selecione o nosso barco e agora tentar redimensionar esta placa de arte para que eles possam olhar para isso sobre o que vai acontecer. E agora temos esse comportamento padrão. Então, temos esse comportamento onde porcentagem fora das dimensões objetos é igual à porcentagem fora dos artigos. As massas agora que se afastam da disfunção, ajustam o redimensionamento do continente e vamos como o oval. Dê uma olhada na estrutura. Então, na arte a bordo é exatamente o pai fora do oval agora. E se eu disse que o trigo fixo ou excitar ou alterar qualquer coisa nas opções Resize Inc, por favor, note que o conteúdo de ajuste na opção precisa liga automaticamente. Agora, pelo menos, você não vai se surpreender, e eles podem olhar para este quadro de arte agora. Ele re tamanhos, mas o oval permanece o mesmo porque tem altura fixa e fixa com isso, dissemos, enfatizando opções. E também o Archbold é pai direto sobre isso. Então, todas essas opções de dimensionamento re são bastante importantes, mas também a sua opcional. Assim, você não precisa definir a opção Redimensionar Inc no início, e você pode lidar com eles mais tarde. Mas, para ser honesto, é melhor ter o hábito de definir as opções de redimensionamento enquanto você está criando alguns elementos, especialmente se você estiver criando, por exemplo, site First móvel que você está indo para um para algumas outras resoluções para um tablet e, por exemplo, para desktop. Então, se você trabalhar com as opções de redimensionamento enquanto cria governos, será muito mais fácil criar diferentes versões responsivas fora de sua interface. Então isso é tudo por enquanto. Obrigado por assistir e vê-lo no próximo vídeo. 14. Como usar máscaras: nesta lição, vamos falar sobre máscaras nas mesquitas são técnicas muito populares e muito poderosas no esboço, então podemos usar máscara para esconder ou revelar algumas partes das imagens. Você também pode usá-los para a forma. Então, basicamente, você pode usar deve em quase qualquer coisa no esboço. Então camadas, grupos, formas, imagens. Mas a abordagem mais comum é usar a forma simples para mesquita parte da imagem. Então vamos fazer isso neste quadro de arte, e eu vou selecionar um dedo retangular e desenhar um retângulo para a primeira foto. Vou ter fotos grátis. Preciso de mais um retângulo e desse cara que vou duplicar. Então o comando D vai manter o turno, Teoh. Coloque-o lá, e eu vou mudar clique para selecionar ambos os retângulos e mudar este lado. Então agora eu tenho três espaços reservados e eu quero usar as imagens dentro deste lugar titulares. Então eu tenho Paksas ponto com onde você pode encontrar fotos. Eu também tenho algumas segue de pixels no localizador. E se você quiser usar uma imagem no esboço, basta selecionar a imagem e arrastá-la e soltá-la em seu parafuso de arte e que você tem essa foto de pixel e eu posso agora com a segunda camada de seleção comum, que é retângulo, e este retângulo irá mascarar esta foto. Então eu vou a uma garrafa de mesquita em cima e eu clico mesquita. E aí você tem um grupo. E dentro deste grupo, você tem mais com a gente Pequena Flecha. E esta seta significa que esta foto está realmente sendo mascarada pela camada que está embaixo, e basicamente a ordem da camada inicial não defende para fazer a diferença. Então, se eu tiver este pacote de células foto sob ângulo direto e agora eu vi que ir formas e forma nos esboços de fotos inteligente o suficiente para mascarar a foto com o retângulo. Então lá você tem um grupo, e dentro do grupo você tem duas camadas, e você pode editar essas camadas separadamente. Então, o que significa que você pode ir para a mesquita e ir para a foto. Você pode ajustar as configurações da mesquita e da foto para revelar ou ocultar algumas árias desta foto. Então, a próxima foto que vou usar aqui, vou arrastar e soltar. E como você vê, eu tenho a segunda camada no mesmo grupo para que eu possa ter duas camadas sendo mesquita com uma forma. E como você vê esta pequena flecha, isso significa que isso está realmente sendo mesquita. Agora. Posso clicar com o botão direito e selecionar. Ignore a máscara subjacente para esta imagem. Não a incluir nos procedimentos de mascaramento. Certo, então é assim que se cria uma mesquita. E é assim que você decide se quer usar a mesquita para este conteúdo do grupo ou não . Então agora vamos mover algumas imagens e eu vou fechar este grupo e eu vou mover outra foto. E desta vez eu vou usar o Pai das células traseiras e você pode arrastar e soltar para aqueles diretamente do navegador para o seu. Pegar janelas. Então eu vou arrastar e soltar do navegador para esboçar. E como você vê, eu tenho essa camada. Eu tinha especificações, esta foto também, então eu posso vir e clicar para selecionar as camadas. E agora posso usar a mesquita, e em vez de usar esta batalha, vou pressionar o comando de controle M, que é o atalho para a mesquita. E como podem ver, tenho a mesquita agora. A diferença 11 entre o frasco e o atalho de teclado é que Agora eu tenho que ignorar máscara subjacente neste retângulo para copiar, porque o atalho não cria o grupo automaticamente. Então, se você clicar na mesquita, mas em você tem um grupo, e se você usar o atalho, você não terá um grupo. Então vamos encontrar algum outro pai e em pixels, você pode encontrar muito para fora grandes fotos e recurso é que você pode usar em seu projeto. Vou usar esta foto para a última mesquita, e vou selecionar a foto e o retângulo para copiar com Comando no teclado. E agora vou usar o comando, controlá-los para usá-la como mesquita. Assim eu tenho máscaras grátis para minhas fotos. Mas o 1º 1 foi criado com a batalha da mesquita, e outros dois foram criados com o atalho de teclado. E a diferença é que, por exemplo, se eu criar qualquer outra forma agora, então eu pressionar são e criar um retângulo. Como podem ver, tenho este retângulo sendo mesquita pela última máscara que usei. Isso é porque o atalho de teclado não criou um grupo para essas camadas, então você tem que gostar dos grupos como as camadas e criar um grupo com o comando G. Então eu pressiono. Vamos, G. E agora eu tenho um grupo para e essas duas camadas. E agora temos o grupo para todas as coisas livres que criamos. Agora vou mostrar-vos alguma outra técnica porque esta era uma mesquita simples, e nós também podemos criar nossas mesquitas agrícolas no esboço. E vamos usar outra foto que eu vou posicionar bem ali. Eu vou atraído. Esta será a minha foto de avatar. Então eu vou pressionar e segurar a barra de espaço para posicionar isso. E agora vamos usar a máscara. Então eu mudo clique nas fotos para selecionar ambas as camadas, e eu uso mesquita para criá-lo. Então é muito, muito fácil. E lembre-se que é sempre destrutivo, então eu sempre posso voltar. Eu posso ajustar a foto, ajustar o tamanho da mesquita, e eu também posso revelar um pouco mais. Minha foto. Então a mesquita é basicamente uma forma simples com sensação amarela. Realmente não importa, mas a opacidade é 100. Se você vai para ah, camada e molde mesquita. Esta é uma mesquita delineada, e você também pode mudar para uma hora de nós. E agora, como você pode ver, você não pode ver a camada, o jogador de mascaramento. Mas você ainda tem esse comportamento de mascaramento como antes. Mas o que você pode fazer agora é selecionar a mesquita e mudar o campo. Você pode mudar, realmente mudar a capacidade de combustível, que está lá. E se você mudar a capacidade de combustível, você também altera a opacidade do objeto. E, obviamente, você pode selecionar o grupo. Ou você pode selecionar a foto e alterar a opacidade da foto. Mas ter uma mesquita suficiente permite que você use, por exemplo, Grady INTs também, ter essa transição bonita e suave na mesquita. Então eu vou criar Grady int e vamos fazer um rádio, Grady, e eu vou falar mais sobre brilho mais tarde. Mas agora vamos mudar a posição e as mudanças do tamanho deste radiante, como você pode ver que há uma cor preta aqui. E se eu mudar a opacidade desta cor preta, como você pode ver, a cor branca revisa as coisas e as cores pretas escondem algumas dessa camada porque é alfa foi ajustado. Então isso só funciona com a Mesquita Alfa. Então, se eu for mascarar, moldar e mudar para fora como mesquita, como você pode ver, nós temos um Grady int sobre isso. Grady está se desvanecendo lentamente porque eu mudo a opacidade desta cor. Então, fora dessa cor preta e sem a máscara dela, você pode usar a opacidade para manipular a opacidade dos prêmios que estão sendo mascarados por essa camada. Então vamos mudar esse molde novamente. Vou usar um modo de mesquita e aí está você. Então, às vezes, você pode estar disposto a usar as mesquitas Alfa para alcançar este tipo de resultados . Certo, como podem ver, mesquitas são muito poderosas. Caracterize fora do esboço e você vai encontrar-se usando-os mais e mais projetos da Inglaterra. Mas às vezes você não precisa de mesquitas. Você simplesmente quer sentir alguma camada, sentir alguma forma com uma imagem. E esta é outra técnica que eu quero mostrar nesta lição. Então, em vez de ter uma mesquita, vou desenhar forma simples. Então vamos trocar essa façanha dura. E agora vamos desenhar são retângulo simples. Eu vou pressionar, são e desenhar retângulo que sente este cartão e eu vou usar em vez de mascarar, Eu vou usar sentimentos. Então eu vou clicar no campo e lá você tem este pequeno ícone de imagem para que você possa sentir esta camada com uma imagem. Você pode escolher a imagem do seu disco rígido, mas você também pode simplesmente arrastar e soltar a imagem em sua forma para que você possa usar o finder ou um site para selecionar a imagem arrastando e soltando ali sobre este quadro-negro. E aí você tem a imagem que sente sua forma e você pode criar formas ainda mais sofisticadas e complicadas e senti-las com as imagens. E agora temos essa opção de campo habilitada. Isso significa que quando você dimensiona a forma e a imagem será dimensionada com a forma e ela não mudará suas proporções, mas será dimensionada para sentir as formas inteiras de algumas vezes você tem partes da foto escondidas , mas ele sempre vai sentir todo o shapewear. Quando você seleciona a opção pés, ele vai redimensionar de modo que sempre você vai ver toda a imagem. E se a imagem não é as mesmas proporções que uma forma, você tem esses mercados. A terceira opção é esticada e quando você usa alongamento, provavelmente perde as proporções da foto, mas você pode ver toda a foto e sente a forma. Então o último é revestido de azulejos. E quando você usa estilo, você também pode alterar esse máximo da foto assim. E como você pode ver, estamos gerando algum tipo de, ah padrão aqui e sim, é assim que funciona. Então, basicamente, você vai usar sentir quase o tempo todo porque ele se sente perfeitamente com a forma que você tem, e ele também escala perfeitamente para diferentes resoluções. Mais uma coisa para te mostrar. Vamos para os sites de pixels, e você pode usar o navegador e diretamente do navegador você pode arrastar e soltar o dedo do pé da imagem neste mesmo campo no menu de campo para que você tenha para esta imagem sentindo suas camadas para que você possa usar o navegador que você pode usar. Encontre lá com suas fotos para anexar aqueles para aqueles, e tê-los mascarado pela forma e também você sabe como dedo do pé usar a função mesquita no esboço. Então eu vejo vocês no próximo filme 15. Como exportar os ativos: Bem-vinda. Na próxima lição desta lição, vamos nos concentrar em exportar ativos de imagem do esboço. Vamos exportar gráficos vetoriais, bem como gráficos de grande máfia. Como podem ver, temos os grupos. Temos imagens lá dentro. Temos coisas do Victor. Temos nossas pranchas, então tudo pode ser exportável com este pequeno ícone na parte inferior. Então, se você clicar no sinal de mais e você selecionou placa de arte lá, você tem a placa de arte , que é feita exportável, e você pode até mesmo deslocar clique nas placas de arte para vê-los no painel de exportação. Torná-los exportáveis também. E como você pode ver, nós vamos exportar gráficos diferentes grátis. Você pode incluir ou excluir o fundo das placas de arte na exportação, e você também pode, para algumas opções. Então primeiro você tem esse tamanho e o X basicamente significa que ele irá exportar no mesmo tamanho a mesma resolução que você esboçou. Então, neste caso, nós vamos exportar em 7 50 por 13 34 pixels porque é um X. Nós também temos seu prefixo e sufixo aqui e por padrão. O nome fora aqui se eu vou ser o nome fora da camada ou o comestível, mas você pode ter algo no início ou no final, e ele também tem a forma dos padrões para PNG. Se você clicar neste pequeno ícone, você pode aplicar uma predefinição de fatia. Isso significa que você pode usar uma predefinição, por exemplo, para Android ou para IOS. E se você selecionar IOS, eu tenho escalas para IOS. Então 12 e X livre e de acordo com este escasso. Eu tenho o sul do Texas e vamos exportar desafio agora e eu vou te mostrar o localizador. Como você pode ver, essas imagens estão sendo geradas, e eu tenho fogo livre para cada artigo. Então deixe-me ir para essas opções de exibição e vamos mostrar informações do item para que você possa ver os tamanhos . Então um tamanho é este X. O 2º 1 é o dobro do seu tamanho e o Fred é três vezes o seu tamanho. Então, por que precisamos de tantas imagens para IOS? Bem, isso está conectado à tela e à densidade de pixels na rotina deste lugar, que é muito, muito alto, então você tem muitos pixels na tela, o que o torna extremamente nítido. Mas, por outro lado, você tem seu dispositivo, que é muito pequeno, então é como talvez quatro ou cinco polegadas para uma tela no telefone. Então, se você servir uma imagem que este X para o usuário, seria muito, muito pequeno neste dispositivo. É por isso que precisamos de imagens de melhor resolução para diferentes dispositivos. E se você ver este material io dispositivo métricas site, você pode ver diferentes dispositivos, por exemplo, iPhones e no frio à direita, você tem densidades, e isso é basicamente o fator de escala. Então o iPhone 4 tem o fator de escala off para o iPhone 6 Plus tem o fator de escala off livre, e isso significa que temos que entregar imagens que serão tempos livres maiores do que a escala um X E para Android, ele fica louco e louco porque você tem escasso depois das quatro. Mas vamos esquecer isso porque o esboço cuida de todos os tamanhos. Então a única decisão que você tem que tomar é decidir o tamanho inicial de sua arte, entediado e decidido escala inicial. Se você for para a turnê do artigo. Você tem tamanhos mais antigos em uma escala X, e eu sugiro que você trabalhe sempre em um X. Isso é porque você pode então exportar para um x dois x ou X livre. E se você começar, por exemplo, a partir de dois ovos, você tem que exportar para eu não sei, 1.5, então metade para que ele não vai funcionar assim. Eu acho que a melhor decisão que você pode tomar é começar com esta escala um X, mas também uma desvantagem potencial de que poderia ser que mais tarde tem que exportar os ativos em depois livre ou quatro vezes maior. Portanto, realmente não importa se você usa o cronograma nativo, como ferramentas fiscais ou eficazes, porque eles serão dimensionados perfeitamente. Mas se você usar imagens, lembre-se de importar para esboçar ativos de alta qualidade, porque caso contrário, se você criar em uma extensão exportando 300% você verá que as imagens ficarão borradas. Mas se você importar para esboçar a imagem que tem uma resolução nativa desativada, por exemplo, eu não sei para OK ou cinco K, então você escala para baixo e então você exporta. Ele terá uma resolução perfeita porque o esboço sempre carrega essa resolução nativa, e quando você exporta, ele olha para a resolução nativa e que exporta em sua melhor qualidade. Então você logo descobre que pensar em todos esses diferentes fatores de escala e resoluções chega a uma batida porque em um caso fora de vetores, você sempre terá a escala perfeita de um vetor. E você nem precisa exportar os arquivos PNG, que são, é claro, imagens batidas. Então agora isso é X, essas resoluções extras. E vamos nos concentrar nos quatro meses. Então, se eu clicar no nome anterior, eu tenho 54 meses diferentes que eu posso escolher e no topo você bateu 54 meses, e na parte inferior, você tem vector livre quatro meses. Isso é pdf EBS e SVG. Portanto, a regra geral é usar vetores o máximo possível. Então, se você criar qualquer coisa dentro do esboço e usar agendamentos nativos, você sempre cria vetores. Dessa forma, você nunca precisa se preocupar com a resolução, e sempre exportou ativos fatoriais também. Mas você sabe, as câmeras ainda não tiram fotos no Vector, então você sempre tem mapas batidos no que diz respeito às fotos, então você tem que exportar os batidos, e então você exporta PNG ou Jay Peak fogo. Então J. Beck é um pouco melhor para exportar para dispositivos de armas porque em J volta quatro meses você pode selecionar a qualidade. Então, se eu selecionar Jay Escolhido e eu selecionar exportação, você pode ajustar o controle deslizante de qualidade para que você tenha um tamanho de arquivo menor e este arquivo será carregado mais rápido. Mas se você tem transparência em seu arquivo, você tem que selecionar P e G porque apenas o formato BNG tem esse financiamento total para ser transparência . Então lá você tem que quatro meses. Você sempre usa P e G ou J pick para seus arquivos, desde que você esteja lidando com mapas de batida. Então a segunda coisa são vetores, e você sempre tenta ter como diretores Marge o máximo possível no esboço. Portanto, sempre use essas agendas nativas ou importe do ilustrador ou de outro aplicativo que exporte vetores. Então, você usa PDF para dispositivos IOS porque no X frio, você pode usar PDF como um vetor quatro meses para outros aplicativos. E para layouts da Web, você sempre usa arquivos SPG, e nos últimos quatro meses, o último formato vetorial é E. P s e você usa E. B s Onley no caso de você querer adicionar mais tarde esses cinco que você está exportação de esboço em outras aplicações, como ilustrador Coral ou talvez loja pai. Então você pode exportar GPS e é bastante universal quatro meses que você pode abrir em qualquer aplicativo. Então eu vou selecionar SPG. E como você pode ver, nós não temos mais que lidar com essa escala porque como B j é vetor, então ele vai escalar perfeitamente para qualquer resolução. E isso é muito mais fácil ter vetores. Então, por favor, tome cuidado com esses ativos para que eles são de alta qualidade e exportar tantos fatores quanto possível. Então agora, como você pode ver, eu posso exportar, por exemplo, um grupo e sobre o nosso grupo. E quando eu voltar para este grupo de avatar, eu tenho um pequeno ícone de faca ao lado da pasta. Assim, todas essas configurações de exportação são lembradas no esboço, e você não precisa fazer isso repetidamente. Quando você voltar para um ativo que anteriormente tinha algumas configurações de exportações, eles permanecerão os mesmos se você tiver muitos ativos configurados para serem exportáveis no esboço. Você pode ir para este menu de exportação de fogo, e você pode ver todos os ativos fora, modo que a opção anterior que você exportar ativos individuais. Enquanto este pode exportar todos os ativos que estão configurados para ser exportável e você tem escalas , você também tem os 54 meses aqui você pode selecionar ou de selecionar o ácido que você deseja, ou você não quer incluir em sua exportação, e você pode clicar em Exportar para exportar tudo fora da imagem desta luta de esboços. Então, desta forma, você pode selecionar um grupo de camadas de exportação ou quadros de arte. E se você quiser exportar algo que não seja um grupo de camadas ou inaudível? Você vai para o dedo do pé de inserção e você seleciona esse estilo de vida, que é como no teclado, e não enfraquece ho sobre algumas camadas. Você tem essas linhas azuis que permitem que você apenas riacho e ter as configurações de fatia o mesmo que o objeto sob esta seleção, mas basicamente você também pode pegar um dedo do pé e criar uma seleção arrastando. Então agora eu tenho uma seleção off, não necessariamente uma camada ou grupo, e ele irá exportar em conformidade. Então eu posso dizer as opções de exportação, patinação e outras coisas. E no painel de camadas você tem isso como uma coisa separada. Então isso não é um grupo ou uma camada. Esta é apenas uma fatia que você pode ajustar mais tarde para que possamos alterar o tamanho desta fatia. Ou você pode, por exemplo, movê-lo para outro lugar, e ele meio que tira uma captura de tela do que você selecionar para que você possa ver essa visualização à direita , e você pode selecionar muitas coisas com essa fatia e é exibida no painel de camadas. Então isso significa que você pode alterar o nome dos slides que você pode. Eles precisam. A fatia poderia reorganizá-la, e é muito útil. Mas às vezes você tem muitas fatias em seu projeto, e você não pode selecionar nenhuma camada que está por baixo para que você possa ficar tão bonito. Você pode torná-lo invisível, mas você também pode usar esta pequena função que irá esconder todas as fatias. Então eu tenho 47 fatias aqui, e clicando neste pequeno ícone de faca, eu posso escondê-las todas. E se eu estiver pronto para exportar, eu posso revelá-los clicando neste ícone novamente. Então agora, quando você pressiona o comando Shift E, que é um atalho para esta janela de fatias de exportação, você pode acessar essa fatia recém-criada também. Então agora eu vou mostrar mais uma proteína bônus que você pode usar para exportar ativos diretamente do esboço e colocá-los, por exemplo, para encontrar a janela ou, por exemplo, para sua área de trabalho. Você pode facilmente selecionar qualquer coisa, como um grupo ou uma camada, e, em seguida, você vai para o painel de camadas e você simplesmente arrastá-lo para lá e você colocá-lo no finder e seu arquivo agora é exportado. Então, o que está neste grupo está sendo salvo como um arquivo PNG. Você também pode fazê-lo com uma placa de arte para que você possa facilmente arrastar e soltar coisas ao redor. E se você precisar rapidamente usar alguns PNG cinco de suas camadas do esboço, você pode fazê-lo como para que você não precise exportar. E fica ainda melhor porque se você usar folga, por exemplo, por exemplo, você pode selecionar qualquer coisa da coluna vertebral do avaliador, e você pode arrastá-lo e soltá-lo em slog. E então você tem esse ativo exportado e ele é carregado para sua conta de folga e, por exemplo, enviado para seu companheiro de equipe. E espere. Porque há mais. Você também pode selecionar os ativos exportados a serem enviados, por exemplo, para o Facebook ou diretamente com um e-mail como anexo com este pequeno ícone de compartilhamento. Então você clica neste ícone de compartilhamento e você tem todos os aplicativos em sua marca que suporta treinamento, por exemplo, masculino up Facebook, cintilação ou Twitter. Então é assim que funciona. Agora você pode facilmente exportar ativos do esboço e salvá-los em diferentes formatos. Vejo a próxima lição. 16. Operações de Mathmatical: aqui estamos na próxima lição, e como os anos podemos usar operações matemáticas em cada campo de entrada no esboço. E isso é realmente enorme, porque se você selecionar qualquer camada, você pode ir com a opção superior para o primeiro campo capaz de posição. E em cada campo de entrada você pode usar operações como, por exemplo, dividir ou adicionar ou multiplicar. Ou você também pode subtrair. Então vamos adicionar 45 vamos subtrair e extra para pedaços. E aí você tem. Você tem 48 pixels, você pode dividir por dois, e você tem 24. Você também pode, por exemplo, multiplicar pelo resultado da operação off para menos dois, e lá você tem 48 novamente para que possamos pressionar tab para ir para o próximo campo de entrada Oregon Press tab para ir para a entrada anterior e podemos usar o teclado Teoh conduzir essas operações matemáticas. Como você pode suspeitar. Vai ainda mais longe, porque neste sentimento de importação de trigo, o que podemos fazer é se tivermos estes 563 pixels, podemos derrubá-lo e você pode dizer, por exemplo, por exemplo, 10% por favor e aí está. Então é cerca de 55 pixels. É 10% deste valor. Agora, se adicionarmos algo subtrair, você pode ver que o trigo e o campo Hyde mudam de acordo porque o pequeno ícone de cadeado está ativado. Então, agora, se eu deslizar, se eu mudar o tamanho esta pequena imagem vai em proporções tanto quanto podemos esconder está em causa. Então agora o que eu vou fazer é na verdade eu vou mostrar a vocês uma maneira inteligente de escalar qualquer camada de um lado. Então vamos colocar 500 lá. E se eu colocar 500 eu quero, por exemplo, deste 500 fazer 600 para torná-lo 100 pixels maior, eu posso realmente dizer esboço para dimensioná-lo de um lado para que eu possa dimensionar a partir do lado esquerdo , e assim ele vai colocar este 100 pixels extra para a direita fora da minha imagem. Então, quando eu pressionar Return, aí você tem, 100 pixels para a direita, e eu posso voltar para 500, em seguida, colocar 600 colocar são para o fim deste campo de entrada e agora eu vou escapar da direita, modo que significa que irá adicionar 100 pixels à esquerda. E como você poderia esperar, você pode usá-lo em altura também. Então, em altura esquerda e direita, realmente não faz sentido. Mas você pode usar o topo e o fundo, então eu vou dizer 50 grátis. E agora eu vou expandir por 100 pixels e eu vou adicionar T no final, então T significa topo. Então é por isso que eu vou me assustar desde o início. Então eu estou adicionando estes 100 pixels para a parte inferior e para o oposto. Eu também posso escalar para o fundo. Então eu estou começando de baixo e eu vou adicionar 100 pixels para o topo, e é assim que ele funciona. Você pode colocar esquerda, direita, superior ou inferior no final dos campos de entrada para escapar de cada lado. Então vamos mudar para algum outro campo de entrada pode ser transformado lá. Temos diplomas, mas não importa. Se você colocar passado 10 ele fará 10 graus de rotação, então é sobre isso. Então é assim que você pode conduzir operações matemáticas em campos de entrada fora do esboço agora , eu vou mostrar a vocês a próxima íngreme. A última lição foi sobre exportar imagens. Então, vamos agora para, por exemplo, nosso logotipo. Vamos selecionar o logotipo e torná-lo exportável. E como você sabe, você pode selecionar assustadores aqui para que eu possa selecionar um novamente. Por exemplo, coloque 1.4 para ter escala 140%. Eu tenho agora 160%. Mas também, posso dizer 100 pixels, por exemplo. E agora, quando eu exportar este logotipo, dê uma olhada no arquivo e eu vou pressionar o comando I para ver as propriedades e o painel Informações . Você pode ver que a semana fora este logotipo agora é de 100 pixels e a altura é definida de acordo com as proporções desta imagem, então ele nunca, nunca perderá proporções. Mas você pode configurá-lo para qualquer exercício que desejar. E agora vamos ter 500 pixels. Então, quando eu verifiquei o painel de informações, nós vamos ter 500 pixels de largura e 500 pixels 5 48 pixels de altura para que ele mantenha as proporções. E isso não é bom. Porque em vez de pixels, você pode usar letras. Por exemplo, você pode colocar a letra W para ordem de trigo sua idade para altura. Então, se eu dissesse que é livre 100 altura, não será superior a 300 pixels. Então vamos exportá-lo como local, também, e você pode ver que ele ainda está em proporções. Tem 300 pixels de altura e, consequentemente, 274 nos fala. Espere, então você não precisa igualar a necessidade de abastecer este segundo número. Você simplesmente disse uma resolução, por exemplo, 300 pixels de largura. E vamos dar um nome fora do pouco livre. E sempre temos essa altura proporcionalmente dimensionada nesta luta. Então isso é precisa lembrar essas letras, w e idade, e também lembrar as letras para esquerda, direita, direita, superior ou inferior ao lado, e a última profundidade nesta lição é definir os rádios de borda para o seu forma para que possamos definir os rádios aqui e vamos selecionar o retângulo e vamos mudar o raio da borda. Como você pode ver estes rádios fronteiriços, qualquer que seja o valor, ele muda para todos os cantos. Então, e se quisermos alterar os valores separadamente para cada canto? Podemos fazê-lo neste campo de entrada. Começamos a partir do canto superior esquerdo e depois vamos no sentido horário. Então o primeiro valor é para o canto superior esquerdo. E eu coloco zero isso como separador, uso ponto-e-vírgula. E então você coloca 20 pixels para o orgulho do dedo do pé. Zero pixels para a parte inferior, direita e 20 pixels para a parte inferior esquerda e pressione Return. Lá você tem um raio diferente para cada um dos cantos. OK, é isso. Por enquanto, vamos mudar para a próxima lição. 17. Grade de pixel: como mencionei em uma das lições anteriores. Sketch é um ambiente vetorial. Isso significa que tudo o que você cria dentro do esboço com essas ferramentas nativas é um vetor. Então, se você selecionar o ícone e pressionar os comandos K para dimensioná-lo para, por exemplo, 48 sobre 48 comentários para ampliar e eu tiver 1000 zoom nunca, eu posso ampliar ainda mais para, por exemplo, 13.000. E como você pode ver, tudo é extremamente nítido e claro, e esta é a beleza dos vetores. No entanto, às vezes você precisa exportar esses ativos vetoriais como um arquivo PNG ou como um arquivo J pic. Então, por exemplo, uma solicitação de desenvolvedor é que você entregue incêndios PNG e você tem que exportar. Bata nele. Neste caso, você vai ter que pensar em algo que é ir picos concordado, e basicamente grande. Tão grande é a propriedade fora de sua tela, e como você sabe, você tem um grande para que a cidade em seu monitor, bem como a resolução. Então, se você tem uma tela Full HD, você tem 1920 pixels brancos, e você tem 10 80 bicos nós alta. Então isso cria acordado e Quando você vai para as configurações de exibição em um esboço e você entra tela, você pode habilitar mostrar fotos da opção de leitura, eo atalho de teclado é controle X. Então agora você pode ver individuais nos escolhe em desengordurado no meu Iconix 48 por 48. E se você der uma olhada nas coordenadas deste retângulo, as posições X e Y estão na verdade em escolhas completas. Nós. Então agora o que acontecerá se eu imaginar esse retângulo e colocá-lo em alguns valores decimais? Então eu tenho esta Posição X e por que com este mais valores no final, e isso significa que ele não está na força para picos nós. Agora. Se eu for ver e mostrar células fracas, posso imitar como isso funcionaria e como isso ficaria nos picos. Concordou com o monitor enquanto exportado como um espancado. Então, se você olhar de perto, você pode ver que essas bordas estão realmente borradas agora, e isso é porque essas bordas não estão nas semanas completas de valores. Então, para mudar isso, podemos ir para as propriedades de posição novamente, e podemos apagar tudo depois de um coma. Então eu tenho agora valores horizontais que são perfeitos, e também eu preciso de valores verticais perfeitos também. E como você pode procurar, essas bordas borradas desapareceram, e agora o retângulo está perfeitamente alinhado dentro do pixel. Concordou. Então, como um take away, lembre-se que é melhor para manter os picos de valores em torno dele para picos completos nós o tempo todo para que você possa garantir que o monitor exibi-los corretamente. Agora vamos pressionar o Comando Coma novamente e vamos para as preferências de esboço. E na seção Geral, você tem essa opção de alimentação de pixel, e você pode alimentar camadas e aponta para limites de pixel ao redimensionar jogadores, e também ao alinhar jogadores. Então eu recomendo fortemente que você selecione ambas as opções. E agora, se você usar um dedo de opções de linha incorretamente, posições, camadas, bem como mover a camada ao redor, você sempre encaixar duas semanas inteiras de valores. Então vamos selecionar essas opções e deixe-me mostrar o que quero dizer com isso. Eu vou ampliar para mudar a posição deste retângulo novamente, e vou manter os picos acordados ativados, que você possa ver que ele sempre se encaixa no dedo do pé cheio, fala para cima, então eu não posso realmente deixá-lo na metade pizza. Mas o que eu posso fazer é que eu posso fazer para o campo de entrada, e eu posso digitar o valor decimal para que você ainda pode tê-lo em meio pixels, por exemplo. Mas é mais importante que quando você move as camadas, eles sempre se encaixam um quatro semanas sobre. Então isso é como este diamante agora. E vamos falar sobre talvez uma exceção a esta regra. Então, se você tem uma forma que você deseja transformar com a rotação para aplicar convite off, por exemplo, 20%. Como você pode ver, você obtém automaticamente esses valores decimais nas coordenadas X e Y, e basicamente você quer mantê-lo dessa maneira. Isso é porque, de outra forma, você vai ser. Mova a posição fora das coordenadas X e Y, e ele saberá que Logan está mais centrado dentro deste retângulo no esboço para cada camada individual que você selecionou, você pode ir para o menu de camada e selecionar em torno de duas capturas para cima, e é assim que você pode pagar esta camada para estar em valores de pixel total para co-ordenadas. Por isso eu não poderia, embora isso realmente não funciona neste fim, trabalho. Isso é porque ele agora é movido dentro do seu grande tão concordado e não está perfeitamente alinhado com o centro fora do retângulo. Então isso é porque eu pressiono o comando Z. E se você usar valores de rotação, por exemplo , 20 graus, você não precisa se preocupar em ser apenas, por exemplo, meia semana nós ou decimal valores fora pizzas. Você ainda está bem. Então vamos como este ícone e vamos como, fazer opções exportáveis. E como eu disse, você não pode exportar com segurança fazer A P e G ou um arquivo J pic, que é um arquivo espancado arquivado. Mas você tem essas coordenadas definidas para pixels completos de modo que ele vai olhar para o seu melhor, e por que motivo que eu tenho é selecionar uma caixa de seleção segura ou Web enquanto você está exportando caxumba de carne porque foi manter perfis de cor e também alguns meta mais tarde para que você têm um arquivo menor que carrega mais rápido, e é isso por enquanto. Vejo-te na próxima lição 18. Trabalhando com os símbolos: nesta lição, vou mostrar-vos uma das melhores características fora do esboço e a que vos vai poupar muito tempo. E esse recurso é símbolos. Então você vai usar símbolos em seu projeto para que você tenha muitas ocorrências fora de um símbolo que é definido no espaço do símbolo. Eu vou mostrar a vocês em um segundo, e se você quiser fazer uma mudança em todas as instâncias, você pode fazê-lo de uma só vez por qualquer coisa. O símbolo mestre. Então agora vou recriar isso no processo de embarque para um pagamento, e vamos selecionar as camadas que não precisamos sobre elas. E agora eu tenho apenas uma estrada que eu poderia recriar como montado. Então, para criar um símbolo fora de um grupo ou fora de uma camada, basta selecionar este grupo e clicar em criar símbolo inferior. Agora você pode inserir um nome para o seu símbolo e por padrão. É o nome da camada, e você também pode criar um espaço de símbolo separado que o esboço irá usar para todo o seu símbolo. Então eu recomendo que você selecione esta opção e eu selecionar Ok, Agora eu tenho na minha estrutura de páginas, símbolos, página. E nesta página, vou ter todos os símbolos. Por quê? Na página um, você só tem as ocorrências fora do símbolo. Então não agora. Vamos criar ainda mais símbolos. Eu vou usar todos os grupos com ícones para criar símbolos, então eu vou ter tick como um símbolo, também alerta. E eu vou transformar pontos em símbolos também. Então agora todos esses ícones estão na página de símbolos, e eu posso editar esses símbolos de monstro bem ali. E se eu voltar para a página um e tentar copiar as instâncias, então eu estou selecionando esses ícones e eu vou opção movê-lo para o próximo cartão para que você tenha duas instâncias fora de cada montagem individual que eu criei. Eu não posso mais editá-los na página um, mas eu posso clicar duas vezes neste pequeno ícone para ir para a página de símbolos. E se eu clicar duas vezes e fazer alguns ajustes aqui, eu posso, por exemplo, mudar a cor do ícone da vara, e eu posso selecionar a forma e ir para cor e talvez mudar para alguma cor avermelhada e ir de volta para a instância como você pode ver todas as instâncias fora do meu símbolo mudar de acordo. Então eu li varas agora, e é assim que você atualiza o símbolo no espaço do símbolo para que ele mude em seu layout . Então vamos imaginar que você tem o guia de estilo com o logotipo e todos os ativos que você pode atualizar uma vez, e eles mudam em todos os seus layouts fora das páginas. Então, vamos agora selecionar o número do cartão. Vamos alterar este nome para algum nome mais genérico, por exemplo Item. E eu vou mudar os nomes desses ícones também. Vou adicionar prefixo para eles, e será barra de ícone. Então agora eu vou selecionar este ícone barra e copiar e enfrentá-lo em todos os nomes do meu ícone. Então eu vou ter ícone, ícone, outros e, em seguida, pressionado, tem que ir para o próximo nome e colocar ícones tick usando esta convenção de nomeação particular para os nomes de símbolos vai permitir que você organizá-los no menu de inserção. Então eu vou para um menu de inserção no esboço. E como você pode ver, eu posso inserir símbolo a partir daqui, e o item é um símbolo autônomo. Mas todos os ícones estão agrupados no grupo de ícones, então eu tenho este ícone. Depois coloquei o Slash e tirei o nome. Outros pensamentos antigos. E esta estrutura está bem organizada neste menu de inserção. Então lembre-se que você pode usar esta convenção para agrupar seus símbolos e é muito necessário para manter seus arquivos organizados porque como você trabalha junto com esboço, vai ter milhares ou centenas de símbolos e você quer mantê-los agradáveis e limpos . Então agora vamos duplicar esses mentirosos. Vou optar por arrastá-lo e depois vir para duplicar. Agora mude, clique em todos os itens e vá para as opções de alinhamento. Vou distribuir deslocamentos verticalmente. Então agora eu tenho itens perfeitamente alinhados. Ok, vamos fazer algumas pequenas alterações no símbolo em si. Então eu vou selecionar o símbolo do item e o grego duplo para entrar no modo de edição no discurso do símbolo e eu vou pressionar comandos que me permitirão fazer esse campo de texto pedregulho e o que eu gostaria de fazer agora é mudar o texto de acordo em cada off no instante. Então agora você pode ver todo o potencial off símbolos porque você pode realmente fazer algo que é chamado de substituição e você tem configurações de substituição no parceiro certo quando você seleciona o símbolo e lá você tem todo o campo de texto que você pode alterar. Então eu tenho campo de entrada e também campo de rótulo, e eu vou colocar data no rótulo em vez do número do cartão neste primeiro símbolo, e eu também posso excluí-lo para voltar para a frase original original original que estava lá. Então, no segundo campo, eu vou colocar mês e ano em adiado. Eu estou indo sobre tinha o rótulo para ter este casaco CVV, e no terceiro 1 eu vou substituir o rótulo para que eu tenha frio postal. Como você pode ver, a convenção de nomenclatura para quatro camadas também é importante porque, dizendo rótulo em vez fora, Por exemplo, veículos CV é muito melhor para símbolos para ser mais genérico. Às vezes, em seus símbolos você tem muitos fora dos campos de texto e você não precisa necessariamente desses campos de texto. Teoh aparece no painel de sobregravação, então toe exclua-os de ser sobre retorno. Você pode pressionar o comando shift l toe, olhar a camada ou simplesmente olhar a camada na coluna vertebral, e como você pode ver ela agora não aparece no exagero. Portanto, se você quiser excluir o sofrimento de substituições, basta bloquear a camada no painel de camadas. A segunda coisa que eu tenho aqui em substituições por padrão é um logotipo Visa, modo que é basicamente uma batida meu jogador que eu posso substituir com algum outro batido para que eu possa selecionar o logotipo MasterCard, por exemplo. E aí está. Troquei o local. Então meu padrão em todos os seus símbolos você pode substituir bater meus jogadores, bem como você pode substituir os campos de texto. Então, o segundo cenário pode ser que você não queira que essa imagem de visto ou qualquer imagem apareça no lado direito do item. Então você basicamente quer excluir este logotipo Visa, e você pode escolher uma imagem de banco, por exemplo. Mas não é a melhor maneira de o fazer. O que você pode fazer é a primeira coisa que você pode separar isso de um símbolo. Então, quando você desanexá-lo de um símbolo, você não tem mais essa conexão entre a página de símbolos e este número de cartão. Como você pode ver, esta é uma pasta separada agora. E você pode, por exemplo, excluir ou ocultar esse logotipo do visto, então essa pode ser a primeira abordagem. No entanto, não é idéia, porque se você fez são algo de símbolo, ele não pode mais atualizar com o símbolo das mudanças símbolo de reunião. Então tem que ser uma maneira melhor de fazer isso. E é claro que é. E o que vamos fazer para conseguir isso é que vamos criar uma estrutura ainda mais complexa a partir de símbolos, que significa que vamos aninhar símbolos um dentro do outro. Então eu vou selecionar este logotipo Visa agora, e eu estou dentro do símbolo do item e fora o logotipo do visto dele. Vou fazer outro símbolo. Portanto, certifique-se de que você selecionou a camada local de visto e agora crie um símbolo fora dela. Vamos dar um nome de um logotipo, ou talvez algo mais genérico, como uma imagem, e eu vou selecionar. Ok, agora eu tenho um simples dentro do outro símbolo, e é assim que você faz este outro símbolo para aparecer nas substituições. E agora você pode selecionar non nas substituições para ocultar o símbolo nesta instância específica . Então é assim que você faz um símbolos aninhados que podem ter sobregravação. E vamos fazer isso para todos os ícones também, porque podemos esfregar os ícones em cada linha. Então eu vou mover para uma página de símbolos, e eu vou criar símbolos aninhados fora desses ícones novamente. Então eu vou mover os ícones primeiro para a posição correta no símbolo do item também, e eu vou ter certeza de que todos os ícones estão dentro deste símbolo do item. Então vamos mover o alerta também. E esta é até agora a melhor maneira de fazer isso. E eu vou mover os cães também. Portanto, não podemos destruir todos os símbolos restantes. Vamos selecionar os ícones e apenas pressionado backspace para excluí-los. E agora vamos fazer símbolos fora dos ícones que temos aqui. Então eu vou criar um símbolo e apenas ter certeza de que você colocar ícones barra antes de cada nome que seja bem organizado, e nós vamos fazer isso para os outros também. E também ícones Putin aqui, e vamos definir o nome para um novo símbolo pontos. E agora podemos trocar essas imagens. Isso é porque eles são símbolos investidos dentro do nosso item. Então eu não vou colocar nenhum para Dolce e outros aqui no segundo troll. Vou colocar as docas de Nantou outras e levar também esconder todos os itens. E aqui vou eu aparecer na teca. E no último, só vou mostrar o outro. Então eu vou colocar os outros para os outros. E os adultos não tão bem quanto a teca. Então estamos quase prontos agora, mais uma coisa que eu vou criar é essa pequena linha vermelha que aparecerá sob o campo que, por exemplo, por exemplo, alguém escreveu errado ou eu apenas coloquei um número de cartão incorreto ou algo assim. Então, por favor, tenha em mente que você tem que projetar todos os estados fora, por exemplo, um formulário ou uma garrafa, para que quando você lida com desenvolvedores, eles saibam exatamente como isso afirma, por exemplo, estado vazio, estado inativo ou estado de erro iria olhar Então eu vou ter uma duplicata desta linha e eu estou indo dedo do pé, ter um nome fora da linha e também criar símbolo para a dúvida. E vamos colocar ícones aqui e eu tenho alerta de linha também. Vou criar um símbolo para isso, e isso mudou primeiro a cor vermelha do dedo do pé. E vamos mudar a espessura para fazer e discretar um símbolo. By the way, alerta de linha é um bom nome porque é mais genérico do que, por exemplo, linha vermelha. E se você decidir mais tarde que você quer ter uma linha laranja, você terá que mudar os nomes de acordo, então é melhor mantê-los genéricos. E agora eu vou selecionar todos os itens com shifty, e você também pode executar operações em vários itens selecionados. Como você pode ver, eu desliguei a linha para cada item e para a última linha, eu vou apenas ligar esta linha vermelha que eu criei. Agora, se você está usando as versões dos EUA do Sketch, você teve sorte porque símbolos têm atualizações muito boas, que eu vou mostrar a vocês agora. E um fora do grande público que você tem que levar em conta para as próximas lições também é que anteriormente você teria que bloquear a camada para excluir essa camada de substituição. Então, se eu amo a camada de entrada no mestre de símbolos, então se eu ir para a página, isso será muito de substituir, então entrada eu não estarei aqui e eu estou usando isso na lição futura. Então, por favor, tenha em mente que esta é a maneira que não funciona necessariamente nas versões mais recentes do Sketch. Você realmente não tem que olhar nada. Basicamente, se você olhar alguma coisa, ele não terá qualquer efeito, seja visível nas substituições ou não. Mas você pode simplesmente desacreditar que algo é de substituições no próprio símbolo. Basta ir para o símbolo e selecionar o símbolo em si. Então eu clico neste item, e no lado direito, há uma dor de substituição gerenciada que você pode usar para permitir, e isso permite substituições tanto para tudo no símbolo ou você pode selecionar elementos individuais . Além disso, se você tiver, por exemplo, texto, texto, poderá desabilitar o valor de texto Onley para que não possa substituir esse valor de número de cartão. Mas você pode deixar estilos de texto habilitados para que você possa alterar a cor ou algo assim . Se eu voltar para a página e selecionar isso, você verá que para este rótulo, eu tenho apenas estilos de texto que podem ser substituídos e aplicados a ela, e eu não tenho esse valor de entrada, então não posso alterar esse texto de número de cartão em Aqui. Então é assim que você pode decidir e 40 se substituem. Você pode usar os valores aqui para que você possa alterá-lo assim. Mas para os campos de texto, também é muito fácil selecionar a sensação de texto que você pode vir e clicar no campo individual e, em seguida, clicar duas vezes. E agora você pode viver adicionado esta entrada substitui aqui também simplesmente clicando duas vezes porque você também tem todas as coisas individuais que podem ser mais escrito sob este símbolo . Assim, nas versões mais recentes do Sketch, você pode clicar neste pequeno triângulo ao lado do símbolo, e ele permitirá que você veja todos os símbolos dentro e todos os alimentos de texto e imagens e tudo mais. Você pode selecioná-lo a partir daqui, e a menos que ele não esteja desativado para substituições, você pode substituí-lo aqui para que cada pensamento individual tenha apenas uma configuração de substituição. E se você selecionar o símbolo inteiro este número de cartão, você terá todos os direitos disponíveis sobre, dependendo se é uma imagem ou talvez campo de texto, você terá coisas diferentes para escolher. Por exemplo, esta batalha professores qualquer medida, ou você pode trocar uma imagem. Se você tem símbolo, é do mesmo tamanho. Ou você pode, por exemplo, colocar texto aqui ou alterar o texto. Estilos de coisas diferentes estão aqui, e também estes pequenos ícones vão permitir que você salte diretamente para a definição do símbolo porque se você tem símbolos aninhados como eu mostrei a você, por exemplo, há esta linha de ícones, e este é um símbolo separado. É apenas aninhado dentro deste número de cartão, mas se você quiser saltar rapidamente para a linha de ícones, você pode apenas clicar nesta pequena seta, e isso irá direto para a linha em vez do símbolo dos pais, que é neste caso, o item. E também você pode fazer é usar esta pequena sobrescrever com dados coisa que eu vou explicar nas lições posteriores. Mas se você tiver dados de texto ou algumas imagens fictícias, você pode simplesmente usar dados catch off, por exemplo, cidades premiadas ou nomes, ou você pode trazer dados diferentes que serão preenchidos automaticamente. Mas faremos isso em uma das próximas lições. Se você já fez o suficiente e você quer voltar para o estado inicial fora do símbolo. Você pode redefinir todas as substituições de uma só vez clicando neste pequeno ícone de reset. Além disso, nas versões mais recentes de agendas ligeiramente alteradas. Esta lista suspensa que lhe permitirá pegar outro símbolo, e isso será basicamente você para substituir símbolo inteiro. Então, se eu selecionar um número de cartão, eu posso usar o ícone assim, e isso irá manter os tamanhos, as diferentes propriedades que você aplicou para este elemento. Isso é basicamente para as futuras lições. A polícia se lembra de duas coisas. A primeira é que você pode, e é o texto substitui diretamente na tela. Você pode dobrar, clicar e editar o texto. Isso é uma coisa legal, e o 2º 1 é que você não tem mais o dedo do pé olhar qualquer camada para que ele não esteja disponível para substituições. Em vez disso, você vai para o próprio item para o símbolo e, em seguida, você gerencia sobre os direitos para o lado direito. Isso é tudo para símbolos, e eu vejo você na próxima lição. 19. Esboçar bibliotecas: Olá e bem-vindos à próxima lição. Agora vamos fazer este bling bling bling bling. E isso é simplesmente porque as bibliotecas são um dos recursos mais esperados fora do esboço, e agora você pode usá-los. Eles são muito fáceis de entender. Isso significa que você pode basicamente usar outros disparos de esboço e os símbolos que você tem naqueles incêndios de esboço dentro de qualquer projeto no esboço que você tem para que você não necessariamente tem que copiar e colar todos os símbolos para a página de símbolos. Você simplesmente pode usar esses incêndios como bibliotecas. Então vamos inserir o menu. E aqui você tem símbolos e obviamente este tipo de texto ou, você sabe, aqueles já. E se você criar um símbolo fora deste cara, por exemplo, que criou e digamos que este é o nosso, por exemplo, símbolo de texto, você pode usar este símbolo, e isso tem este pequeno ícone de seta que você Já sei. Ele já está na página de símbolos, e você pode usar, inserir e, em seguida, ir para símbolos. E lá está a nossa tecnologia que, além disso, você pode ir para inserir, e aqui temos, por exemplo, IOS você eu projetei e esses são símbolos que estão dentro fora nesta chave de design IOS ey que você ter no esboço. E agora você pode usá-los sem sequer abrir este arquivo e mesmo sem importar elementos para o espaço do símbolo. Então agora eu não tenho isso na página de símbolos, mas eu não tenho aqui e agora vamos para as preferências de esboço. Eu pressiono comentário, coma, e aqui você tem isso uma parada na biblioteca. E agora só posso usar a Iris. Você eu desenho, a propósito, você pode clicar sobre este pequeno II vai pré-visualizar esta biblioteca. Mas também, você pode fechar a visualização e adicionar uma nova biblioteca. E isso basicamente pode ser qualquer arquivo de esboço que você tenha. Então isso é, por exemplo, importar isso. Você é a chave que eu tenho aqui, eu vou abrir isso e aqui eu tenho outra biblioteca, então isso é agitado. Você pode visualizar esta biblioteca novamente, e há alguns símbolos nesta biblioteca. Então, agora, quando eu vou inserir, eu posso ver Loja E, e eu posso ver todos os símbolos que estão dentro. Então, por exemplo, se você quiser usar um pouco de fundo, eu vou usar uma garrafa simples. É um riacho neste item e vamos colocá-lo no nosso incêndio. Agora o que você tem aqui também são ordenadas todas as substituições. Então isso significa que ele vai para esta luta e pode determinar se você quer mudar essa cor de substituição, por exemplo, para esta batalha. E isso muito legal porque você pode ter tudo em um só lugar. Por exemplo, este guia de pneus. Então esta fonte fora da verdade que você tem para seus arquivos de design, por exemplo, para o produto, e então você pode usá-lo repetidamente dentro das novas descobertas que você cria. Isso é muito útil, e você também pode distribuir esses incêndios pela sua equipe, e então todos podem usar essa fonte da verdade. E quando essas mudanças, você pode atualizar através de livros de drogas ou resumo ou de qualquer outra maneira, e você tem todos os ativos no lugar correto. Agora o que você pode fazer é acessar as preferências, ou você pode simplesmente clicar com o botão direito sobre este ativo nas bibliotecas, e você tem o mesmo menu, e a partir daí você pode desativar a loja E, e isso significa que você não vai excluí-lo deste bibliotecas. Mas ele simplesmente vai desativá-lo para que ele não seja exibido no manual de inserção, e então você tem show no Finder. E isso é muito importante. Lembre-se que você tem que manter os arquivos catch que são importados como bibliotecas em seu disco rígido. E esta é a principal diferença entre os símbolos também, porque os símbolos estão aninhados neste fogo variado que estamos trabalhando. Enquanto esses ativos que você cria e que você usa de bibliotecas não são símbolos em si, eles são símbolos, mas eles têm esse pequeno ícone de link, e isso significa que eles estão vinculados a esse arquivo específico que está em algum lugar fora do no seu disco rígido. Isso significa que se você remover essa fonte original de verdade, ou simplesmente movê-la para outro lugar em sua unidade, isso não estará mais disponível como um ativo aqui nas bibliotecas. Então isso é realmente importante, e você também pode abrir este fogo e esboçar, bem como removê-lo. Se você removê-lo de lá, você não irá removê-lo do seu disco rígido. Ele simplesmente removê-lo, removê-lo das bibliotecas, e eu acredito que isso é muito simples, e ainda assim é uma técnica muito poderosa para que você possa ter todos os seus ativos de design, por exemplo, logotipo e o prompt de tipo em um arquivo separado. E então você pode usá-lo em todos os outros incêndios sem importância em símbolos. Era sempre uma viagem quando você importava e copiava símbolos colados através das fogueiras. Então, se você mudar uma fonte fora da verdade em seus 15 você tem que ter diminuído um no outro e bibliotecas simplesmente resolver este problema. Agora vamos cavar um pouco mais fundo nas bibliotecas e criar uma do zero. E o que basicamente fará a sua irá criar algo que poderia ser chamado de Biblioteca aninhada. Então eu pressiono o comando e para criar um novo disparo de esboço. E agora imagine que neste arquivo de esboço, por exemplo, temos dois retângulos, então temos o 1º 1 que é a nossa cor amarela da marca, e o 2º 1 será cor azul marrom. Ok, Agora você pode selecionar esses elementos e criar símbolos fora deles que definir Kohler e isso será amarelo. E isso é a imprensa. Ok. E agora para o outro, vamos criar também um símbolo, e isso será chamado de livro. Ok, então por aqui. Temos um arquivo com dois símbolos de orbe SAARC azul e amarelo. Agora eu posso criar outro arquivo e este outro arquivo terá algumas, talvez formas ou eu console. Vamos talvez selecionar estrela e eu vou desenhar uma estrela. Este será basicamente outro símbolo. Então vamos criá-lo. Vou criar símbolo de estrela ícone aqui e pressionar OK, agora, dentro deste símbolo, é clicar duas vezes nele no espaço do símbolo. O que vou fazer é ligar para esta biblioteca anterior. Então vamos pressionar o comando vírgula. E também precisamos primeiro salvar esses arquivos. Então vamos salvar este horário gratuito sem título. Este será o curso para a nossa marca. Vamos salvá-lo. E também para este incêndio sem título, vamos guardá-lo como ícones. Ok, agora, vamos para a biblioteca. Vou criar outra biblioteca. Então isso é na biblioteca. E aqui temos nossas cores abertas, e podemos usá-la dentro do símbolo agora. Então, se nós, por exemplo, quisermos chamá-lo daqui, vamos para as cores e vamos usar nossa cor azul. Eu vou colocá-lo sobre esta vez eu vim assim E agora nós vamos fazer é simplesmente selecionar a estrela e clicar com o botão direito sobre ela e selecionar mesquita para que nós tenhamos mascarado fora esta cor com a forma eo que nós podemos fazer se nós voltarmos para a instância. Você pode ver que nós temos essas cores substituições, e essas são do nosso fogo de cor. Você pode selecionar a cor amarela para mudar o carro para amarelo ou, por exemplo, azul. OK, então agora vamos salvar este comando de fogo e vamos ter certeza de que as cores também estão seguras e vamos para a nossa primeira descoberta. Agora, se você for inserir e usarmos ícones, podemos usar um dos nossos ícones que temos aqui. E se colocarmos este ícone dentro, você verá que também terá a sobreposição. Então agora esse ícone é disso. Ícones, notas, pegar fogo. Mas o núcleo que temos nas substituições pode ser substituído, e é de cores. Isso é pegar. Então agora você pode organizar essas bibliotecas, para que você tenha ícones, cores, cores, logotipos, telefones, todas as coisas diferentes, e então você pode vinculá-los e mesclá-los juntos. E a melhor coisa é que você tem esta estrela ícone como um recurso separado. Está fora dos símbolos porque está simplesmente ligado. Então agora todos esses incêndios funcionam juntos como uma biblioteca desde a captura, e isso é muito legal. E, a propósito, se você quiser editar algum dos ativos da biblioteca, por exemplo, nesta parte inferior, você pode simplesmente clicar duas vezes nele e, em seguida, você tem as opções dedo do pé. Abra isso em documentos originais para que você modifique sua fonte fora da verdade. E lembre-se de que quando você salvá-lo, ele mudará em todos os seus arquivos. Mas também você pode torná-la uma instância separada e simplesmente desvinculada da biblioteca. Se você fizer isso, em vez de passar por este fogo, você vai tê-lo dentro disso. Verifique se você está nos símbolos, então agora é um símbolo. Agora eu posso voltar para esta instância você vê que eu não tenho mais este ícone de link, e eu posso comer isso diretamente neste arquivo particular para que ele não mude mais na fonte da verdade ou nos outros cinco que ele usa essa fonte de verdade. Então há mais uma coisa que eu gostaria de mostrar nos lançamentos mais recentes do Sketch, você pode usar techstars nas bibliotecas. Isso significa que se você criar um quadro de texto e, em seguida, você deseja salvar essas configurações no texto são você pode criar um. Agora vamos em frente e criar novos têxteis. Agora vamos dar-lhe o nome off estilo um. E agora eu quero acrescentar isso como uma biblioteca. Então vamos para o menu de arquivos e você tem biblioteca de artistas. E depois de salvar o arquivo, você tem uma informação de que este documento é agora uma biblioteca. Então vamos em frente e criar um novo documento. Agora, nesta nova final, vamos Presti e criar um quadro. E se você verificar novamente as preferências, você tem esta biblioteca de testes conectada. Então, agora você pode selecionar o quadro e você pode usar estilos de bibliotecas de teste e aplicado a qualquer quadro de texto. Isto é muito fixe. E se você quiser que Teoh atualize este estilo, você pode apenas mudar as propriedades e você tem alguns truques de bunda aqui. Então o que você pode basicamente fazer é que você pode no link atualizar este texto para fora apenas para este documento , e se você quiser atualizá-lo na biblioteca. Você terá que ir para a biblioteca, então você tem que abrir esta hora de texto na biblioteca. Agora você pode aplicar algumas alterações, e depois, se você voltar a este arquivo, você poderá atualizar esse estilo de acordo. Agora, se você voltar para o arquivo da biblioteca de teste e criar qualquer forma e, por exemplo, usar alguma sensação, bem como alguma borda específica, você também pode salvar os estilos de camada como o texto I. se você voltar para o arquivo da biblioteca de teste e criar qualquer forma e, por exemplo, usar alguma sensação, bem como alguma borda específica, você também pode salvar os estilos de camada como o texto I. criar e usar estilo posterior, e isso é isso pode ser um estilo oval. OK, agora vamos salvar este arquivo e vamos para este novo arquivo e vamos criar um retângulo talvez, e nós podemos aplicar esses estilos de nossos testes elaborados arquivo. Então isso é muito legal. E desta forma, você pode trocar informações entre suas bibliotecas e tenha em mente que você também pode fazer upload dessas bibliotecas para esta nuvem de captura. Ou você pode apenas mantê-los em livros de drogas, e então cada membro de sua equipe pode contribuir para este arquivo. Você pode criar um guia de estilo no qual você tem estilos de texto diferentes, bem como estilos de camada que você pode vincular aos documentos que estão antes da mesma empresa ou clientes e, em seguida, você pode usar todas essas configurações para permanecer consistente. Então isto é tudo sobre a esperança da biblioteca. Você vai verificá-los e perguntou-lhe na próxima lição. 20. Trabalho em escala 1x: Olá e bem-vindos à próxima lição. Ao longo deste curso, vou mostrar-lhe como criar um layout bonito completo, muitas vezes aplicação dentro do esboço para que eu vou mostrar-lhe passo a passo processo que você tem que seguir para realizar, bem sucedido você Eu projeto. Então agora está focado na ala. Como e porquê. Assim, o básico é criar novos incêndios e configurar seu projeto no esboço Uma de suas primeiras decisões seria o tamanho do artigo. E a menos que você esteja direcionando um dispositivo específico, por exemplo, e iPhone oito, que é muito raramente o caso, eu recomendo que você use s assim chamado abordagem agnóstica dispositivo. Então, basicamente, vamos usar arte sobre o tamanho para um layout móvel que é para jogar fora e um layout de tablet, e vamos tentar este audível para ser gerado de acordo quanto possível. Então não pensamos nisso necessariamente como um iPod. Mas fazemos resolução, que é mais comum para a maioria dos tablets. E então tentamos manter nossos recursos de esboço organizados, e usamos símbolos, bem como as opções de redimensionamento que eu mostraria a vocês que nos permitirão fazer pequenos ajustes entre as resoluções. Então, se você tiver resolução 7 68 para um tablet, você pode facilmente ajustar para 1024 pixels, por exemplo. Mas ainda assim você tem dispositivos diferentes como artigos diferentes. E, baby, você os mantém organizados em diferentes páginas no esboço também, para que você tenha um layout móvel, depois layout de desktop e tablet separadamente e talvez até mesmo um layout de lavagem. E isso é porque eles são diferentes proporções e que você tem que ter em mente. Então, vamos selecionar. Alguns são dobrados e você pode escolher entre dispositivos IOS, por exemplo, e seletor iPhone sete audível para começar. Então agora temos a posição e o tamanho e vamos redefinir a posição para que eu tenha zero coordenadas x e y. E isso é apenas para limpar o projeto e vamos colocá-lo no centro e que a partir de agora , vamos tratar esta arte do iPhone a bordo como uma visão móvel independente de dispositivos, e vamos criar um layout móvel. E, a propósito, se você tiver o dispositivo que tem um determinado tamanho, por exemplo, iPhone ou algum dispositivo Samsung apenas você pode definir o peso e a altura do seu dispositivo para que você possa visualizar o layout que você está criando no esboço, e eu vou mostrar-lhe isso mais tarde. Então, agora vamos nos concentrar na resolução. Nós temos a largura e altura de 3 75 por 667 Bem, na verdade, isso significa que estamos criando um projeto em uma escala X. Então, o que significa que estamos criando-o em um Xscape? Vamos dar uma olhada no dispositivo Metrics site novamente, e vamos descer para ver o iPhone, e temos iPhone seis resolução e resolução nativa é realmente 7 50 por 13 34. Então você pode estar se perguntando, onde vem a diferença? E vem da tela retina, que dimensiona o conteúdo para que seja perfeito para o usuário. No entanto, você não precisa dividir esse valor em pixels nativos pelo fator de escala de densidade. Então nós temos o fator de escala off para, e você tem que dividir 7 50 por dois para obter 75 livre você tem que dividir 13 34 por dois e você obtém 667 e é assim que você obtém a escala de um X, que é diferente padrão para esboço e qual é o melhor para o seu projeto. Então, por que é melhor para o seu projeto? O que é melhor para o seu projeto? Porque você cria deseja que um ou dois usuários vejam e o usuário vê essa resolução x. Então você tem que ter em mente que para cada um dos picos que você cria, pode haver até quatro pixels na resolução nativa fora do dispositivo. Mas realmente não importa porque eles são escalados por dois. E para que o usuário veja essa escala x. E se você dar uma olhada em alguns outros dispositivos, por exemplo, você tem este iPhone seis mais e você tem idade completa a tela de retina. Mas o fator de escala é gratuito para que você obtenha por 14 por 7 36 para este iPhone. Então vamos começar com o iPhone 6 ou 7 na nossa placa, que é a mesma coisa. E vamos verificar duas vezes essas opções de exportação. 40 estão entediados. Vou definir a cor de fundo para um colarinho azul. Agora vamos selecionar o quadro de arte, então eu vou pensar em seu nome, e eu vou clicar em fazer opções exportáveis na parte inferior para ver os tamanhos da escala. Então, se você selecionar a predefinição de Iowa, você tem um x dois X e X livre. E se você começar com um x, que é o tamanho correto agora vamos ter este ativo dimensionado de acordo e vamos ter escalas perfeitas. No entanto, se você estiver indo para começar com resolução nativa fora do iPhone, então você vai começar com a escala de dois X. Você precisa alterar as configurações de exportação para que elas correspondam à escala. Então você vai para 0,5 para a escala 1, e então você vai ter um para dois. E se você quiser ir de dois para livre, você tem que contar 1,5 e é um pouco complicado, eu acho. E também tenho mais uma razão para este caso fiscal não ser perfeito. E vamos imaginar que temos essa escala de dois x e depois precisamos ter um 1 X ativos também. Então, a partir desta escala, precisamos do Teoh. Divida os valores do trigo e esconda-se por dois. E bem, se esses valores não podem dividir em quatro picaretas nós, por exemplo, se você tem um uma semana fora deste retângulo e você quer exportar o dedo um X, você vai ter 55 então você obviamente tem este borda desfocada na borda fora do pixel. E isso vai voltar para esta lição com porcos Concordo quando eu mostrei a vocês que se nós não temos células de pico cheio como nós a altura da porta, nós temos bordas borradas. Então essa é outra razão para não projetar no reboque XK, mas manter a escala um X. Mas também este. escala X é o menor tamanho do seu documento, portanto, significa que estamos exportando mapas de batidas. Você tem que levar em conta que esses mapas de batida serão até mesmo dois gratuitos ou quatro vezes maiores. E desde que você use programações nativas para projetar elementos gráficos, como retângulos, macacões e usar texto, você estará completamente seguro. E isso porque são vetores antigos e podem assustar até 100 vezes. E o gráfico ainda será perfeito. Além disso, se usar vetores, por exemplo, do ilustrador e você importá-los para esboçar, você estará seguro porque os vetores patinam perfeitamente. Não importa o quê. No entanto, você tem que levar em conta que, se você tem uma má qualidade, bater esfregões dentro de um incêndio esboço e você tentar exportá-lo do tamanho um x dois, por exemplo, quatro X quatro ovos livres. Esses esfregões podem ficar embaçados e rebocados. Evite essa degradação de qualidade nos esboços. Basta ter certeza de que os mapas de batida que você importa para o esboço são pelo menos três vezes maiores no exercício nativo do que o tamanho que você tem em seu design. E assim você está seguro, e o esboço é inteligente o suficiente para manter essa resolução nativa. E lembre-se dessa resolução nativa, mesmo que você torne essa imagem menor em sua interface. Então vamos dar uma olhada neste exemplo prático. Nós vamos ter uma foto, e eu vou verificar a resolução da foto I Press Command. Eu termino. Há um 3,5 1000 pixels nesta foto, por isso é uma boa qualidade. Quando eu arrastá-lo para o esboço, você verá que a qualidade é agora 17 48. Por quê? Por que isso aconteceu? Bem, isso acontece porque esboço já comprimido esta imagem para ser metade fora do tamanho do dedo do pé conta para uma retina, este lugar então você tem agora o tamanho da imagem que vai olhar grande tanto no padrão este lugar como bem como monitores de alta resolução. E você sempre pode pegar esse saco indo imagem da camada do dedo do pé e selecionando conjuntos de tamanho original do dedo do pé . Então agora esta camada é novamente livre e 1/2 K Mas o que é a coisa mais interessante no esboço é que ele lembra o valor que você tem como uma resolução nativa. Então, se você mesmo tornar a imagem muito menor, por exemplo, 100 pixels de largura e as pessoas, por exemplo, escala fora 15 X antes da exportação, que significa que é 1500 imagem maior e destruiria cada espancado, então você tem pixelado. Mas quando você exportar este arquivo, vamos dar-lhe o nome fora do teste e vamos para esta pasta de exportação. Você tem uma imagem que é 1500 por 9 45 Então o tamanho correto. E você viu essa foto? A qualidade é perfeita, e isso é porque o esboço tem uma resolução nua debaixo deste arquivo. E até que você tenha exportado cinco que é maior do que esta resolução nativa Off livre e 1/2 K você vai ter a qualidade perfeita fora da imagem, e agora você sabe tudo sobre patinação e você também sabe que o melhor K para começar é um X, mas também você tem que levar em consideração o uso de imagens batidas de alta qualidade para que eles possam dimensionar perfeitamente enquanto exportam para diferentes fatores de escala . E é isso por enquanto. Vejo-te no próximo filme. 21. Layout de diagrama: Então agora sabemos a abordagem agnóstica do dispositivo. Nós também conhecemos os fatores de escala, bem como isso. Temos que manter esta escala X em nosso projeto. E outra coisa é, se você estiver criando um layouts da Web, você deve sempre começar com o celular de você do que você faz uma visualização de tablet e depois, uma visualização de desktop. Então, essa abordagem é chamada de Mobile primeiro, e eu recomendo fortemente que você respeite isso. No nosso caso, estamos trabalhando em nativo para um dispositivo móvel, e agora eu gostaria de mostrar opções de configuração de saudação e também opções de configuração de layout que são acessíveis no menu de exibição. Então, vamos primeiro acessar as configurações de ganância e você pode escolher o tamanho grande do bloco. E também você pode ter as linhas grossas a cada, por exemplo, 10 blocos, o que é padrão. Assim, o tamanho do bloco para desengordurado eu geralmente definir para oito pixels. Essas linhas grossas geralmente padrão no meu projeto para 12. Então eu vou definir 12 aqui e oito grandes tão grande é realmente muito bom. Se você conhece diretrizes de design de materiais, muitas vezes você tem esses oito incrementos pacíficos, então vamos ficar com isso e para algum projeto. Você pode ter este declina, por exemplo, definido para 100 blocos ou 1000 blocos para torná-los invisíveis em seu acordado. Então, às vezes é só a ganância que queremos trabalhar com, e você não precisa que isso se recuse a aparecer a seguir. Temos a cor do nosso grande, e temos dois temas, e o tema escuro aparecerá em interfaces mais claras e luz. Tema aparecerá em interfaces mais escuras, e você sempre pode alterar a cor fora do grego em conformidade. Então, eles têm as cores e também podem tornar essas configurações de saudação padrão. Eu vou definir isso como padrão, e se você quiser justificar suas escolhas sobre a ganância, eu encorajo-o a ler o artigo, e eu tenho o link nos arquivos fonte para você. E este artigo trata da ganância, e explica o porquê. Na verdade, os oito pontos concordaram. As oito semanas concordaram. É bom tanto para manter o seu design organizado, como para manter os padrões, por exemplo, para as diretrizes de design de material e muitas resoluções de exibição e as configurações de especificações . Por exemplo, uma das boas descobertas aqui é sobre a maioria das resoluções de tela usadas mais frequentemente que você tem nesta tabela que eles podem ser divididos por oito, que é bom para e fala concordado. Então, se você tiver tempo, basta dar uma olhada neste artigo, seu final nos arquivos fonte. E agora estamos voltando para as grandes configurações. Eu vivo, ok, ok, e mais uma grande coisa sobre trabalhar com desengordurado como este é que se você tentar criar qualquer forma, ele vai se encaixar na ganância. Por isso, é fácil criar uma forma que esteja perfeitamente alinhada ao desengordurado. E também, como você pode ver, arrastar essa forma é fácil. Alinhe com a ganância. Mas se tentarmos combiná-lo, então se você tentar usar shift e as setas no teclado, o retângulo se move em incrementos de 10 pixels em vez de oito pixels. E isso é uma pena para o nosso grande. Então, felizmente, nós podemos corrigi-lo, e nós podemos ir para ah entalh-lo link site. Você vai encontrar em lutas fonte também, e nós podemos instalar este pequeno aplicativo gratuito que permitirá que você altere os valores noturnos para esboço, e eu vou clicar duas vezes sobre isso e então você tem este pequeno Nagy, que é basicamente apenas uma seta no teclado. E por padrão, é uma escolha. Então, e vamos configurá-lo para um pixel também. Mas você pode mudá-lo, e então você tem esse grande entalhe, que é Shift mais seta, e nós vamos defini-la para oito pixels. Então eu vou definir o valor do pé. O valor exato S s nossa saudação. E agora não podemos com os oito capta incrementos. Então tudo o que fazemos em esboços perfeitamente alinhado com um pixel grande e isso é o que você chama de um Santo Graal na indústria da ganância. Agora temos isso perfeitamente configurado e vamos mudar da ganância para um layout. Então vamos para ver e eu posso habilitar o layout definindo esta opção show layout. Eu também posso ir para configurações de layout. E antes de fazer isso, vamos mudar a visão um pouco para que eu possa mover a arte a bordo com barra de espaço para o lado para que você possa ver este layout corretamente. E eu vou para configurações de layout, e, como você vê, você pode definir pentes e rosa para um layout. Então isso é basicamente algo mais do que ganância. Vou desligar a ganância pressionando o controle G para que você possa ver melhor o layout. E vamos voltar a essa camada das opções como, como, como, exibir e layout estático. Então, como você pode ver, podemos definir colunas, bem como subiu em nosso layout, e o primeiro valor que temos aqui é o total com fora do layout. Então, como você pode ver, podemos ter o diferente com fora do layout, então o tamanho do nosso barco. Mas normalmente você vai manter o tamanho do quadro de arte, então você tem 3 75 pixels em termos fora da nossa leitura, bem como a camada. E a próxima configuração que temos aqui é a configuração de deslocamento, possamos deslocar o layout por, por exemplo, 20 pixels, e ele sempre o desloca da borda esquerda. No entanto, se você quiser que este oficial seja distribuído uniformemente entre a borda esquerda e direita, basta clicar no botão central à direita fora da entrada de deslocamento. Vamos redefinir essas 20 grandes vendas. Próximo. Você tem número off colunas então Normalmente ele vai ficar com quatro colunas em Mobile, oito colunas para tablet e 12 colunas para desktop. A próxima é a próxima configuração é Gutter Wheat, e o cortador é basicamente a marcação entre sua coluna para que você possa defini-lo para 16 e eu geralmente defini-lo para 16 ou 24. E isso determina a coluna. Espere. Então, se você tem 16 que a coluna, que será 82 porque o total com fora as configurações de layoff leste 3 75 em. Se você decidir alterar algum desses valores, os outros valores serão alterados de acordo. Então, se você decidir que a coluna deve ser, por exemplo, eu não talvez 65. Eu vou definir 65 aqui, e a sarjeta com agora está ajustada para que alimente a filha com fora do layout. Basicamente, o valor de 3 75 não pode ser dividido por quatro. Então é por isso que você vai ter essa pequena mudança em pixels de qualquer maneira. Então vamos padrão toe 24 nos escolhe. Eu acho que o 24 é uma grande sarjeta e às vezes você tem 16 também. Nós também podemos definir a reunião para estar fora, e agora vamos apenas para 24 novamente. E, a propósito, esses valores de trigo sarjeta não são coincidentes também, porque eu tento mantê-los como um multiplicador fora oito. Então eu tenho as oito semanas de acordo, e é por isso que eu mantenho a calha 8 16 24 ou, por exemplo, 32 para as configurações de layout. Demasiado as configurações de ganância o mais próximo possível. Infelizmente, como um peso total fora 3 75 não sendo Dividir Herbal por oito ou quatro você sempre terá esta coluna com que é ligeiramente deslocado de sua ganância. E é provavelmente por isso que eu tendem a não usar configurações de layout e não usar layout em todos os projetos móveis enquanto em projetos de tablet, bem como desktop. Essas configurações de layout são muito valiosas porque você tem muito mais espaço e é mais fácil . Organize este espaço, tendo as oito semanas de grande, bem como a estática de layout. Como você pode ver, você também pode determinar o número fora rosa, bem como reunir entre rosa e você vai selecionar a vista de ganância ou contorno para o seu layout. Você pode conhecer algumas cores de alteração, bem como tornar essas configurações padrão, e lembre-se também dos atalhos de teclado. Você tem que selecionar a arte a bordo. Em seguida, você pressiona o controle l para layout e controle G para a saudação. Então isso é tudo por enquanto. Vejo vocês na próxima lição. 22. Desças e de modelos e de modelos: É bom te ver na próxima lição. Nas lições anteriores, você aprendeu sobre esboço, ferramentas básicas, operações, símbolos comuns e eu quero fazer para me familiarizar com um esboço. E agora podemos avançar para a próxima parte do nosso curso, que será projeto prático fora de uma aplicação. Então vamos projetá-lo dentro do esboço. E é assim que eu vou mostrar a vocês um trabalho real, entanto, e alguns ainda mais em funções rápidas. Eu costumo começar com alguns arames e mais policiais, e eu amo usar caneta e papel porque ele só lhe dá esse tipo de liberdade, e você não precisa necessariamente Teoh desenhar lindamente. Ele só precisa desenhar alguns componentes aqui em apenas se concentrar no fluxo de usuário. Então imagine alguma ação que o usuário precisa executar em seu aplicativo e, em seguida, tente recriar essa ação para que você use a quantidade mínima fora das telas e a quantidade mínima elogios. Por exemplo, se o usuário quiser mudar a temperatura na sala de estar, você pode desenhar uma tela ou telas que o permitiriam realizar essa ação. E é aqui que você cria um fluxo, então você não necessariamente. Eu tenho que anotar telas antigas de seus aplicativos e depois dirigi-los. Você pensa fora do fluxo, então você pensa sobre as ações específicas que o usuário precisa executar em seus aplicativos, e então você tem alguns esboços e você não vai. Teoh exporte esses esboços em formato digital para que você possa digitalizá-los. Você pode fazer uma foto e enviá-la para seu e-mail, ou você pode usar um dispositivo como o meu. É faísca de bambu, e permite que você se conecte ao aplicativo e sincronize esses esboços com um pensamento sobre dentro com o seu aplicativo. E agora podemos enviá-lo em PDF ou em alguns outros 54 meses. E o bom do Bumble Spark é que você pode realmente ter esses esboços no Vector também, mas você não precisa de tanto, então isso é apenas uma opção. Próxima aplicação que eu quero mostrar a você é sempre ser comp. Você pode usar seu iPod ou um iPhone para desenhar formas e criar alguns mais policiais e protótipos básicos dentro do aplicativo. Então, se você não quer usar caneta e papel, você pode usar este aplicativo para esboçar, e existem algumas aplicações lá fora que podem criar formas simples apenas desenhando. E você pode posicionar essa mudança de forma com o tamanho definido, e é muito bom talvez nota no telefone, mas no tablet, é bastante bom, geralmente na reunião. Por exemplo, com seu cliente, você pode discutir algumas opções. Você pode usar este fogão de gestos simples, por exemplo, desenhar um campo de texto e alterar o tamanho da exibição de texto. Como você pode ver, é bem fácil. Você também pode ter um estilista para o seu iPod, por exemplo, para executar essas operações. Como você pode ver, você também pode excluir coisas facilmente. E a coisa boa sobre este tornar-se aplicação é que você pode facilmente enviar esses protótipos para, por exemplo, ilustrador ou para a loja. Você não tem a opção de enviar para esboço, embora, embora, mas você pode enviar para ilustrador e do ilustrador é apenas vir e procurar na TV para esboçar, e ele funciona lindamente e você terá vetores como seu protótipo. Então, aprendemos sobre a abordagem de caneta e papel, também os aplicativos móveis e, finalmente, você também pode protótipo e creed esses quadros de arame de fogo com aplicativos da Web, como a visão ou, por exemplo, Você explica. Então não vou te ensinar a usar todos esses abdominais, mas vou te mostrar como criar um projeto simples e do que se trata essa abordagem. Então o que você pode fazer é você pode se registrar para uma tentativa de sete dias. ALOF você explicar e apenas usá-lo livremente para este tempo. E você pode criar protótipos com desenhos que você já fez com um esboço para a loja. Ou você tem esse Jay Peak 5 que você importou. Por exemplo, isso se torna aplicação e você pode instalar os vagões também. Mas isso não é completamente depois que depois de criar um design a partir do zero. Então vamos projetar com isso, você explica, editor, e vamos começar com uma peça em branco fora da interface. Então, pedaço de conversa. E vamos definir essa conversa para ser do tamanho do iPhone 6. E agora você pode usar os atalhos com os quais está familiarizado. Por exemplo, barra de espaço para alterar a posição fora da exibição. E então você pode, por exemplo, usar esses fundos pré-definidos ou caixas de seleção, círculos, círculos, pontos de acesso, ícones para protótipo, um comportamento simples em seu layout, você pode até escolher uma foto Teoh ser carregado em sua experiência e novamente selecionar a pasta do seu disco rígido. E aí está, então sempre podemos usar alguns elogios que você já criou para o seu layout. E essas são as melhores coisas para descobrir qualquer novo Experian. Ou imaginar que você tem essas bibliotecas prontas feitas fora de componentes e, por exemplo, você pode procurar por barra suficiente do Iowa s iraquiano. Então você pode selecionar barra suficiente basta arrastar e soltá-lo em sua tela selecionada e apenas patinado para marchar o tamanho do seu barco de arte e então você Lá você tem isso para que você realmente não precisa se preocupar muito com estilo sobre cores tipográficas porque você é fazendo essa sensação baixa ainda mais cópia estão fazendo este quadro de fio simples que é tudo sobre funcionalidade, não sobre o design. Então você não se importa com ganância. Essas coisas não precisam necessariamente estar alinhadas corretamente. Por enquanto, sua principal preocupação é o usuário e as ações que ele ou ela executa em seu aplicativo. Então você tentou definir os componentes para que esses componentes ajudá-lo ou ajudar seu dedo do pé realmente para realizar essas tarefas na mãe mais amigável e mais rápida. Então você pode ter o texto, você pode ter alguns ícones. E novamente, não vamos nos concentrar nas próximas propriedades aqui, que vai colocar a cópia correta e vamos deixar Arial 14 ou 16 escolher-nos. Mas o que vamos procurar é o espaçamento correto e os elementos corretos,bem como elogios que permitirão aos usuários ver o que é mais importante nesta tela. procurar é o espaçamento correto e os elementos corretos, bem como elogios que permitirão aos usuários ver o que é mais importante nesta Por exemplo, esta é a tela de bloqueio da nossa casa, e eu quero mostrar algumas informações sobre os sistemas em casa. Então agora podemos distribuir esses elementos que podemos ver que é um bem organizado. Todas as informações necessárias estão na frente, e não temos nenhum barulho aqui. Não temos informações desnecessárias. Por exemplo, as informações sobre o endereço fora da nossa propriedade não são necessárias aqui porque temos a foto da casa. Então o usuário intuitivamente sabe que ele está editando essa propriedade. É assim que você cria quadros de fio simples usando papel flâmula usando aplicativos móveis, bem como aplicativos da Web, como você explica ou imaginou, mas você também pode é muito mais ferramentas de prototipagem, como real, que é muito popular, simulação para simulação mais e muitos, muitos outros. Então, o principal objetivo a ter em mente é que você crie Notre projetado agora para que você não se concentre no estilo, mas na função fora de sua aplicação. E a melhor abordagem que conheço é focar nas tarefas que o usuário tem que realizar. E então, se você sabe que ele tem que fazer uma determinada tarefa, você tenta criar uma tela que o deixará fazê-lo o mais rápido possível e na mãe amigável . Então isso é tudo por enquanto, eu vejo o próximo vídeo. 23. Como escolher as cores: Bem-vindos no próximo passo da nossa jornada. Então vamos criar um layout no cronograma. Mas primeiro precisamos de inspiração. Vamos imaginar que você criou todos os amigos de fio para o nosso aplicativo e também que você tem todas as idéias sobre o que o usuário vai realizar usando suas telas particulares no up. Agora vamos nos concentrar no estilo. Então, por estilo, quero dizer o início de nossos componentes, bem como cores, bem como tipografia e aquelas coisas que você procura nos sites como drible. Então o primeiro site que eu vou mostrar é drible e basicamente aqui você pode encontrar muitos componentes simples e peças fora do design que podem levá-lo a algum tipo de idéias sobre como você gostaria que seus componentes para olhar. E, claro, não é. Não é roubar. Não é lidar com 1 para 1, mas está apenas procurando uma inspiração. Por exemplo, se você disse para um perfil de usuário, você pode procurar por um design diferente fora do perfil de usuário e decidir se esta ou aquela solução poderia ser poderia funcionar bem em seu projeto, e depois você pode ajustá-lo para que ele pés as necessidades do projeto perfeitamente. Na verdade, neste ponto boa idéia é também criar uma conta Pinterest e ter uma placa para cada projeto onde você vai espiar toda a inspiração em você será todas as imagens. Então você pode voltar e ver toda a inspiração para esse projeto. É muito melhor Teoh ser capaz de comparar todas essas idéias e depois disso eu decido qual realmente funcionará melhor. Então, o Pinterest é um ótimo lugar para gerenciar suas ideias. E também eu recomendo que você vá para o Adobe Be casa que é um grande recurso fora projetos de classe palavras fantásticas . Então eu recomendo que você definir para, por exemplo, você I projetos ou algumas ilustrações aqui que é absolutamente incrível. E o próximo site que eu gostaria de mostrar é a premiação ponto com. Este site é realmente um dos meus favoritos em termos de inspiração Web design porque você pode encontrar muito fora realmente criar sites de qualidade lá, e você também pode procurar por uma determinada cor ou para determinado tipo de sites. Então é realmente ótimo ver esses sites que você tem no mundo que vem o próximo site é padrões e padrões é Ah, é um lugar onde você pode encontrar screenshots de aplicativos prontos, por exemplo, a partir da loja ou do Google Play. E se você procurar, por exemplo, por um design fora Airbnb ou uber, você pode ir para padrões e você pode definir para ele. Ok, você vai ter que instalar o aplicativo. Ok, então é assim que você procura por inspirações. Ou pelo menos foi assim que eu disse para inspiração. E essas são as equipes que posso te dar. E lembre-se sobre esta conta do Pinterest e o quadro para cada projeto. Vai ajudar muito. Então agora vamos para a inspiração de cores, e eu tenho alguns sites para você, então o primeiro 1 é color dot adobe dot com, ea idéia principal aqui é usar esta cor bem. Isso está no centro, e você seleciona qualquer regra de cola que você gosta, por exemplo, monocromática ou experimente ou complementar. E agora, se você tiver, por exemplo, experimentar para que haja um triângulo dentro desse círculo, você pode pegar uma cor e combinar as outras cores de acordo. A boa notícia é, se você selecionar qualquer uma das regras de cores. É muito difícil estragar as cores porque elas sempre combinam umas com as outras. Então isso é ótimo, também, para iniciantes e também para pessoas que por algum motivo têm algum problema com a seleção de carros para o projeto. Então você também pode selecionar este pequeno ícone, também. Carregue uma imagem e selecione um tema de cor fora da imagem que você gosta e aqueles que podem ir para um menu superior. E lá você tem a seção de explorar. Se você ir para explorar a seção, você pode explorar as escolhas de outras pessoas em termos de cores, e você também pode navegar por essas opções e vamos ver o mais popular. E lá vamos nós, para que você possa selecionar essas cores. Você pode copiar essas águas. Você pode economizar esta água para que você possa adicioná-la. Essas cores e cópia lá devem ser uso var ou os valores hexadecimais de cores em conformidade. Então é assim que funciona. E mais um até que eu recomendo, é cores que co. E ainda há realmente grande para, especialmente para aqueles de vocês que têm alguma experiência em teoria de cores e também sabem como escolher cores. Agora você pode pressionar a barra de espaço para alterar as cores em cada um lá fora. Cinco barras que você tem aqui. Então eu presidentes paga barra até que eu percebi que um do curso é, por exemplo, bom para o meu projeto. Então agora eu passar o mouse sobre essa cor. Posso ajustá-lo um pouco, por exemplo, torná-lo mais escuro. E agora, se você gosta da cor, você pode selecionar o ícone de cadeado para que esta cor seja bloqueada e as outras cores mudem acordo Quando você pressiona barra de espaço. Então eu pressiono barra de espaço tia, eu vejo cores que eu gosto. Então eu pareço outra cor. Por exemplo, Para esta cor azul, Eu vou para a opção superior, que é tons alternativos, e eu vou criar uma cor um pouco mais clara. Está bem, vamos ver. E para esta, vou voltar para as sombras e deixar-me... É como uma cor mais escura. Então, sim, aí temos. Agora vamos ver este aqui para que tenhamos mais um para levar. E, a propósito, isso não é uma coincidência que haja cinco cores e explicou mais tarde. Agora, quando temos a palete, podemos ir para a opção mais alta fora de exportação. Você pode exportar este Pollitt em quatro meses diferentes, por exemplo, podemos ir com o fogo SPG. E se selecionarmos o arquivo SPG, posso baixar o arquivo. E aí você tem o Pollitz disse ao SPG no esboço que vamos para páginas e eu vou organizar o nosso projeto um pouco para que eu tenha todos os componentes para o guia de estilo fora da nossa aplicação em um só lugar. Então eu crio uma nova página, dê-lhe o nome dos componentes. Vou desligar o layout, e agora posso arrastar e soltar o piloto. O SPG e bom pensar sobre isso é quando você acessar este grupo. Você tem retângulos mais antigos e você pode selecionar os retângulos agora e você pode ir para alguns . E agora você tem essa cor. Então você pode facilmente, por exemplo, copiá-los para amostras, que eu vi você mais tarde. Mas por enquanto, se você quiser criar seu próprio guia de estilo, eu vou criar um retângulo e dar um tamanho fora. 1 28 por 1 28 eu me livrei de todos os retângulos que eu tinha e se ele quer colocar em um valor diferente para eu sinto que você pode usar, por exemplo, por exemplo, sites como cores gordas y Caro e cores de design de materiais. Então o 1º 1 é 30 cores de desgaste que vêm, e aqui você tem essas cores lisas agradáveis que você pode copiar apenas clicando na cor que você gosta. Então você pode simplesmente clicar nas nuvens, por exemplo, E lá você tem o valor decimal Hexi fora desta cópia de cor, e quando você voltar ao esboço, você pode acessar a propriedade de campo e então você tem neste hexágono valor. Na verdade, ele é selecionado, então é apenas uma questão fora do comando V para colá-lo, e aí você tem. O segundo site é material poderes ponto com, onde você pode selecionar duas cores. E isso é muito bom, porque se você selecionar duas cores, por exemplo, azul e amarelo, ele gera o paladar de oito cores, e você também tem uma cor primária e uma cor de acento. Essas são as cores que você escolheu, mas as outras cores, por exemplo, imposto primário e texto secundário, ícones e outras coisas também estão aqui. Então, com base nessas duas cores, você tem um paladar fora de oito curso, que é bastante agradável e Você pode baixar os valores dessas cores como seus relógios, e você também pode selecionar essas cores para copiar seus valores decimais Hexi. Também tenho mais uma dica. Se você usar, por exemplo, este piloto pronto, Vamos ajustar, decide os retângulos. Então eu vou selecionar todos os retângulos. Vou me livrar do texto. E agora vamos matá-los todos juntos no esboço e vamos ter esses retângulos próximos um do outro . Então eu vou colocá-los um ao lado do outro e ali. Eu gostaria de mostrar a vocês como criar seus próprios pilotos, usando métodos simples fora, criando um retângulo que está em cima dos outros cinco. Agora vamos dividir a altura por livre. Vamos colocar esse cara na parte inferior de nossas formas e vamos mudar a cor para ah cor branca ou uma cor preta se você quiser mais escura, então eu vou mudar muito largo. Mas vou diminuir a capacidade pressionando quatro no teclado, e agora tenho 40% da capacidade. Eu vou duplicar este, e eu vou diminuir a opacidade no 2º 1 para 20% impressionando no teclado . E lá você tem diferentes tons da mesma cor fora deste feitiço do pequeno valor. Ok, então você tem escritor e o mais leve. E como você pode ver, você pode gerar diferentes tons e diferentes pilotos, diferentes partes para o seu projeto. Mais uma coisa que podemos fazer é criar outro retângulo e vamos dividir o trigo por livre agora. Então, em vez de gerar tons diferentes, vamos gerar matizes diferentes. Então vamos usar uma cor, por exemplo, um amarelo brilhante, e vamos começar como esta cor amarela, e vamos mudar a opacidade para 20. E também podemos acessar esses modos de mesclagem. E se selecionarmos sobre o modo de flexão de luz, como você pode ver essas camadas misturam-se uns com os outros e agora você tem um pouco de cores diferentes . Vamos subir com a opacidade. E como você pode ver, você tem 40 rapacidades agora, e você está gerando tons fora das cores. Mas também você está mudando um pouco de tonalidade. Isso é porque você tem esse modo de mesclagem, e você também disse que o campo é um acorde diferente do preto ou branco, para possamos experimentar com essas cores e gerar bastantes paletes e as diferentes variantes fora do carros que você cria para o seu estilo. Guia e eu também recomendo fortemente que você dê uma olhada nos sites como mostrado nesta lição. Mas agora vamos criar um guia de estilo para cores a partir do zero. Para a nossa aplicação, vou selecionar um retângulo que fiz. São 1 28 por 1 28 e eu vou me drogar. É e depois eu vou entrar no D algumas vezes para que eu tenha cinco retângulos. E isso não é coincidência termos cinco cores. Eso eu costumo usar cinco ou menos cores no meu projeto. O 1º 1 será a cor principal da marca. Guia para o 2º 1 é a cor do acento, e você vai usá-lo para alguns elementos de interface, como garrafas. O 3º 1 é para, exceto por isso será meio verde, os quatro fundos para erro. Então eu vou usar um tipo de vermelho e o pé um é para texto, e é por isso que eu vou acelerar para metade porque eu posso ter texto claro e texto escuro, dependendo do fundo, então eu sempre uso duas cores para texto. Eu vou ter um, que é por agora, preto e 2º 1 que é, por enquanto, branco. Por que por agora? Porque eu cuido para evitar essas cores preto e branco, Eu costumo ir para uma escassez e disse a opacidade para 80%. E eu acredito que é muito melhor do que ter completamente essa cor ou defini-la, definindo-a para alguma cor escura. Isso porque quando você coloca o texto sobre algum fundo, que é, por exemplo, azul ou amarelo, você receberá parte dessa cor amarela em seu texto. Então você tem 20% de desconto na cor de fundo em texto, e é muito melhor para marchar essas duas cores e ainda assim o contraste é aceitável . Então, aí está. É assim que se cria. É assim que você começa a criar essa cor parece para o seu aplicativo, e vamos terminar na próxima lição. Antes de terminarmos esta lição, vou mostrar uma atualização para o painel de cores, que está nas versões mais recentes do Sketch. Antes de terminarmos esta lição, vou mostrar uma atualização para o painel de cores, Mas esta é apenas uma pequena atualização e tudo o que está na lição futura. OK, mas apenas em um layout ligeiramente diferente. Então eu acho que você vai descobrir. Mas vou te mostrar o que há de novo agora. Então, basicamente, eles, uh, adicionaram este valor hexadecimal aqui, então isso é muito bom. Você realmente não tem muito rápido sobre a cor para inserir este valor hexadecimal, mas ele ainda está lá. Você pode fazê-lo da maneira antiga e também pode alterar os valores fora das cores. Aqui dentro. Você tem documentos e núcleos globais neste menu suspenso, em vez de fora das seções. Mas isso é basicamente o mesmo para as cores do documento. Você pode adicionar cores lá e, além disso, você pode optar e alterar os nomes das cores. E isso é muito legal porque mais tarde, quando você estiver, descubra bibliotecas e compartilhando essas cores com outras pessoas. Por exemplo, com sua equipe, você verá que os nomes das cores realmente fazem sentido. Além disso, você pode selecionar e alterar a posição das cores, que é bastante limpo. Você pode mudar como eles aparecem aqui e também mudar de posição, e, hum, é basicamente isso. Você também pode selecionar as cores usadas com mais frequência, modo que as que você usa com frequência estão aqui neste pequeno ícone de relógio. Se você mudar o brilho, não há muito novo. Mas você pode mudar a cor, a cor inicial e final do radiante assim. E você pode girar o Grady int com este pequeno ícone. Também a partir do Grady INTs, você pode acessar o brilho global e documental, o que é muito bom, e você pode tê-los a partir daqui. Se você vai para imagens, há algumas mudanças agradáveis também. Por exemplo, você pode selecionar as imagens usadas com freqüência. Você também pode usar dados do esboço ou como rostos, por exemplo, ou você pode usar coisas como unspool Esh como um plugging, e eu vou mostrar-lhe como trabalhar com dados e lições futuras. Mas tenha em mente que você pode tê-lo lá dentro. Além disso, você pode armazenar imagens no repositório global de imagens ou nas imagens do documento. Então, toda vez que você tem uma imagem, você pode adicionar isso e você não precisa mais procurar por esta imagem em seu disco rígido. Então isso é muito legal. Além disso, você tem uma imagem é se você, por exemplo, em outro campo que faria sentido você pode acessar este pequeno ícone tanto nas bordas e, em seguida, imagens que lhe permitirão aplicar alguns modos de mesclagem. Eu vou explicar os modos de mistura em detalhes, e isso é bom porque você pode misturar e combinar essas camadas e você pode alterar suas posições e aplicar algum modo de mesclagem para que você realmente não precise ter várias camadas. Você pode simplesmente operar nos campos, e você pode simplesmente misturá-los juntos ou em várias cores. E quanto às fronteiras, tudo é igual. Eles alteram ligeiramente o layout desses ícones, mas isso é fácil de entender. Basicamente, essa é a atualização que eu queria contar e ver na próxima lição. 24. Cores e símbolos: lá estamos na próxima lição e entre as lições que eu tratei meu esquema de cores com o erro de acento de fundo branco, exceto aviso e também para acentuar cores e era importante sobre esta estrutura é que temos a página de componentes. Mas dentro desta página de componentes, temos cada cor como um símbolo separado. Então este último, que não é um símbolo, mas um grupo que eu vou converter para um símbolo que eu vou colocar criar símbolo e eu vou colocar barra de cor e nome, tendo nomeado sotaque livre. Então agora é também um símbolo. Eu posso apagar essa cor, e eu posso colocar os símbolos um ao lado do outro e você pode acessá-los no menu de inserção. Mas também, se você alterar qualquer coisa neste guia terrível nesta seção de componentes e você tiver quaisquer instâncias fora dessas cores em seu projeto, eles serão atualizados de acordo e mostrarão isso em um segundo. Por enquanto, vamos criar uma forma simples, por exemplo, um retângulo e menos acessar as opções de cores. Então, se você clicar na cor, você tem esta caixa de diálogo de cores e você tem duas seções na parte inferior. Assim, primeiro 1 é cores globais, e o segundo é cores de documento. Então, como você poderia esperar, você pode salvar cores para mais tarde. No esboço e cores do documento serão cores acessíveis apenas a partir deste documento particular flagelo , enquanto carros globais são as cores que você pode acessar a partir de qualquer documento de esboço. Então vamos adicionar nossas cores de aplicativo à seção de cores do documento e o que eu vou fazer. Vou entrar e clicar no retângulo para que o combustível fique branco. E se você riacho sobre este pequeno ícone mais em cores de documento, você pode fácil nas cores para esta seção para que possamos dissecar todas as cores que eu criei assim exceto aviso e também as cores de acento. E agora podemos acessar essas cores a partir de qualquer caixa de diálogo de cores no esboço. Então agora você pode ter as cores, e se você quiser remover uma cor, basta arrastá-la para fora da caixa de diálogo de cores e esboçar e muito mais. Esta cor branca desapareceu agora. A próxima ferramenta muito importante em termos de gerenciamento de núcleo fora é esta pequena cor Pekar, para que você possa selecionar qualquer forma, e agora você pode mudar a cor que você está com esta cor Pekar e usar pode selecionar qualquer cor de dentro de seu projeto. Mas também, como você pode ver, você pode selecionar qualquer polar de Y. e isso não é tudo porque você pode me fazer o meu esboço. E se você tiver alguma janela fora do esboço, por exemplo, um navegador ou qualquer janela da qual você deseja ser chamado, você tem tudo fácil. Faça isso para que você possa selecionar um seletor de cores. Vá fora do aplicativo de esboço e selecione a cor que você deseja ter para o seu objeto. Então é assim que usar o seletor de cores e, na verdade, um atalho de teclado muito importante que você tem que lembrar é um atalho para o seletor de cores e este é o controle, Veja, Então, se você selecionar a forma e selecionar o controle, ver que você tem cor automaticamente um seletor de cores seletivo e, em seguida, você pode escolher qualquer cor para aplicar como uma sensação. Para essa forma, você também pode usar o hexadecimal, um valores decimais ou valores RGB. E se você clicar nos valores RGB aqui, você pode ir com as cores H S B também. Esta é quase 81 última coisa que eu quero mostrar nesta caixa de diálogo de cores é esta caixa cores usadas frequentemente e em seu projeto. Se você tiver muitos campos e muitos núcleos definidos como um valor de cor, eles também aparecerão nesses livros de cores usados com freqüência. Então vamos apagar esses carros e vamos nos concentrar em nossos símbolos. Então eu disse antes que é muito inteligente ter essas cores como símbolos separados. E isso porque quando você muda de idéia sobre uma cor em seu guia de estilo, você pode simplesmente mudar essa cor. E o que você tem são todas as instâncias fora desta cor fora. Esta cor irá mudar de acordo em todo o seu projeto, ou você tem que ter em mente, no entanto, é quando você cria um símbolo, e uma maneira de fazê-lo é apenas criar um símbolo fora de retângulo simples. E se você criar um símbolo que você não usa, realmente use essa cor de toque para definir as poucas cores como vermelho ou verde. Mas você tem que aninhar este segundo símbolo dentro, e mais uma coisa a acrescentar é que se você está criando símbolos que têm símbolos aninhados fora desta cor, não é suficiente para lidar e colá-lo. Você também não pode simplesmente arrastar e soltar esta cor até um outro símbolo. Então, se você chamar mar comum e comando V e tentar colocá-lo como você pode ver, ele ainda está fora da definição deste retângulo para símbolo. Então, em vez de fazê-lo, isso desmoronou. Todos esses grupos e esses grupos são apenas uma definição fora de um símbolo. Isso significa que você não pode simplesmente arrastá-los ou copiá-los para outro símbolo. E a melhor maneira de ter esta cor dentro deste retângulo para símbolo é ir para o local do concerto e selecionar o símbolo do grupo de cores. Agora você seleciona o sotaque e coloca o símbolo dentro do 2º 1 E agora, como você vê, esta estrutura de mensagens está funcionando muito bem. Então, em vez de copiar e colar, basta tentar inseri-lo a partir deste menu de inserção. E agora o que acontece é quando você tem esses símbolos bem organizados e você tem símbolos diferentes aninhados um no outro, você pode mudar a sensação original de uma cor mestre, e ela muda em todas as instâncias. Ok, então este é um ótimo caminho do pé. Na verdade, organizar suas cores e usá-las durante todo o projeto Então agora vamos para a página um e vamos mudar seu nome para home up. E nós vamos jogar com alguns fundos diferentes aqui e algumas propriedades diferentes de fundo para que você possa ver a diferença entre símbolos e entre usar, por exemplo, sentimentos simples. Então, vamos selecionar este artigo primeiro, e o que você pode fazer é aplacar as placas de arte, por exemplo, de tempo livre. Então eu pressiono. Venha no final, eu tenho a propriedade de cor de fundo. Então, uma maneira é selecionar todas as placas de arte, e agora você pode acessar a propriedade de cor de fundo e você pode alterar essa cor de fundo . Então, agora vamos nos livrar. Aqueles dois não são pranchas, e isso é muito bom. Mas você, por exemplo, não pode ter vários fundos também. Você como você não pode ter este símbolo aqui e por que, quando você cria um retângulo como este, então crie um retângulo que é 100% peso e altura fora do Archibald. E agora vamos selecionar alguns fora da nossa cor de fundo. E para este tipo de forma, você pode selecionar este pequeno ícone de adição ao lado do campo s para que você possa criar mais de um campo em uma forma. E vamos criar o rádio Grady int aqui que se dividiu por baixo. Eu estou aqui e que podemos ajustar as propriedades deste campo s O que ele tem, por exemplo, 60% de capacidade. E como você pode ver com um retângulo, agora temos que sentir que eu posso ligá-los ou desativá-los. E tendo selecionado essa forma, eu posso fazer um símbolo com ela. E esta é uma ótima abordagem. E eu também posso dizer, este símbolo para ser colocado no, ah, espaço símbolo. E, a propósito, você não pode alterar o nome original deste espaço de símbolo. Então, se você quiser que todos os seus componentes sejam iniciados em uma página no esboço, você pode simplesmente renomear a página de componentes para que você possa mantê-los todos juntos com seu guia de estilo . Então vamos colocar símbolos aqui e vamos voltar para as tomadas, criar o símbolo fora deste retângulo, e vamos ter um nome fora. Ok, isso foi cor e barra, então BG sentir e desligar. Além disso, vamos verificar isso enviado para Símbolos Página e agora em símbolos Página, Eu vou ter alguns que eu posso usar em muitas telas diferentes de meus aplicativos. Então isso te ordena e ter várias cópias deste primeiro parafuso de porca. E imagine agora que você quer mudar o plano de fundo em todas as telas. Você pode ir diretamente para este símbolo, e então você pode colocar, por exemplo, 30% de capacidade para este pequeno Grady. E como você pode ver, todos os símbolos atualizados em conformidade. Então é assim que você símbolos em cores e como você organizá-los no discurso símbolo. Vejo vocês no próximo vídeo. 25. Ferramentas de tipografia: nesta lição, vamos visitar alguns lugares agradáveis para a tipografia em nosso design você. Tipografia é extremamente importante, e você vai levar algum tempo para selecionar os telefones adequados, bem como tamanhos frontais certos para criar algo que é chamado de rampa de tipo. E eu vou falar sobre isso em um minuto. Então, primeiro você precisa selecionar o telefone que você gostaria de usar. E eu costumo usar telefones que google dot com porque esses são telefones gratuitos, telefones alta qualidade que você pode usar ambos. É captura, bem como em sua aplicação final ou um site. Também é bom ter certeza de que o telefone que você está usando está disponível no idioma fora do seu aplicativo ou de um site. E, finalmente, você tem Teoh selecionar o telefone que você está prestes a usar. Por exemplo, para o nosso projeto, eu recomendo que você use o telefone ou uma garrafa, então vamos clicar no ícone de adição e, na parte inferior, você tem uma família de telefone selecionada. Este é o robô da família, e você também pode mudar os estilos. Você pode ajustar o tamanho desta pré-visualização, mas vamos cetera Balto como nossos telefones principais. Na verdade, eu vou usar algum outro telefone, mas você pode usar roboto para que ele se encaixa perfeitamente projeto alcatrão. E para usar este telefone dentro do esboço, você tem que selecionar esta pequena seta e, em seguida, baixar este telefone. Então você precisa extraí-lo e instalado em seu sistema. By the way, há também um link que você precisa fornecer ao seu desenvolvedor se você deseja ter este telefone embutido em um site que você criou. Mas, por enquanto, só precisamos baixar este telefone. E, a propósito, eu tenho algum outro link também e algo para obter ajuda que você pode usar para baixar todos os telefones do Google para que mais de 800 de famílias você pode baixar como um arquivo e instalado em seu sistema. Você pode selecionar clube ou baixar aqui em obter ajuda e selecione Donald Zip. Você terá mais de 500 megabytes fora de telefones que você pode instalá-lo em seu sistema, e então você tem todos os telefones do Google que estão prontos para usar dentro do esboço e outro serviço que eu recomendo fortemente é kit tipo adobe, e este está incluído na sua associação à Adobe Creative Cloud se você pagar por sua associação . Caso contrário, você pode acessar fundos do kit tipo, bem como pagando algumas taxas. E você pode gostar dos telefones aqui e, por exemplo, disse a classificação. E também verifique o suporte ao idioma. E aqui estão realmente bons telefones que você não pode realmente encontrar em telefones do Google, seus telefones de qualidade. E também você pode usá-los em seu projeto Web, bem como em seu aplicativo. Então você precisa ter essa nuvem criativa para cantar esses telefones. Mas uma vez que você cantá-los com a nuvem criativa, você pode usá-los no esboço também. Portanto, ambos este site são realmente um ótimo recurso para encontrar uma frente agradável de sua escolha. E também, se você tem conta Creative Cloud, lembre-se que você pode usar o kit tipo, e também você pode usar esses telefones no esboço e o próximo site é telefones Paradox Co. E este é o site que mostra diferentes configurações fora de par off fundos. Por exemplo, você tem esses filhos Josefin e também você tem que jogar como uma cópia corporal, então você pode marchar esses fundos e como você pode ver, aqueles Paris parecem realmente bonitos. E também, você pode baixar aqueles Paris diretamente a partir deste site. Então, se você é um iniciante e você quer apenas dar uma olhada em alguns fundos que combinam entre si ou você só quer Teoh procurar alguma inspiração. A maioria desses fundos estão disponíveis em telefones do Google, By the way, você pode usar este site e o último é certo para isso é realmente um pied up, que é , eu acho, onde se é dinheiro porque permite sincronizar todos os telefones que você tem em seu sistema e gerenciá-los. Isso só está disponível para Mark, mas sim, recuse pegar. Obviamente, você é um marcado. Então, quando você abre este aplicativo legítimo, você pode procurar por telefones instalados em seu sistema. Não há telefones extras, mas ele permite que você gerencie os telefones para que você possa procurar por sons serif e todos os tipos de telefones. Além disso, você tem esta pequena pré-visualização e você pode ter o menor de seus telefones. Por exemplo, eu tenho todos os telefones do Google em um mínimo e todos os tipos de fones de ouvido que eu uso em uma lista também , e eu não tenho que ir para colar telefones para procurar por isso. Pelo menos eu posso ter também uma conferência I I aqui, e uma das grandes coisas sobre o telefone certo é quando você cria algo mais escasso. Quando você pressiona T para a ferramenta de texto e você trabalha com algum texto, você pode ter este direito, aberto e riacho através dos tipos para alterá-los diretamente no cronograma também funciona em. Serão software na loja de fotos para que possamos ver o mínimo. E em vez de usar essas ferramentas nativas de esboço para texto, você pode simplesmente usar a direita a partir do qual é, em muitos casos, muito mais amigável e tem mais opções. Então é assim que você procura inspiração, e também é assim que você escolhe a fonte. E se você fez uma escolha, você pode ir para um espaço de símbolo no esboço e dentro do espaço de símbolos vamos criar algo que é chamado de tipo romp e tipo romp é basicamente o set off tamanhos e estilos para os telefones que você uso em todo o projeto. E se você for ao material que eu devo, você pode ver as diretrizes de design de material para a garrafa dela. Na verdade, então se você usar um repórter para o seu projeto, você pode simplesmente copiar esses valores ou você pode criar o seu próprio. Realmente não importa o que lhe convier, e lá você pode ver que eles podem tirar a idéia de que tipo Trump realmente é. Então você tem estilos mais antigos, por exemplo, leve regular, médio e velho, uh, tamanhos mais antigos comparados com o que é chamado de exibição um display para também Heather em nosso projeto. Também títulos subtítulos, Baldick, Opie, legendas, botões. Então você tem todos esses tempos que serão reutilizáveis em toda a nossa aplicação, e então ele vai permitir que você fique consistente com as fontes. Você está usando isso que é muito importante para ter como tabela e layout bem projetado. Então, por exemplo, para manchetes aqui você tem 24 pixels regulares, na verdade, e então você tem, por exemplo, títulos com 20 pixels médios. E, claro, você também pode criar um tipo de fora do seu próprio, e eu recomendo fortemente que você faça isso. E se você não está tão confiante sobre essas relações frontais e tamanhos, você pode visitar o site net Greed Lover Adults e você pode definir o tamanho do telefone base aqui. Então esta é a cópia do corpo, por exemplo, 18 pixels. E a segunda coisa que você determina é a altura da linha, que tem que ser ajustada para que ela fique opticamente bem equilibrada. E depois você cria algo que é chamado de fator de escala. Então esta é a relação entre a sua urze basicamente, e este fator de escala é fornecido para o tamanho do seu telefone para determinar o tamanho do Heather. Ou você pode alterar o fator de escala. Por exemplo, dois grandes segundos ou pequenos esforços ou o que você escolher. E se você escolher alguma relação, por exemplo, você vai para a relação com você. Peça ao corpo que copie o tamanho da fonte de 18 e é fácil de vir. Aquele 18 multiplicado por dois é, por exemplo, 36 para a sua urze. E se você estiver satisfeito com esta seleção, você pode ir para valores de pixel. Qualquer um pode simplesmente copiar e colar. Esses fala nossos valores em esboço para que você tenha a rampa de tipo adequada. Ok, então é assim que fazemos em teoria e que são algumas ferramentas que vão ajudá-lo a estabelecer a relação entre o tamanho do seu telefone, e eu vou mostrar a vocês como ele funciona na prática. Na próxima lição, 26. Como criar uma rampa de tipos: Muito bem, é bom ver-te na próxima lição. Então, vamos continuar. E agora vamos nos concentrar em alguns estilos de texto. Então vamos reorganizar esses símbolos que eu tenho em símbolos Página. Agora eu vou diminuir o zoom, e ainda assim os símbolos serão realmente no fundo do nosso aplicativo para que eu possa criar um retângulo enorme aqui na página de símbolos e que eu vou senti-lo. Eu vou mudar a posição desta camada, e eu vou sentir esta camada com a cor fora dos meus atletas do fundo da minha aplicação para que tudo o que fica aqui esteja no contexto de algum fundo minha aplicação. Então vamos movê-lo para lá fora desta montagem. E agora vamos mudar a cor do combustível para um mendigo e cor. E agora posso ver tudo no contexto. Então agora vamos olhar esta camada eu vou peito mudança comum Idade é para esconder e mudança comum l é para olhar. Espero que se lembre dos atalhos. E agora eu tenho esta camada olhando para que nada seja selecionado. Quando eu clico nesta camada. Agora eu selecionar a ferramenta de texto com chá no teclado e eu posso clicar quer criar um campo de texto simples no esboço. Como você pode ver, este campo de texto se expande enquanto estou escrevendo. Isso porque esta é uma extrusão de tamanho alto, e se eu mudar o dedo do pé da semana corrigido, esse texto muda, e agora eu posso selecionar, selecionar, e agora eu posso alterar o tamanho do texto e os feeds de texto para deste tamanho. Também posso selecionar a ferramenta de texto e, em seguida, desenhar uma forma de um campo de texto para que ela seja corrigida automaticamente. Então vamos usar esses campos de texto fixos, bem como fora de experiência. Por enquanto, vamos consertá-lo. E vamos colocar Heather um dentro deste primeiro campo de texto. E agora vamos nos concentrar em algumas propriedades de texto. Vou definir Avenue como a frente de minha escolha, e se você não tiver Avenue, não entre em pânico. Você pode usar o Roboto. Como eu disse, Roberto também está grato. Agora vamos para a segunda propriedade, que é o peso, e você vai usar um pesos diferentes para estilos diferentes, e você pode ter o meio leve ter o seu preto. Basicamente, a regra geral para todos os projetos é que se você tem tamanho maior fora do imposto, por exemplo, Heather, você pode escolher algum peso mais leve, então talvez leve ou um meio. Mas se você tem texto menor, você vai ficar com médio, preto ou negrito. E isso é só porque se você tem texto menor, é mais fácil ler quando ele pesa mais. Então eu vou duplicar a urze agora, e eu vou ter mais cópias grátis. Então eu tenho quatro instâncias no total. Agora eu vou distribuir o espaçamento entre aqueles Heathers e eu vou criar diferentes variantes desta urze para estes. Tenha em mente que este não é um tipo diferente de Heather. Eu só vou criar diferentes variantes um do outro, e geralmente eu fico com livre, mais variância. Isso é porque eu vou definir isso para ser uma cor branca, e eu vou colocar um Toby algo entre 80 e 90% para que você não precisa necessariamente manter 100% porque não é tão bom. Se você colocá-lo no contexto do aplicativo. Às vezes é muito melhor quando esses 10 por cento extras são essa mesma cor que você tem no fundo. Então eu tendem a ficar com 80 Teoh 90% valores para esta primeira variante, ea segunda variante será no texto que é um pouco mais escuro. Ok, então se tivermos este 1º 1 pronto, vamos para o 2º 1 e vamos apenas manter este valor alfa. Não vamos mudar a cor. Então vamos ter texto branco. Mas aqui, vamos definir para ser, por exemplo, por exemplo, cerca de 50%. Então, geralmente esta segunda variante está em minhas aplicações cerca de 50%. E a primeira variante também, eu não vou mudar o valor Koehler. Só vou mudar o valor alfa. E este será o texto mais escuro, então ele se misturará com a cor que estiver por baixo. Praticamente assim. Vou colocar 20% de desconto na porosidade agora para a última. Eu vou usar minha cor de acento, e eu vou selecionar esta urze do que pressionar o controle, ver para chegar ao seletor de cores e eu vou clicar nas cores de acento para que ele agora é a cor do texto. E como uma exceção, eu não vou mudar a opacidade desta cor porque eu não quero que a cor azul se misture com qualquer outra cor do fundo. Então agora você tem quatro variantes fora do seu texto e esta cor de acento Heather, vamos usá-lo, por exemplo, para você, onde mais em nosso design. Então, se você está criando variância de texto, você vai ter que criar outro retângulo que vamos sentir com alguma cor clara, e você precisa criar essas variações para fundo escuro e branco. Então é por isso que estou escolhendo os Heathers. E se você pressionar o comando procurando na TV, você vai colá-los no lugar. Mas se você selecionar o retângulo e pressionar o comando chefe de TV, o esboço irá colar o conteúdo teclado no canto superior esquerdo do que você selecionou. Então agora vamos posicionar o texto, e vamos selecionar a Heather livre. Então eu preciso selecionar todos os Heathers em vez da cor de acento em, e eu vou para o 2º 1 e eu vou selecionar o valor Alfa para ser em torno de 50 aqui também. E também, vamos ajustar o valor fora da segunda Heather e vamos ficar com 20% de capacidade. Agora vou controlar o nosso só mostrar aos governantes. E eu vou dizer a régua para que eu possa igualar a posição desta Heather. Esta é apenas uma questão de ordem na sua página de símbolos. E a próxima coisa vai fazer, nós vamos criar algo que escola, o têxtil, e nós podemos selecionar qualquer campo de texto que temos dentro do esboço. E não há têxtil à direita. Podemos criar um novo têxtil a partir deste menu e podemos dar-lhe um nome. Então vamos dar um nome de outro. Mas vamos fazer um prefixo, e eu vou ficar com D barra Heather. E isso significa que esta é uma opacidade 90 fora desta cor branca. Então isso significa que é o mais claro fora dos cabeçalhos que aparecem no fundo escuro. E esta é apenas a minha convenção de nomes pessoais, mas funciona muito bem. E daí se tiver 80% de desconto? Bem, isso não importa. Eu sempre coloco 90. Está bem. E aqui, por exemplo, eu sempre coloco 50 mesmo se é 45 ou mesmo se é 58 Eu sempre coloco Heather 50 e eu também coloco o para que eu saiba que ele aparece no fundo escuro e para o texto que eu tenho on-line fundo, eu vou criar um novo estilo, e eu vou colocar l e o L representa a vida. Então esta urze é 90 no fundo claro. Então, aí está. E se você organizar seus laços de texto de tal maneira, você pode então ir para inserir e você pode ir para no estilo de reboque texto, e você pode ver que o D e L significa escuro e claro. E esses são dois grupos que criarão criado porque eu uso essa barra no nome e agora eu posso acessar qualquer fora deste estilo de texto, e eu posso fazê-lo de duas maneiras. Eu posso ir para inserir texto de estilo. E aí você tem essa separação entre fundos escuros e claros e em fundos claros . Posso ter este texto de urze 90, por exemplo. No escuro, eu tenho duas variantes, e se acontecer de eu criar qualquer campo de texto que eu queira formar neste estilo particular, eu vou selecioná-lo, e eu vou colocar algum texto dentro indo para selecionar o texto, e eu posso sempre, na verdade, a partir deste mínimo também. Então eu posso selecionar que este imposto será variante 90 em fundos leves. Certo, então é assim que se faz os têxteis. Oh, e também uma atualização rápida para esta lição. Se você tiver um campo de texto e quiser colocar o texto no centro horizontal, você pode fazê-lo com esse cara pequeno, mas ele quer colocá-lo verticalmente no centro. Você também pode fazer isso. Você tem que criar o trem de texto que é realmente maior do que uma linha de texto, por exemplo, assim e agora você pode colocá-lo no topo também. Pergunte para o meio vertical e para o fundo. E também, mais uma coisa que você vai encontrar novos e futuros lançamentos fora do esboço é que você pode acessar o menu de arquivos e, em seguida, você pode selecionar isso. Substitua telefones perdidos, eles livros antigos, e isso ajuda você a substituir todos os telefones no fogo. Por exemplo, se você baixar alguns que você gosta, então você pode ir aqui e substituir telefones mais antigos ausentes. Faça o telefone que você instalou e você pode fazê-lo para todos os telefones de uma só vez. Ok, então é isso. Na próxima lição. Quero dizer, entre essas lições, vou sentir o resto dos têxteis, e vamos avançar para o próximo passo. 27. Como criar o top: e eu disse, Bem-vindo à próxima lição. Primeiro, tenho um anúncio a fazer. Isto é uma boa notícia. Isso é porque a partir de agora, nas próximas lições, vamos usar todo esse conhecimento que você adquiriu e vamos criar um aplicativo prático no esboço. Vamos fazer um design que será um aplicativo nativo para IOS ou Android, e está conectado à indústria doméstica inteligente. Então vamos começar. E a propósito, tenho todos os meus duelos feios, todos os arames na minha frente no pedaço de papel. Então não está fazendo nada do espaço. É só fazer esses protótipos, certo? E é apenas organizar esses ativos no esboço para que possamos ter uma perfeita alta fidelidade moke up. Então, vamos começar com um dedo do pé retângulo e vamos desenhar um retângulo simples. Vou definir o tamanho deste retângulo para ser a largura total, mas também vou mudar a altura para alimentar desengordurado. Então eu vou puxar para o 72, por exemplo, ou 80 ou 88 para que ele alimente nossas oito semanas acordadas. Vou ficar com 88 aqui. É um tamanho bonito. Então vamos mudar a cor do Assad. Eu vou sentir e menos suco nossa cor de fundo. E agora eu vou usar um campo de texto simples, e isso vai ficar fora do extra. Então eu clico uma vez com o T O no meu teclado, e eu seleciono o estilo da Heather 90. Agora eu posso colocá-lo diretamente no centro, fora da minha forma e, basicamente, tanto quanto Texas concerto, você também pode ir para fixo. Mas agora você precisa expandir esse campo de texto para que o texto ainda mais longo apareça corretamente neste campo de texto. E agora está centralizado o texto, e agora você pode digitar qualquer coisa dentro desta chuva de texto e você sempre terá isso no centro. Para ser honesto, prefiro o caminho mais fácil. Então eu prefiro mudar para auto e apenas certifique-se de que este texto está centrado verticalmente e horizontalmente bem dentro desta forma. Então eu vou definir a forma, o texto, e então quando eles usaram e eu quis dizer opções. E agora, se você tiver esse centro de texto no quadro agora, você pode colocar o texto que quiser, e ele está sempre no centro. Ok, vamos seguir em frente. Vou colocá-lo ligeiramente no topo e vou selecionar um novo campo de texto. Vou criar um campo de texto com o endereço fora da nossa propriedade. Será porque a estrada 19, por exemplo. E agora minha abordagem não é fazer todos os estilos de texto para o macacão tipo com antecedência. Vou usar as coisas que estão criando no layout, e então vou movê-los para o nosso símbolo, Espanha, Espanha, para a rampa de tipo. Então eu vou criar um 50% de desconto no nosso texto de 10 pixels. E agora isso é estimativa se este texto é mesmo legível no dispositivo móvel, Então, uma maneira de verificar, que não é tão bom é alterar o valor do zoom para que ele corresponda ao tamanho físico fora do barco de arte em seu monitor. Muito é aproximadamente o dispositivo, e como você vê, é o Texas um pouco pequeno demais. E a segunda maneira de fazer isso é pré-visualizar em um dispositivo que eu vou mostrá-lo mais tarde e é muito melhor para que você possa visualizar a partir do esboço no dispositivo real. Mas por enquanto, vamos mudar o texto para 12. Vou ficar com 50% de capacidade e agora vou selecionar os dois elementos e vou agrupá-los. E também, eu vou colocar este grupo no centro deste retângulo. Agora vamos mover a casa, dedo do pé para a esquerda. Vou movê-lo. Oito pixels para a esquerda. Eu vou pressionar l para linha e eu vou criar a linha que comandos D para duplicar a linha. E eu vou dormir nesta linha horizontalmente. E agora vamos combinar a posição para que tenhamos Ah, flecha. Vamos eleger ambos os anos e mudar o príncipe falso para um e também vai mudar o e para que eles em torno dele. Além disso, seria melhor dimensionar um pouco essas linhas. Vou primeiro agrupá-los. Então deixe-me selecionar ambas as camadas e o Comandante G para agrupamento. Vou colocar esse grupo lá fora e agora posso agrupar. Eu posso mover esta alças sobre o grupo para que ambos haja mudanças em conformidade. Agora vamos diminuir o zoom e lá está. Então, basicamente, quase temos nosso primeiro componente de topo. Mas o que estou perdendo. Aqui estão os ícones, e eu quero que os ícones apareçam para a esquerda e para a direita fora do meu componente e em termos fora dos ícones. Eu gostei que você soubesse isso simples depois deles usando seu frasco de ícone chamado, e você não precisa necessariamente usá-lo, mas eu acho que vale a pena a panela. Custa cerca de 15 dólares, mas ajuda você a organizar seus ícones e todos os conceitos que eu tenho aqui. Acho que tenho mais de 100 mil. Eu posso ouvir ícones aqui, e ele me permite facilmente ver esses ícones, bem como organizados em conjuntos. E também posso procurar os ícones que preciso. Por exemplo, se eu procurar o usuário. Como você pode ver, ele procura todos os meus conjuntos para esta frase ou palavras-chave em particular porque, especialmente se você pagou pelos conjuntos de ícones, você vai tê-los bem organizado com as palavras-chave, que é salva-vidas se você tiver 20 ícones off e você quer procurar rapidamente os ícones, Então, se você quiser colocar este ícone dentro de esboços, basta arrastar e soltá-lo, e lá você tê-lo, então ele funciona em trabalhos programados para o ilustrador loja e foi o melhor é que se você revisar o conteúdo deste grupo que você realmente tem uma forma vetorial, então isso significa que é a melhor qualidade que você pode obter fora do ícone. Ok, então eu vou usar I Condra muito ao longo do curso, mas você não tem que usá-lo. Não é necessário. Você pode simplesmente arrastar e soltar do localizador, ou você pode instalar um trier fora eu controle e apenas verificar se este aplicativo é para você . Então eu vou usar também este ícones simplificar ponto com disse, que também é pago. Mas eu acho que investir em ícones é realmente uma boa maneira de se tornar um designer melhor. Isso é porque você economiza muito tempo em esboços. Você pode, obviamente, projetar ícones. É muito fácil. É muito gratificante. No entanto, também é demorado, então você pode gastar esse tempo em outra coisa e apenas comprar um bom set off ícones. Caso contrário, você pode usar ícones livres da Internet, mas certifique-se de que eles são pelo menos ícones vetoriais para que você tenha a melhor qualidade. O próximo site que eu recomendo problema. Comi a rede. E, tanto quanto ícones livres estão em causa, Eu recomendo que você confira Icahn monstro ponto com, bem como eu confinado lá que vêm e você vai encontrar alguns ícones vetoriais livres aqui. Mas você provavelmente tem que gastar mais algum tempo para encontrar os ícones que estão realmente no mesmo estilo ou apenas se adequar às suas necessidades no que diz respeito ao seu design. OK, então agora vamos voltar para o frasco de ícones e eu vou procurar por alguns ícones. Então eu vou colocá-los no horário programado e mostrar-lhe como. Qual é o melhor trabalho para com estes ícones para que você possa pesquisar com dentro de todos os sets off ícones. Mas você também pode alternar para definir para pesquisar Onley na seleção atual. Então, só na agilização atual disse que eu vou definir para a câmera primeiro e deixe-me ver se há algum bom que eu venho com a câmera. Eu acredito que esta câmera cc um é bastante ouro, então eu vou colocá-lo em esboço e agora eu vou procurar a outra palavra-chave, que é se, e como você pode ver, eu iria muito fora se ícones no mesmo estilo de estado que a câmera porque ainda é o mesmo conjunto de ícones. E eu posso, por exemplo, disse este dia, sair e puxá-lo dentro fora do esboço. Se voltarmos para Aiken Jar, o que podemos fazer é mudar os lados deste ícone para que possamos vê-los em uma pré-visualização maior ou menor. Mas isso realmente não afeta o tamanho dos ícones que estão sendo importantes no esboço. O mesmo vale para cores, porque você pode facilmente alterar cores dentro de ícones são. Mas este é apenas um ícone de visualização de drogas, ou seja, se você arrastá-lo e soltá-lo no cronograma, ainda tem este ícone escuro. Mas não é realmente muito importante, porque você sempre pode selecionar o ícone burra este ícone vetorial. Você pode selecionar este grupo, e agora meu fluxo de trabalho está basicamente despreparado para esses grupos diferentes porque, como você pode ver, há muitos grupos e agora, dentro deste último, temos formas vetoriais, e é assim que você tira ícones do meu contrato dentro do esboço. Por isso, carrego o comando Shift G muitas vezes até chegar ao fim da nossa selecção. Então, até que eu um grupo todos os grupos que estão lá no ícone e agora eu posso executar operações como uma mudança acadêmica ou mudança de espessura e essas operações são aplicadas a várias camadas selecionadas. Quando estava em baixo, pressionei o Comandante G para agrupar as camadas mais uma vez, e li bem o tango rigoroso que precisava. Vou colocar este ícone no centro exato desta forma, e também vou transformá-lo. Então eu justamente Gannett e os judeus dormem horizontal do menu transformado. E lá temos o nosso primeiro ícone. Então agora eu executar as mesmas operações no 2º 1 Então eu pressionei Comanche G até que eu alcancei as formas agora e mudar a cor. E também cresci comandos de bits, g. E agora vamos como formas e agrupá-los. E agora eu tenho que me livrar deste retângulo e colocar este grupo à direita fora do nosso elogio. Agora vamos ter certeza de que está posicionado corretamente, então eu tenho que posicioná-lo no centro verticalmente e fiquei impressionado. Comando o suporte escolar direito, que é o nosso pessoal personalizado. Atalho para fazer isso. E agora eu tenho os dois ícones. Eu posso selecionar ambos os grupos, e é sempre melhor executar operações como capacidade em ambos os grupos porque é sempre mais fácil acessar o grupo de camadas individuais para que você possa selecionar os grupos e pressionar livre na tecla palavra. E agora você disse que a opacidade é de 40%. Agora vamos selecionar todos os grupos e camadas e vamos fazer um símbolo deles. Eu vou colocar o nome top com símbolo. E agora vamos para a página Símbolos e, por enquanto , são aqui. Mas vamos movê-lo mais tarde. E agora vamos ampliar este elogio com comentários e o que vou fazer. Vou transformá-lo para que tenha ainda mais símbolos dentro. Portanto, este ícone pode ser alternar com simples sobre a direita. Então eu vou criar um símbolo fora dele, e eu vou dizer câmera ícone, bem como este direito Ikonomou. É como a direita eu posso criar símbolo fora dele, e eu vou colocar ícone barra filho e esta seta bem vamos criar símbolo fora dele . Isto será que eu posso estreitar. E como podem ver, tenho outros símbolos. Vou duplicar todo o topo. Então, vou pressionar. Vamos lá. D no símbolo superior e este símbolo cópia superior Eu vou apenas para que ele não tem este pequeno subtítulo e também uma seta. E agora vou selecionar a casa e colocá-la no centro vertical e horizontalmente. E como você pode ver agora, eu tenho a versão alternativa fora do topo, então eu vou renomeá-la para top out. E agora vamos ver o que conseguimos com os símbolos que mudam para a página inicial de uma página. E agora vamos esfregar o dedo de cima. É uma versão alternativa. Então eu vou selecionar top out e eu vou substituir casa fazer, por exemplo, escritório. E também você pode esfregar os ícones. Eu realmente não tenho muitos ícones aqui, mas eu posso configurá-lo, por exemplo, para conhecido para esconder este ícone à esquerda. E também, se eu for de cima para cima de novo, como você pode ver esta sobreposição prevalecer. Então eu ainda tenho o escritório como substituto, e isso é muito bom. Então isso é tudo sobre o topo. Eu me vejo na próxima lição 28. Adicione as de casa: O Haider. Parece que estamos prontos para a próxima lição, e aqui temos o site Pixels e imagens diferentes no site do Spectator. Eu procuro consulta casa e lá temos algumas belas fotos fora de uma casa moderna que selecionam uma imagem que temos aqui e vamos nos certificar de que estamos na qualidade total fora desta imagem. Agora está carregado e podemos usá-lo como uma sensação fora de nossas camadas. Então vamos criar um retângulo, e este retângulo vai adicionar a metade do meu quadro de arte verticalmente. E agora eu posso definir o campo fora deste retângulo até ser a minha imagem. Então eu vou sentir e eu selecionar a opção de imagem agora a partir do navegador. Eu posso pegar esta foto de alta qualidade e apenas puxá-la e soltá-la sobre este quadro-negro pequeno que temos na opção de imagem. Assim, nas opções de imagem, também temos pés, estiramento ou azulejo e, adicionalmente, na opção de azulejo. Você tem liberdade para ajustar esse controle deslizante, o que tornará a imagem cerveja ou menor, e na verdade queremos que a imagem seja um pouco maior, mas queríamos estar no centro fora do nosso retângulo desligado. Então, basicamente, a opção de sentir funciona melhor para nós. Mas para ser honesto, prefiro outros métodos. Então, se você quiser que esta imagem seja parcialmente visível, basta selecionar alguns fora de uma cor sólida e você arrastar e soltar esta foto pixels para esboçar, Em seguida, selecione ambos os jogadores e selecione mesquita. E esta é a diferença. A diferença prática entre a mesquita eo campo comum para que agora você pode ajustar o tamanho da foto. Você pode ajustar a posição da foto e você pode transformá-la livremente enquanto ela ainda está dentro deste retângulo porque este retângulo é uma máscara, então vamos colocá-lo em algum lugar no meio. E agora eu gostaria de ajustar a capacidade. Mas como você pode ver, se eu tentar ajustar a capacidade sobre os especiais, siga O que eu faço é realmente eu revelar além desta cor amarela para que possamos clicar na mesquita e apenas você pode desligar o campo e agora você pode transformar. Você pode alterar a opacidade. Além disso, você poderia usar essa opacidade em todo o grupo, e a terceira maneira de fazer isso é usar uma mesquita de oferta, mas na verdade depende de você. Certo, então dissemos que a opacidade era 75%. Agora vamos desenhar algumas formas e eu vou usar mais. Então isso é assim Com o turismo comum no comando menos zoom out, vamos comandar a opção de sobre-hold e mudar para torná-lo maior. E agora assim, como o campo fora da cor branca e 20% de opacidade. Agora é selecionar L para linha, e eu vou desenhar uma linha reta com Shift e eu vou desenhar outro sobre com Shift para que eu tenha círculo perfeito e apenas movê-lo no centro. Agora, no painel de camadas, isso é comando. Clique em ambos fora este overs s para que eu possa dizer como ambas as camadas e eu vou selecionar sentir . E vamos usar um dos meus sotaques, talvez esta cor rosa. E então eu vou gostar da linha também e mudar a cor da linha para esta mesma cor. Eu posso usá-lo da lista recente, ou eu posso apenas clicar lá. Ok, agora vamos criar uma Nikon no esboço, e eu não vou usar o frasco de ícones porque eu quero mostrar como é fácil criar um esboço icônico. Vou desenhar um retângulo com a borda, levantar livre. Vou desenhar outro em cima dele. E o raio da fronteira aqui será maior. Por exemplo, muito cinco. Isso é bom. Basta posicionar este retângulo com as setas do teclado. Agora que amplie e eu vou usar tesoura para apagar esses dois segmentos. Não vou apagar este porque posso entrar na forma no modo de edição vetorial. Então eu pressiono Return nesta forma e agora vamos selecionar os dois pontos vetoriais com Shift . E agora não vamos esses pontos vetoriais com seta para cima para que tenhamos uma forma perfeita . Vamos selecionar este ícone de olhar, e isso é colocá-lo no centro fora do nosso círculo. Agora vou criar outro. Eu entro será ícone de teca, e eu pressionar l para duas linhas como esta. Vou mudar, clicar neles e no Comandante G para o grupo, e depois vou transformar-me, e vou girá-lo em menos 45 graus. Também dorme verticalmente. Aí está você. Agora vamos voltar a essas camadas novamente. Vamos mudar o clique para selecioná-los e vamos para opções de borda. Vou dar uma volta. Acaba aí. Você tem outro ícone que é clicar duas vezes no ícone de loop para ir para a visualização 100%. E agora você pode selecionar o grupo e também o ícone de cadeado e ir, por exemplo, para alterar a espessura ou a cor. Você pode ajustar as opções, e basicamente, agora queremos posicioná-lo exatamente no meio. Então eu vou ter um grupo fora desta camada, e eu vou selecionar sobre também. E usarei nossos atalhos de teclado para centralizar isso horizontal e verticalmente. Eu também vou fazer este segundo mais um pouco menor, e agora vamos colocá-lo no centro fora da tela pressionando comando livre. Na verdade, é o melhor atalho que você pode usar para isso. Agora vou selecionar e criar ritmo de feud de texto, o texto que eu já tinha na minha área de transferência e o que eu gosto de fazer. Eu gostaria de alterar a altura da linha, e você pode ajustar esta altura da linha, que é 19 por padrão. Para este tipo fora do tamanho do texto, mas eu poderia colocar, por exemplo, 40. E lá nós temos depois eu posso passar o mouse sobre o rótulo da linha, e eu posso riacho e drogas para ajustar este espaçamento de acordo. E agora, como você vê, eu tenho algum espaço vazio entre as linhas de texto que me diz para fazê-lo. Eu coloquei esses pequenos ícones. Então eu vou vir e ver comandos, vídeos, alguns pontos e vamos colocá-lo lá e nós vamos precisar de mais um geral para que eu vou dizer, tipo, este aqui. E eu vou opção arrastar este para que nós criemos outro e nós entalhe sua posição com setas do teclado. Às vezes é melhor s para que eles estejam devidamente alinhados opticamente não matematicamente, como você faz com opções de alinhamento. E aí está. Então vamos colocar esses pequenos carrapatos dentro de cada um. Mas primeiro, vamos para eu conjurar de novo e eu tenho esse dedo mindinho que eu posso vou colocá-lo lá. Então vamos agrupá-lo. Vamos, Chefe G. Até chegarmos às formas. Agora mudamos a cor branca e agora agrupá-la novamente. Então eu restaurante. Vamos, grupo G dois. Este ícones e eu também excluir isso. Use este retângulo. Vou colocar o grupo dentro da minha arte, mas agora não posso escolher. Então, se você tem tal situação, basta selecionar este grupo que temos aqui e mudar em agit para que sua posição dentro do quadro de arte. E agora podemos vir em k para escalá-lo e em uma escala do centro e usado 200% escala. E também vou ler essa flecha para a direita do dedo. E em vez desta flecha, gostaria de ter uma linha aqui. Então vamos selecionar L para a ferramenta de linha e então vamos deslocar arrastar para uma linha. E eu quero ter essa linha pontilhada, então isso é um grande desafio. Você pode ir para configurações de borda tão rápido neste pequeno ícone e apenas as propriedades de borda. Temos traço e lacuna aqui para que possamos inserir alguns números no traço, por exemplo, pixels livres. E então podemos ter, por exemplo, 10 picos de Gap para que você possa ver que há picos livres de Dash que 10 fotos de Garp três picaretas de traço e assim por diante. E se você quiser ir mais longe, você pode entrar em outro traço e outra lacuna. E lá você tem esse tipo de padrão diferente que você pode emular, por exemplo, código de barras ou algo assim. Temos este traço e dores de cabeça. Então vamos nos livrar de todos os campos em vez de fora primeiro e 2º 1 Então eu vou ter um traço de um pixel e deixar e apenas a lacuna para que seja, por exemplo, 10. E lá temos algumas linhas. Mas se arredondarmos as extremidades fora desta linha para que nós vamos ter adultos em vez disso e nós também podemos dizer a seta assim Mas sim, ele realmente não parece bem em tudo. Então vamos nos livrar dessa flecha e vamos criar uma mais tarde. Por enquanto, eu vou apenas a espessura fora da borda para que nós temos para estes pequenos pontos e provavelmente quatro é o valor correto aqui, e isso é agora mudar a posição dele. Também podemos ajustar as configurações desta linha, como trigo fora da linha, e ele realmente funciona bem. Agora vamos selecionável do grupo com este ícone, bem como linha. Eu pressiono comin G para agrupá-lo. Agora vamos usar nosso atalho de teclado Comando colchete esquerdo um colchete para posicioná-lo. Dirigindo o centro. Eu vou opção arrastou o campo de texto comando A para selecionar todo o texto aqui e eu vou colocar slides para abrir aqui. Vamos colocá-lo sob nosso ícone. Basicamente, acho que já não precisamos desta flecha. Este ícone parece bom agora, então eu vou apenas colocá-lo neste grupo e vamos mudar a opacidade de todos os grupos , como o grupo livre no teclado. E lá temos opacidade de 30%. Agora vamos selecionar este grupo para novamente e eu vou criar símbolo fora dele. Então vamos ter olhado para abrir símbolo e apenas deixe-me dar uma olhada nisso, a estrutura das camadas. Então vamos ter este grupo como símbolo separado também. Mas o que temos aqui é que temos este pequeno ídolo tiki, modo que é primeiro criar no símbolo de offtake ICANN. Então nós temos que eu posso tomar e então nós podemos selecionar ambas as camadas. Ambos os retângulos para frente olhar anti arma que criam símbolo para fora todas essas camadas E vamos dizer que é ícone. Olha, aqui temos e é sempre uma boa ideia. Dedo. Mantenha suas camadas organizadas também. Então, de vez em quando, por favor, vá para o cabelo espinhal e renomeie as camadas. Exclua grupos desnecessários e apenas tente mantê-los organizados. E você não precisa fazer isso toda vez que criar a camada ou um grupo. Mas é bom limpá-lo. Talvez depois de criar uma única tela. Ok, então o que vamos fazer agora é eu preciso que este pequeno ícone de cadeado apareça nos outros pontos. Então eu vou ir para os ícones do dedo do pé e eu selecionar QI. Agora vamos ampliar e isso é ah, recita um pouco com a mudança para que eu mantenha proporções. Eu preciso dele um pouco menor e ter a vara também copiado e colado mais uma vez. E não é isso. Com as setas de deslocamento e teclado. Inglês. Vamos copiar e magia novamente. Então agora podemos apenas para limpá-lo um pouco porque a nossa primeira tela está pronta e eu vou fazê-lo entre as lições enquanto eu vejo você em outro vídeo 29. Como organizar e a organização e a nominar de ativos: Então, no começo eu pensei, eu vou limpar as camadas entre as lições. Mas agora, quando eu penso nisso, Eu apenas acredito que esta classe extremamente chato e será uma espécie de ajuda para você para permitir que você organize seus ativos melhor não só para as camadas sobre fins, mas também para exportação. E isso é muito importante. Então, em um segundo, vamos voltar para o painel de camadas e vamos reorganizar o vírus, criar grupos. E o mais importante, vou mostrar a vocês qual é o melhor padrão de nomenclatura para suas camadas e por quê. Ok, então a primeira coisa é que você não precisa renomear as camadas o tempo todo. Quando você cria uma camada, basta seguir em frente, seguir em frente. E quando você terminar, por exemplo, uma tela ou uma parte maior da tela ou um componente Agora você pode definir os nomes apropriados fora das camadas, então a primeira operação que você precisa executar é colocar as camadas e agrupá-las juntos. Então você pressiona e segura o comando no teclado, e então seleciona todas as camadas que, na sua opinião, precisam aterrissar em um grupo. Então é como se o olho fedorento também aparecesse. E agora você pode pressionar o comando g para agrupá-los. Aí está você. Então este é o primeiro grupo que eu pressionar comando são. E agora, neste molde de edição, você pode pressionar começar a descer o mínimo, bem como mais tarde. Você pode pressionar shift, parar para ir Abdel East, e você pode renomear em lote todas as camadas e grupos, então isso é bastante conveniente. OK, então agora vamos passar para as convenções de nomenclatura. E você já sabe uma convenção de nomenclatura inteligente quando você tem nome fora da pasta e, em seguida, você tem smash e, em seguida, nomear fora da camada, que permite que você vá para o menu de inserção e selecione símbolo. E lá você tem todas as camadas agrupadas nestas pastas que vieram antes da barra s possamos ir para símbolos. E como você pode ver, eu criei mais alguns símbolos aqui e mais ícones. E se você der uma olhada nas camadas, como você pode ver, todas elas têm um ícone de nomeação apropriado, cadeado, ícone, barra e assim por diante. Mas isso não é tudo. Se você selecionar as camadas, por exemplo, isso é uma mudança clique e selecione alguns fora desses ícones, bem como eu vou comando clique para ter esta cor BG sensação e cor acento livre selecionado também. Você pode ir para opções de exportação e você pode clicar no botão tornar exportável e lá você pode ter todos esses livros de arte realmente exportáveis, e eu vou exportá-los. E como você pode ver, eles serão salvos nesta pasta de exportação. Mas em vez disso, fora desses arquivos individuais nesta pasta, o que eu vou obter após a exportação são duas pastas separadas. Então eu tenho essa cor e eu posso pasta também. Então, como parece, não só agrupa os ícones no menu de inserção, mas também criou as pastas. Por que exportar para que você tenha todos esses ativos organizados em pastas separadas e eles apenas obter seus nomes do nome antes da barra no nome fora do símbolo. Então isso é muito legal, não é? Vamos voltar para a página inicial. E como você verá, podemos até criar estruturas mais complicadas e avançadas fora de uma pasta. Então, vamos pressionar comando são ir para o modo de edição agora que suportam barra inicial em quatro para este componente, e vamos tornar este componente exportável. Agora vamos salvá-lo em nossa pasta de exportação e dentro de casa. Nós temos essa informação, então deve haver um chamado o arquivo PNG, e lá está ele. Mas podemos ir mais longe e podemos mudar o nome deste grupo novamente para que tenhamos alguma pasta extra aqui, por exemplo, que é ter um nome desligado para essa pasta. Vamos colocar uma barra aqui e exportar novamente. E agora você aninhou estrutura fora das pastas. Então vamos para a pasta pessoal e dentro você tem esta pasta up e lá você tem informações o arquivo PNG. Então é assim que você aninhou a estrutura fora das camadas. E, na verdade, mais uma coisa que está estritamente conectada aos nomes de seus grupos e camadas também são algumas propriedades CSS que você pode exportar diretamente do esboço e passá-lo. Teoh, por exemplo, desenvolvedor front-end. Você pode clicar com o botão direito do mouse em qualquer camada ou apenas mercadoria na camada ou grupo, então vamos brilhantemente sobre este grupo e você pode copiar atributos CSS. E agora, se você colocar o código CSS do seu teclado. Você terá os nomes de camadas como comentários no revestimento CSS. Então isso é muito importante para Então agora você pode estar se perguntando qual é a convenção de nomenclatura perfeita para seus grupos e camadas no esboço? E, na verdade, vou te dar uma dica. Então vamos primeiro renomear este grupo. Vou selecionar o grupo e expandi-lo. Como você pode ver, há uma abundância de overs e ícones, e eu vou pressionar o comando são toe renomear o grupo, e eu vou colocar em casa em primeiro lugar. E isso é porque esta é a minha tela inicial. Então a primeira parte do nome será o nome da minha tela. E então eu coloco barra para que eu crie outra pasta e eu selecione o nome desse componente. Então, provavelmente este componente pode ter o nome off info, e é isso para o nome do grupo. Agora eu pressionei Tub, e eu colocar o nome fora este tanto como a primeira tela, bem como o complemento no início , fora de cada camada ou cada símbolo e lá nós temos casa em para ícone, bloqueio e também abundância de casa em para ícone teca. E essa é, na verdade, uma maneira de evitar ter várias instâncias fora de cada imagem. Então, se você só quer querer, você tem os mesmos nomes. E se você quiser diferentes fogos BNG, você coloca nomes diferentes, por exemplo, de um fora de tudo para mais livre e assim por diante, e eles estão aqui. Vamos ter casa em quatro linhas, bem como este texto, e vamos renomear este texto para que ele corresponda ao conteúdo do grupo também. Então vamos para casa receber uma mensagem. Ok, então é isso. Vamos para a próxima camada. E agora temos olhado os componentes abertos, e também precisamos que a tela inicial seja colocada no início, porque precisávamos pousar na pasta adequada. E então temos, por exemplo, herói em casa. Dentro, temos essas duas camadas, e não precisamos renomeá-las. Vamos para a camada superior e vamos colocar casa antes do nome, bem como colocar o nome fora nossa string antes do nome fora do último símbolo e agora terá tudo organizado nesta pasta pessoal durante a exportação. E também é bom ter a ordem correta fora das camadas para que tenhamos os elementos superiores na maioria das camadas e vamos para o fundo. Às vezes não é possível porque se você mover herói para o topo do painel de informações , ele irá cobrir este pequeno ícone para que tenhamos que mudar a ordem desses dois grupos. Mas se você puder, por favor, tentar ter, ah, ordem direita fora das camadas para que você possa ir de cima para baixo assim, e eu não sei se você se lembra. Mas também há atalhos de teclado para mover as camadas para cima ou para baixo a estrutura da camada , e isso é comentário. Opção seta para cima ou para baixo, e também você pode pressionar o controle. Então controle o comentário. Opção para baixo ou para cima, para movê-lo para o topo, maioria da camada ou para a parte inferior da camada liberada e também mais um atalho de teclado é uma mudança comum. L. E se você pressionar comando shift, L você olha esta camada para que possamos olhar as camadas e grupos que você não quer mais editar que você terminou, por exemplo, depois de terminar seu trabalho com esta tela. Agora vamos passar para o espaço de símbolos, e outro bom conselho é manter a página de símbolos organizada e manter essas camadas de símbolos organizadas também. E como você vê, temos esses estilos de texto de campo de texto aqui. E como eu disse antes, vamos adicionar alguns têxteis extras aqui à medida que avançamos com o nosso layout. Então aqui temos os estilos para os cabeçalhos e também diferentes variantes fora dos cabeçalhos. Mas se formos para a casa acima, como você pode ver, eu tenho agora para estilos extras para o texto, e eu vou selecionar o primeiro estilo, que é uma cópia corporal, e será Avenir Medium 14 e vamos copie este texto e vamos movê-lo para os símbolos. Agora vamos procurar por esses cabeçalhos. Vou selecionar Textiles Group e colá-lo aqui. Vamos mudar a posição e movê-la para dentro deste grupo. Vou mudar o nome do dedo do pé, e este será o meu segundo têxtil. Vamos selecionar este grupo e um clique de seleção através de uma opção de seleção. Isso vai me fazer selecionar cada jogador individual com apenas um clique, e agora eu tenho o seu meio fora 40 pixels. Vou escolher dragões para ter uma cópia. E então eu vou pressionar commodities e commodity novamente para duplicar esta ação. E agora vamos mudar o quão longe para 50 e que vamos mudar o nosso demasiado 20 neste para a primeira cópia. Agora vamos para o 4º 1 Vamos controlar o peito, ver, e vamos eleger nossa cor de sotaque. Então, mais uma coisa que precisamos é que vamos selecionar essas camadas e vamos copiá-las e criar a luz Valiant fora do fundo. Então vamos comandar a nave V para colá-los nesta forma, e eu vou mudar para baixo são dois Majette. Agora precisamos selecionar livre desses campos de texto e mudar a cor para preto. E eu vou ajustar o, hum, hum, Alfa em conformidade. Eu vou colocar 50% de desconto na segunda cópia e também 20% nossa gordura na primeira cópia. E, por favor, acredite que eu sei que pode parecer chato da primeira vez, porque você continua fazendo as mesmas operações uma e outra vez. Mas se você tornar esses estilos de texto disponíveis para cada tipo de texto, por exemplo, vamos pegar este texto fert que é uma legenda no nosso caso. E digamos que isso será uma legenda e nós vamos salvar as ações para este texto de legenda , bem como o credo, variância dele, então você verá que nós vamos fazê-lo. Eu não sei 12 ou três vezes para 1ª 1 ou duas telas, e depois será muito mais fácil porque você tem toda a estrutura fora deste estilo para o texto. E novamente, eu vou usar a convenção de nomes fora do para o fundo escuro, e eu vou dizer, que é o Bolic Opie. E no final, eu coloquei o nome fora da variação. Então, basicamente, esse é um número para a variante mais leve. Era 90 para o 2º 150 para o 3º 1, serão 20. O nome dessas camadas dentro de camadas não são tão essenciais aqui, então podemos deixá-los eso e você verá que em breve esta estrutura vai valer a pena porque você continua usando os mesmos símbolos. Você continua usando os mesmos têxteis do mesmo pique possui, e se você mantê-los organizados, se você mantê-los nos símbolos, você verá que esta é realmente boa estrutura de ter, e de vez em quando você vai descobrir que você pode ter ainda mais símbolos aninhados dentro outros símbolos. Então, vamos limpar o fundo fora da versão superior e superior, e vamos usar essa cor BG em vez disso. Então vamos selecionar o topo e vamos inserir a cor do símbolo e vai usar a cor BG. Vamos colocá-lo como uma camada separada aqui, e eu vou escolher a posição do fio de sotaque 00. Vamos colocá-lo no final da nossa estrutura de camada para este símbolo em particular, e eu vou ver e Kamanzi para colá-lo no outro. E provavelmente agora estamos começando a perceber que toda esta convenção de nomenclatura e essas pastas imediatamente começa a fazer sentido porque se você selecionar esta cópia mestre e você mudar a cor para verde, você tem esta cor verde em todos os símbolos, bem como em seu projeto em todo o lugar. E aí está, outra técnica de salvamento de vidas que será especialmente útil quando você tem um projeto maior . Quando você começa a projetar em outras telas e você verá que essas convenções de nomenclatura, bem como ter esses grupos separados para o menu de inserção, mas assim como para a exportação e código CSS é bastante útil. Isso é tudo por enquanto. Vejo vocês na próxima lição. 30. Diferentes de telas de casa: Olá e bem-vindos à próxima lição nesta lição. Vamos começar criando algumas alterações neste quadro de arte. E esta é uma técnica bastante agradável. Se você quiser ter um estado diferente, por exemplo, para suas formas, para as batalhas ou para algum tipo de elogios, você não faz isso no mesmo quadro de arte, por exemplo, com diferentes grupos que você precisa ocultar e revisar. É muito mais fácil fazê-lo com as iterações do nosso primeiro barco. Então vamos duplicar o nosso barco, e vamos criar versões diferentes deste painel de informações que temos aqui em casa em quatro grupos. Então, vamos clicar no quadro de arte e eu vou pressionar os comandos precisam duplicar duas vezes, e nós vamos ter três estados diferentes fora desta tela inicial. A segunda tela. Nós vamos selecionar as ovais e vamos para alguns e vamos selecionar a cor laranja para que este seja algum tipo de estado de aviso, e o terceiro 1 será estados abertos, então vai ter cor verde para os mais de 40 overs. Agora vamos voltar para a segunda tela e eu vou selecionar os itens que eu quero me livrar. Então eu vou apagar nós dois, bem como todos os ícones do pico. Então vamos selecionar isso com um clicado comum. E também você pode clicar com o botão direito em qualquer camada e, em seguida, dentro do botão direito do mouse. Você tem a segunda opção desativada substituída por para que você possa substituir qualquer item por algum outro gráfico. Mas eu não vou fazer isso agora. Eu posso simplesmente apagá-lo com backspace. E agora vou dar um passo para ouvir uma mensagem. E vamos mudar as alturas da linha para 20. E aí você tem algum tipo de aviso de que o alarme está inativo e precisa ser ativado. Então vamos inserir símbolo. Vou usar o ponto de exclamação que criei entre as lições e vou colocá-lo aqui. Vamos mover este símbolo para o topo do grupo para que ele fique visível. Agora é natural um pouco com flechas. Eu vou pressionar o comando d para duplicado e eu vou mudar para baixo auto Nagy ele para que ele apareça no segundo sobre o segundo sobre. Agora você pode acessar o campo de entrada de trigo e você pode pressionar para baixo ou para cima seta para mudar o trigo. E se tiveres este olhar, eu comprimido. Você tem. Você está mudando o peso e a altura de acordo para que você não precise mudar o gelo do dentista fora do ícone no nível máximo de zoom. Você pode fazê-lo com este campo de gelo também. Agora vamos passar para a 3ª 1 e é bem fácil também. Vou selecionar todo o texto com o comando A aqui. Vamos jogar alguma informação sobre as pessoas que estão dentro da nossa casa. E agora vou ampliar e mudar o Commons, selecionar todas as camadas que eu quero excluir. Pressionei o backspace para apagá-lo. E agora vamos nos concentrar nisso. Olha, eu tenho, então eu vou pressionar os comandos para com a fechadura selecionada para ampliar. E agora preciso do Teoh. Modifique este ícone. No entanto, este é um símbolo. Então eu preciso Teoh, clique com o botão direito do mouse no símbolo e eu preciso selecionar separar do símbolo para que eu não tenha mais este símbolo. Mas eu tenho este grupo original e agora eu posso entrar no modo de edição para os vetores com retorno e clicar neste ponto vetorial e simplesmente backspace ou excluí-lo. Caso contrário, se eu fizesse modificações no símbolo mestre, todas as ocorrências deste ícone de olhar, todas as minhas, minhas, nossas placas mudariam para que eu tivesse que separar isso do símbolo primeiro. Agora eu vou criar grátis no geral para que eu possa mostrar os avatares fora das pessoas que ficam em minha casa e vamos Creed e mais com turnos para que possamos manter proporções. Agora é comandos D. Agora é pressione Shift e basta movê-lo para que tenhamos a segunda cópia e co Mandy e movamos a primeira cópia. Isso é controle. G dedo do pé mostrou, concordou, e vamos ampliar um pouco. E agora com o turno, eu seleciono itens gratuitos agora se você tentar movê-lo no centro da arte. Mas não é assim tão fácil porque temos estes tipos espertos diferentes aqui. Mas o que você faz nessa situação? Você pressiona o Commander G dois grupos em um grupo, e agora você pode usar as opções de alinhamento para que seja muito fácil senti-lo no centro fora do audível. Ok, esses overs, vamos senti-los com avatares. Não vamos eles para que eles gostem precisamente em nossa ganância. Oito semanas concordaram, e agora está perfeito. Então vamos seguir em frente. E isso é realmente um bom importante para mim para mostrar o potencial fora do esboço plugins , que são extremamente úteis, e você pode usá-los para diferentes fins. A maioria dos plugins estão em Get up, e você pode realmente usar Sketch Toolbox dot com, que é um livre up para navegar todos aqueles vagões em, obter ajuda e instalá-los, e para esboçar. Você não tem que usá-lo. Você pode simplesmente baixar os planetas e instalar para programar diretamente. Mas isso é muito mais fácil. Portanto, se você abrir a caixa de ferramentas de esboço, poderá procurar, por exemplo, conteúdo. Gerador plug in e eu vou instalar este conteúdo gerado gerador esboço Blufgan Eso Vamos apenas clicar no botão instalar. E, de fato, eu tinha esse bloqueio sobre o instalado, então eu não vou fazer isso novamente. E você nem precisa reiniciar o esboço. Você simplesmente vai para os plugins, e lá você tem esse gerador de conteúdo. Conectá-lo começa, então, para usar gerador de conteúdo, precisamos selecionar todas as formas para que a mudança clique sobre as formas e precisamos habilitar os poucos, porque ele vai usar campo para senti-lo com as imagens. E nós vamos nos conectar do que gerador de conteúdo. E podemos usar coisas diferentes, como imagens, números, texto. Na verdade, vamos usar um pessoal agora, e vamos às fotos. Como você pode ver, nós podemos escolher entre fêmea, minha neutra, e lá temos algumas fotos femininas aleatórias. Também podemos usar algumas fotos diferentes, se você quiser. Então isso é pressione o comando Z dedo sob esta ação, e você pode fazê-lo por Baggins. E, claro, você pode usar gerador de conteúdo, mas você também pode selecionar em torno feminino novamente ação, e há um atalho de teclado pesado, bem como, que é deslocamento de controle. Nosso vamos clicar sobre ele e isso é pressione a mudança de controle são um par de vezes para que você possa ver resultados diferentes. E se você estiver feliz com os resultados, você pode finalmente parar de pressionar esses botões. Você vai se ver pressionando os tempos do dinheiro, mas agora que mudar para as fronteiras e eu vou fazer quatro pessoas espessura fora da fronteira e também diminuir a opacidade. E como você pode ver a posição fora da fronteira, seu centro, você pode mudá-lo e você pode definir dentro ou fora. Então vamos passar fora da fronteira e isso parece muito bom. Então vamos diminuir o zoom com o comentário um. Isso é como os comandos do quadro de arte para ampliar agora. Controle G. Teoh Hide concordou. E vamos selecionar aqueles de nós novamente, e eu vou diminuir a opacidade fora da borda apenas um pouco. Então agora está perfeito. Vamos mover este grupo para que possamos alimentar os nomes dos nossos avatares. A 1ª 1 é Ana. Vamos selecionar o estilo. Como você pode ver, eu fiz minha lição de casa e e eu fiz alguns estilos bonitos para o texto aqui. Isso é um clique principal comum para selecionar ambas as camadas. E agora vamos alinhar opções e permitir-lhes ao centro horizontalmente. Agora vamos colocá-lo para o topo, e agora você pode mover esta camada de texto e depois, sem soltar a fenda mais inferior, você pode pressionar a tecla de opção para que você tenha duplicado. E agora vamos mudar o texto para, por exemplo, Jenny, e vamos movê-lo novamente com Come on the I duplicated, eu movê-lo e vamos pegar este texto e digamos, por exemplo, A Laura. Certo, então temos esse primeiro artigo. By the way, você pode se mover entre as placas de arte com atalho de teclado, que é a tecla de função e, em seguida, seta para a esquerda ou para a direita no teclado. Eso Vamos passar para a segunda tela e eu vou criar um botão extra aqui que vai me deixar ativar e o alarme e se livrar desta mensagem. Então, vamos pressionar são para retângulo que é criar ângulo direto com a borda adequada, e eu vou usar esta cor laranja para a borda. Além disso, vamos ter algum raio de borda grande para que as bordas sejam completamente arredondadas. Agora estou feliz. Faça esse cara ficar com o centro fora. Os meus são dobrados e um pouco menores. Agora é Presti no teclado e vamos clicar nos para fora do campo de texto Wheat e este texto. Seria melhor se estivesse posicionado no centro. Então, se o Texas A nove pés para o centro e eu espero que você se lembre desses atalhos de teclado , então o comando shift esquerda Bracket tecla está mentindo para o comando turno esquerdo chegou. Bracket Key está tentando para a direita e principal comando Slash está alinhando para o centro para que nós certifique-se de que todas as opções de redimensionamento estão agora corretas, porque o texto é dito para estar no centro perfeito fora deste campo de texto. Então eu pressiono comentário A para selecionar o texto e eu quero tornar este texto maiúsculo. Então vamos para o tipo de homem, você sabe, jogador, mas tipo que eu sabia e vamos para a transformação de texto e maiúsculas agora. Como você pode ver, ainda é minúscula. Mas se você escapar desse campo de texto, portanto, se você clicar fora, esse imposto será automaticamente convertido em maiúsculas. Agora, alguns atalhos de teclado mais ótimos para o texto. Se você pressionar opção comando pass ou opção comando menos, você terá o texto alterado o tamanho para que você tenha um texto maior com o botão de adição e, claro, texto menor com botão de menores. Além disso, se você selecionou o campo de texto, você pode pressionar a tecla de comando no teclado para acessar o tipo letra e começar imediatamente a digitar o nome da fonte que deseja usar para este texto. Então isso é começar a digitar Avenue. E agora você pode usar as setas do teclado para descer menos ou subir menos e ver como elas mudam, como o telefone muda de acordo. E, em seguida, também vamos selecionar o branco fora de nossos telefones e vamos manter provavelmente pesado. E também vamos mudar a cor muito difícil esta cor laranja. Agora vamos centralizar o texto na garrafa. Vamos como ambos mentirosos e vamos pressionar nosso atalho de teclado, que é comentário colchete esquerdo e comentário. Paride suporte para século diretamente no meio, e eu esqueci sobre o carro fora das linhas. Então isso é comum Creek nas linhas para selecioná-los e mudar os mutuários de acordo com laranja e verde. Agora vamos criar um símbolo fora deste fundo, então selecione ambas as camadas, e eu vou criar um novo grupo para este mesmo tipo de símbolos. Então eu vou ter lutado padrão barra, e este é o meu primeiro valente fora desta garrafa A Z pode ver que é totalmente responsivo, bem como, para que ele possa escalar Tudo permanece no centro, e também eu posso substituir o rótulo de ativação para que você pode ter texto diferente para as batalhas. Então é isso para as três iterações da nossa tela inicial. Espero que tenha gostado desta lição e que te veja na próxima. 31. Variantes de botões: Olá. É bom te ver na próxima lição. Então, na lição anterior que criamos em Barton e depois fizemos um símbolo deste fundo. Isso é ótimo. Mas precisamos de mais algumas versões destas garrafas, e vamos fazê-lo no discurso do símbolo. Então vamos como o padrão inferior. E como podem ver, podemos sobrescrever o rótulo aqui. No entanto, nós também gostaríamos de mudar a cor fora do traçado, por exemplo, e também possivelmente fazer alguns estados, por exemplo, quando o usuário passa o mouse sobre esta batalha ou quando o mas sobre estes ativos e fazer Então, vamos seguir essas definições de símbolos. Então é duplo grego neste símbolo, e agora eu vou ampliar e vamos por um segundo discutir algumas idéias sobre como isso pode ser feito. Então, primeiro, vamos para a barra de ferramentas, e eu vou clicar com o botão direito e personalizar a barra de ferramentas para que você possa ver que há um símbolo e também um frasco de texto de estilo. Se você adicionar esses botões aqui ao dinheiro, você não precisa mais cavar fundo neste menu de inserção. Você oh, você pode acessar, por exemplo, cores dos símbolos. Então vamos inserir nossa cor de sotaque e colocá-lo em algum lugar neste símbolo, eu vou patinar para que ele sinta todo o nosso fundo. E é possível sentir esse golpe da cor azul? Bem, se é como cor e retângulo e você tentar mascará-lo, bem, você tem o fundo fora da cor de sua escolha. Então, se você tem garrafas com fundo sólido, isso seria uma opção. No entanto, no nosso caso, realmente não funciona muito bem. Então, se tentarmos acessar essas propriedades de máscara, como você pode ver, o campo e a borda são meio que ótimos fora. Isso significa que você não pode usar a única fronteira ou apenas sentir por uma mesquita. Então talvez na versão futura do esboço, não em mente, pelo menos. Mas a outra opção é ir para a camada e depois converter em contornos. E o que ele cria? Um caminho diferente forma diferente fora desta forma particular que você tem aqui e agora você pode selecionar a cor, bem como a segunda camada e ligar a mesquita. E tudo bem, aí temos. Por isso, é possível. Bem, na verdade, é, mas não é a melhor abordagem. No entanto, você retorna para a instância, agora você pode parar as cores fora do contorno, e ele funciona muito nono, nice s e substituir. Não é a melhor abordagem, porque se você tentar escalar o fundo, você pode ter os resultados diferentes, especialmente se você escapar fez sem proporções. E outro problema maior, eu acho, é que por enquanto, pelo menos na minha versão do esboço, você não pode substituir a cor do texto. Então isso é um problema, e vamos resolver esse problema criando diferentes versões fora da parte inferior. Então essa é a opção arrastou o 1º 1 E agora vamos pressionar comandos fez para criar símbolos diferentes que serão os diferentes tipos de nossas batalhas, e vamos mudar as cores por isso é um pouco fora clicando. No entanto, eu acho que vale a pena porque você faz isso apenas uma vez para o seu aplicativo. E vamos mudar as cores para erros. Agora temos exceto cores, então os botões verdes, e também vamos definir a última cor para uma cor azul. E mesmo que nosso brainstorming não tenha corrido muito bem, acho que essa técnica também é muito útil e lembre-se disso. Converter opções de esboço do dedo do pé no esboço em Segunda Falha Existem alguns plugins para esboço que podem permitir que você altere os valores de cor em todo o documento. Então, se você verificar os valores de cor para verde, por exemplo, este é para quatro db cinco e você pode com um plug in. Você pode trocar esses valores, também, qualquer diferença de cor em todo o documento. E talvez você use algum tipo de conversa de vez em quando. Então, sim, isso foi do topo da minha cabeça. Agora vamos recolher esses grupos, esses símbolos e mudar seus nomes. Então isso é comentário de imprensa são e que a primeira garrafa é a azul. Então temos esse sotaque padrão de traço. O segundo é padrão Dash, exceto que o 1º 1 é o vermelho. Então, temos um erro aqui e inferior padrão com algumas informações. Isso é estado de alerta. Então vamos colocar aviso aqui e OK, então lá temos quatro primeiros estados fora de nossos botões. Eu também sempre faço fundo branco e preto para que eu tenha este neutro gerar botões para que eu possa usá-los mais tarde no meu projeto. Então vamos mudar as cores muito largas. Eventualmente, eu não usaria branco puro e preto puro também. Então talvez algum tipo fora, preto ish cor, não perfeitamente preto aqui, então você pode mudar o valor da cor tudo o que você pode apenas manipular a capacidade. Agora que é o comando é mudar o nome desta garrafa, e este será W padrão Então por que provavelmente você pode usar uma luz padrão também. E aqui podemos, em vez de preto usar d para escuro. Então nós vamos ter padrão antes do botão escuro e l para fundo educado, ok? E que você tem seis versões de uma batalha e este é apenas um valente desta garrafa. Então, vamos selecioná-los todos. E vamos opção arrastar para ter outra cópia e vamos ordenar que você tenha ainda mais uma duplicata desses seis botões. Agora vamos selecionar todos os itens aqui no for dro e vamos para a opacidade. Eu vou fazer o estado ativo fora do fundo e será em torno de 20% de capacidade. Então lá você tem estado inativo e a segunda, a segunda camada. Então vamos selecionar apenas ângulos diretos que temos aqui. Vou mudar as propriedades destes botões e em algumas sombras. Então nós temos efeitos no esboço lá, e nós podemos em sombras também em suas sombras. E nós podemos habilitar essas garotas propriedade sindler também. Então eu não vou usar aqueles mais jovens. E também, eu não vou na sombra deles e vamos ajustar os valores um pouco. Eu vou colocar zero na posição y para que você tenha sombra que é igualmente distribuída através traço e você pode mudar a desfocagem desta sombra. Vamos deixá-lo às quatro. E bem, isso é o que eu vou fazer. Eu vou mudar a cor para que você possa ter até mesmo uma sombra clara aqui para que nossos fundos tenham esse pequeno efeito de brilho, e eu não vou usar cor branca pura. Mas, em vez disso, vou usar este tipo de cor amarela e talvez dinheiro. As pessoas que eu manipulo o são muito capacidade um pouco, bem como você pode até mesmo definir um modo de mistura para dias. Eu vou ficar com cerca de 36 Alfa Valor e este estado ativo fora das garrafas agora parece realmente bom. Eu também vou ligar o campo e usar a sensação branca com alguns apenas um par de capacidade por cento , talvez seis ou 5% de capacidade. E esta segunda fila é agora o estado ativo das minhas batalhas. Então, agora seria melhor mudar os nomes de toda essa cópia de instâncias fora da parte inferior. Mas não vou desperdiçar seu tempo. Eu só vou para esta seção inferior off símbolo, trocar muitos anúncios Agora você pode escolher o botão que você gosta de usar. Por exemplo, esta cópia variantes que são estados ativos e copiar para a violência que são esses estados capazes. Então vamos mudar para outro. E aí está. Então é assim que você organiza a estrutura de fundo no discurso do símbolo. Então, obrigado pela sua atenção. E vejo-te na próxima lição. 32. Pré-visualização no iOS: esboço tem um grande futuro que é chamado Espelho esboço. Nesta curta lição, vou mostrar-lhe como visualizar o seu layout diretamente em um dispositivo móvel, como tablet ou telefone. Então, primeiro você precisa baixar, congelar, pegar espelho da loja APP e está disponível apenas para dispositivos IOS, pelo menos por enquanto. Mas também, você pode tentar este partido francês faz, como cristal para cima ou pago, que é visualização de cores, e ele deve funcionar sob ele também. No entanto, em um segundo vou mostrar-lhe uma dica sobre como pré-visualizar no Android dentro de sua rede local e vamos mudar o esboço. E agora vamos usar esse medidor de captura no meu iPhone. E quando você abre o up, você tem ah, informações curtas de que o APP está conectado ao arquivo de esboço em que você está trabalhando, bem como uma pré-visualização dos primeiros artigos. Para mim, é sempre melhor conectar meu telefone com o cabo U. S B porque ele também está carregando. No entanto, você pode usar apenas a rede Wi-Fi e você tem que estar na mesma rede Wi-Fi tanto para o seu laptop quanto para o seu computador, bem como para o seu iPhone. Então você pode agora clicar neste ícone de espelho na barra de ferramentas e você tem dispositivos conectados. Eu tenho um dispositivo conectado, que é o meu iPhone. E também, eu tenho este pequeno ícone que permitirá Teoh visualizar este projeto também no navegador. E este é um pequeno truque para um andróide. Se você tiver seus dispositivos Android na mesma rede, basta copiar o endereço. Então você tem o endereço I P e deportar, e você cola este endereço no navegador Androids e é isso. É assim que você pode ver a vida muda do seu esboço. Cinco dentro do navegador Android. Então eu geralmente tento ter meu iPhone conectado o tempo todo. E quando estou trabalhando em um projeto baseado na Web e, por exemplo, quero compartilhar com meus colegas no trabalho, às vezes eu posso passar o endereço I P, e eles podem visualizar o protótipo também. Então, agora vamos dar uma olhada no up. Se você tocar no quadro de arte, você pode acessar o primeiro nosso barco, e então você pode trocar um deslize para a esquerda ou para a direita. Teoh tem uma pré-visualização ou fora de algumas diferentes nossas pranchas, então você pode selecionar qualquer coisa no nosso barco. E como você pode ver, as mudanças que eu faço no esboço são em tempo real no meu dispositivo. E é realmente uma ótima experiência tê-lo em seu dispositivo o tempo todo, porque você sempre pode cheques duplos. Por exemplo, os telefones, tamanhos de telefone, eles aparecem corretamente. Se eles são legíveis no dispositivo e também alturas de linha, você pode aplicar algum ritmo de diferença para os elementos que aparecem no formulário. E também você pode verificar duas vezes as cores, que é bastante importante porque às vezes há uma pequena mudança entre as cores no seu monitor e no seu dispositivo móvel. Então eu recomendo fortemente que você use o tempo todo para ter este espelho de esboço ligado . Além disso, é bom ter seu telefone conectado com cabo USB, pois oferece uma visualização de vida útil suave e também carrega seu dispositivo. Então isso é tudo por enquanto. Vejo-te no próximo filme 33. Tela de login: Nas lições anteriores, criamos uma tela que diz, tela inicial e temos três variantes diferentes fora da tela. Então agora eu vou selecionar o primeiro quadro de arte, e eu vou opção arrastar para duplicá-lo. E é assim que eu estruturo a luta de esboços. Então, de cima para baixo, vamos ter diferentes seções de nossas aplicações. Então este é basicamente o fluxo de usuário, e é assim que o usuário navega através de diferentes seções do aplicativo. E no que diz respeito a esta horizontal do companheiro, vamos duplicar as placas de arte horizontalmente e criar diferentes variantes fora das páginas ou subseções diferentes de cada seção de nossa aplicação. Então é assim que funciona. E agora vamos nos concentrar nesta primeira tela. Então, antes de irmos para a tela inicial, vamos ter uma tela de registro. Então vamos para a camada de fundo. E aqui temos isto. Grady e eu não precisamos desse Grady para a tela de registro. Então eu vou separar isso do Símbolo, e agora eu posso acessar o retângulo e eu posso desligar os campos. Vamos ao sentimento e vamos desligá-lo. Ok, então agora podemos trabalhar com esta primeira tela e vamos ligar a imagem do herói. Vou fazer esta máscara um pouco maior para cobrir um quadro de arte inteiro. E também, precisamos fazer alguns ajustes na foto para que você não possa gostar da foto, e você pode movê-la, bem como você pode redimensioná-la. Lembre-se que por baixo desta foto, temos sua resolução nativa para que mesmo se eu multiplicar esse tamanho por dois, tanto quanto com seu concerto, eu vou ter a imagem perfeita do Cory. Então talvez pudéssemos fazer isso um pouco menor. E vamos colocá-lo no centro e também qualquer um como você pode ver, às vezes trabalhar bem para mapas de batida de alta resolução no esboço é bastante lento. Então, se você tiver muitos mapas de batida e tentar movê-los, redimensioná-los, esboçar minha resposta lentamente, e para fazer isso acontecer mais rápido, você pode ir para o menu de edição fora da imagem, ou você pode simplesmente pressionar retornar na imagem, e aqui você pode fazer uma seleção. E com esta seleção, você pode inverter o corte ou, por exemplo, senti-lo com alguma coisa. Ok, você pode até usar o Magic One. Mas, por enquanto, vamos apenas fazer uma seleção que é um pouco maior do que a arte sobre o tamanho. E quando você tiver essa seleção pronta, você pode ir para as opções e selecionar cortar. E agora, se você cortar, você se livra de todos os picos desnecessários. EUA e esboço responderão mais rápido. Outra maneira de otimizar suas imagens é usar uma das posições no dinheiro do esboço. E se você selecionar a imagem e ir para a camada, você pode selecionar imagem e reduzir sites de imagem. Às vezes, se você tiver imagens de alta qualidade no esboço, isso pode ajudar. Mas para esta imagem, ela já está otimizada. Então Sketch diz que ele não pode otimizar mais esses cinco, então basicamente usou essa opção sabiamente porque mais tarde, você pode não ser capaz de voltar atrás. Então agora vamos diminuir a opacidade da nossa imagem, e eu gostaria de mostrar a vocês sobre as opções deles. Então vamos ligar o gás lá dentro, e a opção padrão está dando a você a possibilidade de mudar. A quantidade de desfoque em você pode ter uma imagem mais ou menos borrada enquanto você acessar desfoque de movimento. Você também pode alterar o ângulo. Então agora você pode ver que temos ângulo diferente para o borrão e podemos determinar uma quantidade apropriada. A próxima opção é zoom, desfoque, e para assembler, você pode clicar em editar para adicionar a origem, e você pode alterar a região para que você possa ter esse zoom indo para algum lugar particular fora do seu imagem. Alguém que você é tem picos fora da sua imagem e que é levar o gás lá dentro para esta imagem e eu vou ter cerca de sete picos de borrados aqui e agora vamos colocar aqui algum texto. E eu já copiei o texto de outra arte a bordo para que não percamos tempo apenas digitando o texto. E também, por favor, saiba que se você pressionar o comando v, você colá-lo no lugar direto de onde ele estava lidando. E se você selecionar qualquer coisa, por exemplo, esta forma e pressione o comando shift v você vai passá-lo para o canto superior esquerdo fora desta forma selecionada e também você tem um dedo do pé opção, botão direito ou controle, clique em qualquer lugar e usar paced aqui comando e, em seguida, esboço irá colá-lo neste mesmo pixel que você clicou no início da borda superior esquerda. Ok, vamos colá-lo aqui e agora vamos tentar fazer um pequeno ícone ali, então eu vou usar um pessoal e nós realmente não usamos esta turnê desde o início do nosso curso, mas por outro lado, não é tão útil no esboço. Mas você pode ser criativo com o dedo especial e talvez, vamos imaginar que podemos desenhar algo. Podemos traçar uma linha como esta. E a grande coisa sobre esta linha é na verdade que esta é uma borda, então você pode mudar suas propriedades. E isso também é um caminho, então é vetor completo. Agora. Vamos realmente tentar criar algo útil com o passe. Ele vai e vamos tentar criar um pequeno ícone de impressão digital. Eu vou desenhá-lo assim, e não é o cubista que eu conheço. No entanto, agora você pode acessar as propriedades apropriadas da borda, e você pode mudar as formigas para que eles em torno que você pode mudar as articulações. Você também pode determinar o traço e a lacuna e até mesmo, por exemplo, ter quatro e 10 e até mesmo ir mais largo e ter mais quatro e duas escolhas, uma lacuna para ter efeitos diferentes, e há uma grande chance de que se você tentar o suficiente e você mudar todos esses valores, bem como se você entrou vetor qualquer coisa molde mais tarde. Então, se você pressionar Return e acessar todos os pontos vetoriais que você tem aqui e tentar mudar suas posições usando as setas do teclado e ela gastou 10 ou 15 minutos nisso, você obtém esse tipo de ícone. E outra abordagem criativa para usar uma fantasia é realmente fazer vazamento para que você possa fazer alguns simples Faça aqueles, assim, e eu sei que não é muito bonito. No entanto, se você acessar as propriedades da borda agora, você pode criar algo que é um tipo de gráfico ah, por exemplo, ou algumas partículas para que você possa ir com extremidades arredondadas e, em seguida, ter algum pequeno traço e enorme lacuna. Por exemplo, 100 e lá você tem os pequenos pontos Feingold ao redor, e se você mudar o traço, você vai ter voado em diferente, mãe diferente, e você também pode mudar a lacuna em conformidade, de modo que você tem partículas diferentes, e agora você pode acessar esta segunda seção e disse, por exemplo, traçar fora livre e cap off 200 apenas fazer esses valores diferentes. E vamos imaginar que você tem um fluxograma ou um gráfico aqui, e você pode menos gostar desses dados de tal maneira. Então é bem legal, na verdade. Agora, isso é um final deste ícone. Eu vou desenhar um retângulo aqui e vamos duplicar distrito atrás comandos D Agora vamos imaginar para a esquerda eu vou entrar neste molde qualquer coisa com retorno Selecione um os pontos vetoriais e colocá-lo 20 pixels para cima e o 2º 1 20 pixels para baixo com shift e seta para baixo. Agora vamos criar aqui e que selecionar ambos os retângulos, e eu vou usar a operação booleana fora da União. Agora, eu preciso de uma linha aqui, então eu pressiono l e desenho uma linha que está posicionando corretamente. Agora quero apagar a parte da linha que está atrás das impressões digitais. Então deixe-me entrar no modo de edição do primeiro retângulo, e eu vou adicionar pontos vetoriais aqui. E também deixe-me entrar no banco de tesoura e apagar este segmento debaixo do meu ícone. Então é isso. Basicamente , está quase acabado. Agora, talvez eu vá entrar nesse modo de edição novamente e selecionar com Shift. Ambos os pontos vetoriais e mudar para a esquerda para a direita nossa própria magia para a direita. Agora o que vamos fazer é selecionar o quadro de arte e vamos mudar o nome dele. Então eu pressionar Comando são e eu disse, É tela de registro. Vamos selecionar algumas camadas aqui a partir do ícone e vamos criar um grupo a partir delas. Vou alterá-lo para o ícone de barra de registro. Então vamos como ambos os campos de texto e também fazer um pouco de limpeza lá. Isto vai estar registrando a linda informação da barra. E conosco, temos esse dedo traz imagem de herói para casa. Então talvez doce lar e colocar Logan aqui como um nome fora de nossa tela. E eu também vou ler isso, uh, desligando uh, esta seção de casa e núcleo para o meu campo. Ok, é isso. Temos a primeira parte da nossa tela de registro. Agora vamos selecionar o segundo campo de texto com comando e vamos opção de medicamento. É para que tenhamos uma cópia aqui e abaixo do ícone. Vou dar a vocês uma opção de registro com as senhas dele. Então eu vou usar o símbolo de uma batalha e vamos usar este padrão mentiu sobre eu vou fazer aquele fundo maior. E também, eu gostaria de colocá-lo neste centro fora do meu Archibald horizontalmente. Então eu pressionei o comando colchete esquerdo. Agora eu posso fazer substituições para o texto, mas eu também quero mudar a borda. Então eu cheguei vazamento em I selecionar destacado do símbolo. E agora posso mudar o texto. Então vamos colocar aqui digitar senhas. Então essa garrafa realmente se transformou em um campo de entrada. Vamos como o grupo. Vou pressionar cinco no teclado para mudar a opacidade para 50%. E como este é um campo de impulso, eu também vou mudar o estilo deste retângulo. Eu vou selecionar retângulo e assim, como traçar fora quatro e Gap off nove. E isso era impossível de fazer sem separá-lo do símbolo. Então agora podemos agrupar algumas camadas, por exemplo. É como aqueles grupos que colocam a impressão digital dentro do ícone de registro. E vamos criar um símbolo fora deste ícone que eu vou colocar que eu posso ouvir e isso é registro em log. E também, eu vou criar símbolo fora desta garrafa também. Então, vamos selecionar as camadas. Vou criar um símbolo. Vamos colocar informações e eu vou montar palavras de chefe, e é isso. Então, por favor, lembre-se de manter tudo na sua coluna vertebral mais tarde limpo e arrumado. Agora vamos excluir esse grupo. Já não é necessário. Vamos mudar um positivo para 50% novamente. E agora vamos criar esse estado diferente para nossa tela de logon. Então, vamos clicar no nome deste barco de arte e vamos duplicar com comandos D e este será o estado ativo fora do campo de entrada de senha para que movamos tudo para cima. E eu também quero destacar esse campo de senha de tipo. Então vamos como este campo e vamos mudar a opacidade de 50% para 100%. E também vamos substituir este tipo de entradas de senha para que tenhamos apenas linha aqui. Então simboliza que o usuário pode aqui. E também precisamos ir ao arquivo. E aqui temos os modelos. Vou usar o IOS. Você eu projetar modelos, e a partir deste temperado, você pode pedir emprestado, por exemplo, um teclado escuro. Eu vou vir e ver o teclado de cópias aqui. Vou colá-lo e movê-lo para o fundo da nossa tela assim. E aí está. Parece que temos isso quase pronto. E se você der uma olhada nos símbolos, esses símbolos colados também estão aqui. Então temos um teclado e escuro e mais baixo. Essa é a estrutura. Essa é a convenção de nomenclatura para este teclado para que você possa usá-lo mais tarde na sua próxima parte. Placas. Talvez você também mude isso. Não é realmente para ele. Texto e pressione o comando A no campo de texto e apenas, digamos, digite a senha aqui. Provavelmente é isso. Agora você pode voltar para a página de símbolos, e você pode ajustar alguns símbolos que criamos nesta lição. Talvez nós vamos criar este efeito halo para o ícone de registro também. Então isso é uma sombra aqui como vamos usar uma sombra simples. E vamos mudar o núcleo para algo brilhante. Talvez a nossa cor de sotaque. Vamos mudar a posição Y. Vou colocar zero aqui para que a sombra seja igualmente distribuída através do nosso ícone. Não e agora parece muito bom. Então este é um efeito de halo agradável que aparece em ambas as instâncias fora deste ícone, e que seria para esta lição. Espero que se junte a mim no próximo 34. Tela de casa: Bem-vindos à próxima lição, e vamos primeiro. Fale sobre páginas escassas para que você possa adicionar quantas páginas quiser. E a questão é, você realmente precisa deles? Bem, obviamente, isso depende do projeto, porque se você tem um projeto grande e você tem seções diferentes fora de seu aplicativo ou por exemplo, , um site, você terá páginas diferentes para otimizar seu fluxo de trabalho. Para mim, eu crio páginas, principalmente porque fora da eficiência bem, se você tem páginas diferentes, esboço tende a trabalhar mais rápido. E se você tiver muitas de nossas pastas em uma página, provavelmente isso teria um impacto direto no desempenho de sua máquina. Então, se você descobriu que o esboço está apenas começando a funcionar lentamente, então considere ter uma próxima página para o próximo artigo do seu projeto. Às vezes, no entanto, é bom trabalhar na mesma página. Isso porque você pode acessar diferentes quadros de arte e, por exemplo, copiar e colar alguns elementos. Alguns campos de texto alguns ícones a partir daí, e você não precisa ir para, por exemplo, inserir símbolos e outras coisas. Então é só ter em mente. Mas lembre-se também de que, por razões de eficiência, você gostaria de ter mais de uma página em seu projeto e que normalmente você manterá diferentes seções fora de seu aplicativo ou seções diferentes do seu site como uma página diferente . Então agora vamos criar uma luta diferente para uma seção geral fora da nossa aplicação, e eu já lidei com isso de nossos furos de arte para que eu pudesse acompanhá-lo aqui. E vamos começar a partir de um certo tamanho fora da arte a bordo e talvez, apenas talvez, usemos alguns bens que temos aqui também. Então vamos redefinir a posição fora X e Y 200 Eu vou apagar quase todas as camadas. No entanto, eu vou ter este campo de fundo para estar dentro deste quadro de arte, e vamos ter um símbolo fora de cima. Então agora é hora de testar algumas habilidades de teclado. Você vai ter que pressionar banheira opção, e então você aprendeu no primeiro na primeira entrada alimentação fora posição. Você pressiona zero top zero, e lá você redefiniu a posição das coordenadas X e Y. Eu não tenho certeza se você é um jogador ou se você joga Mortal Kombat antes, mas esta opção Top zero zero zero zero seqüência soa como uma fatalidade ou algo assim. Então, vamos agora substituir e vamos substituir acima campos de texto. Vou colocar quartos e também selecionar quarto aqui. E o que eu gostei de substituir também são os ícones. Então eu tenho esses ícones para a direita e para a esquerda e vamos para um símbolo sobrescreve. E, em vez disso eu concordo, eu vou escolher as configurações de ícones e eu preciso substituir esta câmera com algum tipo de botão home que vai me deixar ir para registrar uma tela. E se eu tentar Teoh, mude. Como você pode ver, não há símbolos para substituir e por que isso aconteceu? Bem, na verdade, esta é uma pergunta muito boa, porque a captura de casa determina que tipo de símbolos te mostrar neste símbolo, certo? Bem, se você voltar para a página de símbolos, você descobriu que você tem muitos símbolos, eo esboço realmente escolhe os símbolos que podem sobrescrever uns aos outros pelo tamanho fora do símbolo. E deixa-me mostrar-te o que quero dizer. Se eu selecionar ícone câmera e ir para as configurações de tamanho, eu posso ver que é 24 por 22 pixels. Vamos selecionar outro ícone. Por exemplo, eu concordo, e como você pode ver, este símbolo é de 24 por 24 pixels. E mesmo se você tiver um ícone que não está totalmente fechado pelo símbolo, não é um problema a menos que você tenha o símbolo que é três tamanho correto e que ele pode substituir eso. Se você tem 24 por 24 funciona bem. Então vamos mudar o tamanho desta câmera ícone para ser 24 por 24 pixels. E se você fizer isso, vamos mudar a altura e você volta. Teoh esta, uh, tela geral. E agora vamos tentar sobrepor a câmera, e todos os Akron estão no mínimo. E isso é porque todos os ícones são 24 por 24 para que você possa facilmente mudá-los, e eu vou mudá-lo para este pequeno ícone de casa com o cadeado e este ícone de casa. O mundo vai para a tela de login. Mas, por enquanto, vamos nos concentrar no próximo item aqui. Vou colocar uma garrafa. Talvez vamos usar esta garrafa de sotaque padrão, e com base nesta batalha, eu vou criar uma notificação simples que aparecerá na parte inferior. E vamos pressionar o controle G para ativar, decretado, bem como comandos para ampliar este elemento e que centralizar isso na tela . Eu também posso pressionar o controle l para ver o layout e como ele se alimenta no layout para que você possa fazer esses pequenos ajustes. E é sempre bom fazer esses ajustes dio os itens que aparecem no único layout s para que fique mais estável e pareça melhor. Agora vamos separá-lo do símbolo e vamos acessar o retângulo lá. Eu vou mudar a cor para que ele tenha o campo fora de uma cor azul que é selecionar nossa cor azul. E também eu vou mudar, ativar textos e vamos para digitar texto transformar, e eu vou selecionar conhecido aqui. Não quero que o texto em maiúsculas apareça aqui. E finalmente, para este recurso, vamos mudar o estilo do texto para que seja talvez uma das legendas, e eu vou selecionar a versão mais leve da legenda. Então a versão 90 agora que mudou as tags que aparecerão aqui. Estou esperando grãos, então as janelas estão fechando e, um, vamos colocá-lo no centro do nosso quadro de arte, e isso não é apenas o seu firmemente para o fundo, de modo que é opticamente correto. Agora vamos mudar o nome para notificação e vamos organizar mais tarde para que possamos criar símbolo fora notificação também. Eu vou entrar e entrar neste símbolo e o que eu preciso aqui é um pequeno ícone X para que você possa fechar a notificação. Então, um peso inteligente fora do fora fazendo tal ícone é criar um retângulo que é a altura fora da letra L A. E vamos mudar a espessura deste dedo do pé um retângulo, e isso é posicioná-lo corretamente para que agora possamos acessar as ferramentas vetoriais V opressivo e criar a primeira linha vetorial. Agora temos que duplicar esta linha, então vamos pressionar o comando e vamos invertê-lo horizontalmente. Agora podemos nos livrar do retângulo, selecionar ambos os caminhos e agrupá-los com o comando G. E talvez, apenas talvez, parece melhor. Se voltarmos e selecionarmos ambas as linhas, assim como formos para as fronteiras e vamos eleger , isso termina. Agora. É perfeito. Então vamos voltar à instância, e eu acredito que isso é tudo no que diz respeito à nossa notificação. Então agora isso é o comando da imprensa. Um dio-view toda a arte a bordo, e a próxima coisa que vamos criar é um oval que representará a escala de temperatura . E sem soltar o botão mais esquerdo ou desenho, eu posso pressionar barra de espaço para posicionar na correção do Archibald. Vamos colocar a temperatura aqui. Vou colocar 25 graus fora do centro. Ótima. Então vamos precisar que Teoh procure um personagem especial fora das células. Use a graxa e eu vou pressionar o controle da barra de espaço de comando. Se você pressionar comandos de controle Barra de espaço, você vai abrir esta janela de caracteres especiais com emojis e antigos, os caracteres que você pode procurar e vamos começar a digitar células usar. E agora você pode copiar este personagem com mar comum e colado diretamente no seu texto. Poucos que mudaram, decide talvez algo em torno de 70 ou 60 e também vamos mudar o peso para o mais ousado fora do mo para o tipo Avenue, que é preto. Agora vamos selecionar com deslocar ambas as camadas e comentar colchete esquerdo e direito para posicionar no centro. No entanto, como você pode ver agora, Moffett está perdendo com a arte e porque este texto deve ser posicionado mais para a direita como há um vende você assinar e não está bem ônibus agora. Então vamos colocá-lo, Não vamos com setas de teclado um pouco para a direita, e eu também vou mudar a espessura fora disso sobre, modo que isso é realmente grosso. Além disso, eu gostaria de apagar esta parte inferior do lado de cima, e eu vou usar réguas. Então vamos pressionar o controle são para as réguas e vamos ampliar com os comandos para agora. Vamos ter um guia que fica em algum lugar por aqui, e agora precisamos entrar no modo vetorial de edição para o geral. Então vamos selecionar o over Isso é pressione retorno, e este pequeno guia vai me ajudar a posicionar os pontos vetoriais em um eixo para que depois você possa selecionar a ferramenta tesoura. Vamos para a tesoura e deletar esses dois segmentos, e estamos quase prontos. Agora vamos para as propriedades de bordas e vamos selecionar ao redor. Acaba com 40 fronteiras. Sei que é engraçado porque estou abaixando minha voz quando estou focada, mas por favor, tenha paciência comigo. Quase o deixamos pronto com o nosso componente. Vou me livrar dos guias, bem como dos governantes. E agora vamos criar mais um sobre o qual se sentirá com a cor branca. E a propósito, se você quiser ativar a sensação, você pode pressionar F no teclado e para fazê-lo com Bordas, você pode pressionar agora que mudou a cor fora da borda, bem como uma espessura. E uma última coisa que vou fazer à fronteira é diminuir a capacidade. E vamos deixar a opacidade para cerca de 75, isso é tudo por enquanto. Vou continuar a desenhar esta tela na próxima lição. 35. Tela principal: ainda estamos trabalhando com a mesma tela. E agora vamos nos concentrar no brilho. Vou selecionar isso sobre o que tínhamos aqui e como um campo de fronteira. Também podemos escolher ingredientes, então temos essa cor sólida. Mas também podemos escolher a outra opção, que é linear Grady Int, bem como radiante rádio e angular gradado. E para este item em particular, eu acho que eles são angulares, radiantes, com os carros que eu tenho aqui nestes pequenos retângulos serão perfeitos. Então, como você pode ver, há um círculo, e neste círculo temos duas cores. Então nós temos que colorir paradas por agora para este angular, radiante, e nós podemos obviamente ajustar essas cores, bem como algumas outras cores para o radiante com o ciclo de vidro. Vamos selecionar essas duas cores, que podemos fazer, que podem selecionar diretamente do seletor de cores. Ou podemos clicar sobre estes pequenos pontos aqui para selecioná-los também. E desta forma, você pode simplesmente alterar os valores de cor. Mas ele também pode riacho e arrastar acima da escala, bem como este círculo para mudar a posição fora desta cor no radiante. Então agora vamos em algumas cores aqui e vamos mudar os valores de cor. Vou começar com esta primeira cor e vamos usar o seletor de cores aqui para selecionar o primeiro carro que eu tenho. E agora eu vou adicionar outra cor apenas clicando na escala, e isso é ver esta filhinha. Eu posso movê-lo aqui, e isso é selecionar uma cor diferente. Então eu vou para a cor azul mais clara agora, outra abordagem para ranger diretamente no dedo do círculo. Adicione outra parada de cor e pressione o controle, consulte para ir diretamente para o seletor de cores. E é isso que vamos fazer para a próxima cor. Então eu estou adicionando cores, pressionando o controle, veja e selecionando cores da minha paleta de cores do Pekar. Agora você pode mover as cores ao redor, e você pode ajustar este Grady para que ele esteja perfeitamente alinhado. E isso você pode dizer que meio que faz sentido porque você tem as temperaturas mais baixas, temperaturas no lado esquerdo fora desta caixa para que nós usamos cores azuis do que você tem laranja no meio e no lado direito da nossa escala. Fora do nosso radiante. Temos temperaturas mais altas para que usemos cores vermelhas. Agora vamos apenas este controle deslizante um pouco. Preciso mudar a posição fora do curso para estar fora e talvez mudar a espessura. Agora vamos mudar o tamanho deste componente para que ele seja um pouco menor e também eu vou me mover. Vou usar a capacidade de cerca de 90% para alguns. Agora vamos duplicar isso com um Grady int, e eu quero me livrar dessa fronteira. Então, basta arrastá-lo para fora do painel de propriedades e ter alguma outra borda com uma cor sólida . Panfletos usaram algum valor de oferta para esta cor azul escuro, e nós vamos ter espessura fora de um. E também gostaria de criar outro elemento. Vamos duplicar isso mais uma vez, e agora eu quero mostrar-lhe técnica legal que vai permitir que você crie escala vertical. Então, vamos para as fronteiras daqui. Copiado, também. E vamos usar o valor do traço fora um e o valor do gap off 10. Agora vamos desactivar a volta disto fora das bordas. Vou colocá-los em linha reta, e se você for para espessura, a magia acontece como você pode ver, você pode criar essas linhas verticais como escala de pagamento. Se você acessar as propriedades da borda novamente e alterar o tamanho da lacuna, você também poderá alterar esse tamanho do caos simultaneamente. Então vamos criar talvez 24 picos de conversa, e isso aqui vai ser duplicado novamente. Então é mercadoria pressionada, e isso é porque queremos ter essa escala externa também. Então vamos mudar o medicamento opção para criar outro e vamos mudar a cor fora da borda . Vamos selecionar uma cor mais clara e vamos modificar a opacidade também. Vamos definir cerca de 30. Vamos voltar para essas propriedades de borda, e isso mudou o valor gab para que tenhamos menos linhas. Então você definitivamente precisa se lembrar dessa técnica. E o que é ainda mais incrível e fantástico é que se você der uma olhada no painel Camadas, você tem cópias gratuitas do mesmo fora de quatro cópias do mesmo, enquanto na tela eles parecem completamente diferentes, e nós conseguimos isso, você sabe, usando imaginação e também com habilidades fantásticas fora do esboço. Então, uma última coisa que vamos fazer a este elogio de temperatura são rótulos dos dedos dos pés. Eu vou usar algum estilo de texto muito fino fora da legenda 50 e vamos selecionar este Textile Creek uma vez e colocar o primeiro rótulo fora 10 graus. Então vamos como este tipo. Vou pressionar o comando B, que é um atalho para a configuração, o texto é muito negrito. E não é Fox negrito, é um realmente mudando o branco fora do dedo do pé texto pesado e todo o tempo eu tenho esta pré-visualização do iPhone ligado para que eu possa olhar no meu telefone no meu dispositivo real e determinar se este texto pode ser menor se ele pode estar fora de menos capacidade e eu posso fazer escolhas se deixar como está ou, por exemplo, fazer que eso maior. É sempre melhor ter esta pré-visualização do dispositivo, especialmente para esses pequenos dados confidenciais que você tem aqui. E vamos colocar alguns outros rótulos, talvez para este trabalho de fogo. Eu vou usar o valor fora 22 e o disparado na vanguarda na verdade será 26 ou 27 e nós vamos acabar com 32 graus. Então agora são um complemento está pronto, bem como é a primeira parte desta tela. Então, para a segunda parte da tela, vamos usar alguns ícones e vamos começar com a ferramenta de linha. Vou pressionar L no teclado e dirigir com o turno. Vou desenhar uma linha reta perfeita. Agora, se você quiser mudar a altura desta linha, às vezes eu tento fazê-lo e, por exemplo, arrastá-lo para que eu possa mudar o trigo ou esconder da linha. E não é assim tão fácil. Tão bem fundo aqui é pressionar um retorno, e se você pressionar Return, então se você entrar no modo de edição vetorial, você tem esses primeiros pontos vetoriais selecionados automaticamente. Agora podemos facilmente bater esta altura linhas ou trigo com as setas do teclado, e você pode pressionar a nossa seta para cima ou para baixo. Nós também podemos pressionar shift para 10 pedaço de incrementos, e lá você tem isso. Então, vamos pressionar os comandos D e duplicado clique com o botão direito na linha. Transforme e gire menos 90 graus. E aí você tem outro. Vamos igualar os dois achados e agrupá-los. Comandante Gina. Vamos mudar a opacidade 10 pressionando um no teclado, e agora tudo o que precisamos aqui são os ícones e ícones. Na verdade, eu escolho de ícones são deste extremo, Nikon disse que eu mostrei a você. E agora só posso copiar e colar esses ícones. Como você pode ver, eles já são núcleos incorretos. Então agora é apenas uma questão de posicioná-los, bem como colocar aqui alguns rótulos. Uma coisa interessante aqui é se você impressionar um chá agora e os gregos, seu novo campo de texto herdará todos esses blocos que você tinha no campo de texto anterior. Então, agora, como podem ver a Avenida Typefaces, temos o peso pesado e o tamanho menor. Então, essas foram as últimas configurações são tipo toe saber que podemos digitar ações para o rótulo fora deste primeiro ícone, e vamos mudar de cores em breve para que eles correspondam aos ícones. Mas, por enquanto, essa é a opção de medicamento para uma duplicata, e o segundo rótulo será dispositivos. Agora podemos selecionar os dois fora deste campo de texto e opção arrastar novamente para que tenhamos outro set off Trabalho agora este para o trabalho é energia e o último é CC TV. Ok, agora vamos mudar as cores de acordo para que selecione ações agora controle, veja para um ícone conta-gotas e até mesmo para uma linha tão grossa e fina que você pode facilmente. Com este conta-gotas selecionado, você pode facilmente selecionar a cor. E isso é porque você tem esse gelo do Super-Homem que lhe permitirá selecionar pixels individuais. Ok, então nós temos os ícones, bem como o trabalho. Agora vamos eleger este grupo com linhas. Essa é a posição que os posiciona corretamente, e agora isso é clicar no turno do grupo. Clique no CCTV para selecionar todas as camadas. Vamos, G para agrupá-los e colocá-los no centro do nosso quadro de arte que está se movendo para cima com a seta do teclado, e vamos voltar para a cópia da linha para que possamos tornar esta linha um pouco mais larga . Talvez seja como os dois pontos vetoriais e fazê-los para o chá. Grandes empresas. Por que há Cada lado. Então, parece-me que é quase o fim da tela enquanto eu tenho um bônus íngreme para você. Então, se você quiser reutilizar este, um, Grady, neste ângulo, um radiante que você criou fora das cores que temos aqui, você pode adicioná-lo para documentar Grady INTs. Como você pode ver, temos brilho global, bem como documentos Grady ins e você pode clicar no sinal de mais para adicionar este pouco radiante e reutilizá-lo mais tarde em seu projeto. Então isso é tudo para esta tela, e isso é horrível. Esta lição eu vejo vocês no próximo filme. 36. Tela de configurações: que está prosseguindo com a nossa aplicação. Vou selecionar o quadro de arte e pressionar o comando, disse Di Dio. O próximo verde e o próximo trem. Vamos nos livrar de todas essas camadas e isso realmente será as telas de configuração. Então vamos selecionar esta arte a bordo. Vamos pressionar o comando para e que nós estamos indo para ir para a tela de configurações pressionando sobre este pouco que eu tenho na direita fora de nosso topo. Vou usar a parada aqui fora, e vou substituir a estática para casa. Ok? Precisamos mudar este ícone também para um ícone de volta e este pequeno ícone para a direita. Vamos definir para que eu possa. Além disso, se quisermos adicionar algumas configurações personalizadas. Agora vamos nos concentrar no meio deste quadro de arte e vamos criar um casal legal e aqui . Então vamos começar criando uma linha. Vou pressionar L no teclado. Então eu crio uma linha perfeitamente reta com a mudança pressionada no meu teclado. E vamos ficar com a ganância Vamos ter 46 p fonte para a esquerda e para a direita, e vamos diminuir a espessura. A única opção agora arrastou esta linha para criar outra e também certifique-se de que ela alimenta o grego para que tenhamos ganho o rolo fora de nossas configurações e vamos defini-la 64 Gigs of Space. Vamos voltar para 100% de visualização clicando duas vezes neste ícone de loop e vamos para texto de estilo e vamos ter essa Heather 90. Mas acredito neste Texas. É um pouco grande demais. Agora vamos ter música para cima como a primeira configuração, e isso é vir em um e alterar o tamanho do texto. Você também pode fazer isso com o atalho de teclado que eu mostrei. Mas aqui, vou colocar 19 pelo tamanho do meu texto. Vou deixar isto e 90% de cor branca. Agora vamos nos esconder de acordo com o Controle G e vamos ampliar aqui. Eu gostaria de criar Heather para esta primeira linha, então nós vamos ter um elogio que realmente tem que tipo de Heather, e um será o separador de linha simples com 20% de capacidade, e os outros poderiam ser os Heathers para seções fora de nossas configurações. Então vamos usar texto de estilo novamente, e eu vou para a descrição Andi. Talvez vamos usar esta pequena descrição fora de nove pontos e será 20% assar. Agora vamos clicar em algum lugar no meio e deixar o nome fora. General, é o nome da nossa primeira seção nas configurações. Agora eu vou ter isso centrado no quadro de arte e eu preciso esconder, então esta parte fora da linha que está sob geral um General Heather. Então, vamos pressionar Return para entrar no modo de edição vetorial, e eu posso colocar em pontos vetoriais lá. Mas eu também posso dividir esta mentira igualmente e para fazê-lo lembrado cap curto, um curto corte off comando. Então, se você comandar Creek entre esses segmentos você estava sempre tem metade dos segmentos aqui, e isso me permite pegar uma tesoura agora e me livrar desses dois segmentos. E é perfeitamente igual da esquerda e da direita. Agora vamos criar símbolo que será este símbolo de seção de linha, e nós vamos ter outro símbolo para esta linha normal. Então vamos ter nove e padrão, e dessa forma nós podemos fazer algumas substituições e alternar entre a seção Fattal e entre a linha normal aqui e mais uma dica que eu posso dar agora é criar um retângulo e 10 fora da borda. Mas você pode ativar o campo, mas reduzir a opacidade para 0%. E agora você pode um grego sobre este elemento, e você pode criar um símbolo fora desta eleição, que tem na verdade a altura e o trigo adequados para que este retângulo defina esta altura e peso fora do símbolo. Deixe-me criar um símbolo fora deste elementos, e eu vou chamá-lo de configurações de uma linha e vamos para Símbolos Página. Vamos dar uma olhada nos símbolos recém-criados lá no topo. Oh, e a propósito, se você comandar mineiros e se você quiser mudar a posição desta seção nove como configuração padrão corvos configurando através, você pode alterar a posição e enquanto arrasta, não liberando o botão esquerdo do mouse, você pode segurar essa barra de ritmo, e agora você pode alterar a exibição, e agora você pode soltar o botão esquerdo do mouse. Então, agora vamos voltar para este lançamento cenário e as empresas que temos aqui são a seção de linha e também na parte inferior. Temos esta linha padrão. Basicamente, podemos nos livrar desta linha padrão aqui. Isso é porque vamos alternar entre linha, seção e linha padrão em um componentes sobre a direita? Então, se conseguirmos, se voltarmos ao general e agora se tentarmos mudá-lo com a sobreposição, infelizmente, vemos que não há linha geral. E provavelmente se você ouvir com atenção nas lições anteriores, você sabe exatamente por que isso é por causa deste tamanho fora deste símbolo. Se você der uma olhada no tamanho da seção linhas, é 311 por 12 pizzas, e aqui temos o padrão linha, que é recuperado 11. Mas temos apenas um pixels de altura, então precisamos mudar os símbolos para 12 pixels para marchar o primeiro símbolo. E se fizermos isso, vamos nos certificar de que esta linha também é dito estar no centro do símbolo. Agora vamos voltar ao arremesso e será que realmente podemos fazer? Podemos criar outro campo de texto, e teremos, por exemplo, por exemplo, Spotify aqui como nossa música padrão em nossa casa inteligente. Vamos colocar esta comida de texto para a quase direita fora da nossa seção fora de definir lançamento. E também vou usar o símbolo. Um dos símbolos que temos aqui e esta é uma seta e aqui à direita fora estão confiantes de que precisamos explicar algumas opções diferentes. Então, por exemplo, precisamos de uma seta diferente que aponte para a direita. Então isso é duplicado. E vamos separar o 2º 1 do símbolo. Agora podemos escrevê-lo e transformá-lo. Eu vou dormir. Eu não tenho girado mineiros 90 graus, e agora temos o segundo são, a propósito, também podemos clicar nesta seta e fazer montar fora dele. Então vamos dizer que é ícone barra r o tudo bem e com a gente pode usar provavelmente. Podemos usar algum tipo de switch aqui nas configurações, então é melhor ir t para o IOS. Você gosta. Então vamos para o arquivo e vamos abrir em seu novo do modelo. Eu vou dizer que eu era você trabalhar isso e aqui nós temos esses switches IOS. Você pode selecionar ambas as opções, e podemos simplesmente copiá-las e colá-las em nosso projeto. Então vamos fazer isso. E vamos enfrentá-los aqui e uma coisa que vale a pena notar agora é que se colarmos esses elementos aqui, também colamos os símbolos. Então, se você der uma olhada no topo direito do nosso espaço de símbolos, esses são os símbolos que temos aqui também. Então vamos eleger esses símbolos com comandos deslocamento pressionado em nosso teclado e podemos ampliar um pouco e se livrar de instâncias desnecessárias do símbolo. Agora vamos tomar este exemplo, e isso é bala aqui e para talvez você possa mudar algo neste interruptor. Eso tanto assim? Isto é cansativo da nossa aplicação? Então vamos selecionar esta cor Greenfield e vamos selecionar uma de nossas cores verdes. Talvez esta primeira cor de acento, modo que agora se parece com isso. E possivelmente podemos mover todos os elementos que temos aqui para a extrema direita deste componente, eu acho que seria melhor. Então vamos mover a seta e o 2º 1 também. Esta seta para baixo. Temos que movê-lo para a direita para a extrema direita deste componente. E também, vamos dar uma olhada neste campo de texto do Spotify agora. Vou movê-lo um pouco. Ok? Parece que nosso componente está quase pronto. Vamos ativar a visibilidade desse outro mais tarde para que quando eu voltar para a página geral , eu possa ver cada um desses elementos aqui e vamos movê-los. E vamos tentar mudar essas substituições para que tenhamos, por exemplo, o estado desligado do interruptor e vamos para a linha. Podemos definir um padrão para a linha, e também podemos voltar para a seção. Se nos sentarmos para a seção, podemos substituir o texto que aparece como um título da seção, e tudo realmente funciona bem, Então podemos, disse a seta. Além disso, podemos ter esta outra flecha aqui. Podemos definir alguns dos componentes para nenhum para que fiquem escondidos. Nós também pode substituir o feed de texto à direita, bem como podemos substituir campo de texto à esquerda , que é música para cima. E sim, seria melhor ou dar esses impostos sentir mais gerar. Os nomes podem estar no espaço do símbolo, mas você pode fazê-lo. Enquanto isso, enquanto temos este componente pronto, vou mostrar-lhe mais uma ótima opção. Vamos para a barra de ferramentas e isso é certo, Grande e selecione Personalizar barra de ferramentas. Agora vamos selecionar o pode concordar com e vamos colocá-lo em nossa barra de ferramentas. Esta é, na verdade, uma das melhores ferramentas no esboço. Você simplesmente seleciona qualquer grupo de camadas ou símbolo, e clica no meu ícone de ganância. E então você pode multiplicar isso, e você pode ter rosa diferente, bem como as colunas. Então vamos determinar que temos uma coluna e nós 10 linhas. Nós não precisamos de nenhum margon entre essas fileiras, então vamos colocar zero em Margon e simplesmente clicar em May Greed battle. E então você espera que essa mágica de captura aconteça. E lá vai você. Você tem 11 cópias. Você tem 11 rosa porque você tem 10 cópias e uma linha original fora e seu segundo símbolo arremesso . Agora podemos ir ao quadro de arte, e podemos desbloquear o combustível também, o fundo poucos também, para que possamos ver todos esses itens. E, a propósito, se você usar catch mirror para visualizar isso em seu dispositivo móvel, se você tem no arable, que é maior do que a tela do iPhone, você pode facilmente rolar e ele está rastejando automaticamente por padrão. Então vamos selecionar algumas dessas rosas. E se você acessar todas as linhas, como você pode ver, você pode alterar as substituições para todos fora deste assado selecionado. Então, em vez disso , fora da linha de seção, vamos ter tempo padrão, por exemplo. E agora podemos fazer ainda mais substituições para cada seção individual e sua rosa individual . Então, por exemplo, para este segundo lançamento, vamos colocar o som do alarme e esta é outra configuração. Vá para uma casa inteligente e vamos mudá-la para um novo começo. Além disso, vamos entrar neste símbolo e precisamos mudar o comportamento deste alimento de texto para ser alinhado à direita. E assim você pode ver o que está aqui, e ele sempre fica para a direita para que o texto está sendo empurrado para a esquerda para o para dro. Vamos ter configurações de relógio em um relógio de 24 horas, por exemplo. E para a próxima linha, vamos ter algumas configurações, por exemplo, show mostrando profundos e se você quiser ter uma suíte agora, então precisamos desativar esse Spotify. Eu só preciso entrar neste campo de texto e pressionar e esvaziar um espaço vazio como uma substituição. E agora, como você pode ver, nada está sendo mostrado nesta sobreposição. E precisamos permitir que a célula seja visível. Esta opção para ser visível. Ok, para a próxima, vamos ter seção de linha, então teremos a próxima seção fora de nossas preferências e podemos chamá-la de modos. Você pode selecionar várias linhas. Então vamos mudar de grego. E vamos selecionar, por exemplo, as primeiras 4 linhas nesta seção. E vamos mudar a seta para que não tenhamos essa seta para baixo e para habilitar para todos eles habilitar a seta para a direita para que possamos entrar na configuração e, por exemplo, mudar algo na próxima tela. Então o primeiro será no bom dia de configuração, e nós podemos ter um espaço vazio aqui para que possamos entrar e editar. Ok, eu não quero desperdiçar mais do seu precioso tempo. No entanto, permitam-me que expresse algo muito claramente no final desta lição. Isso é simplesmente incrível o que fizemos porque temos apenas um símbolo, um componente que é multiplicado por esta bela opção make ganância. É pegar, e podemos fazer todas as opções aqui. Podemos fazer todas as substituições neste símbolo neste único componente para que possamos até ter telas de configuração muito sofisticadas. Então isso é tudo por agora e ver mais tarde. 37. Tela de dispositivos: Bem, espero que você comece a acreditar que tudo o que fizemos no início deste curso, que foi tão tedioso porque estava criando símbolos e fazendo esse tipo de brincadeira e criando todas essas coisas diferentes que não eram necessariamente necessários para as telas que estávamos fazendo agora estão começando a valer a pena. E isso porque cada próxima tela que você faz usando essas técnicas usando os símbolos que temos, ele é super rápido. Ok, se você sair da duplicação do nosso barco, então você esfrega os símbolos. Você troca alguns ícones, você faz a substituição para o texto. Então você insere alguns novos símbolos como, por exemplo, este como a linha aqui e agora começa a fazer muito sentido. E também começa a fazer muito sentido organizar esses componentes sabiamente e ter esses grupos e ter nomes próprios para que você não se perca em todo esse barulho, porque às vezes é quase inacreditável que você crie um aplicativo enorme, mas você ainda reutiliza os mesmos componentes. E se você criar grandes símbolos no início, é muito mais fácil. OK, então agora vamos criar outra tela que é uma tela de dispositivos e vamos usar retângulo simples. Vou enchê-lo de cor branca. Mude a opacidade para 10% e depois vamos selecionar a borda e mudar a chamada para uma de nossas cores de destaque. Este será o primeiro bloco e o primeiro ícone fora de nossos dispositivos. Podemos alterar os dispositivos e também disse algumas propriedades do dispositivo nesta tela. Deixe-me selecionar outra descrição. Eu vou colocar algum texto aqui e a primeira vez que eu vou ser console que, selecione o texto, bem como retângulo e vamos colocá-lo no centro com suporte quadrado direito co . Agora vamos usar ícone Jar em tal para ícone conselho sobre drogas e soltar este ícone no esboço. E como eu disse antes, agora precisamos clicar neste grupo agora pressione o comando Shift G algumas vezes até que você veja essas formas, e então você pode selecionar várias formas e mudar a cor, por exemplo, a uma cor branca. OK, e a propósito, não sei se pode parecer óbvio para mim, mas não sei se você sabe disso. Se você quiser ter uma cor perfeitamente branca, você pode ir para fora do estudioso Pekar enquanto segura o botão esquerdo do mouse. E então você tem a cor branca exata, e o mesmo é com o preto. Se você descer este seletor de cores e até mesmo para fora enquanto mantém pressionado o botão esquerdo do mouse, você terá a cor preta. Certo, vamos deletar formas desnecessárias. Vamos o Comandante G agrupar este ícone. Agora podemos mudar o tamanho e podemos fazê-lo com drogas de mudança de opção para que tenhamos para este único pedaço de acidente vascular cerebral. Ou podemos usar essa escala para que possamos pressionar o comando K e, em seguida, podemos definir, por exemplo, 170%. E como podem ver, este cabo é muito melhor. Isso é porque ele muda o acidente vascular cerebral com, de modo que não tivemos mais este pizza um acidente vascular cerebral. E nós temos. Temos uma bela que eu posso ouvir. Vamos fazer alguns ajustes na opacidade. Vamos ter 15% de nós. Ok, agora vamos selecionar todas essas camadas. Então o grupo e também o conselho e o retângulo e vamos criar um símbolo a partir dele. Então vamos ter o nosso primeiro símbolo, que é o dispositivo. Vamos entrar os símbolos vai clicar duas vezes nele. Preciso que Teoh mude sua posição para que eu possa vê-lo em nosso fundo escuro e vamos nos concentrar nas propriedades desses elementos. Por exemplo, precisamos definir o alinhamento fora do texto para ser centrado s para que qualquer texto possa ser pés aqui. E também vamos mudar o tamanho do ícone para 44. Prefiro que esses valores sejam divididos ble por dois ou por oito. Agora vamos garantir que ele fique no centro e este será o estado ativo do meu cartão de dispositivo . Então vamos mudar o dedo do pé do texto alguma cor de acento. E também temos esse golpe em uma cor de acento. Mas também precisamos de uma cópia disso. Então eu pressionei comandos sobre este símbolo, e agora nós temos o Segundo Estado que estará em ativo para que mudar o nome. Este 1º 1 será dispositivo ativo, e o 2º 1 temos que mudá-lo de acordo. Vamos, clique no retângulo e vamos tirar os pés da borda, bem como vamos mudar a cor do texto para branco. Então agora temos dois símbolos, que são dois estados fora deste cartão de dispositivo. Na verdade, vamos ter mais uma cópia. Então, vamos pressionar commodities. E agora vamos nos livrar desse ícone, e esse estado será realmente o estado vazio para o usuário determinar se ele quer arrastar e soltar qualquer dispositivo para ser seu favorito. Então vamos ter uma Dasha fora quatro e intervalo fora 10. Agora vamos diminuir a opacidade da borda. E uma última coisa que vamos fazer aqui é colocar este texto no centro vertical e horizontalmente e mudar o texto para arrastar por item. Então, temos diferentes opções de dispositivos gratuitos, e vamos usá-los na tela do dispositivo. Então vamos renomeá-lo e vamos ter um dispositivo de droga aqui ou algo assim. E agora podemos voltar para a visão geral e podemos multiplicar. Estes itens estavam indo para usar fazer grandes funções. Então, vamos selecionar o dispositivo. Vamos fazer ganância, e eu quero duplicar os itens horizontalmente, então eu vou ter apenas uma linha. Mas eu vou ficar com quatro colunas, e para as marcações, é melhor configurá-lo para ser multiplicado por oito. Então eu vou com 16 e assim ele vai ficar no meu grande. Agora vamos selecionar todas as cópias e eu vou selecionar Dispositivo Drug em vez deste dispositivo padrão . E agora vamos mover todos os dispositivos um pouco para a esquerda para que você possa ver o último . E é muito importante porque esses dispositivos foram rolados horizontalmente e o usuário deve ver o último pelo menos parte dele, para que ele saiba intuitivamente que ele pode rolar menos. Ok, vamos passar para a próxima seção e para a próxima seção. Vamos começar com Heather e vamos ter uma urze ligeiramente diferente do que esta linha tinha lá. Vamos selecionar a garrafa, adicionar, vamos, tipo, fundo de sotaque padrão. Vamos acelerá-lo aqui, e vamos separar isso do símbolo. Então nós vamos basear nesta forma e vamos ligar o combustível Anthony fora da fronteira e o atalho de teclado aqui é F e B, então você tem combustível e borda. E agora vamos para a cor que mudou a cor do texto para alguma cor acinzentada. E mais uma coisa que eu vou fazer aqui é que eu preciso de alguns ícones porque esta seção será baseada em Vamos desligar o estilo maiúsculo, e esta seção será baseada na localização atual de um usuário. Então, por exemplo, em nossa casa, se estamos na cozinha, vamos ter dispositivos que estão disponíveis na cozinha, e então isso irá localizar o usuário para que precisamos de um pequeno ícone à esquerda que mostrará que isso é baseado em sua localização, mas também teremos a opção de mudar a sala. Então isso é uma bala levemente para o topo. Então, essas opções que mudam a sala será uma pequena flecha. Então vamos para o ícone de seta e vamos colocar a seta aqui e vamos mudar a opacidade desta seta para talvez 30 ou 40% ok, e o segundo ícone será algum tipo de ícone adolescente que irá deixar você saber que você está sendo localizado por esta aplicação. E esses resultados estão morrendo na sua localização. Então vamos dar o pé, eu conjurar. Vou selecionar um mapa. Eu venho aqui e temos a direção deste mês aqui. Eu acho que é bastante OK porque é muito semelhante ao ícone IOS off localização. Então vamos excluir o retângulo. Eu vou entrar em grupo como de costume porque é um ícone que é usado cor de acento livre para este ciclo, e nós vamos ter medo. Então vamos usar K. comum e vamos escalá-lo, por exemplo, para 20% que podemos ir dentro deste campo e pressionar uma seta para cima ou para baixo para ter essa escala maior ou menor. E em apenas um segundo você verá a visualização de como, na verdade, ele será exibido em seu layout. Então vamos ter este nove por nove Pizza Arrow aqui, e é isso para esta Heather. Agora vamos nos concentrar na seção em si. Então vamos lá, Menores. Para eles fora e por cima, vou ter os meus dispositivos favoritos. E na parte inferior, há um mínimo fora de todos os dispositivos disponíveis, então vamos gostar do símbolo do dispositivo, este mesmo. Ok, agora vamos colocar o primeiro 1 e vamos fazer um acordo fora deste símbolo. Vamos puxar, por exemplo, um 10 linhas e este mínimo será rolado verticalmente, não horizontalmente, modo que terá colunas livres e talvez Morgan off 16 pixels. Para que ele se senta perfeitamente na saudação. Ok, agora vamos como todos os dispositivos lá. Você tem 30 dispositivos. É o Commander JI Group. Agora podemos distribuir o alinhamento deste grupo para que ele fique diretamente no centro do nosso motor de popa. Agora vamos descer para abrir espaço para esta garrafa ser um pouco maior. Então, esta é uma urze, mas também um fundo, então ele precisa ser facilmente coberto com um dedo. Então vamos escalá-lo com o comando K para 120%. E como você pode ver, escalar com opção de escala é realmente bom, porque é sempre caso perfeitamente, mesmo se você tem diferentes elementos dentro de um grupo. Agora vamos controlar G. E vamos garantir que tudo se alimente da nossa ganância. E vamos fazer esta arte a bordo, bem como o fundo mais alto para que possamos revelar mais desses itens. E, por exemplo, se o dispositivo for usado visualizar se o espelho de esboço for exibido, você poderá rolar no telefone, modo que essa é uma única maneira de fazer isso. No entanto, você também pode clicar em nosso barco e selecionar redimensionar para caber opção neste caso. No entanto, como você pode ver, temos este item específico à direita. E é por isso que este artigo é agora dois branco para que precisamos comandar Z sob esta ação e apenas escalá-lo com o fundo e assustar. Os são sobre si mesmos. É quase isso. Agora vamos mudar o tamanho do barco de acordo com o, e podemos passar para os ícones. Então vamos abrir um símbolo. Então vamos dobrar grego neste símbolo console, e vamos ter dentro deste símbolo vai criar Assemble fora do ícone primeiro. Então nós temos este conselho de ícones, e agora vamos para o fundo e dar uma olhada no tamanho. E agora vamos para a gaveta ícone e selecione alguns dispositivos, alguns dispositivos de cozinha e arrastado diretamente para esboçar para que tenhamos. Você pode ter alguns ícones a serem substituídos por sobregravações. Agora vamos escalá-los de couve comum, e precisamos de 170, eu acho que sim. Isso foi este K que usamos anteriormente, e que não é precisamente o mesmo tamanho, entanto, vai mudá-lo no segundo. Então vamos concordar o primeiro símbolo, e nós vamos dar-lhe o nome, off ícone barra avental e então nós vamos ter todos esses ícones para ser símbolos também. Então vamos acelerar um pouco. Certo, aqui temos as armas I. Então agora vamos para cada ícone e precisamos despreparar este ícone de Chefe G comum e eu pressionar estratégia de comando até chegar às formas e precisamos mudar a cor. Então eu acredito que é um pouco mais rápido do que agrupá-los primeiro e, em seguida, criar um grupo um símbolo novamente. Mas provavelmente é a mesma coisa. Sim, vamos passar para o próximo ícone que é um poço despreparado do que esta mudança de cor. Como você pode ver, eu nem sequer tenho que criar novos grupos agora. Então isso fica no símbolo, e eu não preciso de um novo grupo para essas formas. Então, talvez nesse caso em particular, seja um pouco mais rápido fazê-lo dessa maneira. Então vamos mudar a cor da borda aqui. Como você pode ver para alguns ícones, você tem cor para alguns ícones que você tem na cor da borda da borda. Realmente não importa tanto. Para ser honesto,não consigo pensar numa forma mais simples de o fazer, mas épreciso alguns riachos e às vezes, mas fazemos uma vez e depois esquecemos. Para ser honesto, não consigo pensar numa forma mais simples de o fazer, mas é preciso alguns riachos e às vezes, Então vamos fazer essa última cor do ícone mudar para a cor branca. E agora temos todas essas camadas diferentes e um realmente bom comandante e esboços que você pode ir para ver e, em seguida, camada menos e recolher quadros de arte e grupos para que você tenha tudo colapsado em seu painel de camadas. E isso é muito útil. Você não precisa recolher todas essas camadas, todos esses símbolos individualmente. E agora vamos dar uma olhada no tamanho de nossos ícones. Então eu pressiono a opção superior e eu vou para o tamanho e eu posso alterá-lo para que ele corresponda ao tamanho nossos consoles. Era 44 por 44, mas como você pode ver, todos os ícones aqui são 41 por 41. Então, possivelmente, eu posso mudá-los para 41. E também vou mudar o tamanho deste console, Toby 41 para 41. E é assim que você pode acessar todas essas substituições agora porque todas as nossas carroças estão do mesmo tamanho e o que é mais importante fora dos símbolos são do mesmo tamanho para que você possa ir para substituições. E aí você tem todos os ícones que eu posso alternar entre os ícones neste primeiro símbolo. E no que diz respeito a esses símbolos, esses símbolos ativos estão em causa. Vamos para o símbolo e vamos mudar este grupo para o nosso símbolo para que ele possa ser atolado pelo outro símbolo, bem como em substituições. E para fazer isso é um controle ou clique com o botão direito sobre esta camada. E vamos usar a opção substituir com para que possamos substituir qualquer grupo do ano com, por exemplo, qualquer símbolo que temos aqui. Então, vamos selecionar console. E agora podemos voltar para a instância fora deste símbolo e podemos alterar quaisquer ícones com as substituições, e também podemos substituir o texto. Então, em vez de conselho, o rótulo, o nome dessa camada deve ser, por exemplo, info ou algo assim. Mas como você pode ver, podemos substituí-lo facilmente. E por todos os meus itens aqui, eu posso fazer o mesmo. Então é isso. Temos a próxima tela da nossa aplicação e eu vejo você na próxima lição. 38. Tela de ações: Olá e bem-vindo para a próxima lição nesta lição. Vamos seguir em frente na nossa candidatura. Então, cada vez que concordamos em alguma tela, usamos as mesmas ações. No entanto, tento introduzir algo interessante em cada lição. Então agora vamos falar sobre, por exemplo, por exemplo, começos compartilhados. Então vamos criar o próximo mundo da tela, que será uma tela de ação e para as ações que eu vou ter página separada. Como você pode ver, eu passo outro a página, e agora eu posso definir o nome para a página como ações. Basicamente, você pode se mover entre as páginas com atalhos de teclado também. É controlar seta para cima ou seta para baixo, bem como controlar, pagar, cortar ou página para baixo. Eu não sei, porque eu não tenho essas teclas no meu teclado Agora você também pode empilhá-lo na página e, por exemplo, duplicar e dividir a página. Vou colar uma cópia e colar uma das placas de arte como de costume, para que eu tenha esse tamanho do iPhone, bem como alguns componentes que vou usar. Então vamos apagar tudo o que não precisamos. Realmente não precisa aqui, e vamos mudá-lo para a sua versão alternativa. E vamos anular o nome desta tela. E este verde será a tela de ação para que o usuário possa ser capaz de alternar entre as ações, por exemplo, assistir TV ou jogar jogos de computador ou qualquer coisa. Então lá temos os ícones. E agora vamos usar o segundo ícone para voltar a batalha e vamos cumprimentar montagens. Eu vou orientar o símbolo fora, cair para baixo! Então este beliche caiu para baixo símbolo. Conheci no fundo que criamos na lição anterior. Agora podemos usá-lo como um símbolo que o coloca no centro. Vamos controlar G e garantir que suas linhas corretamente para grau também. E o próximo item aqui será um cartão para cada ação. Então nós vamos ter cartões diferentes, e o usuário estará passando deslizando entre esses cartões, também. Veja as ações teatrais. Então este será o 1º 1 e eu vou beber um retângulo. Eu, hum, fazendo o raio da fronteira e vamos ter certeza de que ele se encaixa na ganância. Agora Frump se destaca. Posso usar alguns e mudar para a imagem. Teoh, tem esta foto dos eixos diretamente no esboço. Eu simplesmente drogo e deixo isso neste pequeno quadro de bate-papo e vamos usar o comando de combustível aqui. Agora vamos desligar a borda, e também teremos outro retângulo que irá conter os ícones de dispositivos que participam desta ação. Então vamos duplicar o comando, fez este primeiro retângulo e vamos mudar o combustível. Então essa é uma chamada diferente ou uma semana vai usar cor sólida fora do nosso fundo. Mas vamos torná-lo um pouco mais leve. E agora vamos mudar o tamanho deste item e também precisamos ter essas bordas afiadas para que possamos ir para rádios fronteiriços. E eu não sei se você se lembra de uma das lições anteriores, mas você pode manipular os rádios, mas também você pode colocar ponto-e-vírgula aqui e você pode dizer diretamente que você quer, por exemplo, apenas esta parte inferior esquerda fronteira para ser ter os rádios. No entanto, há também outra maneira no esboço que você pode realizar. Esta tarefa acabou de entrar no modo vetorial qualquer coisa. Então, pressione return e agora selecione os pontos vetoriais no topo com shift no teclado para que você tenha multiplicado pontos vetoriais selecionados e na seção de canto você tem o rádio de borda. Então, como você pode ver, você pode modificar separadamente cada cantos pontos vetoriais, rádios e agora podemos ter bordas retas. Vamos para os poucos de novo. Isso mudou o campo, e eu vou usar a capacidade em vez da cor ligeira. Então isso é cerca de 50% de capacidade. E a última coisa que usamos aqui é o ícone. Então vamos aos símbolos. E na seção de Aiken, temos um sintonizador. Temos um aparelho de TV também, bem um alto-falante. Então vamos começar com os alto-falantes, e depois vamos andar lá, bem como TV. Então, esses são os dispositivos que participam desta guerra. Ação de TV, na verdade não é um sono saudável. Mas o que nós íamos mudar com uma sobreposição em apenas um segundo. Por enquanto, vamos ter esses ícones online. Então vamos selecioná-los com o turno. E ainda assim o que eu vou fazer é distribuir este ritmo entre esses ícones, bem como provavelmente fim de semana sim, no alinhamento para o topo fora dos ícones, e parece muito bom. Então vamos ter um grupo fora dos ícones, selecioná-lo e Comandante G. E agora podemos mudar essa posição para estar diretamente no centro onde temos um grupo, podemos centrar isso dentro do nosso quadro de arte. Vamos mudar um pouco a opacidade. Apenas um pequeno ajustes para que pareça ainda melhor. E para este grupo, vamos transformar a opacidade em 60%. Quero mudar esse sono saudável. Teoh, cuidado com a reacção. Então vamos fazer isso. Substituir no campo de texto info e quase definir com esta tela. Uma última coisa que eu vou ter aqui na parte inferior é o botão play para que você possa ativar esta ação direcionada a partir desta tela. Então vamos ter em cima e eu vou fazer e mais em Centros vamos pressionar barra de espaço para mudar a posição enquanto desenha agora sua posição que no centro da arte, entediado com as ferramentas on-line e eu vou ter para esta cor verde para correr as ações , Vamos ter tipo pedágio e vamos digitar ir aqui. Vou colocá-lo no centro opticamente. Então eu vou sair da duplicata isso. Eu vou mudar a cor para Branco e agora você pode realmente usar este atalho de teclado muito bom , que é opção comando para cima ou para baixo para mudar a posição fora das camadas no painel de camadas para que tenhamos este segundo círculo na parte inferior e outro grande atalho é a mudança comum. E então você pode pressionar a seta para a esquerda ou para a direita para alterar esse tamanho fora do objeto, você pode um comando de pressão Shift para a direita, nossa ou seta para a esquerda para fazer isso maior ou menor, bem como seta para cima para fazer essa seta menor ou para baixo maior também. Então você nem precisa usar o mouse durante todo esse processo. Agora você pode pressionar dois para ter uma escassez de 20% e aí está. Então este é basicamente o próximo nível fora do esboço quando você não sai do teclado para que cada operação que você executa seja extremamente rápida. Você não precisa ir e mudar para o tablet ou para o mouse. Basta pressionar atalhos de teclado, como posicionar a camada. Depois, você tem esse tamanho fora da camada, e finalmente, você pode ter esse atalho para 20% de capacidade. Agora, vamos dar a este carro uma sombra, e eu vou criar uma sombra de um grande borrão que podemos ter aqui. Então, vamos ter 12 escolher-nos lá. E se você tiver efeitos diferentes, como sombras de borda, sombras internas, montadores e outras coisas, você também pode definir algo que é chamado de estilos compartilhados no esboço. Então, às vezes você não quer usar símbolos, mas ele vai usar esses estilos compartilhados, e esses pneus se aplicam a tudo o que está abaixo desta seção. Se você criar uma nova camisa, comece com este retângulo. Você vai salvar o estilo, olha fora sentir fronteiras, sombras e tudo o que você tem abaixo. Então, agora, se você criar qualquer outra forma e você vai para estilos de camisa para aplicar este estilo, você tem o estilo atual aqui, e você pode implicar isso. Como você pode ver, a sensação é fornecida. Sombra é aplicada, mas os elementos que estão acima deste estilo de camisa não são aplicados. Então você não tem esse uso de ataque. Você vai ter posição aplicada ou transformação. Então é assim que funciona. E agora, em vez de símbolos, por exemplo, você pode ter esses estilos de igreja. É realmente muito poderoso porque, por exemplo, se você for para as diretrizes de design de materiais novamente, e talvez você conheça o conceito de elevação e sombras aqui. Então, basicamente, objetos em design de material têm sombras diferentes para que você possa expressá-los enquanto eles estavam deitados na superfície. E cada objeto pode ser maior nos surfistas ou pode ficar mais baixo na superfície. E é assim que funciona. Você tem níveis de elevação diferentes e valores diferentes para as sombras. Então, por exemplo, aqueles cartões que, como quase na superfície, eles têm a menor sombra nesta fazenda. Mas no botão F A B que está aqui tem essa elevação maior, e é assim que você pode distinguir um entre o outro. Este botão distante é basicamente a ação mais proeminente neste layout, então você tem diferentes elevações para diálogos, para switches, para menus, para submenus, por exemplo, e na escala, à esquerda e à esquerda, você tem picos de valores. Esses são pixels de densidade, mas você pode definir o mesmo pedaço de valores se você estiver projetando em um Xscape, por exemplo, 20 ou 24 para ter essa elevação, e isso é mais poderoso. Se você criar, por exemplo, uma forma, você pode se livrar do campo. Os três fora da fronteira e só disseram a sombra aqui. Então nós vamos ter material estes e sombra para X e Y e, por exemplo, por exemplo, que pensaram que era começar com a elevação fora para a paz de Borrred. Agora sua opção dragão do que comandar as duas vezes para ter várias cópias. Você vai para níveis de borrão e você disse de acordo com 16 24 8 E lá você tem diferentes elevações que agora você pode salvar como um novo estilo de camisa. Então vamos ter alguns estilos de camisa de Shadow 24, por exemplo. Você também pode organizar essas estrelas afiadas. Você pode selecioná-los, excluí-los ou reorganizá-los, renomeá-los. E isso é bastante útil porque agora, em projetos de design de materiais, você pode. Além disso, você sempre pode selecionar grupo ou camada e disse que a elevação fora desta camada muito com o estilo compartilhado, modo que usar os estilos de camisa para objetos, bem como um início para o texto é muito útil. Agora eu duplicei este cartão e vamos voltar para o Paquistão é mudar a imagem. Eu vou usar imagem de jogo de vídeo, então vamos dedo do pé alta resolução fora imagem PlayStation aqui, e eu vou mudar este cartão. Deixe-me ir sentir agora. Eu preciso arrastar e soltá-lo dentro desta sensação que levará um segundo para baixa carga. Mas agora você tem nosso outro cartão. Você sempre pode fazer este cartão como um outro quadro de arte. No entanto, às vezes você realmente não precisa disso. E, por exemplo, se você quiser descer algumas interações e animações de deslizamento de cartas como as suas, em princípio, ou em Flint O, isso é tudo o que você precisa fazer. Põe as cartas um ao lado do outro. Eles podem estar fora de seu quadro de arte ou dentro de sua arte abortar. E agora vamos posicionar os ícones de acordo. E aí temos as ações. O ecrã está agora pronto. Temos esta opção para alterar as ações, bem como cartão. E também, por favor, certifique-se de que você criar alguns outros cartões disso. Por exemplo, desenvolvedor. Enquanto você mão do projeto, ele sabe que é uma ação de deslizamento cartão. Então é isso por enquanto. Obrigado por sua atenção nesta lição. Vejo-te no próximo 39. Tela de detalhes de ação: Vamos seguir em frente com nosso layout, eu vou duplicar a tela para criar detalhes de ação em, uh, geralmente você tem menos e o detalhe de você. Então vamos criar a tela. Isto vai ser muito fácil. Isso mudou para assistir TV. Então, quando entramos em cada ação particular, temos essa visão detalhada que podemos editar. Por exemplo, podemos alterar os dispositivos que eles fazem parte nesta ação ou, por exemplo, alterar algumas outras propriedades. E se você entrar, se você acidentalmente entrar em qualquer objeto, você pode pressionar comando escape e você voltar para onde você estava antes. E é muito útil porque às vezes é muito fácil. Teoh por engano, Grego duplo em qualquer símbolo, e você está no espaço símbolo, então você tem que voltar rapidamente. E este é o atalho de fuga. Agora, quando você tenta alterar o tamanho do retângulo, como você pode ver esta imagem que é uma sensação e tem uma propriedade de campo s escalas lindamente e você nem precisa fazer mais nada com isso, basta selecionar e alguma descrição. E nessa exibição detalhada, teremos descrições para cada dispositivo que participe dessa ação. Então, isso será realmente alto-falantes. Então temos que honrar e Stevie disse também. E que coisa importante é essa? Eu usei as mesmas camadas aqui, e isso não é crucial para o momento. No entanto, se você planeja fazer interações e protótipo interativo, por exemplo , usando principal up, será extremamente útil. Como nesses nomes fora das camadas ao longo. As placas de arte podem ter animação em princípio. Então isso é basicamente apenas uma nota lateral, mas definitivamente ou lembrando. Agora vamos colocar esse botão de ir aqui, e eu vou fazer isso maior, também indo para selecionar o texto e vamos mudar para parar. Por isso, se estiveres à volta da acção, podes impedi-la. Pare diretamente de lá. Vamos mudar a cor do campo para uma cor vermelha, e agora podemos fazer nossa arte, mas um pouco maior para que tenha todas as opções para diferentes dispositivos que participam dessa ação. Então vamos fazer o aluguer de barcos de arte, bem como vamos ultimamente sentir fundo, e eu vou fazer esse coração também. Agora o que vamos usar. Aqui estão os símbolos que já temos. Então vamos para os símbolos e vamos ter este cenário jogar aqui. Eu não sei se você se lembra, mas nós o usamos nas configurações. Isso é uma bala no centro dos quadros de arte, e agora podemos mudar muitas coisas aqui. Quero dizer altura e revelar os elementos que são opcionais. Mas primeiro, vamos para o dedo grego e vamos fazer uma chamada para eles e digamos que queremos fazer livre aqui fora do curso. Vamos apagar a marcação para não termos nenhuma Margon adicional. Agora vamos eleger essas duas linhas e definir alguma sobreposição. Então, em vez da linha de seção, vamos manter o padrão. Além disso, vamos desligar todos os elementos desnecessários aqui e deixar Onley o texto no rótulo, que não é Spotify, mas podemos substituí-lo mais tarde. Vamos manter a linha padrão. Além disso, vamos desligar algumas setas e em um segundo eu vou postar este vídeo por um minuto e mudar os rótulos para que tenhamos rótulos corretos aqui e OK, agora temos substituições corretas para cada rótulo. Vamos mudar o tamanho do quadro de arte. E vamos precisar dois pés depois de mudar o fundo para que você possa fazê-lo dessa maneira e é um pouco mais fácil. E o que temos agora é uma tela de ação completa. Então nós temos, ah, menos de ações, bem como riso de ação. Agora podemos pressionar o comando para salvar, e na verdade, eu não falei sobre isso. Em lições anteriores, entanto, pode valer a pena falar sobre salvar lutas no esboço, então por que não falamos sobre isso? Isso porque é esboço salva automaticamente o desafio que você tem aqui, então você nem precisa se importar em salvar as lutas. Sketch também mantém o controle de suas ações, e você pode pressionar Kamanzi para desfazer a ação, bem como pressionar Shift Command Z para refazer a ação. Às vezes esboçar até ranhuras esta ação para que você pressioná-lo uma vez e você não tem talvez 10 passos ou cinco passos que são semelhantes e você voltar para o estado anterior. E outra coisa é reverter esse arquivo de volta, por exemplo, para mudanças que você poderia dois ou três dias atrás ou talvez um mês atrás, você sempre pode reverter esse estado se você usar máquina do tempo em Mark e vamos para o arquivo. E a propósito, você tem aqui nesta opção segura, então podemos sempre definir seguro com um s comum também. Você também pode duplicar a luta. Então, às vezes, se você quiser criar uma versão diferente do arquivo, você simplesmente duplicou e então você tem opções de reverter. Então, no mínimo, aqui você nos tem documentos seguros e últimos abertos. Mas também você pode ir para navegar versões antigas e dançar captura alterações para uma visão de máquina do tempo, e você pode alternar entre as versões do seu documento e você pode ir para o histórico deste documento salvas. Em seguida, você pode comparar esta versão com o documento atual que está à esquerda, e se você quiser restaurar qualquer versão, você pode fazê-lo com o botão de restauração. Além disso, você tem o histórico off alterações e histórico off salva para a direita, E se você encontrar a versão que você está procurando, você pode simplesmente ir para uma restauração e você pode restaurar e realmente substituir seu arquivo que você está trabalhando em. Então, às vezes, é uma boa ideia. Além disso, para duplicar este arquivo antes de ir para este histórico de fogo e substituí-lo por alguma outra versão do histórico. Então isso é tudo por enquanto. Vejo na próxima lição. 40. Menu de baixo: Olá, e é bom te ver na próxima lição. Então agora você provavelmente conhece todos os recursos importantes fora do esboço, como ferramentas e ações e todo esse barulho. Então agora olá e é bom te ver na próxima lição. Bem, agora você provavelmente conhece todos os recursos e ferramentas mais importantes fora do esboço. No entanto, criar um você funcional, é sempre um processo e a melhor maneira desses proprietários são aqueles designers que podem tornar este processo o mais simplificado e o mais rápido possível para que você não precise necessariamente se concentrar nas ferramentas corretas e que tipo de atalho usar. Mas você basicamente se concentra no design de seu aplicativo, e para conseguir isso, você precisa praticar. Você precisa trabalhar, no entanto, por isso é melhor Teoh às vezes olhar sobre o ombro de alguém para que você possa ver esses atalhos , bem como ferramentas em ação. Então vamos criar outra página, criar uma página para uma sala telas, e eu vou ter um par de telas aqui. Agora vamos fazer as operações padrão. Então ele estava copiando e colando Can Art Board Agora eu apaguei todas as coisas desnecessárias do quadro de arte de amostra. E como você pode ver, projetar uma nova tela é basicamente usar os mesmos estilos e os mesmos símbolos repetidamente e substituir apenas alguns ícones I, por exemplo, ou alguns rótulos com substituições. Então, é muito, muito fácil de usar este pronto blocos fora do nosso você gosta dele fora do nosso guia de estilo e, por exemplo, eu tenho aqui uma droga, uma droga para baixo, e que vai mudar para que ele alimenta o quadro de arte como Bem. Como por exemplo, desligamos o ícone de localização, podemos substituir o texto que está aqui. Então sim, basicamente, símbolos são grandes agora vai criar um ativo diferente, e também será um símbolo. E nós vamos dio componente muito popular fora de aplicativos nativos, que é um tanto de dinheiro. Então vamos mudar a altura deste retângulo para 88 para que ele se encaixe corretamente no grego. Agora vamos desligar a fronteira e eu vou pressionar f para o campo. Está mudando de cor para a nossa cor de fundo, e aqui eu vou ter cinco ícones diferentes que vão me deixar alternar entre os diferentes vários, as diferentes páginas que temos quatro quartos Às vezes é mais fácil corrigir. Clique em seu quadro de arte e selecione colar aqui para que você tenha esses itens pagos basted diretamente no grande para que você tenha clicado. E então vamos selecionar todos os ícones e eu vou movê-los dentro do quadro de arte para que eu possa ver os guias inteligentes para posicionar, em seguida, diretamente no centro. E agora o que vamos fazer é sair deste retângulo e de todos os ícones que vamos criar. Reúna. Então vamos elegê-los no painel de camadas que é criado símbolo. E este é o nosso menu. Assim, o símbolo inferior do menu será símbolo com ícones com estados ativos e inativos. Então, na verdade, esses ícones que eu tenho aqui estão agora no estado inativo. Então vamos fazer um estado que podemos alternar entre eles. Então, primeiro, vamos criar esse estado ativo para o ícone individual. Vou pressionar oh para todos e com o turno, vou criar um círculo perfeito. Agora vamos movê-lo com as setas do teclado. Vamos ativar o campo e mudar a cor para cor branca. Mas nós vamos ter uma capacidade desligada por volta dos 24 agora, e isso é desligar a fronteira. Você também pode pressionar estar no teclado. Também precisamos mudar a posição dessa camada de camadas no painel de camadas. Então isso está abaixo dos ícones. E vamos mudar o dedo de opacidade, por exemplo, em torno de 11. Agora temos esse ícone, que é o estado ativo desse ícone, então é ótimo. No entanto, queremos ter outro símbolo que podemos trocar sobre a direita para que ele possa destacar este ícone indo para escolher alguma cor diferente. Então cada ícone é basicamente um tamanho diferente. Este é 27 por 29. Então vamos criar símbolos diferentes, selecionando o ícone e vamos ter pasta Aiken, e isso será uma temperatura. Então vamos colocar temp é o nome deste símbolo. Agora temos o 2º 1 com o caroço. O Fred. Um deles é clientes ou Curtin neste usuário de tela. Eu poderia ser capaz de mudar a posição das cortinas assim como este quarto ícone, que é alarme eso. Você pode definir o despertador em seu quarto e o último será censo. Então vamos criar outro símbolo fora dos sentidos. E agora temos todos os ícones em símbolos separados agora que buscam a definição desses símbolos e lá nós os temos. E, a fim de selecionar esses símbolos, é muito melhor ir para as opções de exibição e da lista de camadas, selecionar recolher artigos e grupos. E provavelmente é o melhor Teoh. Tenha seus próprios atalhos de teclado para esta posição do menu para que seja relativamente fácil configurá-lo . Agora. Eu pressiono barra de espaço enquanto arrasto, também. Mudou a posição fora do inverso e vamos duplicar esses ícones. Então temos uma duplicata de todos os símbolos, que são o tamanho correto, e agora podemos mudar a cor de cada icônico separadamente. No entanto, você sempre pode fazê-lo para todas as formas. Então vamos agrupar todos os ícones que eu pressionar o comando Shift G no Eu alcanço fora das formas. Agora vamos selecionar a camada mais inferior e vamos para a camada mais superior. E agora, quando você vai para a cor da borda, você pode alterar essa cor para todas as formas selecionadas. Então vamos selecionar uma de nossas cores de sotaque, e agora tudo o que precisamos fazer é pegar esse destaque, e eu vou entrar no X para um corte, e eu vou cortá-lo fora deste menu inferior. E como você pode ver, temos formas adequadas para nossos ícones, para os símbolos a serem trocados entre eles. E o que vamos fazer agora vamos colar o oval para cada um fora do estado ativo fora de nossos símbolos. Vamos colocar o centro indireto sobre essas placas de arte fora desses símbolos, e nós vamos tê-los para que, como você pode ver lá, como você pode ver lá, fora os símbolos cerca de três dúzias de mães, porque tudo o que é fora do símbolo também será visível. E o truque é, se você colocar o sobre no final, você provavelmente terá os tamanhos diferentes fora de cada ícone, de modo que você não tem este tempo sobrescrever menos, e agora você pode voltar a tela do dedo do pé que você está criando. Então vamos voltar para a página da sala. E agora se você selecionar qualquer símbolo aqui que você tem, eu posso anular. E para cada ícone, você deve ter apenas dois estados. Então isso é como um braço, e você pode definir este estado para ser ativo. Bem, na verdade, por exemplo, se você nos tem cortinas Aiken aqui, que é do mesmo tamanho que alguns outros ícones. Você tem algumas substituições diferentes, mas para a maioria dos ícones, seria fácil selecioná-los e alterar entre este estado ativo e estado inativo. Então agora vamos duplicar esta tela e na tela do quarto, eu vou ter cinco telas no total. Então vamos fazer outro e vamos mudar o estado de cada tela. Então, para o 1º 1 vamos definir o estado de estilo ativo fora da temperatura. Eu vou na segunda tela para a segunda tela. Você tem que definir este caroço. Eu vou estar ativo. Então vamos desligar os sentidos. Vamos ligar o caroço. próximo é as cortinas e a quarta tela facilitar a nossa tela de alarme. Então vamos mudar o outro ícone muito ativo. E o 5º 1 o último é o SAS. Então, aí está. Um símbolo à prova de balas que você pode usar em todo o seu design. E sim, talvez você gaste cinco minutos criando este símbolo. No entanto, se você tiver centenas ou milhares de artigos contendo este símbolo e seus clientes decidirem que ele quer mudar a cor, você não precisa pular da janela. Então este é o fim desta lição. Vamos para o próximo. 41. Tela de alarme: É bom te ver na próxima lição. Agora vamos pular as primeiras telas livres e vamos nos concentrar na rua do alarme. Amplie esta tela com comandos para ordenar que os mineiros diminuam o zoom. Agora vou usar o símbolo e vamos usar o primeiro símbolo desta linha de seção. Vamos colocá-lo lá e eu vou entrar, mais zoom neste símbolo. Vamos nos certificar de que se encaixa na nossa ganância. Então esse é o controle G de saudação. E agora vou pô-lo ali mesmo. Certo, vamos selecionar o símbolo. E agora vamos para as substituições. Vou substituir o texto reunido para repetir, e essas são as opções de repetição para o alarme. Então aqui está o bom truque. Se você quiser ter, por exemplo, oito ícones aqui, vamos desenhar um retângulo que é a largura total desse espaço que você deseja colocar ícones . Então você vai para Teoh seu tamanho. Então eu opção top e, em seguida, top três vezes para ir para o tamanho que eu dividi em oito pedaços . E eu também preciso do Teoh extrair 12 pixels para os mercados. Então lá temos cerca de 27 Então vamos torná-lo 28 por 28 pixels. E aqui está o nosso primeiro ícone. Então vamos fazer com que seja um pixel. Acho que vou desligar o rádio cerca de oito pixels, e agora temos que selecionar este item. Vamos para um positivo cerca de 40 pressionando para no teclado. Agora isso é forma multiplicada. Vou usar o dedo grande, e vou deixar um. Robôs. Preciso de oito ícones. Então eu disse oito colunas e 12 semanas fora de Margate. Vamos fazer de acordo, e agora você tem esse pequeno espaço na extrema direita. E isso é porque arredondamos este tamanho para 28. Então não vamos o último retângulo que seleciona todos os retângulos e vamos para a distribuição e vamos distribuir esses itens. Eso que as marcas são mesmo agora vamos para esta forma e vamos duplicar. Então, a imprensa comum fez uma opção chefe de pé proporções e skate do centro que diminuiu apenas um pouco mais de mudança. Os rádios de borda permitiram a sensação do F no teclado agora virou opacidade. Sim, eu sei que é rápido, mas é assim que você trabalha no esboço e aí você tem o estado ativo fora do nosso rádio . Agora vamos para a descrição, e eu vou usar talvez essa 20 descrição de opacidade para definir a primeira descrição, e o primeiro 1 será uma vez e os outros sete serão dias de peruca. Então vamos colocar no meio. Agora isso centralizou o alinhamento fora do campo de texto, e eu preciso de mais alguns campos de texto. Então vamos fazer de acordo fora deste texto também. Vou criar outra duplicata. E também depois de uma duplicata, vou pressionar. Qual é, o comum, o comum se torna Andy, e eu vou pressionar sete vezes para que eu tenha oito cópias. Agora. Não vamos fazer essa última cópia, então você nem precisa clicar ou algo assim. Você só Najid com o teclado são faz. Vamos selecionar todo o texto aqui em Vamos distribuir isso para que tenhamos esse texto bem no meio desligado. Nossas caixas de seleção são garrafas de rádio, então temos segunda terça, quarta quinta. Responda um. Então temos dois sábados. Não se preocupe com os dias do sul são bastante agradáveis, e então você precisa ajustar a cor do texto para que possamos chamá-lo quase o fim deste componente. Vamos selecionar a linha e talvez não vamos fazê-lo um pouco para que ele fique melhor no grande. Vamos nos certificar de que está bem aqui e agora vamos selecionar todas as camadas e pressionar o comando g para agrupá-las. Portanto, há o nosso grupo com as opções de repetição. Agora vamos definir a coisa principal que é um despertador. Então, isso é assumido. Eu vou criar um over, e eu segurar barra de espaço para movê-lo durante a criação. Agora vamos ter um tamanho de 176 por 176 Vamos colocá-lo no centro e vamos ter uma sensação cor temporária, por exemplo, amarelo. Essa mudança de capacidade para 50% pressionando cinco no teclado. Agora que vem na duplicata e vamos na escala K esta duplicata. Então temos cerca de 140 ou 130% escala. Estamos patinando do centro e, a propósito, note que todas essas mudanças acontecem instantaneamente na pré-visualização do iPhone que eu tenho aqui para o lado esquerdo. Então você sempre precisa verificá-lo no seu iPhone para que ele fique melhor. E agora deixamos 140%. Vamos fazer outra duplicação com mercadoria e outra escala com. Vamos K, e será cerca de 130%. Talvez seja 320 por 320 pixels. E desta forma podemos selecionar todas as ovais e podem ser escaladas dentro delas. Isso concordou que temos aqui para que ele se encaixa perfeitamente grau. OK, agora vamos selecionar o primeiro geral, este no meio, o mais pequeno. E agora vamos movê-lo para o topo. Estou usando o teclado curto. Tenho que movê-lo através das camadas. Agora vamos mudar a cor, bem como a capacidade para 100. E, a propósito, você geralmente pode pressionar 02 vezes para ter opacidade fora 100. Agora vamos ter o digitado também t no teclado. Eu coloquei aqui uma hora louca da manhã cedo. Então vamos com o tamanho fora, por exemplo, talvez 46 flutuantes pretos deste texto. Então vamos colocar isso dentro do nosso relógio. E agora vamos ter horas aqui. Então, apenas mais uma grande função fora esboço à nossa frente, então vamos selecionar uma ferramenta de linha El no teclado. Agora vamos desenhar uma linha reta com deslocamento no teclado, e temos uma linha. Agora queremos duplicar esta linha e vamos para Layer Puffs, e aqui temos girar cópias. Isso é realmente enorme se você selecionar girar cópias, você disse que o número de cópias. Então, por exemplo, se queremos ter 12 camadas no total, vamos colocar 11 aqui terá 12. Digamos que está bem, e agora temos 12 Koby e podemos pegar essas cópias e distribuí-las. Podemos mudar a posição. Podemos mudar a rotação dessas camadas apenas segurando este pontinho no meio. Então agora temos relógio de 12 horas aqui. Vamos mudar a opacidade para que seja quase visível terá cerca de 15 ou 16%. Agora vamos selecionar o texto. Eu precisava estar no meio, mas não use essas opções alinhadas. Basta usar uma abordagem sábia design fora selecionando isso e magia com setas do teclado, modo que é opticamente perfeito no centro. Agora vamos como nós dois que temos aqui, e vamos mudar sua cor para cor escura também. E para esta primeira vez temos aqui. Vou definir a propriedade da fronteira. Então vamos desligar o campo e vamos ligar a fronteira. Isto vai ser bom, profundo também. Vamos para a posição da nossa fronteira e vamos para as opções internas. Então agora podemos igualar a semana fora desta fronteira para que ela chegue ao relógio. Vamos mudar a espessura e vamos parar ali. Talvez um pouco mais. Ok, agora precisamos mudar de posição novamente porque queremos que esta posição seja central. Então vamos colocar o centro. E sobre isso, vamos mudar o tamanho do de tudo para que ele corresponda. Não, este não. Isso mudou de tamanho com o turno e o Arche para combinar com o nosso relógio. E precisamos que essa posição seja central porque vamos mudar a cor da arte fora da fronteira para que tenhamos um lindo radiante aqui. Vamos colocá-lo no topo das nossas camadas. Vamos transformar a opacidade para um 100 vamos mudar a cor, e nós realmente vamos usar este Grady angular em que nós usamos em uma das lições anteriores , e este seria colorido também. Então eu tenho as cores no topo. Então vamos usar essas cores para o nosso Grady int. E para fazer isso, vamos selecionar a primeira parada de cor. Em seguida, você vai para o controle de pressão de cores C para a ferramenta conta-gotas, e lá está. Agora Creek na linha para ter outro controle de parada de carro ver adequado na segunda cor. Em seguida, você pode clicar diretamente sobre isso sobre a tia Grady e Controle. Veja, vamos ter a cor azul. Talvez seja rápido lá e controle. Veja, isso é algo como este. Agora temos que ler esta cor preta para que eu possa selecioná-la e pressionado backspace no meu teclado. Agora vamos fazer alguns pequenos ajustes para a cor pára para que o Grady e olha seu melhor. E vamos mudar. A cor pára de acordo, e aí você tem. Agora, a próxima coisa, que é bastante grande esboço de gorjeta, é que você pode ter esta fronteira para ser apenas para as 77 horas. Então queremos que esta fronteira pare em algum lugar e não sinta todo o oval. Então vamos agora para as propriedades de bordas e vamos eleger as propriedades agora para o valor de traço . Você pode colocar o que quiser por agora, por exemplo, 10. E também por favor certifique-se de que você tem essas extremidades arredondadas e para a lacuna que você colocou, é muito importante e é um bom truque aqui. Você coloca o valor fora dos lados fora do seu geral, então vamos colocar 212 e este número tem que ser multiplicado. Então vamos botar uma bunda. Truques aqui pelo número P e P é obviamente livre vírgula 14 para que você possa arredondá-lo assim e, em seguida, pressione Return. E agora o que acontece quando mudar o traço? O valor é que esta linha está começando a crescer. Então agora esta criatura de caracol colorida que fizemos está começando a se mover para cima e para cima é basicamente a direção errada aqui. Então o que precisamos fazer é selecionar essa forma e ir para transformar opções, e se você for transformar, você pode invertê-la verticalmente. Então vamos fazer isso. E agora, se mudarmos o tamanho do dar, você pode ver que temos a direção certa. Então este prego está caindo. E agora podemos definir o alarme para que corresponda às 7 da manhã. Então vamos alterar o valor para, por exemplo, livre. Digamos 5 18 Não, é demais. Vamos ter 400. Certo, 400 é só cerca de sete. Agora eu tenho um símbolo aqui que eu fiz. Então este é o símbolo deslizante. Então vamos colocá-lo lá e lá temos nossa primeira linha, vamos saber, vamos saber, ajustar a posição do controle deslizante e eu não quero que este prego seja visível sob este Snyder. Então vamos provavelmente separar isso do símbolo e vamos mudar a opacidade fora do campo. Então vamos entrar, e temos opacidade de combustível aqui. Vamos fazer 100%. Acho que agora parece melhor. Agora vamos duplicar o oval. Isso é pressionar e manter a tecla Shift e opção do teclado para dimensioná-lo dentro de proporções , bem como a partir do centro. E vamos modificar esse Grady daqui a pouco. Então, vamos inserir grau e propriedades e vamos mover a parada de cor para que este radiante seja ligeiramente diferente. Que o 1º 1 e acho que fica melhor agora e com a gente. Temos que fazer isso duplicar também esta cópia deslizante e vamos colocá-lo no 10 minutos e nós precisamos mudar o tamanho. Então vamos para Borders Properties e que dizer Dash será 200. Mas também precisamos mudar o espaço para que ele corresponda ao tamanho fora do círculo e vamos multiplicá-lo por um valor de P. Agora está perfeito. Então nós temos nosso componente, e talvez nós vamos selecionar todos esses itens e selecionar grupo. É o comandante da imprensa G para agrupá-lo. Agora podemos escalar essas camadas com comandos K. Então, por exemplo, vamos colocar 90% aqui para torná-lo um pouco menor e aí você tem. Nosso componente está quase pronto. Agora vamos separar o fundo do símbolo para que possamos entrar neste retângulo e vamos mudar o campo ligeiramente. Então vamos aumentar essa capacidade. Você pode clicar neste campo e pressionar shift e seta para cima para alterar a opacidade deste Grady em. E talvez isso tenha colocado esse Grady no centro desligado ou relógio. Se der uma olhada na pré-visualização do meu telefone. Parece um pouco melhor. E agora o nosso alarme A tela está pronto. Espero que tenham gostado desta lição. Vejo-te no próximo. 42. Pontos e a tela e a de de Senses: Certo, vamos passar para a próxima tela. Temos tela de sentidos aqui e vamos selecionar o menu suspenso. E a sensação que usaremos por enquanto é limão fresco para que nosso quarto possa cheirar bem. E vamos selecionar dedo retangular. Vamos criar um espaço reservado para uma imagem, e eu vou Phew vamos ou pressione F e B no teclado para alternar entre borda e sensação . Agora isso mudou alguns para o campo de imagem. Vamos para o lado dos pixels e eu tenho essa boa qualidade fora limões aqui. Agora vamos tirar esta cesta de limão do nosso navegador e arrastá-la e soltá-la na sensação de esboço e esperar um segundo. Aí temos. OK, agora vamos selecionar a opção de alimentação que vamos definir para sentir como de costume, e eu vou diminuir uma escassez desta camada para que tenhamos, por exemplo, 30%. Agora vamos mover esta camada para o fundo para que tenhamos esta batalha no topo e com, como precisamos aqui no fundo, vamos colocar esta pequena linha. Então esta seção de linha que eu precisava eu preciso deste símbolo para estar no fundo desta tela de censo bem Vamos para os símbolos e eu preciso de linha com seção, e esta seção será realmente a seção para a intensidade do nosso cheiro. Então, basicamente, quanto mais intenso o cheiro será no quarto com mais capacidade essa imagem de fundo terá, e esta será a primeira pista visual para o usuário. E a segunda pista visual será um pequeno ícone que você tem aqui. E essas serão as garrafas que vão deixar você disse a intensidade. Vamos agora para o menu de inserção fora do esboço e aqui temos as formas e algumas dessas formas. Nós não os usamos nas lições anteriores, e esses são estrela, polígono e triângulo. Isso é polígono selecionado. E vamos desenhar uma pesquisa simples. Como você pode ver agora nas preferências, você pode selecionar os lados da política, e você também pode, por exemplo, por exemplo, e o mundo da edição, e você pode fazer algo louco com esses pontos vetoriais também. Então, basicamente, nós vamos ter flores como nossos ícones aqui, e quanto mais flores você tiver, mais intenso será o cheiro. E para flores, vamos usar uma forma de estrela. Então, na forma de estrela você pode como os rádios, bem como você pode selecionar um número fora de pontos , nós vamos manter os 45 pontos, e nós vamos para este modo de edição eleitoral pressionando Return. E agora vamos ampliar. E como você pode ver, temos diferentes pontos vetoriais e para criar para o nosso ícone. Basta selecionar todas as portas vetoriais, as outras nas bordas. Então eu me mudo. Clique em cada ponto vetorial, e agora vamos para a adoção do espelho. E lá você tem uma flor, e se você quiser ter uma flor ainda mais bonita, você pode selecionar cada fora dos pontos vetoriais, e então você pode ajustar as alças vetoriais. E se você pressionar e segurar as alças de ajuste de comando, você irá ajustar. Ambos têm esses em conformidade, e é assim que você pode fazer aqueles lindamente em torno de formas fora desta hora. Agora vamos terminar este ícone e vamos diminuir o zoom. Eu vou dobrar grego no pressuposto no loop. Eu venho aqui para que eu tenha 100% de vista. Agora vamos fazer isso um pouco menor com deslocamento e fora para manter proporções, bem como para escapar do centro e talvez vamos começar a partir daí e mudar a espessura fora das bordas para um. Agora vamos colocar no lado esquerdo da nossa escala de intensidade, e eu vou fazer o mesmo que no nosso audível anterior. Então vamos ter uma opção make saudação, e eu vou fazer uma coluna, oito linhas e também 16 peças marcações. E como podem ver, há muito espadim agora. Certo? Mas vamos colocar uma flor para a direita e depois distribuir os mercados de acordo . Então vamos selecionar todas essas formas. Vamos usar as opções da ilha. E agora você tem as flores e eu preciso que essas marcas sejam maiores. E isso é porque eu preciso que cada próxima flor também seja escalada. E vamos escalá-lo e eu posso usar minhas palavras-chave são vai para cima e para baixo para fazer uma escala de cerveja. E vamos dar uma olhada nessa flor. Talvez tenhamos 110% para a segunda cópia, e eu vou pressionar, ok? Não, para o próximo, vamos fazer mais 120%. Assim, o próximo menor obviamente ser 130 irá criar esta escala que nos permitirá dar usuário e outro visual sugerido que você pode fazer essa coisa cheirar muito mais intenso apenas selecionando mais flores. OK, e vamos ter 170% para o último agora está muito bom. Bem, eles vão ter que fazer é apenas selecionar essas flores e alinhá-las corretamente para o centro, para o meio, basicamente. E agora o quê? Queremos fazer isso selecionar algumas flores e, por exemplo, para nós para este cheiro de limão fresco, temos cerca de 30% de capacidade. Então vamos eleger sentir e isso é fazer alguns brancos. E lá você pode ver a balança fora do cheiro do nosso quarto. Tudo bem, então se tivermos uma saída livre de oito flores aqui, vamos ter um sorriso em torno de 30%. Podemos então subir com a opacidade fora de nosso fundo quando o cheiro é mais intenso e essas são pistas visuais para o usuário. Teoh se comunica. Esse cheiro está subindo ou descendo. Ok, então este é o fim para esta tela do censo. Agora vamos passar para outra tela. Então vamos passar para esta tela de cortina e para a tela. Meu usuário doméstico inteligente gerenciará cortinas, bem como cegos. Portanto, temos dois dispositivos para gerenciar e que você se lembra corretamente na visualização de dispositivos. E agora podemos usar o símbolo, que foi, por exemplo, dispositivo ativo ou dispositivo inativo para definir dois dispositivos aqui. Então, o 1º 1 será cortinas e o 2º 1 será dieta. Então, se selecionarmos esses caras, podemos dizer, centralizar a entrevista e colocá-los um pouco no topo desta placa dura, eu vou alinhá-los corretamente com o grande. E agora esse interruptor, o primeiro ícone a ser cortinas. E essa é a única substituição que eu posso usar minúsculas aqui porque meu texto é maiúscula de qualquer maneira, então o 2º 1 é cego. Vamos colocar persianas aqui e agora temos esses dois dispositivos, então permanecemos consistentes até mostrarmos dispositivos para o usuário. Agora, esses controles de dispositivo também serão o mais intuitivos possível. Então vamos criar um retângulo, e eu vou definir o raio para este retângulo, e esta será a minha escala para a escala. Eu menti. Algumas linhas, algumas linhas horizontais. Então vamos desenhar uma linha vertical. Essa é a altura do nosso complemento. E agora vamos ficar com o afiado e assim como eu vou fazer um traço fora, talvez para adicionar Gap off 16. Então vamos ser consistentes com o nosso acordado. Agora vamos voltar ao valor fora da espessura. E agora, se você aumentar esse valor, como você pode ver, você pode desenhar essas lindas linhas horizontais. Então aí está. Vamos ter um valor em torno de, eu acho, 100. E agora vamos selecionar ambos fora desta camada. Então vamos selecionar aprendizagem e retângulo e vamos fazer uma máscara fora deles. Ok, então isso é basicamente meio fora do meu elogio. Agora eu também vou precisar de um controle deslizante para que o usuário possa determinar se ele quer ter uma luz muito mais ou menos no quarto. E isso eu também vou ter como uma pista visual aqui. Então eu vou selecionar esta linha, e eu vou mudar ligeiramente a opacidade desta linha para que se você estiver no topo deste nove, há uma linha branca e vamos usar Grady. E para isso eu vou usar ingrediente simples linear, radiante, e vamos usar cor branca para ambas as cores. Mas para este núcleo no fundo, vou usar uma escassez quase zero. Então, vamos ter, por exemplo, capacidade de cinco pessoas aqui e agora. Podemos ter a idéia de que se movermos o controle deslizante em direção ao topo, este componente terá mais luz no quarto. E se movermos o controle deslizante para a parte inferior do componente, teremos menos vida no quarto. Também podemos ajustar essa lacuna para que tenhamos mais ou menos linhas, e é muito fácil fazer alguns ajustes neste componente. Então agora vamos para símbolos e vamos usar nosso controle deslizante inferior. Vamos colocar o controle deslizante aqui. Mas em vez deste controle deslizante branco, acho que vou converter as cores. Vamos colocar em primeiro lugar aqui e agora. Eu acho que podemos selecionar o mais e mudar algumas cores, e enquanto você é consistente, na medida em que a forma deste elogio parece, Eu acho que você pode você pode alterá-lo períodos Z através dos diferentes barcos de arte. Ele realmente não tinha você x tanto, então vamos fazer uma linha ainda mais espessa lá fora e nós temos essas garrafas como se elas estivessem prontas. Então temos nosso primeiro componente que está quase pronto. Vamos mudar a cor da borda aqui e vamos mudar o Alpha para que seja quase 100%. E agora acho que parece muito bom. Então agora dentro desta forma, eu vou desenhar um campo de texto e neste texto, eu vou colocar um valor percentual de como aberto ou fechado nossas cortinas ou persianas, por exemplo. Talvez defina a descrição, mas acho que é muito pequena. Então vamos selecionar, Vamos colocá-lo no meio do quadro de texto. E também vou mudar o tamanho agora mesmo. Então vamos adicioná-lo, este campo de texto e vamos tentar o tamanho fora, por exemplo, algo como 14 ou 14. Eu acredito que este tamanho está OK agora. Também gostaria de ajustar algum espaçamento de linha, Então vamos começar com 17 em. Vamos descer daí. Acredito que podemos ajustá-lo para que seja um pouco melhor. Ok, agora está tudo bem. Eu acredito que isso é tudo para este componente. Este controle deslizante. Agora vamos para o painel de camadas e vamos limpar um pouco eu vou colocar a linha aqui e vamos selecionar os dois grupos. Vamos fazer mais um no grupo com o controle deslizante. Eu vou vir em nosso ou clique duas vezes e apenas chamá-lo Slider. Agora vamos escolher droga para ter outro ao lado das persianas, e este cego Snyder talvez vai ajustá-lo um pouco para que você possa ter um valor diferente aqui. Então, vamos pegar este controle deslizante inferior e colocá-lo ligeiramente para baixo. Talvez aqui e mude o valor também. Provavelmente 25. Certo, vamos derrubar as camadas. E agora vamos criar outra pista visual para o usuário. Vamos usar um ano de texto de descrição. Vamos colocá-lo no meio do quadro de texto e eu vou dizer aberto e vamos colocar esta tabela para o topo do nosso componente, bem como para o segundo componente. Então, opção. Arraste-o para copiá-lo para as persianas. Vou escolher a droga segunda vez, e desta vez vamos mudar a descrição para fechada. Então, as persianas estão fechadas agora, e vamos fazer a opção de drogas novamente. E lá temos o nosso layout final, então agora você só provavelmente quer alguns pequenos ajustes que você quer Teoh pressione controle, C dois c desengordurado e talvez uma linha para o grande pouco. Mas por enquanto , também está nesta lição. Fizemos duas telas. Foi censo e cortinas e nos vemos no próximo. 43. Tela de lâmpada: Agora você sabe que os atalhos de teclado no esboço são uma das coisas mais importantes que você pode aprender. Então, basicamente, sua habilidade é baseada em quantas vezes você precisa Teoh Reach para o mouse ou para o tablet pan, e usando os atalhos de teclado eficientemente permitirá que você acelere o processo de criação , ele sábio. Quando você desenvolve um hábito usando atalhos de teclado, você percebe que você não clica muito nas opções de esboço. Use o teclado com mais frequência e, em seguida, você pode economizar algum espaço na tela. Usando esses atalhos, você pode pressionar a opção de comando um para ocultar o painel de camadas. Você pode pressionar a opção de comando para ocultar o painel no lado direito. O painel de propriedades, bem como você compacta a opção de comando T para ocultar o ponto da ferramenta. E lembre-se de que, no painel Ferramentas, você também pode ocultar esses rótulos para que você tenha apenas ícones e economize algum espaço no monitor. Agora, mais um atalho de teclado para entrar no modo de tela cheia é o ponto de comando e todos os comandos de mama pontos não há barulho, nenhuma interface em tudo, e você pode usar todo o espaço fora do seu dia para projetar no esboço e então é ainda mais importante dedo do pé. Lembre-se desses atalhos de teclado para ferramentas, bem como para algumas técnicas comuns, como escala ou muskie? Ok, então agora vamos para a próxima tela. Esta será a tela fixa, e vamos mudar o rótulo para a parte inferior. Isso é um frio à noite é um nome bastante agradável para uma predefinição no quarto, então vamos copiar e colar esses itens. Eu vou ter fontes de luz livres lâmpadas livres que eu posso ajustar e alterar suas configurações. Às vezes é muito mais fácil simplesmente copiar e colar alguns símbolos de outro barco de arte do que passar pelos símbolos. Batalhe e procure um símbolo. Então vamos copiar e colar. Vamos mudar as marcas. E como você pode ver este quadro que temos aqui com cor de acento, na verdade significa que este dispositivo está ativo. Quero dizer que podemos mudar suas propriedades deste mesmo dispositivo, então precisamos mudá-lo, e também precisamos mudar os ícones. Mas primeiro essa mudança é para um dispositivo. Como você pode ver, nós temos três tipos diferentes fora desses cartões Então este que está ativo terá esta borda, bem como a cor diferente fora do texto. E agora sabemos que estamos editando essa luz principal, por exemplo. Agora vamos para ícones e eu tenho ícones para cordeiros aqui. Então vamos colocar a luz de leitura aqui, e o primeiro ícone será a nossa margem. Então vamos colocar a legenda. E como você pode ver agora, o que este aqui está ativo. E isso significa que o usuário agora mudará as configurações da luz principal. E essas configurações serão a cor da luz, bem como a intensidade das luzes . Então vamos criar um oval. Eu não apertei Shift para que eu possa ter este dedo oval parecido com isso. E vamos levar César para deletar esses segmentos inferiores. Agora esta parte fora do fim vai nos deixar criar uma escala. E como você se lembra, temos que acessar as propriedades da fronteira. Agora ele mudou o fim para que nós temos essas bordas retas e vamos colocar dois para traço e talvez cerca de 20 para uma lacuna para começar. Então vamos mudar a espessura para criar essa escala, e precisamos que essa escala seja igual para da esquerda para a direita, então vamos ajustar a tampa de acordo. Certo, aí está, e começa a ficar bonito. Então este cabo realmente permite que os usuários ajustem o brilho da luz, e nós vamos ter um controle deslizante fora da escala com a informação desligada. Quão forte é a luz no nosso quarto? Então, como de costume, tentamos dar ao usuário algum tipo de dicas. O que está acontecendo aqui? Então vamos para a cor da borda e vamos selecionar Viniar radiante. Vamos colocar esse Grady da esquerda para a direita, e nós também vamos mudar essa cor preta que é grega nesta cor Pare e vamos para uma cor branca. No entanto, vamos mudar a opacidade para que seja quase invisível para o lado esquerdo. Significa que teremos uma pequena quantidade fora do lado direito e esquerdo da balança, e temos o lado de divisão de luz mais brilhante da fuga. Agora o que eu vou fazer, eu vou copiar este fundo do Snyder da próxima tela das cortinas. Então isso é Mar Comum e Comandante V para colá-lo, e nós vamos ter o mesmo fundo aqui que vai permitir que os usuários mudem na fonte de luz de acordo. Vamos colocar alguns valores e essas porcentagens de acampamento, porque porcentagem é um bom valor que o usuário sempre entende. No entanto, poderíamos também colocar um valor mais preciso. Por exemplo, podemos dar valor às pernas e alterar o tamanho da frente desse trabalho para ser, por exemplo, cerca de 12 ou 10. E isso é meio legal. Agora vamos criar um pequeno ícone aqui, e é sempre divertido para mim criar um esboço Ikenson. Eu não sei se você compartilha meu entusiasmo, no entanto, eu sempre gosto de criar. I constantes pegar em vez de procurar ícone, às vezes é muito mais fácil e é muito mais rápido. Então vamos criar uma pequena lâmpada aqui. Vou pressionar Shift e criar mais, o que é um círculo perfeito. Agora vamos criar uma forma diferente, forma retangular, e se você tentar Teoh, conecte essas formas. Então vamos eleger o primeiro na segunda forma e você vai para o sindicato. Você diz que não tem esse efeito que esperava, e isso é porque essas formas não estão se sobrepondo. Se você tem as formas que estão fora um do outro, você provavelmente não tem o efeito que você quer. Então o que você faz é que você realmente fez essa forma de maior e três não importa o quão grande é agora, porque se nós é o final ambas as formas e união seletiva. Como podem ver, temos esse efeito esperado. Então vamos ter uma linha aqui, e eu vou ter outra. Então isso é um Comando C V comum ou simplesmente uma mercadoria para duplicar. Agora vamos entrar no modo de edição vetorial, e eu era como os primeiros pontos vetoriais e pressionou a esquerda nosso próprio teclado e, em seguida o segundo vetor aponta e pressione a seta direita no teclado para que este seja arrebatado por um pico. Então agora vamos criar mais uma linha. Esta será a nossa fonte de luz, então precisamos duplicar esta camada e colocá-la ao redor do ícone. Vamos para a camada agora Vamos para os caminhos Anti. Você se lembra? Girar cópias. Espero que você dio Vamos ter, por exemplo, por agora, sete camadas. Vamos ver se está tudo bem, é às seis. E vamos mudar a posição desses elementos. Na verdade, vou apagar aqueles dois, e vou ficar com cinco. Agora, Como você pode ver, nosso ícone acima está pronto e parece muito bom. Então vamos lá. I menos ou dobrar rápido no zamtel para ter uma escala fora 100. Isso é um turno. Clique nas camadas para selecioná-las todas. E vamos agrupá-lo. Agora temos o grupo que está indo, Kate, Kate, mudar o tamanho deste bob para talvez 40 ou talvez 45%. Ok, agora é a posição ajustada com as setas do teclado. E vamos duplicar este bob para que possamos tê-lo do outro lado fora da nossa escala. Vamos mudar a droga para manter a linha, e , uh, vamos fazer zoom um pouco. O que precisamos fazer é nos livrar desses Linus, porque aqui no lado esquerdo, não temos nenhuma fonte de vôo do Bob. Então vamos fazer outra linha que vai cruzar este ícone. E agora acho que parece muito legal. Então vamos agrupar essas camadas. Vamos colocar a linha dentro desta cópia fora do grupo, e agora vamos talvez mudar a opacidade para cerca de 40 ou 30%. Então, vamos pressionar para no teclado e lá você tem nossa escala. Mas para ser honesto, eu realmente não gosto desta curva que temos na escala. Então, possivelmente, podemos ir para o modo de edição para vetores e mudá-lo. No entanto, eu acho que provavelmente será melhor dedo mascote esta forma e vamos selecionar V para Victor . E vamos criar uma mesquita simples como esta para que possamos cortar as linhas que estão à esquerda e à direita. E esse tipo de sopro deve ficar bem. Agora podemos selecionar ambos. Meus anos, no entanto, precisa mudar a posição fora das camadas para que o caminho está sob a camada com sobre e agora podemos mosket para fora. E como podem ver, parece muito melhor agora. Agora podemos selecionar ambos os grupos e colocar os bobs para o topo para que tenhamos um pouco mais de espaço para o próximo componente que terá para o fundo. E este próximo componente será que permitirá que os usuários alterem o curso das luzes. Então vamos copiar e colar um de nossas seções aqui, e vamos mudar o nome desta seção para cor. Então agora dentro desta seção de cores, vamos colocar um pouco de forma vetorial. Então vamos trabalhar com fatores no esboço novamente, eu vou pressionar, mudar e desenhar um oval para ter um círculo perfeito. Agora isso é pressionar comandos para ampliar esse círculo e ir para o molde de edição de casamento com retorno. Agora isso é Command Creek entre as seções, e isso permitirá que você coloque esses pontos vetoriais diretamente no meio das seções. Vou selecionar com Shift esses pontos vetoriais livres e vamos arrebatá-los para a direita . Então, vamos pressionar Shift e tentar o nosso próprio teclado para que tenhamos este tipo de forma. Eu quero que essas transições neste fazer pontos vetoriais sejam um pouco mais suaves. Então vamos para a variante desconectada fora das alças ou pressione o comando livre. E agora, se você selecionar os pontos vetoriais e arrastar uma das alças, você verá que podemos suavizar isso, e isso funciona muito bem. Então, vamos puxá-lo para lá. E a propósito, eu vou para um governante agora. Então vamos pressionar o controle são E agora vamos criar um guia que está em linha com o vetor tratado, e eu mostro a vocês por que estou fazendo isso em apenas um segundo. Isso é injustiça. 2º 1 Vamos também fazer esta bela curva fora deste ponto vetorial e também vamos para as réguas e vamos colocar guia ali. Precisamos do mesmo tipo de forma do outro lado. No entanto, antes de fazer isso, vamos para o over e vamos duplicar esta camada para que possamos ter uma cópia de backup e vamos comprimir commodity nesta camada. Vou escondê-lo por enquanto. E vamos trabalhar nesta camada de cópia geral quando um retorno de imprensa para ir para o mundo de edição vetorial . E agora vamos ter os mesmos pontos vetoriais aqui. Então vamos pressionar o comando para dividir o segmento em partes iguais e comandar aqui, bem como isso é ela fugir nesses pontos vetoriais livres. Najid com um deslocamento e seta para a esquerda, Eu pressionei duas vezes para ter 20 pixels agora que selecionar ambos os pontos vetoriais aqui, assim como braços desconectados. E agora você vê por que os guias são nossos melhores amigos, porque agora podemos definir essas alças de diretor para combinar com os caras que criamos e então temos uma curva muito semelhante para a esquerda e para a direita. Então, a primeira parte do nosso segmento está feita. Podemos comandar menos para diminuir o zoom, e agora queremos duplicar este segmento para que tenhamos um segmento à esquerda e um segmentos à direita. Vamos optar por drogá-lo e vamos colocar o 1º 1 aqui. E também vou colocar o 2º 1 lá e vamos pegá-lo com o teclado. Não é o 2º 1 para que possamos combinar ou, quase muito essa curva que temos também, basicamente, podemos deixá-lo, e para sabor deve ser ideal. Então vamos virar horizontalmente, e agora parece muito bom. Então também precisamos que no final é essa forma de backup que temos aqui. Então vamos habilitar essa forma e vamos colocá-la à esquerda de nossas formas. E também precisamos ter ganho a direita também. Então vamos duplicar e mudar a droga para manter a linha. Agora é girá-lo horizontalmente e aí você tem. Nós quase temos a nossa forma, pois as cores terão algum menor. Nagy está aqui com as setas do teclado, e agora estamos prontos para selecionar todo o geral. Então, vamos clicar na parte inferior e vamos clicar no botão de cima em The Liar Spinal. E agora vamos para as operações Bhuiyan. Eu escolho o sindicato. E como você pode ver, você tem esta bela forma combinada e a beleza da forma combinada em esboço é que se você quiser ter alguns pequenos ajustes mais tarde, você sempre pode voltar para a forma combinada, e você sempre pode revelar o conteúdo e alterar. Então agora vamos criar Grady Int, e vamos senti-lo com um int Grady linear. Vamos colocar alguns valores de cor diferentes para que o usuário possa alternar entre as cores de nossas luzes e talvez vamos virar para que tenhamos essa linha muito. Essas cores estão ativadas no controle deslizante? Então temos branco à esquerda e através e preto à direita, e agora estamos prontos para definir algumas cores bonitas para o nosso Grady int. Podemos até ser inspirados por este tema de cores que temos 40 despertador, então vamos eleger algumas cores e provavelmente para o lado esquerdo da escala. Podemos começar com algumas cores mais quentes. Vamos começar quente e depois vamos mais frio. Vamos ter um amarelo brilhante aqui, e a segunda cor estará enchendo em torno de cor laranja ou vermelha. Sim, é como uma mais brilhante. Agora, como você pode ver, você pode simplesmente clicar no mesmo lugar que você precisa colorir para aparecer na linha Grady Int . E é muito mais fácil Toe adiciona essas cores parar desta forma. Então isso vai ser rosa mais claro, e agora vamos mais frio. Então isso é metade de algumas cores verde e azul. Talvez alguma cor azul da noite aqui e também algum colarinho azul ali. Mas isso é mais leve, e eu acredito que este caso agora parece muito bom, então o usuário pode ser capaz de escolher entre as cores, bem como a intensidade de nossas luzes. Uma nota lateral aqui é que nós ainda tentamos manter as funções que são mais frequentemente usadas pelo usuário para o fundo fora do nosso layout. Então nós temos o menu, esses controles deslizantes aqui na parte inferior, e se você for para o topo, você tem funções menos frequentemente usadas, e nós fazemos isso só porque o usuário, enquanto segura seu telefone, ele pode facilmente alcançar a parte inferior do telefone e conhecer o topo. Lembre-se de que a experiência do usuário é um dos fatores mais importantes para suas decisões de demissão . Agora a nossa cidra está pronta com esta pequena garrafa, e vamos prosseguir para a próxima lição. 44. Configurações de temperatura: Olá e bem-vindo. É bom te ver na próxima lição. Então agora vamos prosseguir com a nossa última tela para o quarto. Esta é uma tela de temperatura, e vamos colocar aqui um componente de temperatura. Eu fiz um símbolo fora deste controle deslizante com temperatura para que possamos colocá-lo como um primeiro item na tela do nosso quarto. Agora vamos para o outro e vamos ter uma linha de seção aqui. Vamos colocá-lo diretamente no centro do nosso quadro de arte. Espero que se lembre do nosso próprio atalho de teclado, que é comentário. Deixe o colchete quadrado. Isso é comando do dedo do pé. Amplie e vamos criar um primeiro fundo. Este será um retângulo e vamos ter o raio da borda para ângulo de distrito. Para ser grande de você, por exemplo, 100 para que tenhamos um cuidado perfeito de para a esquerda para a direita. Agora vamos mudar a cor para a nossa cor de fundo principal, e eu vou ter duas garrafas aqui. A primeira linha será um fundo menos para a esquerda, e a segunda linha que eu vou duplicar será uma garrafa de plástico. Vamos ter outra cópia com D comum, e podemos transformá-la em 90 graus. Ou podemos usar o dedo giratório e manter o deslocamento no teclado para criar este ícone perfeito. Esta será uma batalha para mudar o valor divertido, Então vamos criar um ícone divertido que eu vou pressionar são para retângulo. Vamos criar um retângulo como este, e vamos mudar a espessura fora de nossa borda para ser um. Agora eu preciso ajustar os rádios, mas eu só quero ter o rádio em cima. Então isso é colocar duas semanas de valor do que ponto-e-vírgula para espreitar e, em seguida, 00 para que você tenha bordas afiadas no fundo fora deste eu poderia Não, vamos criar outra parte deste ícone. Isto vai acabar, na verdade, mas vou mudar a espessura do dedo do pé e ir para a tesoura. Isso é excluir esses dois segmentos na parte inferior. E se você pressionar Return para entrar no modo de edição do reitor, tudo o que você precisa fazer é clicar neste ponto vetorial ou ir para as propriedades e selecionar fechar caminho inferior. E agora os lucros fecham. Podemos ampliar e entrar no modo de edição para vetores. Você pode selecionar este vetor pontos na parte superior e, em seguida, Naj-lo com as setas do teclado. Então, talvez, vamos colocá-lo um pixel para a esquerda e um pixel para o fundo, e então nós temos um fora dos braços fora para diversão. Então vamos colocá-lo lá, e nós vamos criar as cópias fora deste elemento. Agora isso foi girado um pouco. Agora vamos para camadas, depois caminhos e girar cópias. Vamos criar duas cópias para que tenhamos três camadas no total. Agora vamos mover este ponto médio, e você pode movê-lo para cima para ter essas asas mais próximas umas das outras. E também, vamos movê-lo ligeiramente para a esquerda. E lá temos. Vamos arrebatá-lo com setas do teclado para que possamos posicioná-lo corretamente, e eu vou girá-lo um pouco para que nosso ícone fique ainda melhor agora. A última coisa que eu faço é selecionar esses anúncios retangulares como a sensação de ângulo direto Vamos para a nossa cor de fundo, e agora o ícone fora do nosso fundo ainda está completamente acabado. Então vamos organizar as camadas para que possamos ter um grupo adequado que é como essas camadas, e o primeiro grupo vai ser para o ícone divertido. Vou dizer que é divertido, e o segundo grupo será para a nossa batalha, e isso é porque precisamos duplicar esta batalha. Então, vamos opção arrastá-lo e vamos criar outro ícone para a direita. Eu sei que é tão viciante criar ícones no esboço, mas este é o último que estou fazendo aqui. Então vamos ampliar e eu gostaria de criar um ícone de gotas de água e vamos começar com um romance. Seria muito, muito simples, então estou começando com um oval. Estou fazendo espessura de um. Agora vamos selecionar os primeiros pontos vetoriais no topo. Agora é clicar duas vezes sobre esses pontos vetoriais para que você possa remover as alças e ir para o modo de edição reta. Isso é pressionar Shift e seta para cima no teclado. E aí está. Nosso ícone está quase pronto. Vamos criar um ícone menor e duplicado para que possamos ter gotas de água, e este será menor e também este menor. Vamos colocá-lo no topo do nosso ícone. Agora que é clique duas vezes sobre a zona tal para ir para 100% e parece muito bom. Acho que temos que criar mais detalhes neste ícone , , então vamos ampliar e mudar esse tamanho. Vamos fazer isso menor. E também vamos criar um pequeno detalhe aqui com o dedo do vetor. Pressiono V e crio este pequeno ano caminho artesanal. Vou tirar a espessura de um. Vamos colocá-lo mais para o centro, bem como eles mudam as formigas que estão em torno dele. Agora parece verde. - Legal. Agora isso é, vamos lá. Comando C v. Então duplique isso e coloque-o dentro desta pequena gota de água também. Então, se formos para 100% agora, nossos ícones estão prontos, e eu acho que parece muito bom. Vamos às descrições. Vamos criar a descrição com 90% de capacidade de texto para que possamos ter um nome fora desta função, bem como um valor percentual. Então vamos nos divertir. 60%. E também, vamos colocá-lo no centro abaixo do fundo. Vamos selecionar todos esses itens e vamos distribuir o alinhamento para que ele esteja diretamente no centro. Agora isso é opção de arrastar, e aqui nós vamos ter umidade fora de algum valor. Talvez mudemos para 45% agora. Dito isto, o alinhamento, vamos selecionar o frasco em ambos com este campo de texto e vamos alinhá-lo ao centro horizontalmente. Vou selecionar as camadas de ícone também e criar um grupo a partir delas. E este grupo também estava atrás para o centro fora do fundo. Agora ele realmente parece bom e nós temos a nossa primeira tela pronta. Isso é controle de imprensa, G. E vamos ver se ele se encaixa bem para desengordurado. Eu acho que ele faz. E acredito que agora é hora da festa porque terminamos toda a seção da sala. Temos cinco ecrãs aqui, e na próxima lição, vamos trabalhar noutra página. Vamos chamá-lo de CCTV, e, uh, eu vou pegar este e audível a partir daí e colado aqui. Agora vamos apagar toda a equipe desnecessária. Vamos selecioná-lo assim E vamos pressionar backspace. Por isso, creio que estamos prontos para a próxima lição. Eu vejo você lá 45. Telas de câmeras: Olá e bem-vindo na próxima lição. É bom te ver aqui. Então agora vamos criar outras telas de fazer para CCTV terá algumas câmeras em torno de nossa casa. E, hum, nós vamos fazer algumas coisas interessantes. Por exemplo, com o texto, vou mostrar-lhe como criar um texto em um caminho. Então vamos começar com um retângulo aqui, e esta será uma barra de informações com o status fora de nossas câmeras. Agora, um atalho útil ainda estava desenhando. Você não precisa soltar o botão esquerdo do mouse. Você pode simplesmente pressionar outro atalho cortar fora controle são e, em seguida, você ativar a ganância para que você ainda pode desenhar. Você pode pressionar a barra de espaços sem soltar o botão esquerdo do mouse. Você pode ajustar as formas disso. A marcha é a sua saudação apropriada. Agora vamos mudar o combustível e a fronteira. E, por favor, lembre-se dos atalhos se você quiser habilitar a sensação de desespero F no teclado e para a borda pressione batida no teclado. E então essa é a maneira como você pode totalizar tanto borda, bem como um campo. Agora vamos colocar o texto aqui. Agora vamos gostar destes dois itens. Vamos mudar o vazamento no retângulo e nas câmeras. Vou colocar o texto no centro, por isso lembrem-se dos nossos atalhos. Foguetes quadrados esquerdo e direito comuns. É tão rápido. Então você pode desativar a saudação. Então esse é o comentário da imprensa. GSR contra Gee e abaixo desta caixa de informações vamos ter fotos, então precisamos dividi-lo em quatro visualizações de câmera. Então vamos primeiro criar retângulo que é a semana inteira fora do nosso quadro de arte. E então vamos mudar rapidamente para o campo de entrada de tamanho. Então eu vou pressionar a banheira opção e depois top três vezes. Se você pressionar quatro vezes, basta pressionar Shift, parar para ir para trás e então dividir este trigo dois por dois, e eu vou subtrair dois pixels extras para os mercados. Agora vamos trocar a fronteira e os campos. Então vamos pressionar B e F. E agora para o campo, vamos definir uma imagem. Vamos escolher uma imagem do nosso disco rígido, e eu tenho aqui cinco imagens. Vou usar quatro imagens, e desta vez vamos definir diferentes sentimentos para uma única camada. Então essa é apenas outra imagem. E lá nós temos que sentir E como você pode ver, esses sentimentos eles funcionam. Eso que isso sente que está no topo secreto, este que está no fundo. Então, isso é exatamente como no trabalho posterior da coluna vertebral. Então, há nossos poucos peludos, e vamos ter mais um combustível extra para o mesmo retângulo. E assim fizemos um retângulo que tem quatro sentidos e podemos alternar entre esses campos . Então vamos duplicar o retângulo. Vou cumprimentar este retângulo. Então vamos ter duas linhas e duas colunas. E também vou definir os mercados para ser igual para escolher Eus. Então vamos fazer de acordo. Agora é selecionar todos esses retângulos e vamos colocá-los no centro do quadro de arte . Agora são só as peles. Basta selecionar todos os elementos e agora alterar a altura deste objeto. E como você pode ver, tudo escala lindamente. Então você tem essas imagens responsivas graças à propriedade field. Agora vamos selecionar o segundo retângulo. Vamos desligar a primeira imagem do retângulo. Vamos desligar os dois primeiros e o 2º 1 para que tenhamos o 3º 1 visível . E como você pode esperar, desligamos as primeiras imagens gratuitas. E lá temos as quatro imagens que são reveladas como um sentimento para a Caçadora. Agora vamos para, Ah, este barco, no fundo da tela. E vamos criar uma escala de tempo aqui. Então, basicamente, você será capaz de mudar o tempo e ver, por exemplo, o que aconteceu no CCTV durante as últimas 24 horas. Então vamos selecionar a linha. Vou mandar o Dash e o Gap saírem. Um no desceu, 10. Então, basicamente, você tem que selecionar este primeiro item aqui e agora você pode ajustar a espessura para que possamos criar esta bela escala. E para o último item na escala, eu vou pressionar L para a linha, e eu vou criar uma linha maior com a espessura fora talvez três ou quatro e também mal mudar a cor e esta será a posição atual no tempo. Então esta será a hora atual para as câmeras e na escala tem algumas horas diferentes que eu posso alternar apenas deslizando esta linha do tempo, e nós vamos ter algumas pistas visuais para o usuário. E vamos criar uma legenda off, talvez para chá ou 20% para que tenhamos a nossa aqui. Talvez comecemos da meia-noite. É meia noite e meia nesta parte fora do susto. Agora vamos a droga antiga que é a droga opção para tê-lo aqui. E vamos commodities para duplicar esses campos e teremos um 5 30 aqui. Então, cinco horas depois, provavelmente temos 10 35 horas depois terá 15 40. Então isso é relógio de 24 horas. Ok, então vamos duplicar mais uma vez, e esta será a visão atual. Então vamos colocar, por exemplo, câmera aqui. Ok, agora o que precisamos mudar é a cor deste texto, assim como vamos colocá-lo no centro desta pequena barra. E vamos mudar a opacidade fora da cor branca e mudá-la para a nossa cor de acento. Agora estamos quase. Os colonos mudaram o nome deste audível para CCTV, e vamos duplicar com D comum agora terá uma visão de apenas uma câmera. Então, por exemplo, vamos pegar a primeira câmera e temos a câmera livre. Agora vamos colocá-lo no centro e vamos excluir esses retângulos que não precisamos aqui. Vamos ampliar este. Então, como você pode ver, esta opção de sensação para uma imagem dentro do nosso retângulo funciona muito bem. E vamos talvez ter uma visão completa sem marcas aqui, então eu vou torná-la um pouco maior agora. Vamos imaginar para que ele se sente tela inteira da esquerda para a direita e também para esta barra verde na parte superior. Agora o que teremos no centro são informações para o usuário que ele pode deslizar para alterar a exibição. Então vamos criar um deslocamento oval feio para manter proporções e vamos sentir pesado, então pressione F e B para desativar a borda e o combustível será nossa cor de fundo. Mas vamos reduzir a capacidade para cerca de 70%. E vamos usar alguns ícones. Vou usar o ícone do meu controle agora e procurar um dedo. Com sorte, teremos algo como gestos. Ok, tudo está ligado. seção de gestos e vamos selecionar um dos ícones. Eu acredito que talvez este se alimente, então vamos arrastá-lo para o esboço. Agora vamos girá-lo. Então, para girá-lo, precisamos pressionar e segurar o comando e aí você tem. E também você pode pressionar shift enquanto mantém os comandos para ter uma rotação perfeita. Agora vamos escalá-lo. Mas com a ferramenta de escala, é muito melhor porque se você pressionar o comando K, ele dimensiona os traços de acordo. Então vamos ter talvez livre centenas e 50 escala. É isto. Então vamos pressionar OK, agora precisamos agrupar este grupo para chegar às formas. Então essa é a nave de comando G até termos as formas e vamos mudar a cor para um procedimento padrão de cor branca . Agora vamos clicar em qualquer lugar no branco esboçado para voltar do banco. Isso é mercadoria para agrupá-lo. E lá temos o nosso ícone. Vamos selecionar a forma e vamos usar nossos atalhos de teclado para que ele esteja perfeitamente neste centro para que o que vamos fazer é com 1/2 alguma legenda, e esta legenda vai realmente seguir o caminho. Então é assim que se faz no esboço. Vamos rápido para um campo de texto. Agora vamos selecionar o texto e vamos colocar aqui, por exemplo, deslizar para navegar informações e vamos entrar em uma alteração selecionada. O peso deste texto foi enviado para talvez leve. Ok, agora precisamos movê-lo e também precisamos definir o caminho que este texto e seguir. Então vamos ampliar e duplicar isso mais tarde que temos para nossos antecedentes. Então, ele seguirá o caminho para debaixo do dedo. Vamos na duplicata isto. E se eu tiver esse segundo comigo, transforme-o para que seja menor todas as noites e possa definir o caminho para o texto. Tudo o que você tem que fazer para que este texto siga um caminho é selecionar esta camada e então você vai para um menu de texto e aqui você tem texto no caminho. E quando você insere texto no caminho, como você pode ver, ele deseja automaticamente esse caminho correto. E como isso aconteceu? Enquanto esboço seleciona o caminho correto levando em consideração a área comum que este campo de texto tem com este caminho. E se não faz sentido por enquanto, por favor, dê uma olhada em como ele se comporta quando tento mover o campo de texto. Então, se eu me mover, é para que ele toque as diferentes formas, ele se adapta às formas e ele segue o caminho. Então vamos deixar aqui e agora. Há uma parte complicada porque se você tentar mudar, por exemplo, a semana, a altura fora do campo de texto para configurá-lo para estar perfeitamente alinhado, você vai falhar. Em vez disso, o que temos que fazer é mudar as coordenadas X e Y de acordo, e lá você pode ver todo o imposto. E se você pode ver todo o texto, não tente apertá-lo para que ele se encaixe perfeitamente. Basta selecionar este imposto. E, a propósito, vamos selecionar isso e vamos pressionar F para o campo para desativar o campo. E agora vamos voltar ao texto e simplesmente mudar a rotação. Então, você pressiona o comando e altera a rotação para que o texto esteja perfeitamente alinhado à parte inferior, e agora podemos movê-lo ligeiramente para cima. E, a propósito, você também pode alterar qualquer das propriedades desse campo de texto. Então ainda está disponível. Então, se você tentar selecionar o campo de texto novamente, você pode ir para ah, este mesmo imposto, não o texto, exatamente. Mas você tem que clicar duas vezes no campo de texto, e se você fizer isso, você pode ver que há, há. Em seguida, você pode editar o texto. Você pode alterar as propriedades deste texto dentro deste campo de texto, bem como você pode alterar algumas outras propriedades de texto que você tem. Se você selecionou esta camada, você pode ir para o menu de propriedades e, por exemplo, no caso de você poder alterar o espaçamento de caracteres. Então vamos ajustar o espaçamento de caracteres agora. Como pode ver, parece muito melhor. Você também pode, por sinal, ele também pode clicar entre todas as letras dentro de um campo de texto e alterar o Kern Inc individualmente para cada caractere. E este é o mesmo campo de entrada de espaçamento de caracteres. Agora vamos selecionar esta camada novamente e vamos pressionar comandos para ajustar a rotação para que ela esteja perfeitamente em nosso quadro de arte. E agora temos as duas telas de CCTV prontas. Vejo você na próxima lição. 46. Como fazer as: A próxima coisa que temos que considerar são diferentes resoluções, bem como diferentes tamanhos de tela . E também temos diferentes orientações para dispositivos móveis, como orientação horizontal e vertical . Então, basicamente, às vezes você tem casos diferentes quando você cria um nativo up ou se você cria um Web design responsivo, você tem que levar em conta os dispositivos também, porque basicamente no usuário móvel tem uma entrada diferente, que é um dedo. E em uma área de trabalho você tem um mouse, o que é muito mais preciso. Então você tem que levar tudo em conta, bem como esses fatores. Os fatores de escala que eu lhe falei em uma das lições anteriores quando falamos sobre patinar quatro telas diferentes. Então a questão básica aqui é por onde começar, ok? E o ponto de partida para a visualização móvel é duplicar a camada que você já criou e contabilizar primeiro a orientação da tela diferente. Então, para abs nativos, talvez você não precise fazer É necessariamente porque você sempre pode forçar, por exemplo, configuração vertical da tela, e, em seguida, mesmo se o usuário mudar para horizontal, ele ainda vai têm vertical. No entanto, eu não acho que esta abordagem é s o muito amigável, então você deve sempre criar também essas telas horizontais. Então vamos começar a partir daí. E também, se você criar sites, essas versões móveis e designs responsivos, você também deve ter essa versão. Então o que eu fiz aqui foi escapar do artigo para que agora eu tenha uma versão horizontal fora do hardboard, e o próximo passo é verificar se todos os nossos símbolos escalam perfeitamente para essas diferentes resoluções. Então vamos selecionar o símbolo superior agora, e vamos tentar escalar a altura. Parece muito bom. No entanto, se você tentou Teoh ajustar a semana, você verá que esses ícones não ficam bem em todas as configurações. O campo de texto , no entanto, ainda está no centro, então essa é basicamente uma boa posição. No entanto, precisamos ir para o lado do símbolo para ir para a definição de símbolos, e precisamos mudar a posição fora dos ícones para que vamos trabalhar neste re opções de dimensionamento. Espero que se lembre deles de uma das primeiras lições. Vamos selecionar os ícones, e basicamente eu preciso ver esses ícones para a esquerda e direita, então eu preciso fazer isso separadamente para cada um que eu aconselhar. Esse foi o 1º à esquerda. E, obviamente, precisamos corrigir a largura e altura deste elemento para que eles não tenham este patinagem diferente. Quando você dimensionar o componente para que eles não mudem seu peso e altura é o que agora, digamos, como o campo de texto inicial inicial e como você viu seu caso corretamente, mesmo se você não disse o redimensionamento opções. E isso é porque ele fica no centro perfeito do nosso quadro de arte. Então, a mesma coisa que temos que fazer para a próxima instância fora do nosso topo. Vamos selecionar o segundo em que posso lidar com isso. Selecione corrigir trigo e escondendo também amendoins para a direita. Agora, esta pequena flecha. Precisamos consertar o trigo e a altura também, e para esses elementos precisamos de Teoh. Mantenha-o no centro, mantenha-os no centro. Então vamos selecionar todos os três elementos e vamos agrupá-los. É a abordagem mais fácil de ter um grupo, e agora para o grupo, podemos dizer que eles estão dimensionando opções para que tenhamos fixo trigo e esconder e vamos colocar o grupo no centro perfeito, vertical e horizontalmente, Então você não precisa do Teoh. Você não precisa alterar nenhuma outra opção de redimensionamento, e isso deve ser dimensionado perfeitamente. Então agora, como você pode ver, você pode escalar o trigo e a altura e tudo fica no lugar. Então, em termos deste layouts horizontais ou versão horizontal, temos menos espaço, tanto quanto a constante mais alta. É por isso que tornamos este elemento um pouco menor. E agora vamos selecionar o plano de fundo e dimensionar o plano de fundo, bem como escalar os outros elementos. E como você pode ver essas escalas de elementos s muito bem, vamos inserir esses elementos e ver a opção Redimensionar Inc. Então, como você pode ver aqui, nós temos re conjuntos de dimensionamento para todos os elementos, e é por isso que você pode facilmente transformá-los em outras resoluções. Diz-se que este tipo é deixado para ser alinhado à esquerda e ao fundo. No entanto, você pode, um, amendoim do fundo. E se você quiser, se você quiser que este elemento seja, fique no centro, você pode colocá-lo no centro verticalmente e, hum, para os próximos elementos. Este, por exemplo, também foi para o fundo e para a direita, você pode ampliá-lo de baixo. Isso tem que ser consertado, trigo e couro fixo. Então vamos fazer isso. E para a Ordem Geral, este componente realmente está aqui. Então esta é a seção de linha e tem corrigido com e corrigir altura também. E você nem precisa necessariamente dizer o significado para a esquerda e para a direita para este componente para redimensionar porque re tamanho é por padrão horizontalmente. Então este também vamos colocar a altura fixa aqui. E sim, eu acredito que isso é tudo para esses componentes na linha de configurações. Então agora você pode retornar para a instância e você pode voltar para esta tela geral. E como você pode ver tudo como escalas lindamente agora e senta-se neste mesmo lugar que você quer. Então, agora vamos verificar a ganância. Vamos pressionar o controle, G. E vamos redimensioná-lo para que esteja perfeitamente alinhado com a nossa ganância. E também você pode alterar o layout, como você pode ver por enquanto para cada arte. Mas temos diferentes configurações de layouts e para essas placas de arte horizontais, você pode ir para a visualização e agora ativar as configurações de layout novamente para alterar as configurações de layout. E você pode, por exemplo, alterar o número de colunas agora para seis colunas e ajustar os martins de acordo. Ou você pode simplesmente ignorá-lo para os layouts móveis. Como te disse , , não é tão necessário. Então vamos selecionar outra tela e esta outra tela. Vamos dar uma olhada nas configurações do artigo em vez de alterar a largura e a altura. Você também pode clicar neste botão para mudar a orientação para horizontal, e é muito mais fácil. Então agora isso está tentando mudar a posição e o tamanho que eles escondem, especialmente fora deste elemento. E, como você pode ver esta versão normal fora das escalas superiores perfeitamente, bem como dissemos que essas opções de redimensionamento Inc agora que tornam este fundo mais amplo e também o que eu vou fazer, eu vou apenas mudar esses ícones para aparecer para a direita fora da nossa escala de temperatura. E como você pode ver, esta é uma pequena correção que permitirá que você crie essa visão horizontal. Então, como você pode ver, não é uma grande dor criar esses layouts horizontais e adaptar-se a diferentes orientações de tela . E às vezes é menos trabalho. Às vezes você precisa cavar mais fundo, no entanto, se você criar seus símbolos para que esses símbolos recitem corretamente para diferentes resoluções , e é ao mesmo tempo fácil e agradável Agora. Se quer Teoh, pratique um pouco. Use esta primeira tela, e você pode, por exemplo, fazer nove ou seis linhas desses dispositivos e tentar recriar a orientação, a orientação horizontal fora do dispositivo. Bem, agora vou me concentrar na versão tablet, e é um pouco semelhante. E aqui vai mais uma coisa que eu gosto que você saiba. Então, se você duplicar o furo da arte, então se você está duplicando o nosso barco agora alterando os valores fora do tamanho deste nosso barco ou, por exemplo, definindo-o para ser o valor do iPod ou o valor do iPhone. Você sempre tem os mesmos símbolos aqui, então os símbolos não mudam. Você só faz uma segunda instância deste símbolo na visualização do tablet, no entanto, entanto, se você pressionar A para um tabuleiro Arthur e se você criar arte nascida de tal forma e então você copia e cola para que você venha e veja e venha em V esses elementos entre as placas de arte se você voltar para seus símbolos. Você terá novos símbolos aparecendo lá, então isso cria os novos símbolos. E às vezes você pode querer que esses novos símbolos sejam diferentes na versão tablet e em suas versões móveis. Então isso pode ser útil. Mas às vezes você só precisa trabalhar nos mesmos símbolos, e eu geralmente prefiro trabalhar com o mesmo símbolo. Então eu estou duplicando o layout, os motores de popa, e então mudar o tamanho de acordo. E agora posso selecionar tudo o que tenho aqui. E a primeira abordagem para o tablet é tão simples porque você simplesmente altera o tamanho dos itens. E se você tem tudo disse bem em suas opções de dimensionamento re, como você pode ver, tudo é quase perfeito no tablet também. Talvez nós precisamos ajustar o alinhamento fora deste campo de texto, bem como os itens para que eles disseram diretamente no meio fora da linha. Então vamos eleger o campo de texto de música, e vamos garantir que isso está no meio do nosso componente. Agora, se voltarmos para a instância como você pode ver, tudo fica no centro, agora podemos modificar a altura dos elementos e provavelmente Agora eles olham para o seu melhor tão bem que você pode fazer. Se você quiser ajustar coisas como tamanhos divertidos ou cores entre esses layouts para tablets e dispositivos móveis , você precisa ter uma versão diferente desses símbolos. Então lembre-se de ter sempre um comando C Command V. Se você quiser, por exemplo, modificar um tamanho divertido no símbolo entre essas versões. Por enquanto, vamos duplicar este quadro de arte e vamos mudar a largura e altura assim que temos. Os resultados estão desativados. Os comprimidos se colocam e, basicamente, existem duas abordagens. Teoh cria coisas. Layout tablet. Normalmente, você usa todos os componentes do layout móvel e os dimensiona. Então, por exemplo, você tem os componentes de largura total. Mas melhor abordagem, eu acredito, como usar o espaço total fora do tablet. E há muito mais. Picos são muito mais imóveis fora de sua tela para que você possa pensar sobre isso. E, por exemplo, vamos copiar essas configurações novamente da nossa visualização móvel e vamos colocá-lo à direita para o lado esquerdo desta visualização tablet, e isso nos faz ver todos os itens. Claramente, no entanto, para a direita. Temos muito espaço para que, por exemplo, possamos criar um retângulo como espaço reservado para mais alguns itens. E você pode colocar mais itens aqui. Ou, por exemplo, se você for para essa definição de configurações de modo. Por exemplo, se você inserir Good Morning World ou Boas Noites, você terá todas as configurações adicionais em uma tela. Então é assim que você pode usar fazendo uso fora deste imobiliário tela extra. E, na verdade, neste layout vertical, podemos fazer o mesmo, então vamos torná-lo um pouco menor em termos de semana fora. Agora vamos mudar a altura também, e tudo é legível porque você tem os mesmos tamanhos de telefone. Você tem ainda mais espaço em branco entre esses itens. E agora você pode usar mais velho um lugar que você tem o lado direito fora deste menos e fazer este retângulo que vai thats jogar, por exemplo, algumas opções adicionais ou algumas outras opções de suas configurações. Agora vamos fazer alterações de acordo. E como você pode ver, esta é a abordagem móvel e tablet em orientações de tela horizontal e vertical. Então não vamos fazer todo o layout dessa maneira. Se você quiser praticar, você pode fazê-lo e usar nossas finanças para converter tudo em aqueles uso responsivo horizontal e vertical , bem como você pode. Pense fora da versão desktop, no entanto, por favor, leve em consideração que essas versões móveis são bastante semelhantes em termos de como os usuários realmente se aproxima de dispositivos. Eles os usaram em um ambiente similar. Eles têm o mesmo em botas para que eles possam usar gestos, bem como os dedos para navegar e deslizar, e você tem que levá-lo em conta. Então, por exemplo, você cria batalhas para serem um pouco maiores. Enquanto na área de trabalho você tem, AH, ambiente diferente e diferentes dispositivos de entrada. Você tem teclado, bem como mouse. Portanto, tenha em mente que você não precisa necessariamente Theo exatamente as mesmas opções em ambos os dispositivos ou dispositivos móveis e na área de trabalho. Em vez disso, você gostaria de pensar em Vesta como algo que é mais avançado e lhe dá mais controle sobre sua casa inteligente. Por exemplo, enquanto no celular você tem todas as ações mais antigas, necessárias que estão conectadas, por exemplo, onde um qual é a sua localização em casa, em que tipo de dispositivos e ações você deseja executar na melhor das hipóteses, opressão será mais para gerenciar todos esses dispositivos e executar, executar todas essas configurações, acessar opções mais avançadas de sua esperança. Então, sim, é basicamente isso. diz respeito a essas fitas considerando diferentes orientações, tamanhos de tela estão em causa. Por favor. Lembre-se também de manter seus ativos de alta qualidade, o que significa que você precisa de conta para mapas de batida de alta qualidade se você usá-los, e também usar vetores, tanto quanto possível. Então, essas agendas nativas, bem como importar vetores de ilustrador ou outras aplicações, como ícones, são This Is it por enquanto. Obrigado por assistir e vejo você na próxima lição. 47. Introdução à marela: Olá e bem-vindos à próxima lição. E eu tenho boas notícias porque nosso layout em esboços quase pronto. Então agora vamos criar algo que é chamado de protótipos rápidos. Vamos dar um usuário e capacidade de alternar entre nossos barcos de arte e ver diferentes transições, bem como navegar como este aplicativo mais vida vamos usar Marvel para fazer isso. Como você pode ver, minha interface de esboço há um bloqueio maravilha instalado já. Então você pode ao leste da maravilha Blufgan de Marvel up dot com. E aqui você também precisa criar uma conta. Esta conta é gratuita para depois de dois projetos. Então isso se adapta às nossas necessidades por enquanto. E vamos criar um novo projeto. Eu vou como o fundo do projeto riacho. E aqui precisamos digitar o nome home up para o nosso projeto irá selecionar iPhone sete como nosso dispositivo. E por favor saiba que esta resolução é para resolução X e temos o nosso projeto em uma resolução x. Então vamos ajustá-lo mais tarde, e agora você pode adicionar imagens diretamente para o seu acampamento a partir do seu computador. Você pode ir para esta visão de design, e na Marvel, você também pode facilmente protótipo. No entanto, a melhor opção que podemos ter agora é baixar o esboço Blufgan e instalá-lo dentro de nossa programação. Agora podemos ir ao esboço e usar este plugging para exportar o diretor do quadro de arte Toe Marvel. Então você nem tem Teoh. Você nem precisa exportar. Esses são construídos. Uma intimação, três incêndios ou algo assim. Você simplesmente usa este blog maravilhoso, e você simplesmente afundar selecionado nossas placas ou você acha que todas as nossas placas que estão em sua página. Então vamos agora afundar a partir da página inicial. Eu estou indo. É como pensar tudo e lá. Como você pode ver que você tem essas configurações de exportação que você precisa Teoh, Selecione o projeto direitos. Então esta é a nossa casa e agora você precisa exatamente como a escala. Então, como eu mencionei, nós projetamos em uma escala X. No entanto, para Marvel, precisamos nos adaptar a dois x caso. Então vamos para ovos e você pode até mesmo ir para livre X Você se você tem um iPhone sete plus ou você tem alguns dispositivos Android com alta densidade este lugar, você pode ir livre. Saída três dúzias mãe e isso é porque temos ativos de alta qualidade dentro, como consequentemente bater mapas, bem como vetores. Mas para este projeto, vamos começar a ovos, e isso é o suficiente. Agora dissemos, Selecione exportação e está exportando e carregando. Não são pranchas diretamente para se maravilhar. E como podem ver, esta linda animação está aqui. E também o progresso que já carregamos para fora de cinco artigos. Agora está terminado, e podemos voltar para a Marvel e em nossa casa, um projeto que já temos essas telas por enquanto vamos reorganizar essas telas para que elas estejam em ordem incorreta. E como podem ver, temos 750 por 13 34 lados. Então isso é perfeitamente correto para a nossa escala de dois X. E também há um “up “que eu conduzo que podemos definir. Então vamos criar um retângulo aqui, e eu vou dizer que o tamanho de 20 por 120 e dentro deste Congo vermelho, nós vamos criar uma imagem simples, simples para que possamos ter este lindo eu vim Agora vamos selecionar um para abortar arte e vamos selecionar um cartão em torno de nossa seleção. Então em torno de nossa forma e dentro desta arte. Mas vamos colocar, por exemplo, por exemplo, esta foto fora das nossas casas inteligentes. Vamos colocá-lo lá e deixe-me ter certeza que isso está dentro dos meus novos audíveis. Vamos torná-lo um pouco menor. Eu preciso selecionar esta foto dentro da mesquita, e este pequeno ícone será muito útil se você, por exemplo, enviou isso para um cliente e o cliente irá instalar este protótipo em seu telefone, e este pequeno ícone será exibido como o ícone da nossa aplicação. Então, isso é muito bom. Se você disse o nome para isso como eu poderia ser exportação de ONG, agora você pode selecionar este ícone e importá-lo diretamente para a Marvel. Então agora temos quase tudo. Quero dizer, da primeira página. Agora vamos voltar ao esboço, e precisamos exportar algumas outras páginas. Então vamos mudar para General e vamos cantar os quadros de arte aqui. Então eu não vou pensar em todas as placas de arte porque eu tenho essas versões responsivas aqui. Então vamos mudar clique sobre os nomes do quadro de arte que eu não vou re exportar. E agora eu tenho aqueles primeiro libertar nosso barco selecionado para que Select Sing selecionado. Tenho todos os setores corretos. Agora vamos fazer upload. Isso é para se maravilhar. E durante o upload, você também pode trabalhar com dentro esboçado um enfraquecido ir para a próxima página e da vista de ações queremos Teoh upload. São portos também. Temos que fazer quadros de arte aqui. Agora vamos para o quarto. E agora vamos afundar todos os quadros de arte que temos aqui. Então vamos afundar nossos pássaros. E, a propósito, você também pode selecionar todas as placas e colocá-las em uma página para que seja mais fácil. Você não tem que clicar tanto do que pensar, quer e cada um nosso conselho. Nosso barco é selecionado como eu disse. É sempre melhor ter algumas páginas em seu comando de agendamento, especialmente se você tiver muitas placas de arte para que você tenha um melhor desempenho fora do esboço. E agora vamos cantar. Não são placas do CCTV e podemos voltar à maravilha. Então agora as últimas telas estão carregando e dentro da Marvel. Em um segundo, vamos criar pontos quentes, bem como links e transições entre essas telas. No entanto, primeira coisa que precisamos fazer é reorganizar e reposicionar Esses são barcos para que eles apareçam na ordem correta. Então, agora vamos verificar isso. As tábuas são do nosso quarto e vamos movê-las. Então este é o primeiro barco de arte a sair da sala. Este vai para lá. Isto é um alarme, e acredito que todos os outros quadros de arte estão na posição correcta. Então temos ações aqui, então tudo parece muito necessário. Vamos acessar as configurações do projeto para que você possa ver que você pode alterar o projeto e o tipo de dispositivo. Você pode ir para este segundo topo geral e, por exemplo, aqui você pode ativar comentários, bem como notificações sobre notificações sobre novos comentários . Então você tem, ah, segurança. Você pode proteger seu protótipo por senha e também você tem o topo de integração. Então, se você pode encontrar este caso blogando, lá está ele. E também você pode baixar o blog, bem como conectar isso para a conta slack. E então você pode compartilhar os protótipos direcionados para seus canais de folga e para sua equipe. Agora há ir para compartilhar preferências que você tem aqui a menina que você pode copiar e colar. Você pode enviá-lo por e-mail ou SMS. Nós vamos extorquir isso mais tarde, e uma boa opção aqui também é teste de usuário. Você pode realmente registrar os comportamentos dos usuários que usam seu protótipo agora, modo que é basicamente comer tanto quanto organização e configurações estão em causa. Vamos voltar ao esboço em Lembre-se de que você sempre pode testar e executar seu protótipo de dentro do esboço também. Se você pressionar esta pequena batalha no gabar-se da Marvel, você pode ter seu irmão protótipo Diepraam diretamente do esboço. Aqui, você pode gravar. Você também pode compartilhá-lo, e nós fazemos isso mais tarde. Há também mais uma grande característica fora das maravilhas conectando você pode fazer qualquer alteração em seu layout catch neste quadro de arte. Então, por exemplo, vamos selecionar esses retângulos e vamos quais as fotos. Então agora eu tenho essas fotos diferentes nas câmeras e tudo que você precisa fazer para cantar isso Nosso barco é selecioná-lo e selecionar pia selecionado selecionar o mesmo projeto, e agora o barco de arte é trocado dentro da Marvel. Então imagine que você criou um protótipo, e nesta tela você já fez alguns links. Algumas transições esportivas quentes Você não tem que apagar tudo isso. Você só precisa atualizar no esboço e dizendo que este outro barco selecionado para este ativo gráfico para trocar sob o capô. E isso é muito legal. Então você tem essa integração ao vivo perfeita entre esboço e maravilha, e é isso por enquanto. Vejo você na próxima lição. 48. Como definir os hotspots e transições: Aqui estamos na Marvel. Temos telas de captura mais antigas importantes em maravilha, e agora podemos selecionar o primeiro fluxo e vamos para o Mozart tudo. Vamos selecionar editar e agora você pode criar seu protótipo rápido. Então, basicamente, prototipagem rápida é tudo sobre a criação dos chamados esportes inteiros que são basicamente os links entre suas páginas e entre suas telas. Você também tem a opção de ter uma urze festa aqui, e também você pode ter o rodapé fixo. Então, basicamente, você pode congelar alguma parte do seu gráfico para que quando você rolar a outra parte, ela não se mova, e é isso. Então, para a nossa primeira rua, vamos criar basicamente pontos quentes aqui porque queremos simular que alguém usou seu dedo para desbloquear o aplicativo, bem como precisamos simular a ação para ir para digitação impossível. Então vamos criar o primeiro esporte de cavalo, e você faz isso simplesmente desenhando sobre sua tela. Então vamos torná-lo grande o suficiente para que você possa alcançá-lo com o dedo. E agora vamos selecionar o destino do hospital tão possível. Destino é basicamente a tela que aparecerá após o usuário executar alguma ação sobre todo este esporte, e como você pode ver, você tem os tops aqui, e você também pode ajustar o topo de ação. Então isso é dito para clicar ou topo, e esta é basicamente a opção padrão. No entanto, como você pode ver, você pode selecionar o mouse contra. Vamos por que ser e você tem deslizando para a esquerda para cima, para baixo você tem mudando, e você também tem este top duplo. Então vamos ficar com este riacho ou topo. E agora vamos para a segunda facada, que é a transição da tela. Podemos definir diferentes transições de tela para cada hot spots para que você possa saber qual é o padrão. Mas você também pode deslizar de cabeça para baixo. Você poderia papa dormir, e, como você pode ver por que, pairando sobre esses ícones, você tem uma bela animações que irá mostrar-lhe como esta outra tela vai aparecer. E basicamente podemos sentar e dormir, e esta é a animação na próxima rua. Então, quando o usuário toca em todo este esporte, ele vai dormir dedo do pé uma tela inicial aberta. Agora vamos criar outro ponto quente. Então nós temos o 2º 1 nesta página e vamos para a tela de registro agora. A transição será deslizada para cima. Então este outro S Creen foi como de baixo e ele vai subir agora vamos para a ação e vamos selecionar a ação padrão também. Agora você pode jogar este protótipo. Então vamos visualizar esse protótipo em outra janela. E vamos grego neste primeiro ponto quente que temos aqui. Lá vai você. A partir daí, não podemos voltar para a primeira tela do nosso protótipo. Então vamos voltar para a tela. E basicamente, se terminarmos nosso trabalho com a tela, podemos pressionar para baixo. E lá estamos nós na lista. Fora das ruas. Podemos selecionar qualquer outra string para edição, mas você pode ficar dentro desta tela. E aí você tem as flechas para a direita ou para a esquerda. Além disso, você pode usar suas setas no teclado para alternar para a próxima página. E como podem ver, esta é a página 2 da 17 e esta é a senha do Logan. Então vamos criar algum ponto quente lá. Eu vou criar hot spot no retorno, e a partir deste hot spot também irá para a primeira tela fora do nosso aplicativo, que é tela inicial aberta. Então vamos selecionar a tela agora a transição de tela, bem como ações, então a transição de tela vai ser flip e ação vai deixar padrões. Então, depois de clicar ou tocar, vamos para esta tela. Vamos para o próximo, que é o primeiro anel do nosso aplicativo, e ele terá alguns pontos quentes aqui. Então vamos selecionar o primeiro e desenhar o 1º 1 Talvez, vamos rolar câmeras hot spot, e você sempre cumprimentar quente ambos para que eles são um pouco maiores do que os ícones. Então, se você tiver espaço em seu layout, basta criar um ponto de acesso maior para que um usuário possa alcançá-lo facilmente. Agora nós dissemos a tela CC TV e talvez vamos selecionar Philippe s transição aqui também. Agora vamos criar outro ponto quente, e agora este esporte quente será quatro slides para abrir ação. Nós vamos fazê-lo para que ele cobre quase toda a tela para que você possa deslizar em qualquer lugar e você pode ir para a página principal do nosso aplicativo, que acontece a ser a arte geral a bordo. Então vamos como o General Outboard e agora podemos definir a transição. Então, se você deslizar para a direita, você vai ter empurrado para a esquerda. Provavelmente. Certo, empurre para a esquerda serve. E vamos para as ações. E vamos mudar de cima para deslizar para a direita? E por que deslizar chorou, devemos ir para esta página muito geral e principal fora da nossa aplicação. Vamos ver se funciona. Vamos tocar este protótipo. Vamos deslizá-lo. E lá temos nossa tela na pista, e eu acredito que isso é quase tudo o que podemos espremer com essas técnicas rápidas de prototipagem . Então vamos para a próxima tela. E esta é a tela de aviso, aviso de tela inicial e basicamente isso é realmente o mesmo que esta cadeia de caracteres inicial aberta. Então o que basicamente podemos fazer é duplicar esses pontos quentes. Vamos fazer isso detém cerca de um pouco menor para que eu possa acessar a opção duplicada para os hot spots da câmera e vamos clicar em Duplicar. E agora vamos selecionar Aqueles são barcos, então queremos duplicá-lo para aviso de tela inicial, bem como tela inicial aberta. Isso é como duplicado em nossas pranchas de graça e aí está. Agora nós podemos fazer este maior novamente, e talvez, por que lá também, e você quer duplicar este para que possamos duplicar e vamos para o próximo e o próximo e vamos duplicar. Então é isso. Temos mais duas telas. Prepara este com aviso e esta tela aberta. Vamos para a tela seis, que é geral. Esta tela geral provavelmente terá alguns esportes de espera aqui para ações. E vamos selecionar a exibição de ações. Esta é a ação. Selecione o nosso quadro e vamos escolher a ação. Legalmente incumprimento. Essa é a sua transição. Vamos lutar aqui por todas as telas por todos os ícones que teremos um simples desvanecimento. Então vamos selecionar os próximos dispositivos, Vamos como dispositivos e vamos para a transição de tela. Vamos eleger o destino agora. Não temos energia. Na verdade, não fizemos isso, então vamos eleger CCTV, CCTV. Há câmeras que temos em algum lugar lá. Vamos para câmeras com transição de tela fora da luta, e eu acredito que é quase isso. Também precisamos criar um hospital que vá para essas seções de configuração. Então, vamos selecionar as configurações e, neste caso, a transição será a suspensão. E, finalmente, vamos desenhar outro último ponto quente nesta página. Este será o dedo do pé quente do lado esquerdo do nosso topo, e vamos usar todo esse esporte para ligar o dedo do pé esta tela inicial aberta. No entanto, você também pode levar à tela de carregamento. E lá você tem algumas outras opções, como vinculado à última página visitada, e vai usá-lo para as setas aqui mais tarde, bem como você pode vincular ao seu ou M, mas algo que você também pode ter esta opção para rolar para um bis, e isso vai marcar. Se você tem umatela longa e vertical, tela longa e vertical, você pode rolar para qualquer posição nesta tela vertical, e você também pode manter essa posição de corvo para que usemos isso mais tarde. Agora que selecione tela inicial aberta. E é isso para esta tela. Essa mudança para a próxima tela. Você também pode pressionar a seta para a direita no teclado para ir para o próximo trem, e aqui estamos na tela de dispositivos. Então isso é bastante interessante, porque na tela dos dispositivos temos uma altura que é mais alta, na verdade, na verdade, do que a tela do nosso iPhone do que o nosso dispositivo. Então vamos usar esta urze fixa aqui. Bem, talvez primeiro vamos para a pré-visualização deste protótipo, e vamos ver como ele fica sem a correção Heather, para que você possa comparar como ele se comporta. Agora vamos tentar rolar essa exibição. E como você pode ver, temos uma barra de rolagem aqui e podemos facilmente rolar a vista, bem como poderíamos deslizá-la no dispositivo móvel. E agora queremos manter este dispositivo elementos, esta parada que temos que, que é fixado no topo e o resto da tela está se movendo sob este elemento. Então agora vamos voltar para o protótipo e vamos selecionar a correção Heather para que ele termine neste mesmo pixel. Temos esta 178 semanas e vamos cortá-la bem ali. Então vamos visualizar o protótipo, e agora você pode ver que onde você está rolando, você tem esse comportamento como esperado. Assim podemos ter essa área de urze fixa. Agora vamos criar o link para o último lado visitado, e vamos também criar vinculado à propriedade. Então esta é a tela de configuração Agora vamos dizer que a transição do destino aqui ou na verdade nós tivemos essa transição flip, então vamos passar para a transição da frota. E agora vamos para a próxima tela. Então, a oitava tela. Temos configurações aqui e precisamos, Feek disse. A festa Heather, porque a tela também é maior do que as coisas iPhones agora vamos criar um hospital ou podemos voltar para a sétima tela. E agora vamos duplicar todo esse ponto que vai para a tela anterior, e podemos fazer isso para todas as telas que têm esse fundo aqui no topo. Então vamos configurá-lo para todas essas telas e vamos duplicá-lo no seis vinco. Eu seleciono essa opção, e agora na tela, já temos esse ponto quente. Então vamos passar para a próxima arte a bordo. E lá temos Ações são placa. Vamos criar um ponto quente aqui, e pode ser bem grande, então leva a essa ação. Selecione Copiar. Nós daríamos o nome fora da tela, mas é basicamente a visão única da ação, e agora vamos ter talvez uma transição pop. Acho que é legal, então vamos fechá-lo e vamos para o próximo. Temos o 10º Art Board e aqui temos essa ação de parar. Então vamos criar um ponto quente. Isso é ser o suficiente. E isso voltará à nossa ação. Selecione Archibald. Certo, e vamos para a transição da tela. E vamos selecionar talvez desta vez em, você sabe, você sabe, ligeira de cabeça para baixo, mas talvez leve, leve transição para baixo. Agora vamos para a próxima tela e esta é a tela da sala. Então, temos quarto. Nós nem precisamos ter urze fixa ou comida fixa, er, er, e isso é porque esta tela combina com iPhones, altura e trigo. No entanto, vamos criar pontos quentes para o menu e vamos fazê-lo maneira inteligente. Então vamos como transições e vamos para tela fixa. Seja como for que vamos fazer aqui, vamos duplicar este dedo do pé de Hartsburg todas as outras telas, mas a lâmpada. Então vamos ter cortinas e também alarme, bem como censo que eu copiei e lá está. Agora vamos criar outro ponto quente para as cortinas. Ah, e a propósito, na verdade, se voltarmos atrás e tentarmos editar esse ponto quente que temos aqui, por exemplo, tentamos liderá-lo. Você tem a opção de excluir isso dessa imagem específica. Tudo o que você pode excluí-lo de todas as instâncias. Então, de todas as imagens agora vamos criar outra. Vou desenhar um ponto quente para cortinas que selecionam cortinas e vamos duplicar, então precisamos duplicar de novo. Antes disso, aplicamos a transição fora da fé. Vamos duplicar todos os ecrãs do nosso quarto em vez das cortinas. Agora vamos para o alarme. O alarme vai ligado a esta tela de alarme que selecionou. Vou definir a tela adequada aqui e vamos para a transição. Antes de duplicarmos, vamos ter fé também. Assim, combater a transição neste muitos na parte inferior irá realmente gerar esse efeito fora, alterando o destaque fora de ícones individuais. E eu acredito que esta transição de desvanecimento vai ser bastante agradável porque nós temos este efeito menu do que isso. Vamos ter outro, e vamos duplicar cada tela em vez de telas de censo ou cortinas. Temos caroços e alarme também, e também temos este último hospital. Mas precisamos ter esses pontos na outra tela, então vamos mudar para o próximo e vamos criar um ponto quente aqui. Isso realmente vai para a tela principal fora do quarto. Então a tela de temperatura com efeito Fay e vamos duplicar para telas OLED sobre a tela de temperatura. Então é legal lá, ali e ali, rápido, rápido e duplicado. Certo, acredito que estamos prontos para todas essas telas. Então, sim, provavelmente vai precisar de outros pontos quentes aqui. Mas não, acho que não. Então o quarto está basicamente feito, e nós não vamos fazer isso. Marque as caixas aqui. Nem vamos tentar realizar nenhum dos gestos de deslizamento. Isso porque dentro do que prototipagem rápida simplesmente não pode fazê-lo, é muito mais fácil criar protótipos comigo. Direções crescentes que temos em software como Diretor Flint ou talvez Origami, mas não lá. Aqui temos sempre apenas algumas transições básicas entre as telas. Então, para essa tela 16 que vamos ter uma transição para configurações e vamos decidir sobre a transição de sono e agora, da visão da câmera, também terá as mesmas configurações parte em. Então, vamos duplicar. Talvez vamos selecionar a tela CC TV que estamos atrás e vamos como fazer entrar em telas e que meus amigos está fora do nosso trabalho aqui. Então nós fizemos com sucesso todos os links e todos os pontos quentes. Agora podemos ir para a próxima lição e visualizar nosso protótipo. 49. Protótipo de leitura: na lição anterior com as telas importantes, e também fizemos links e pontos de acesso entre nossas páginas. Agora é hora de testar o protótipo dentro da Marvel. Então vamos selecionar o jogo. Agora. Você pode ver seu protótipo, bem como uma tampa mo fora de um dispositivo de sua escolha. Então nós escolhemos o iPhone sete, e lá você pode ir para o menu, e de lá você pode ir para casa. Assim, também, a primeira tela, bem como exibir telas OLED. Por favor, lembrem-se dos atalhos. Idade é casa e G é o atalho que irá exibir todos os artigos que temos aqui , e você pode alternar entre eles e você pode visualizá-los em seu protótipo. Você também pode selecionar entre as setas para a esquerda e para a direita aqui para ir para a tela seguinte ou anterior bem como você pode pressionar você para a esquerda ou para a direita setas do teclado para fazer isso. Agora vamos voltar ao nosso protótipo, e se você decidir que deseja alterar a ordem das telas, você pode fazê-lo e então simplesmente você pode atualizar o protótipo. Então agora vamos usar nosso protótipo, e vamos tentar digitar uma senha que eu vou clicar no primeiro ponto de acesso. Como você pode ver, nós tivemos essa animação indo da parte inferior do dedo do pé no topo da nossa tela. E lá podemos definir a senha. By the way, se você clicar em qualquer lugar fora de qualquer um dos pontos quentes, você verá os pontos quentes anteriores. Então você verá todos os hospitais que estão nesta página específica, e você pode desativar isso passando pelas preferências, as configurações do seu tipo irmão. E aqui, na seção geral, você foi multado em esconderijo, ponto quente heenes, e você poderia permitir que isso escondesse todas as coisas que aparecem. Então agora vamos para a primeira página. Como você pode ver, nós tivemos essa animação flip. Temos a animação aqui também. Podemos voltar do CCTV. Agora podemos executar esta operação de slide para ir para a seção principal e vamos como para a direita agora temos esta tela indo da direita para a esquerda, e aqui temos cinco pontos quentes. E se formos para câmeras, por exemplo, o que é interessante aqui é que se você clicar no mesmo fundo, você voltará para a tela diferente agora. Então vamos para as configurações e o que mais podemos usar aqui. Talvez ações. Agora isso é grego no gol, ou qualquer um dentro dessas ações. Aqui temos um pergaminho. Então, como podem ver, temos que fazer alguns ajustes nos nossos protótipos. Disso, o cabeçalho é realmente fixo no topo. Então vamos voltar ao nosso protótipo. Vamos encontrar esta tela de assistir TV. Isto é acção. Selecione Kobe. Vamos editá-lo e selecionar corrigir Heather. Então agora nossa urze será colada no topo da tela. Eu simplesmente fiz o peito, e nós também precisamos atualizar nosso protótipo. Então agora, como você pode ver, estamos na mesma página e funciona como um encanto. Então vamos selecionar parar para voltar para a tela, e isso não é olhar para trás. E eu também preciso de mais uma correção no meu presidente, porque se eu selecionar os quartos aqui, eu preciso ir para aqueles ecrãs perder telas de quarto com configuração. Então vamos voltar ao seu tipo de irmão e editar esta tela. Ele realmente é. E vamos criar um ponto quente aqui para que eu possa ir diretamente para a primeira tela fora do quarto , que é a tela de temperatura, e eu seleciono burro ou talvez apenas como a transição. E a propósito, eu provavelmente posso selecionar. Talvez seja como a transição para a esquerda e talvez, vamos atualizá-la. Vamos para o quarto. E agora, como você pode ver, eu posso alternar entre essas páginas e este destino Transição é realmente muito bom porque ele me permite transição suave entre esses muitos itens. Se eu tivesse deslizando da esquerda ou da direita, não seria tão bom. Então essa transição do destino é muito legal. Mas agora eu preciso voltar das telas para a minha tela inicial novamente. Idade da imprensa. No entanto, eu também pode adicionar esta vista novamente, e eu posso criar hot spot aqui que irá para uma página inicial. Basicamente, este este hot spots pode aparecer bem em todas as outras telas que eu tenho. Então vamos como uma transição, talvez empurrar para a direita e vamos tentar duplicar isso para que ele fique fora de nossas telas. Eu vou selecionar todas as telas em vez da tela principal para que ele não volte para si mesmo, e eu vou duplicar isso em todas as 16 telas do meu protótipo. Então agora é como a garrafa duplicada e vamos voltar para a nossa pré-visualização. Obviamente, precisamos atualizar a visualização, mas agora nosso protótipo está terminado e podemos pensar em qualquer lugar no topo para ir para a página principal e da página principal enquanto falamos no topo. Temos esta transição da direita para a esquerda fora do nosso quarto. Agora vamos voltar ao esboço e da vangloria da Marvel, se você selecionar jogar no cronograma, também tem este protótipo, e esta é uma visão ao vivo. Então, se você alterar alguma coisa no esboço, ele irá atualizar de acordo nesta visão, para que possamos sempre pressionar para casa novamente. Verifique como funciona o seu protótipo e todas as transições que definimos dentro. Marvel como você pode ver tudo, há outra coisa que você tem aqui é um link de cópia comum para que você possa copiar este link para um conselho judicial, e então você pode colá-lo para folga ou para um e-mail para o seu colega, e ele ou ela pode visualizá-lo dentro de um navegador para que ele nem precise ter um esboço ou conta da Marvel. Então você pode gravar. E como você pode ver, todas as ações que temos aqui estão sendo gravadas em um arquivo de filme que você pode enviar também. E é assim que a Marvel funciona. Então nosso protótipo está pronto. Espero que você se divirta bem, e eu vejo na próxima lição com algumas configurações de exportação e íngremes, ver mais tarde. 50. Como usar o esboço: Olá. É bom vê-lo aqui, infelizmente, na infelizmente, última lição deste material. No entanto, a boa notícia é que você aprendeu tanto para fora do discurso e que eu vou mostrar algumas outras características legais fora do esboço nesta lição. Então vamos falar sobre exportação, bem como sobre a influência do esboço. Se você estiver exportando este projeto para Colding, você deve sempre consultá-lo com um front e desenvolvedor ou um desenvolvedor fora de seu aplicativo . No entanto, em esboçado sempre manterá os mesmos padrões, e ele sempre usará as mesmas funções. Normalmente eu vou para o meu espaço de símbolos onde todos os meus símbolos são Arditti organizados e a maioria desses símbolos que eu vou exportar. Então eu posso até selecionar muitas camadas de uma só vez e, em seguida, gelo como as configurações de exportação. Primeiro eu clique em fazer parte inferior exportável e agora eu posso dizer que as configurações de exportação. Então você já sabe que se você tem P e G, você obviamente vai para exportar tamanhos diferentes, por exemplo, eu descanso E se você vai para preferências então você pressionar o comando coma, você sempre pode acessar essa opção presets. E aqui você pode adicionar suas próprias predefinições. Você pode, por exemplo, ter uma predefinição web fora de um X e dois X, bem como, com algum prefixo e sufixo é e você só vai mais adicionado à sua seção de predefinição. Agora a próxima coisa são os quatro meses e por quatro meses obviamente você vai precisar dessas escalas Onley no caso de você está exportando mapas de batida e se você puder, você sempre exportar como VG se eu assim você sempre ficar com lutas vetoriais. E a menos que você realmente sabe o que você está fazendo, você não quer exportar SVG e Norma dois X e livre X. Você sempre furar um spg e na escala fora de um X e, em seguida, este arquivo svg com escala perfeitamente para resolução diferente mesmo bater Fatores da caverna Biggers. Por favor, lembre-se que se você fizer qualquer fatias ou se você microfone camadas exportáveis, você sempre pode clicar neste botão de exportação e exportar tudo de uma só vez. Você até tem essa balança aqui e todas as informações sobre os quatro meses. Então, e depois pense que você deve se lembrar é que se você quiser Teoh, pegue um pouco de frio spg, por exemplo, este ícone você pode fazê-lo clicando com o botão direito neste ícone, e lá você terá a opção de Copiar SVG Co. Então, às vezes , se você perguntar, seu desenvolvedor aqui apenas exigia código SPG para colar em, por exemplo, código X ou colocar em HTML para tê-lo no site. Você nem precisa exportar seus incêndios SPG, mas apenas basear o casaco. A próxima coisa é co PCs como atributos como bordas, cores, tamanhos de telefone. Lembre-se que está tudo aqui e você pode Kobe que e colar diretamente a sua frente de desenvolvedores, por exemplo, e algumas outras ferramentas lhe permitirá fazê-lo ainda melhor. E isso é chamado de entrega. Então, por favor, dê uma olhada na mão da seção fora dos tutoriais, e então você verá algumas ferramentas diferentes como uma muda, ou tem um código que irá que você cooperar com os desenvolvedores ainda mais fácil e eficaz. Agora vamos explorar outro recurso de esboço, que é a nuvem esboçada. Mas primeiro, vamos à direita. Clique na barra de ferramentas e lembre-se que você sempre pode personalizar este Tober, e se você não vir este ícone de captura nuvem, você pode obtê-lo a partir daí. E lembre-se também que você sempre pode alterar este ícone e texto para ser, por exemplo, apenas ícones ou apenas texto. E eu acredito que você já conhece todas as funções que estão aqui para que você possa economizar algum espaço dentro do seu monitor. Agora, antes de clicar neste pequeno ícone, vamos para esboçar preferências pressionando co mês coma e vamos para a seção nuvem . Como você pode ver, essas são configurações de conta, e essa é a mesma conta que você usou para se inscrever. Esboço. Você não precisa do dedo do pé. Solicite quaisquer serviços adicionais ou pague extra por este serviço. Você acabou de incluí-lo com sua assinatura de esboço. Então isso é riacho na nuvem, e lá você pode compartilhar este documento dentro da nuvem. Agora você pode dizer a senha para que o seu documento é seguro e, em seguida, você clicar na batalha de upload. Agora o documento está carregando para a nuvem, e levará um tempo porque este é um documento bastante grande. Então vamos para a nuvem agendada enquanto isso, e vamos ver como ele fica no amor esboço. Portanto, se você tiver algum documento aqui, eles aparecerão em uma conta de nuvem agendada. Agora o nosso layout já está carregado para que possamos selecionar este link e podemos Kobe esta coisa e enviá-lo para qualquer um que pode colá-lo no navegador e pode pré-visualizar o seu projeto para que ele ou ela não tenha que pegar instalado porque tudo está dentro de um navegador. E como você pode ver, aqui está nossa aplicação e todas as telas que temos aqui. Mas você também pode mudar Teoh páginas diferentes. Por exemplo, vamos para a página das câmeras, e agora você pode visualizar um dos quadros de arte. Você pode ir para o 2º 1 também, assim como você pode ver, é extremamente fácil compartilhá-lo. E também, isso é ótimo para uma apresentação de seu protótipo porque você não tem que exportar todos os arquivos PNG para furos de arte. Agora, se você for para a nuvem agendada, você terá todos os projetos aqui. Você pode gerenciar esses projetos. Você pode, por exemplo, alterar as configurações de privacidade ou alterar as senhas. Você também pode excluir este ativo, ea melhor coisa é, se você ativar este documentos Teoh ser sincronizado com a influência. Uma vez que será afundado o tempo todo, para que ele constantemente salva seus documentos. E depois ele envia as alterações para a nuvem para que na nuvem você tenha a versão mais recente do seu documento. E os links que você compartilha também estão sempre atualizados. Então isso significa que agora você tem uma cópia deste arquivo em seu disco rígido, e você sempre pode selecionar o arquivo e o dedo do rio e navegar todas essas versões com o histórico dentro do seu disco rígido. No entanto, a versão mais atual também permanece na nuvem, para que seja segura e você possa usá-la a qualquer momento. Ok, é isso por enquanto. Obrigado por sua atenção, e eu pego você na última lição para resumir este curso. 51. Outro: Olá aí. E bem-vindo a infelizmente última lição deste curso. Mas a boa notícia é que você já tem todo o conhecimento necessário para trabalhar eficientemente no esboço. Você sabe, todas as dicas e truques e todas as técnicas legais que vão permitir que você crie uma boa Web ou nosso jogo fora. Então eu espero que você se divertiu no discurso e também que você aprendeu muito e eu encorajá-lo a que outros cursos. Agora é um ótimo momento para cursos de prototipagem e mergulhar em ferramentas como Flint ou diretor. Ou, por exemplo, Framer. Espero que tenha gostado deste curso para mim. Isso foi muito legal, e foi muito divertido criá-lo para você. Espero que nos encontremos nos próximos cursos.