Hierarquia visual e espaçamento no webdesign | Gil Huybrecht | Skillshare
Menu
Pesquisar

Velocidade de reprodução


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

Hierarquia visual e espaçamento no webdesign

teacher avatar Gil Huybrecht, Ui & UX designer, Branding

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

      1:08

    • 2.

      Por que é importante a hierarquia visual?

      1:18

    • 3.

      Diferentes maneiras de contraste visual

      2:19

    • 4.

      Meu princípio de agrupamento

      2:58

    • 5.

      Whitespace e equilíbrio

      2:10

    • 6.

      Exercício: resumo /assunto

      0:53

    • 7.

      Exercício: was frames

      4:13

    • 8.

      Exercício: como fazer o design

      50:00

    • 9.

      Projeto de classe

      0:57

    • 10.

      Redonde

      0:46

    • 11.

      Ade de bônus: como fazer uma foto de lesson:

      3:19

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

10.441

Estudantes

142

Projetos

Sobre este curso

Primeiro, de nós por conferir o curso, que eu vai aprender algo sobre Meu nome é o Gil e sou a designer de experiência do usuário e de experiência do usuário.

Este curso é sobre a hierarquia visual no design e espaçamento. Vou ensinar quais as diferentes maneiras há de a hierarquia visual e como usar um espaçamento para criar um estilo mínimo de design de webdesign.

Primeiro, vou fazer uma pequena parte da teoria mas vamos para um exercício em que eu vou explicar como você pode usar essa teoria no seu trabalho. Este curso é para designers de início e intermediários que já têm o básico do photoshop para a parte de nossa parte.

No final do curso, você terá uma boa compreensão do que é a hierarquia e de espaçamento e você é capaz de usar no seu trabalho para criar um estilo de a de a de e a de a de a de uma forma de a sua de a de e a de que a de e a que é a ela a ver em seu design de a de e a de de a de e a que a ela de uma em a que ela é de um design de a de de de Vamos começar!

Conheça seu professor

Teacher Profile Image

Gil Huybrecht

Ui & UX designer, Branding

Professor

Hi everyone, my name is Gil Huybrecht. I'm a UI/UX designer & skateboarder from belgium. I have several years of experience designing websites and brands for various clients. Have a great day and let's make something awesome together!

Visualizar o perfil completo

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: Olá, todos. E bem-vindos ao meu primeiro compartilhamento de habilidades. Fechar em primeiro lugar, grandes coisas para verificar a classe. Espero que tenha aprendido algo hoje. Meu nome é Shell, e sou designer e skatista da Bélgica. Eu moro junto com a minha namorada são dois cães e nós também temos dois coelhos. Meu trabalho se concentra principalmente em um estilo limpo e minimalista para Web design. E é isso que vou te ensinar hoje. Esta classe é tudo sobre hierarquia visual e espaçamento no design. Eu vou falar sobre por que hierarquias visuais importantes as diferentes maneiras que definimos contrastes visuais e como usar grãos baseando-se para chegar a um estilo mínimo fora do Web design. Primeiro, vamos fazer pequenas partes da teoria. Mas então vamos para um exercício divertido onde explicarei como você pode usar uma teoria em seu próprio trabalho. Esta classe é para designers iniciantes e intermediários que já têm o básico de photoshop para baixo. Mas é claro, todos se juntarão a mim no final desta aula. Você terá uma boa compreensão da ira visual contra base, e você poderá usá-lo em seu próprio trabalho para criar um estilo mínimo de design . Então vamos começar 2. Por que é importante a hierarquia visual?: Ei, pessoal. E obrigado por se matricular na turma. Então, como eu disse na introdução, vamos começar com alguma teoria nisso. Primeiro ouça, vamos falar sobre a importância da hierarquia visual. Então, primeiro lugar, brancos, importância da hierarquia visual. Bem, hierarquia visual é importante para orientar um usuário para uma página da Web, por exemplo, usando títulos, legendas , parágrafos e assim por diante. Você pode tornar muito mais fácil para um usuário passar por uma página. Você tem que pensar sobre quais informações são as mais importantes para um usuário e colocar isso no título, por exemplo, como a legenda nas guloseimas. Se você der às pessoas um bloqueio maciço de mensagens de texto, as chances são de que 99 em cada 100 não vão se incomodar em lê-lo. Mas por que isso? Bem, isso é porque a maioria dos humanos são pensadores visuais e, sem dúvida, processadores. Aqui você pode ver um exemplo que eu fiz para deixar o ponto mais claro à esquerda. Temos um texto de bloqueio regular, e à direita, temos o mesmo texto. Mas este está dividido em parágrafos e títulos. A esquerda parece uma dor para começar a ler para mim, mas a direita parece muito mais convidativa para ler E por último, mas não menos importante para esta lição. Como definimos ou estabelecemos uma hierarquia visual enquanto fazemos isso usando contraste visual , mas mais sobre isso na próxima lição. 3. Diferentes maneiras de contraste visual: Então, como eu disse na lição anterior, estabelecemos hierarquia visual usando contraste visual. Nesta lição, eu vou percorrer as cinco diferentes formas de contraste visual seu tamanho, cor, alinhamento, caráter e, por último, mas não menos importante, animação. Primeiro você tem tamanho. Esta é provavelmente a forma mais utilizada de contraste visual. Como você vê, aquele que é maior em tamanho chama a maior atenção. Como você pode ver neste exemplo, ele é usado para o título, O título Gramps. Mais atenção do usuário porque é maior em tamanho. A segunda maneira de contraste visual. Estudioso. Este também é um muito popular. Como você vê, aquele que tem o carro mais brilhante chama a maior atenção. Você pode usar isso, por exemplo, em botões ou ações de cultura como você vê neste exemplo, eu trabalho principalmente com para tonificar núcleos como azul claro, cinza ou branco, e então eu uso, como uma cor brilhante para as ações de cultura. Dessa forma, o usuário pode facilmente entender quais partes são clicáveis e quais não são. O próximo é o alinhamento. Este não é tão usado como os anteriores, mas pode ser muito legal. Você vê que o círculo do meio não é a linha com os outros. Por causa disso, chama mais atenção para morrer. Neste exemplo, você vê que usar essa forma de contraste visual pode criar uma composição interessante e chamar a atenção para o texto. O 4º 1 é personagem. Isso pode ser um monte de coisas. Você vê. Eu escolhi para a redondeza da forma para fazê-lo chamar mais atenção. Mas também pode ser como textura, sombras e outros efeitos que o diferenciam do resto. Neste exemplo, você vê que o retângulo branco com sombra chama mais atenção por causa de seu caractere . O último é animação. Este pode ser muito poderoso. Se você usá-lo corretamente, você pode ver que o Círculo Médio chama a atenção por causa de seu movimento. Neste exemplo, eu não queria usar texto em imagens, mas eu queria manter a sensação de férias. Então eu mostrei pela primeira vez uma imagem completa com a parte inferior e então eu revelo para vocês I com animação, você pode chamar a atenção para objetos, fazer as luzes para carregar animações, e por isso é muito legal. Mas é fácil exagerar rapidamente, então mantenha a animação resolver 4. Meu princípio de agrupamento: nesta lição, eu vou explicar como eu agrupo elementos e como eu organizei esses grupos para obter um tubo mínimo em seu design. Então, primeiro, o importante a manter na parte de trás da sua cabeça é que você tem que ver elementos como grupos. Mas isso se tornará mais claro no final deste Escutem. Então ele recebeu um exemplo simples que eu fiz com na imagem esquerda e à direita, temos sufocar e um parágrafo. Então, se dermos uma olhada em como eu agrupo esses assuntos, podemos ver que eu costumava usar retângulos azuis aqui para mostrar a esquerda e a direita da composição. As grandes linhas seriam onde os britânicos do lado esquerdo, nós temos apenas um elemento, então isso é um simples na imagem. Mas à direita, temos dois elementos. O título e o parágrafo. O lugar da onda esses objetos é o seguinte. Você olha para o título e o parágrafo como um todo, como se fossem um grupo. Então você apenas coloca no meio do retângulo azul que está em cima dele, como você pode ver aqui à direita. O texto é centrado horizontalmente e verticalmente, e é isso que lhe dá a sensação de equilíbrio. Então esse foi um exemplo bem simples. Mas agora vamos dar uma olhada no mais complicado que você vê neste exemplo. Temos um monte de coisas acontecendo. Temos a imagem. Temos o título subtítulo Parágrafo retângulo com algumas coisas USB Aikens sobre ele, mas vemos que o mesmo princípio se aplica aqui apenas maneira mais complicado. Vamos começar com a parte superior esquerda. Você pode ver aqui que temos três itens Título subtítulo e um parágrafo Primeiro de tudo eu espaçado subtítulo intitulado Rumo uns aos outros. Aqueles dois juntos são um grupo agora para mim. Então eu espaço esse grupo como um todo para o parágrafo e aqueles através daqueles rua juntos novamente ex-grupo fora de seu próprio, que podemos usar para o espaço para a composição mais tarde. Em seguida, vamos fazer ângulo direto na parte inferior com os ícones aqui que temos direcionando sobre, nós vamos trabalhar em e há quatro itens lá, então nós dividimos o retângulo em quatro partes iguais. Esses são os quatro retângulos azuis que você vê. Esses são os lugares onde os ícones vão. Então, para os Aikens, eu cresci essas cada vez junto com a palavra abaixo dela. Esses são os retângulos rosa que você vê, e agora é apenas uma questão de colocá-los no meio dos quatro retângulos azuis. Então isso é para o retângulo e, finalmente, para a direita. Temos apenas uma imagem, como no exemplo anterior. Então agora temos três grupos principais com quem trabalhar temos de imagem à direita. Temos o retângulo, e temos o grupo com o título do subtítulo e parágrafo. Então agora é mais fácil no dedo do pé. Esses três grupos em direção a si mesmos, um ao outro, em vez de ter todos esses itens separados no espaço, notei, podem parecer complicados por enquanto, mas quando você começa a usar esse princípio, ele virá todo o medicamente com o tempo. Quando você está projetando 5. Whitespace e equilíbrio: esta lição. Eu vou falar sobre como o seu melhor lugar e espaço, os grupos de que falamos na lição anterior. Eu uso o método de espaçamento principalmente para livros didáticos, mas ele pode se aplicar a qualquer coisa. Realmente. Então agora vamos cobrir como você pode colocar seus grupos de forma equilibrada em direção ao fundo ou sair ou qualquer espaço que você tem para trabalhar. Então aqui vemos um exemplo simples com apenas um título em um parágrafo. Digamos que o retângulo branco com queda superficial é um espaço em que você tem que trabalhar. Bem, aqui vemos como coloquei este livro. Então, primeiro, você vê novamente que eu vejo isso como um parágrafo do grupo Tailândia. E vendo isso como um grupo, temos apenas um retângulo imaginário para centralizar no fundo, centralizando o retângulo imaginário verticalmente e horizontalmente. Nós temos uma sensação muito equilibrada, e é isso que estamos indo para. Então, como se aplica quando estamos trabalhando em um design. Bem, ele recebeu um simples split poucos que eu fiz com à direita da imagem e à esquerda, temos o nosso espaço para trabalhar. Você pode ver aqui que o texto à esquerda está apenas centrado. Como nos slides anteriores, acabei de ver o título e parágrafo novamente como um grupo. E então eu coloquei isso no centro horizontal e vertical fora do espaço onde eu tinha o dedo do pé trabalhando. Você pode usar esta técnica de colocar objetos e elementos em quase todos os lugares em apenas uma questão de definir quais os espaços em que você tem que trabalhar. E por último, mas não menos importante, eu queria dizer a vocês como eu defino a largura de um bloco como vocês vêem nos slides. Para mim, uma boa proporção é 60% para os objetos que você está colocando e 40% de espaço amplo. Isso é 20% de cada lado, menos espaço em branco que você dá aos lados. A carta vai ter uma sensação de reprodução. Se você der mais, ele pode se tornar mais mínimo e reprodução. Mas você tem que ter cuidado que as frases são de um a pelo menos 5 a 8 palavras verticalmente. O mesmo se aplica, mas depende do espaço em que você está trabalhando. Então é isso para a parte teórica. Espero não ter aborrecido muito vocês, mas agora vamos para um exercício onde explicarei como podem usar todas essas coisas em seus projetos. 6. Exercício: resumo /assunto: Agora vamos começar o exercício, e aqui é onde vocês verão como podemos usar uma teoria. Acabamos de passar por cima, e posso usar isso no seu próprio trabalho. Primeiro de tudo, vou explicar como faço um resumo para este tipo de exercício. Então, para as dimensões, eu não vou fazer uma página inteira. Eu vou fazer ah, visão completa fora da tela para um site e para o para o assunto. Vou fazer algo que me interessa, e vou trabalhar com algo que vai girar em torno de locais de trabalho escandinavos. Vamos usar um fluxo de trabalho simples para estes exercícios. Então vamos fazer primeiro uma armação de arame para tirar uma idéia da nossa cabeça, e então vamos começar com o projeto para este exercício. Eu não vou usar um grande, mas você pode usar um se quiser. Então vamos começar com uma armação de arame 7. Exercício: was frames: Então agora vamos começar a armação de arame simples. Hum, eu já caí. Deixei seis livros aqui em que vou trabalhar. E a razão pela qual fazemos isso só para sair desarrumado da nossa cabeça muito mais rápido do que, tipo, poderíamos fazer isso na loja de fotos ou algo assim. Então, Então, eu tenho minhas seis caixas aqui. Estes representam as páginas, e eu vou começar a desenhar alguns I d. Então, na verdade, a primeira coisa que eu preciso pensar sobre isso quais itens e conteúdo eu vou trabalhar com. Então eu vou trabalhar com um título e um texto uma imagem sobre eu estou trabalhando com um local de trabalho escandinavo . Então eu provavelmente vou fazer algo com, como, produtos em destaque em uma grande direção cult. Grande coleção para o usuário vê-lo para que ele possa clicar em uma página de detalhes muito mais fácil, mais fácil e o produto de recurso para que haja alguns metadados onde o usuário pode trabalhar. Então eu vou começar com uma simples divisão para você, onde poderia ter, tipo, a imagem à direita. Poderíamos ter o local aqui e como um cardápio que eu possa ouvir aqui. Poderíamos ter um produto em destaque texto poderia ser como em um cartão aqui com uma sobreposição sobre a imagem ou algo gostaria, Button disse. Eles estão aqui mais um, e isso é apenas eles têm algumas idéias rápidas que são para que ele não tem que ser logotipo perfeito . Podemos trabalhar com algumas linhas diagonais para a imagem. Poderia ir aqui. Agora podemos trabalhar aqui com um produto em destaque e aqui poderíamos ter, como o texto com a chamada à ação. Estes livros podem ser como um apelo à ação, e aqui nós poderíamos ter, como alguns divididos como este. Mas do outro modo, como assim poderia ter, como, como, o menu abaixo aqui Aiken ou um menu completo poderia ter, como alguns o texto vir aqui. Esta poderia ser a imagem e seria legal ter um carrinho com o produto em destaque, como um excessivamente aqui e para a ação cultural. Poderíamos tê-lo aqui com um estreito ou algo assim poderia ser como aqui e totalmente com você. Então aqui eu vou tentar trabalhar com algo em três filas, então dividi-lo em três fileiras . Não, eu vou ter a imagem no menu Loga do meio. Aiken, uma mensagem, e então podemos dividir isso. Então temos um bom aqui à esquerda. Estes são os mesmos. E então essa festa é em pedaços, e então essa parte pode ser, como o produto em destaque aqui, certo? Eu sou produto. E aqui nós poderíamos ter, tipo, o c t a. Então é isso, hum, então nós podemos tentar algumas outras coisas. Como se pudéssemos trabalhar com um círculo ou algo assim. Então, assim de volta das formas com a imagem indo aqui, produto em destaque poderia ser como aqui em um tribunal ou algo assim. Agora, poderíamos ter nosso texto com um logotipo de chamada à ação. É só cardápio que eu posso aqui. Ou podemos mudar isso. Nós também temos sempre o texto à esquerda, então tente um diferente com a imagem à direita à esquerda, quero dizer, desculpe. E então aqui está um texto. O destaque pode ser como de ponta a ponta produto. Sabe, poderíamos ter, tipo, um chamado à ação aqui. Baixo e um cardápio, Aiken. Por isso, quando estou a olhar para isto. O que mais me interessa é este e este. Mas acho que vou trabalhar com este. Então agora nós vamos agora nós vamos para o exercício vai explicar como nós podemos fazer esta armação de arame que eu fiz no reboque o projeto. 8. Exercício: como fazer o design: Então agora vamos começar com o exercício. Acabo de abrir a loja de fotos. Vamos fazer um novo documento. Vou chamar-lhe espaços de trabalho escandinavos. Vai ter 1500 pixels de largura e cerca de 850 de altura. A resolução vai ser de 72 pixels por polegada e a cor Moz vai ser RGB. Então aperte OK? E agora temos essa tela para trabalhar. A primeira coisa que vou fazer é fazer um quadro de arte para que você possa fazê-lo clicando e segurando aqui em movimento e então você vai tirar esse pop para fora. Você pode escolher a Ardmore Tool e então começamos aqui no canto esquerdo da parada. Você pode clicar e direcionar. Você é inteligente, guias vão aparecer, e então você pode simplesmente arrastá-lo para o canto inferior direito, e então você verá aqui no painel de camadas que não temos placa de arte. Então eu vou chamar isso de espaços de trabalho escandinavos. Então, não é? A camada branca aqui é apenas um fundo, então você não precisa se preocupar com isso. Então a razão que eu fiz no quadro de arte disso é Ah, que vai ser fácil de duplicar. Os congoleses estavam trabalhando. Então agora a coisa que vamos fazer é diminuir o zoom, e vamos tentar recriar nossa armação de arame que fizemos. Então o que escolhi tinha uma imagem no meio. Então eu vou até a ferramenta de retângulo direto para você. Então eu estou indo para aproximadamente definir um retângulo aqui no meio clicando e arrastando. Então é isso. Só vou te dar uma cor cinza claro. Então eu sei que isso está lá. Você pode ajustar o núcleo clicando aqui no terminal diretamente. Gary, arranja uma cor, papá. A razão pela qual eu estou colocando o retângulo lá é porque ele vai ser o espaço reservado para a imagem. Então aqui à direita, nós vamos ter dois blocos, um para este para a direção de culto e o outro para o produto de características. Então eu só vou levar isso aqui com todo o arrasto chefe, então nós fazemos uma duplicata dele vai torná-lo um pouco mais escuro para que eu possa ver a diferença entre os dois e, em seguida, com bater ir meses t para transformar. Você pega esses livros delimitadores e você pode arrastá-lo aqui para torná-lo menor, apenas vai arrastá-lo para cá. Você vê o cara esperto que significa que está no meio. Então eu só vou fazer com a morte e, em seguida, comando clicando neste aqui para auto selecionar lugares marcados fora. Mas quando eu pressionei comentários, ele continua. Então, toda vez que eu pressionar comando e eu clicar em algum lugar ele selecionar essa camada. Então, por exemplo, agora este está selecionado. Se eu comando clicar aqui, o outro será selecionado. Então, vou voltar aqui de novo. Vou fazer o mesmo que fiz com o distrito de selecionados. Vou pressionar para fora e mudar e arrastá-lo para baixo. Eu pensei que atinge o canto do outro e eu estou vendo que há uma linha de pixel entre eles, então eu só vou apertar seta para cima para movê-lo. Então eles estão uns contra os outros. Vai deixar isso um pouco mais escuro, também. Então você vê aqui, na verdade, a coisa que fizemos agora se nós apenas recriamos nossa armação de arame, então ele vai ser o espaço em que eu vou estar trabalhando. É outra. Temos este conjunto, quadro da nossa esposa. Vou tentar encontrar uma boa imagem para colocar neste retângulo aqui. Então eu vou até o Luke Room e eu vou para os interesses. O vestido é um bom lugar para procurar imagens e obter alguma inspiração sobre imagens e outras coisas. Então eu vou procurar aqui por um espaço de trabalho escandinavo. Vamos ver quais imagens aparecerão. Então eu meio que já gosto deste diferente. Diferente é um pouco ocupado aqui. Este é um bom. Então, basta ir dedo do pé, clique sobre ele e, em seguida, um truque simples para que você não tem que salvar a imagem é sempre Sim , você pode apenas clicar com o botão direito sobre ele e uma imagem de cópia, e você pode ir sobre a loja de fotos em. Você tem que selecionar o retângulo aqui onde você está indo para colocar sua imagem no lugar para ele, e então você pressionar dois meses taxa para colá-lo, e assim ele vai se tornar a camada em cima dele. Então agora vemos que as imagens soltas do do espaço reservado. Então, se você quiser que a imagem só apareça no retângulo que temos aqui. Há um simples três crítico, uma mesquita de recorte, e podemos criá-la segurando Ault e clicando entre a camada de imagem e a camada espaço reservado. Então você vê essa flecha. Então, se eu clicar, ele só mostra na camada que tem sido necessário. Então aqui que o ângulo direto. Então, se você ver agora, se eu clicar na imagem e eu vou arrastá-la para vê-la, só que ela sempre fica no retângulo. Então isso é bom para não. Então eu tenho essa imagem aqui e talvez pudéssemos tentar outras. É muito fácil, então você pode voltar aos interesses, pode rolar um pouco para baixo, ver que tipo de imagens estão aqui. Ah , como este aqui. Então, incluindo sobre o Pinterest é quando você encontrar uma imagem que você gosta, você sempre pode rolar para baixo e o Pinterest lhe dará imagens sugeridas. Então aqui temos um monte de mais imagens. As músicas são legais como esta, mas essa eu gosto, acho que vou com essa. Então, a mesma coisa, certo? Clique, copie, imagem e, em seguida, veja que estamos no mesmo lugar aqui na camada. Encha isso. Então estamos aqui e eu posso apenas entrar em V novamente e você verá que a imagem aparece aqui. Mas você vê novamente, ele está solto do do espaço reservado. Então, podemos apenas novamente pressionar ault entre e clique entre as duas camadas. E eu vou manter essas duas imagens porque quando eu clicar no olho aqui nesta camada, ele vai me mostrar que a imagem foi Comê-lo. Então, mais tarde, quando estivermos um pouco mais longe na composição, podemos ver a diferença. O que o sentir presentes com as diferentes imagens. Então, eu só vou para o lugar. Só vou clicar no “I” de novo. Vemos a imagem. Eu vou entrar e clicar nele. Então eu tenho que selecioná-lo que eu vou arrastá-lo no lugar. Então é isso. Agora sinto que talvez seja um lugar muito estreitado, embora eu tenha feito Então eu estou indo para o comando clique sobre este no turno de comando Clique no abaixo. Então eu vejo aqui que eu tenho as duas camadas selecionadas. Eu só vou comprimir o comando t novamente para transformar e apenas vai torná-los um pouco mais pequenos em Talvez como este centro numérico. E então aqui temos que fazer o espaço reservado maior. Então eu posso apenas clicar aqui no retângulo novamente ou colocar sobre a mesma coisa. Vamos lá, T arrastá-lo para cima. Agora podemos substituir. Podemos arrastar a imagem dela um pouco. Agora vejo que o retângulo é muito branco do lado. Então, novamente, você seleciona direcionar todo o monte para transformar, e você pode trazê-lo de volta aqui. Então pressione enter image aqui, vai torná-la um pouco menor. Então, assim, então, ok, eu gosto disso. Então, agora que fizemos isso, vou apenas nomear minhas camadas. Então este é um espaço reservado que duas imagens que vão comandar clicam nos outros dois. Então temos o truque, a tria nas três camadas. Nós os selecionamos, e eu vou pressionar o comando G para fazer um grupo deles. Então aqui eu posso nomear a imagem do grupo enter. E aqui temos, tipo, tipo, dois quarteirões. Estes vão mudar, provavelmente. Então eu não vou dar nomes a eles, o fundo e apenas como uma cor branca, mas eu vou apenas excluí-lo porque é automaticamente branco. Então é isso. Então a próxima coisa que vou fazer é colocar toda a informação aqui que eu quero colocar no projeto. Então, primeiro de tudo, então eu vou Presti trazer a tipografia. Vou fazer livros de texto aqui e lembrar-me. Como dissemos na teoria, eu queria estar, tipo, 60% em que fora do lugar em que temos que trabalhar. Então aqui seria o retângulo branco que o espaço onde podemos trabalhar Então eu vou apenas fazer isso cerca de 60% provavelmente vai ser algo como isso. Eu só vou arrastá-lo para o meio e então o título com que eu vou trabalhar vai ser apenas espaços de trabalho escandinavos. Vou deixar a linha aqui. Então isso só vai colocar a frente deles não é a que eu vou usar, provavelmente, mas apenas definir um padrão aqui para mim, e então eu vou para a Internet novamente. Você vai fazer um top novo e eu vou procurar por base de obras escandinavas e então envolve. Veja, vemos aqui que temos alguns artigos. Como aqui, por exemplo, este aqui. Você vê, nós temos um texto aqui para trabalhar com Apenas indo para ver aqui. Se eu puder copiar e colar alguns desses 25, não precisamos disso. Mas só vou levar, tipo, aqui, projetado para ele em espaço de restrições. Algo até você imprimir o comando. Veja, só algumas vezes para ter certeza. E então apertamos o comando para voltar para a loja de fotos. Então agora de novo, vou fazer. Só vou copiar estes livros de texto. Então isso é o mesmo com eu vou apenas Presti. E então eu posso Você pode selecionar o texto aqui nesta caixa. Vou pressionar o comando A para selecionar tudo. Vou pressionar o backspace para apagá-lo e comandar V para colar o texto longo que temos. E eu vou mudar o texto corporal para ah, tempo de telefone usado principalmente para texto corporal em fonte escondida na Spro. Vai levar o normal. É um funk livre. Você pode baixá-lo no telefone. Esquilo, acho que pode procurar no Google. Você vai encontrá-lo. Então é isso. Eu vou fazer isso, tipo, 17 pontos, 17 pontos, e eu vou passar por cima do pênalti que o personagem e eu não tenho é que a altura da linha . E agora nós vemos isso definido. É muito grande. Então eu vou ficar aqui e eu vou clicar e direcionar você vê, nas frases que vai aparecer. E agora queremos algo bom e ganancioso. Então, assim, isso seria para Jim juntos para mim. Alguém para torná-lo um pouco grande. Maior. Veja se todos os textos podem caber lá. Então eu o arrastei para baixo. Então, temos uma mensagem aqui, então isso está morto. E talvez dê um pouco. Nous, talvez algo como você não tenha que nos usar tanto de um texto como este. Mas podemos, por exemplo, cortá-lo aqui, então eu tenho um pouco menos de texto para trabalhar. Lembre-se, não é um trabalho de cliente. Divirtam-se e experimentem coisas novas. Então agora teremos que ler isso. Então clique aqui. Então agora está de volta a isso. Ok, é isso. A próxima coisa que quero é “Ah, Lower”. Só vou clicar aqui e digitar algo. Funciona com base, por exemplo, vai fazer isso como, uh, 20 pontos, por exemplo, sobre isso, lembre-se, nós estamos apenas Funciona com base, por exemplo, vai fazer isso como, uh, 20 pontos, por exemplo, sobre isso, lembre-se, configurando tudo. Isto não é definitivo ou algo assim, mas vamos conseguir. Vamos mudá-lo. O Teoh. O que vai ser? Vamos ver o que, como vai se sentir quando tivermos toda a composição. Então vemos aqui. Eu pressionei o espaço um par de vezes que apenas para clicar e direcionar uma caneta dentro da imagem . Então você vê o cursor mudando para a mão quando eu pressionar o espaço, e então você pode clicar e arrastar por aí. É bem fácil. Então a próxima coisa que vamos fazer é criar um menu. Eu posso, então ele vai passar por aqui, provavelmente. Então eu vou pegar a ferramenta de linha e ele recebeu o conjunto de três pixels. Eu vou mudá-lo para, e eu vou rolar todo para ampliar assim. E então, algo assim, 66 700% ou algo assim. Eu só vou arrastar uma linha algo assim. Como 20 pixels de largura que, como eu disse antes de nós ângulos diretos clique aqui no terminal e você pode mudar a cor , então eu vou fazer com que ele pressione preto. Ok, então nós queremos. Temos um cardápio de então nós queremos. Temos um cardápio de hambúrgueres. Então nós queremos três dessas listras para que possamos apenas duplicar este pressionando comandos. E Jay, então, assim, você vê aqui ele terá uma cópia. Então há isso e então nós vamos fazer isso novamente para que e nós selecionamos este e vamos pressionar shift e uma estrada para baixo, então isso move 10 pixels. Então, se fizermos isso com o outro, então teremos isso. Mas se você diminuir o zoom, vamos voltar 100% do tamanho real da visão para ver o que parece quando temos nosso zoom e uma maneira fácil de voltar a 100% este turno de comando um tão parecido com este. E então teremos implorado isso. Então eu vou apenas Bennett de novo aqui. Então, se escolhermos estas camadas de árvore, esse é o menu que eu posso simplesmente pressionar. Vamos, G. Faça um grupo. Você dá o nome. Menu. Eu posso. Então a coisa que vejo agora é que é muito alto e que as linhas são muito, muito distantes umas das outras, então ele vai vir bem aqui. Então eu quero que eles fiquem um pouco mais perto um do outro, então eu vou, assim, como este aqui, pegar minhas setas. Vou dar o dedo do pé. 123 Ok, está olhando melhor, e então vamos selecionar o dente são e 123 Então isso está começando a parecer um pouco melhor . Então eu estou indo para todos zoom novamente para voltar para o menu, e eu ia torná-lo um pouco mais dinâmico. Então o que vou fazer é mudar o juízo para apagar as luzes. Vou fazer isso pressionando um é o dedo de seleção direta. Este é ah para onde você pode selecionar pontos de ancoragem com. Então eu vou pressionar um ver aqui. Não são as ferramentas brancas. Vou clicar e arrastar, e depois temos o dedo de seleção direta. Eu vou clicar nisso Eu não vou selecionar esses dois pontos à esquerda, mas apenas arrastando sobre eles e com as teclas de seta pode torná-los um pouco mais curtos assim . E não há regras definidas para isso é apenas você pode experimentar com isso. Você pode tentar o máximo de coisas se quiser, mas eu sei como eu sei que eu queria ser um pouco assim. Então nós temos, tipo, três juízo diferentes agora. E eu vou ver de novo como eles ficam no tamanho real. Vou pressionar o turno de comando um de novo. Chega com facilidade. Eu meio que começo a gostar disso, mas talvez eles estejam um pouco distantes um do outro. Então eu vou selecionar o mais baixo novamente, o do meio, e então vou pressionar uma tecla para cima, e eu vou ter que mover os 12 pixels inferiores. Então agora estamos chegando a algum lugar. Ok, vamos deixar isso por enquanto. Assim faz isso. Agora vamos ver o que podemos fazer pelo tamanho da dobra. Oh, são, ou os órfãos em geral. Então este é um tipo de meus formulários de texto do corpo, mas eu meio que gosto dele então eu acho que vou manter que vai selecionar tudo. E eu acho que talvez seja um pouco demais para branco agora. Os livros didáticos. Então eu vou selecionar isso. Eu vou pegar este ponto de ancoragem aqui do livro didático. Eu vou arrastá-lo um pouco para baixo e um pouco para a esquerda, então eu meio que gosto da morte. E para este campo, eu meio que gosto deste trabalho de telefone em praticamente todos os pesos e tamanhos maiúsculos. Em minúsculas. Uma frente multifuncional muito boa. Mas eu vou escolher algo legal. Tipo de ajuste aqui são meio divertidos, eu acho, em julgamento por Duda. Então temos aqui Duda, e vamos escolher um peso-pesado. E a razão para isso é que eu quero ter um bom Contras entre o texto com bala e o título para que o título realmente apareça. Então você vê aqui que o título tem tipo de ajuste certo. Você pode tentar fazer o grande, maior talvez um pouco menor novamente. Tipo de como ele e então nós vamos Teoh, você vê que o espaço entre os dois dedos do pé como o título de Escandinavo e espaço de trabalho. O espaço entre duas cadelas do dedão do pé grande demais. E então, segurando Ault e usando suas teclas de seta, você pode mudar a altura da linha. Então, se você usar Ault, você aperta alternativo. Você usa as sementes UPI da imprensa iraquiana que está se tornando menor, o espaço. Assim fez isso. Veja como aquele olhar lá que parece un selecionado. Então eu vou clicar aqui. Então isso já está começando a parecer algo. Talvez o espaço aqui entre estes dois tenha sido demasiado. Vou mover o texto da bala um pouco. Sim, então eu meio que gostei já é talvez o todo. Como eu disse antes da teoria, temos que ver isso como um grupo. Então, se você vê isso como um grupo, você pode simplesmente usar um retângulo simples para colocá-lo no meio. Casey assim. E se lhe dermos uma cor, você pode ver o espaço entre ele e, em seguida, tudo direto para movê-lo. Algo assim não precisa ser perfeito por enquanto. Então agora nós vendemos esses dois como se eles fossem um grupo, e nós podemos movê-los assim seria algo mais como no meio? Então agora eu vou deletar distritos é novamente porque eles não fazem parte do projeto. Mas agora você vê, está começando a parecer algo. A razão pela qual eu coloquei o logotipo aqui no topo porque Lois, sempre para mim esquerda no topo porque as pessoas sempre lêem da esquerda para a direita. E a primeira coisa que você quer que as pessoas vejam quando elas vêm em um site é a parte inferior da sua empresa. Então é por isso que eu coloquei ali, o local aqui, o menu que eu posso aqui porque nós não temos espaço suficiente para um menu inteiro para digitá-lo . E eu a guardei aqui no espaço branco e não aqui. Por exemplo, no dedo do pé direito tem esta parte fora do design sempre para texto. E este poderia ser variável para imagens são chamadas direções ou algo assim. Então agora eu vou selecionar essas duas camadas sobre texto em um grupo eles texto e este é um grupo para o logotipo e então você pode, se você escolher, você pode escolher se você quiser. Se você quer fazer isso ou não, mas você pode colocar, tipo, menu brilhante Aiken juntos e chamar de cabeça, por exemplo, para que a próxima coisa que vamos trabalhar é ah, direção de chamada. Então eu acho que eu quero fazer aqui é eu quero usar um desses livros e dar-lhe uma cor. Então, ele aparece. E a razão para isso é que eu quero que esse seja o chamado à ação. Como se as pessoas clicassem lá, elas vão para uma página de detalhes ou algo sobre espaços de trabalho escandinavos. Então eu vou começar pegando este livro e te dando frio. Eu vou com, mas ainda meio azul agora um pouco, certo? Algo assim. Eu só vou dar a este, tipo, este grande lugar titular aqui. Vou dar-lhe um fenómeno de núcleo branco para que não me incomode tanto. Agora que temos a morte, temos aqui para a direção da chamada, e eu vou pegar um retângulo para mostrar o espaço e eu vou trabalhar. Então eu quero ter, tipo, um bom espaço aqui onde eu vou trabalhar com o meu texto. Então, como, aqui nós temos, tipo, 60% a 40 porcento, por exemplo, como aqui. Então aqui, vou tentar fazer o mesmo. Então o que eu vou fazer é apenas configurar como uma área de título para como você poderia chamá-lo. Então isso vai ser algo assim de novo. Não precisa ser perfeito. Por enquanto, vou deixar este um pouco mais escuro. Então eu notei que a área que eu vou trabalhar então a primeira coisa que vamos fazer é fazer aqui vai fazer os textos para a direção do culto. Então eu vou apenas pressionar d novamente para trazer a tipografia e eu vou clicar aqui, e então eu vou escrever algo como verificar os espaços de trabalho, por exemplo. Então você já vê que isso é muito grande. Então eu vou clicar aqui no tamanho do telefone, e você pode simplesmente rolar aqui no dedo do pé mais fácil se é como você vê, eu estou rolando aqui e você pode rapidamente ver o que parece melhor. Você realmente não tem que ceder os valores ou algo que pode simplesmente rolar aqui. Então eu vou fazer algo assim. Talvez você também possa usar as teclas de seta. Então talvez algo como 28. 26. 27. Algo como 28, por exemplo. Vamos pressionar Enter. Então não vamos mudar mais os lados do telefone. E novamente, você vê que as duas linhas estão muito distantes. Então eu vou pressionar Ault novamente com e então você novamente, como você pode usar a tecla de seta para mudar as alturas da linha. Então eu vou fazer isso. Então, algo assim parece bom e eu só estou indo para peito V três v acusando atalhos de visto . Toe Apenas traga o movimento para outra vez. Então, assim. Então, se eu sou um texto ou amamentar e voltar para o dedo do pé de movimento Então, novamente, clique em comando. Para ter certeza de que selecionamos isso, eu só vou arrastá-lo para baixo. Então, a primeira coisa que vejo agora que talvez seja muito pequeno, então eu só vou, uh, uh, primeiro dia novamente, selecionar todo o texto, torná-lo um grande, maior, um pouco maior. Então, algo assim. Mas agora as linhas estão muito próximas uma da outra novamente. Segure Ault e com as teclas de seta para pressionar um pouco para baixo. Então eles vão ficar assim. Basta selecionar este retângulo e clicar em I. Para que eu não o veja. Crianças com boa aparência podem fazer alguns ajustes mais tarde. Então, a segunda coisa que eu quero ter aqui algo Teoh, chegar ao olho. Em cima deste bloco é algo em todas as tampas, um pouco menor frente. Isso é, hum, nossos espaços de trabalho, por exemplo. Realmente não importa o que ele diz aqui, mas algo pequeno e maiúsculo que eu costumo usar Monserrat porque é que ele funciona muito bem para este tipo fora de texto. Então eu só vou tomar Monserrat e eu vou usar, hum eu uso principalmente semi careca e depois o ano de respiração novamente. Eu vou até aqui e nós vamos fazer tudo isso, provavelmente vai fazer isso redondo. Eu principalmente para maiúsculas. Neste cenário, eu usei como 12 pontos ou máximo 14 então eu vou com riqueza aqui. Então a coisa que eu sempre acho que funciona muito bem com texto pequeno maiúsculo é ah, o espaço entre letras para que possamos fazer isso maior. Então eu vou apenas para ir aqui, clique aqui e dirigir. Então as cartas iam sair um pouco umas das outras, tipo 200 ou algo assim. E eu vejo que dá também acrescenta ao minimalismo porque as letras são agora, eles têm mais espaço para respirar. Então ela vai clicar aqui e arrastá-lo para baixo para que possa ser como se isso pudesse vir aqui. E então eu vou clicar aqui neste retângulo novamente e clicar no I. E eu veria que talvez ele esteja inclinado demais para a esquerda. Então eu vou apenas clicar neste aqui e vir no turno, clique neste. Então nós dois temos eles selecionados, e então eu vou movê-lo um pouco para a direita, talvez um pouco para baixo. Então, algo assim. Então a única coisa que eu acho que isso pode adicionar a isso é como uma seta aqui e um estreito sempre indica que você está saindo da página, que vai haver uma nova carga de página. Então o usuário vê a seta qualquer eu acho que 95% de desconto as pessoas sabem que eles vão ter uma nova página de carga. Então eu só vou até aqui para a minha ferramenta de forma personalizada. E eu tenho algumas formas personalizadas aqui, carregadas. Veja aqui eu das flechas. Eu vou. Vou fazer uma nota com um link através desses arquivos onde você pode baixar essas setas, e eu vou para, tipo, tipo, um tipo muito fino de seta aqui, apontando para a direita. Então eu só vou arrastar aqui assim, hein? Mude a cor preta para que possamos vê-lo. E então eu vou ampliar por todos, assumindo novamente, arrastar para o meio, e então vamos clicar em Tipo A para ferramenta de seleção direta novamente porque eu queria ser um pouco mais longo, então eu estou apenas indo para selecionar esses pontos de ancoragem e, em seguida, que mudança e meu aero para a esquerda, Eu posso torná-lo mais longo. Então eu vou tentar algo como este V opressivo novamente para trazer a ferramenta de movimento. Vamos lá, mude um para voltar a 100% para você, e então eu sou apenas um selo. Eu tenho minha seta selecionada. Ir para o nome é muito rápido como este, e então eu vou apenas clicar e arrastar e posicionar do jeito certo. Então agora vou ver que está muito perto do final da composição. Então eu vou fazer esses textos novamente, um pouco menor, algo assim. E não consigo chegar um pouco mais perto. Algo como isto. Certo, então meio assim. Agora, se você quiser experimentar um curso diferente, aqui é onde a cópia do quadro de arte é útil. Então, podemos clicar no nome do quadro de arte e você vai até aqui para mover dedo do pé e você pressionar tudo para deslocar e arrastá-lo para baixo. Então você só faz uma duplicata do tom. Então, aqui podemos mudar rapidamente de cor e ver que tipo de coisas funcionam. Talvez algo como ainda esteja sendo ou algo assim. Faça outra duplicata. Poderíamos tentar algo verde. Faça outras duplicatas e tente algo. Algo como amarelo claro, como sua Louise ou algo assim. Então veja aqui, talvez um pouco mais baixo. Sim, talvez algo assim. Eu gosto disso porque isso isso complementa essa imagem mais porque a imagem tem muito fora manchas amareladas marrom nele. Então eu acho que este vai funcionar melhor. Bem, acabei de fechar. As outras placas de arte ouvir clicar nas setas para que não estejamos confusos com ele. Então eu vou trabalhar com isso. Então a única coisa que falta agora neste layout ou composição é ah, o produto em destaque que eu queria colocar aqui. Então temos uma boa base aqui. Eu só vou grande este para o título arrastado para cima. Só vou datilografar. Talvez este seja melhor para o nome do produto, como temos aqui. Temos o pequeno texto no topo e temos o maior ano de texto abaixo. Então o I vai do topo e automaticamente desenha você para baixo porque este pedacinhos do Texas , ele tem mais contraste com a grande rodada. Então eu vou digitar aqui nome do produto, e é também vai ser um link. Então a flecha me dá um cego aqui, veja, como se esse fosse o segundo chamado à ação. A principal coisa que queremos usá-lo para fazer é clicar nesta ação de cultura, e é por isso que ele tem o fundo de cor para que ele chame mais atenção. Então, eu vou colocar isso aqui em baixo. Eu vou pegar este texto Pequeno texto em maiúsculas, vou colocá-lo aqui, e eu estou no meio. Eu só vou digitar características produto como a morte. Então, se eu tenho, eu quero colocar isso no meio aqui. Então eu tenho ângulo distrital. Este é o suporte do lugar para o produto. Espaço reservado, provavelmente. E se tivermos isso selecionado e selecionarmos o texto juntos, podemos usá-lo alinhado a aqui para colocá-lo no meio. Então agora isso está no meio. Isso também seleciona isso junto com o Terryl vai fazer um grupo fora dele. Direção fria, irmão. E você também pode fazer isso com grupos. Então, só mais uma vez, eu selecionei este grupo e eu vou selecionar o fundo para retângulo vai colocá-lo no meio. Então agora dissidente. Então a única coisa que falta aqui é algo como uma cadeira, algo como aqui na imagem. Então eu só vou voltar para a internet e eu vou fazer um top novo. Vou digitar algo como cadeira autografada ou algo assim. E então eu vou para as imagens todas essas imagens, algo assim. Então eu estou indo para tão importante também. Queríamos ter um amplo plano de fundo para que não tivéssemos que fazer muito trabalho para tirá-lo e fazer sombras e todas essas coisas. Então, eu só vou colocar PNG atrás dele. E nós temos, tipo, esse tipo de imagens. Então este tipo de como eu estou indo apenas para experimentar um casal, como, por exemplo, este apenas o mesmo, como com a imagem em ah, alguns momentos atrás em um interessante e fazer clique direito copiar a imagem. Volte para a loja de fotos. Vamos lá, Fi. E nós temos isso para você e renda. Tia Transform poderia torná-lo menor novamente. Assim como ele. Então a única coisa que eu não gosto aqui é que ele tem, tipo, nenhuma sombra ou algo assim como estar lá e não parece realista ou algo assim. Só então vou deletar esse, vou voltar, vou voltar, e acho que essas cadeiras se chamam Eames alguma coisa, então vou passar tempo. Mas aqui, equipes. Sim, sucesso. Então só vamos olhar para todas essas imagens, se tivermos. Ah, bela foto. Podemos trabalhar com algo com algumas sombras. Uh, não. É como se não fosse sombra real e procurar imagens. Não é a coisa mais fácil. A maioria das vezes leva algumas horas para encontrar imagens perfeitas. Mas talvez algumas imagens relacionadas possam nos ajudar aqui. Algo como a morte. Você precisa de algumas sombras. Então, ok, pessoal, eu encontrei a minha imagem. Eu quero usar. Ele vai fazer cópias de novo, voltar para a loja de fotos e Basit aqui. Então você vai pressionar, venha na TV de novo. Ele é morto está em baixo. É aqui como se houvesse um fundo largo na imagem, mas não é realmente um problema porque nós temos, tipo, fundo branco aqui novamente para então nós podemos apenas tocar isso aqui. Então agora sabemos que este Texas já enviou para que possamos Você pode selecionar a camada de produto em destaque e un selecionar a imagem e, em seguida, alinhá-lo aqui novamente. Middle Oops, incentivo, o errado. Então eu vou pegar a imagem e fundo novamente, e assim é isso. Agora temos tudo centrado. Vamos direcionar isso um pouco vai ser isso vai subir. Eu não gosto muito que ele recuse em que então notar Churkin pode nós podemos escalá-lo um pouco mais. Então é mais como um eu capturei. Então eu gosto de algo assim. Confira isso. Então agora este tipo com o qual estamos trabalhando, hum, a única coisa que eu penso e talvez melhorado isso é como se pudéssemos colocar isso a direção do culto , o bloco de cores, poderíamos transformá-lo para o topo. Porque, como eu disse, as pessoas lêem na maioria dos países da esquerda para a direita e de cima para baixo. Então a primeira coisa que queremos que eles vejam é como, essa direção de chamada, porque queremos que eles cliquem nela. Então eu só vou diminuir um pouco e fazer uma cópia disso. Eles só iam virar aqueles para cima, então este vai ser um grupo. Então temos a camada de fundo, texto do produto em destaque , a camada da imagem, e já fizemos um grupo para a chamada à ação do produto. Torres, então eu vou fazer um grupo com isso e isso vai ser e, uh , grupo emocionante. Isso é e este vai ser o subtítulo nos dias de hoje em segundo plano. Vai ser um grupo, e vai ser a ação cultural ou C T. Oito. Então é isso. E eu ia trocá-los. Então o estado, o eu estava indo para ir para o topo. O que vai arrastá-lo assim? Eu só vou pegar o olho para o outro grupo. Então eu acho que ele estava trabalhando com. Então, a direção da chamada vai para o topo e o produto características vai descer assim . Vamos ver o que fica. Eu tenho que dizer que eu gosto disso mais esvaziar. Então agora temos todos os elementos em nosso design que queríamos. Lá temos o texto, temos a imagem. Nós temos o tipo de logotipo semelhante, um menu que eu posso em uma chamada à ação. Então, vou para uma fila. Eu rasgo um pouco mais, quero torná-lo um pouco menor, apenas o árabe. Colocou-o de volta, então algo como isto. Então eu meio que gosto disso. Como aqui temos as mensagens. O título, com o parágrafo como um grupo, está no meio do livro branco. Só um pouco mais aqui. Se, como, este é um grupo com o texto do produto em destaque a imagem e a direção da chamada para os recursos Produtos como um grupo. E é como no centro ir pegar essas três camadas de texto do produto em destaque. Veja ta para o produto e a imagem. Mova-se um pouco para cima. Ok, então isso é como no meio. E, em seguida, temos aqui são base de obras. Verifique a base de obras e a seta para isso. Nossa camada de texto de espaços de trabalho. Então agora estamos mortos. Nós podemos apenas você pode apenas pisar. Você pode usar as setas do dedo do pé, movê-lo um pouco e ver onde ele se sente melhor que você pode. Você pode pegar o subtítulo e movê-lo um pouco para baixo ou algo assim. Mas então o espaço entre aqui tem que ser o mesmo, como teste aqui. Sou eu, pessoalmente, acho que para baixo e topo, tem que ser o mesmo. Mas também à esquerda e à direita e tentei igualar as margens esquerda e direita com a da parte superior e inferior. Então, tipo, se este fosse aqui, então este como um grupo, eu iria para cima. Mas então eu também tenho que ajustar o tamanho do telefone porque isso tem que se tornar menor também para que nós não vamos fazer isso tão monstro para desfazer isso. Então esse é o agora. A única coisa que eu acho que eu quero adicionar aqui é como um pouco de diversão, como algumas flechas como este poderia ser como um controle deslizante, por exemplo. E eu acho que vou fazer outra aula rai o que eu vou animar. É como um controle deslizante no curto. Então, no próximo, a próxima lição desta classe que você verá para um projeto de classe seria legal. Se vocês pudessem fazer isso, como átomos átomos, então tipo de elementos interativos para fazer um slide ou algo assim para o próximo Ouça, eu vou tentar explicar como você pode fazer um controle deslizante. Animação com a atitude de tiro agora é feita e fazer isso em princípio, mas isso é para o próximo a fechar. Então aqui, para o para ele vai adicionar algumas flechas. Então só indo, indo para aqui para o banco dos lábios e pressionando Shift e Ault, eu vou arrastar um círculo. Então, assim, algo assim. Está bem. Um V impressionante novamente para a mudança para Então nós apenas temos. Então nós vamos até aqui para a camada, você pode chamá-lo, pero esquerda. E agora vamos adicionar algum estilo de camada diz, na verdade, um só golpe. Então, a primeira coisa que eu quero fazer, mas eu não vejo o círculo porque ele é largo em largura. Mas para vocês, se vocês vêem, é como se vocês virem assim, por exemplo, por exemplo, a coisa que vocês querem fazer é que vocês querem que o Teoh desligue o campo. Então vamos fazer isso 0% assim e a diferença entre opacidade e sensação é isso. Quando você baixa a opacidade oito turnovers, opacidade para tudo. Além disso, ele aparece testado para a camada, mas também para os estilos de camada ou qualquer coisa que é aplicada à camada para o preenchimento. Só que ele só liga a opacidade para o núcleo ou algo assim. Apenas o que está dentro da camada, mas não para os estilos de camada. Então, se você quiser ver nosso derrame ou a única coisa que queremos ver o derrame, então vamos ter que desligar o campo. Eu nunca vou clicar duas vezes aqui nas camadas, não no nome, porque então você vai ajustar o nome nunca vai passar aqui para derrame. E eles iam fazer, tipo, tipo, duas percepções de derrame Bixel ou fora realmente não importa. É um círculo. E eles iam escolher, como uma cor azulada mentirosa. Eu realmente não gosto de cores lindas. Eu gosto deles ou gosto, na área azul, e apenas passar um pouco para a direita. Então eles têm um pouco de Você nele um pouco de azul. Então, vou pressionar. Está bem. Aqui. Assim faz isso. Só vou dar zoom. Vou presumir por toda a rolagem, então aqui temos o nosso círculo. Então agora queremos uma flecha lá dentro. Então a primeira coisa que vou fazer é ir até a ferramenta de forma personalizada. Então nós temos nossa flecha da última vez, mas talvez isso seja um pouco grande demais para isso, então eu vou fazer, tipo, tipo, um estreito como este. Então, no meio de um círculo queríamos ficar de pé, então eu vou com meu cursor para o meio de um círculo Primeiro clique, e então todo o turno arrastado para fora. Vamos fazer sua flecha algo assim, e eu ia torná-la preta. Então vamos lá, mude um de novo para ir para 100%. Poucos como este. Vou selecionar estes dois e alinhá-los. Então, são tecnicamente uma luz, mas não opticamente, , com 9. Projeto de classe: Espero que aprendam algo com o vídeo anterior em que fizemos o design juntos. Agora, o projeto da turma. Quero que façam a mesma coisa. Procure algo em que esteja interessado e use isso como assunto. Pode ser como um famoso time de futebol, um atleta. Ah ha Buf jogo. Pode ser sobre qualquer coisa. Realmente. Então você tem as mesmas dimensões que eu fiz para criar um tipo similar de design. Faça seus quadros de arame primeiro e pense sobre quais informações você vai trabalhar. Pense no que poderia ser importante para o usuário. Eu usei o produto em destaque como algo que poderia ser importante para o usuário. Mas, por exemplo, se você estiver trabalhando com um atleta, você pode trabalhar com a idade e a nacionalidade ou algo assim. Então pense em como você pode fazer a informação aparecer, postar seu projeto aqui na aula, e eu vou me certificar de verificar todas elas e dar alguns comentários a vocês. Estou ansioso para o que seu cara eles vão inventar e se lembrar, se divertir com isso. 10. Redonde: Então foi isso para a turma. Espero que aprendam algo sobre hierarquia visual e espaçamento grande. Obrigado por ficar comigo. Tenha em mente que foi a primeira vez que fiz isso. E sei que a cláusula está longe de ser perfeita. Foi um projeto divertido para trabalhar. Estou ansioso pelo que vocês vão inventar em um projeto de classe sobre DFO. Ou vou fazer algumas cláusulas futuras sobre animação e alguns outros tipos de tópicos. Então isso foi tipo de classe e obrigado por ficar comigo novamente. E eu também adicionei um pequeno bônus. Ouça, sobre como eu preparar meu projeto para um show de drible. Vejo-te na próxima vez. 11. Ade de bônus: como fazer uma foto de lesson:: Ei, pessoal. E bem-vindo à lição bônus. Então, neste Ouça, vou explicar como preparo fotos de drible com o design que acabamos de fazer. Então a primeira coisa que vamos fazer é abrir nosso projeto aqui. Nós vamos salvá-lo como, ah j arquivo pic. Então, há uma maneira fácil de fazer isso. Vá até aqui com o nome do seu quadro de arte e clique, certo? Faça o certo. Clique em e, em seguida, você escolhe a opção de exportação como vamos fazer isso. Agora, vamos escolher um encontro aqui atrás. Nós só vamos exportar tudo aqui na minha habilidade. Xerife Fuller, vou chamar isto de nove e exportado. Então vamos fazer um novo, um novo, uh, uh, documento vai ser oito abaixo de 600. Fala ALS porque há o tamanho para uma sessão de drible. Vou chamá-lo de drible, atirar e na prisão. Então agora temos nosso novo arquivo aqui. Vou falar sobre o meu projeto que acabei de nos salvar uma foto J. Vou arrastá-lo para cá. Então agora vemos que está aqui com caixa delimitadora aqui. Só vou torná-lo um pouco menor, assim e vou dar um minuto aos grandes motivos. Arraste um retângulo lá para uma cor de fundo vai arrastá-lo até aqui. Vou fazer uma cor cinza claro para termos algum contraste entre o fundo e o dedo do pé, algo assim. E então, para a sombra, poderíamos fazer como, uma sombra normal aqui como esta. Mas eu gosto de uma sombra mais interessante, e eu vou criá-la pressionando Vamos lá, Jay, e duplicar design. Vou clicar na parte inferior que vou pressionar o comando t para transformar. Mas eu vou fazer isso um pouco Vou fazer com que vá lados diminua um pouco isso talvez Diskin de baixo também. Então nós não temos uma sombra no topo aqui e basta pressionar enter e, em seguida, os designers abaixo dela , que é o que nós vamos aplicar a sombra para clicar duas vezes na camada para os estilos de camada . Então eu vou escolher o Drop Shadow um bom ano. O ângulo é 90. Agora podemos brincar com a distância. Então a distância que você vê aqui pode ser algo assim, e eu vou ligar o tamanho dela. Então eu meio que gosto de como isso está parecendo, e então podemos brincar com a opacidade. Então isso é talvez dois cavalos caindo um pouco. Então vai ser algo assim, e é isso, na verdade. Então aí você tem seu abrigo de drible pronto. Então obrigado novamente por ficar comigo. E espero que tenham gostado de vidro.