Transcrições
1. Introdução: Bem-vindo ao curso de Web design com Sigma e este curso vamos aprender a projetar um aplicativo Web simples para serviço de entrega de lavanderia. Se você fez um curso anterior, também
elaboramos uma versão móvel para isso. E assim, neste curso, nós vamos estar trabalhando na aplicação Web para ele alto. Meu nome é Nina, e sou sua instrutora para este curso. Ao longo dos últimos 10 anos, desenvolvi e desenvolvi obrigações móveis e Web tanto para starups em meus próprios projetos
e outros clientes. No final deste curso, você aprendeu a projetar um belo aplicativo de painel da Web para empresas ou clientes , ou talvez até mesmo para seus próprios produtos também. O que projetamos. A marcação de três páginas onde mais aprenderá como importar modelos para Sigma. Como usar a imagem mascarada para nossas imagens estará aprendendo como os componentes podem nos ajudar a tornar o processo de
design muito mais rápido. Também estará aprendendo a usar o layout automático, que podemos usar para criar designs bonitos e
intuitivos que podemos replicar muito rápido, até mesmo usado o conteúdo da Microsoft. Rio conecte-se diretamente dentro de Sigma para gerar alguns dados de amostra para o nosso projeto. Por último, mas não menos importante, vai aprender como podemos criar várias versões do nosso projeto e usar o histórico de versões diretamente dentro de Sigma para ser capaz de navegar todas as diferentes versões de nossos projetos. Então, se você está pronto para aprender a projetar uma aplicação de borracha bonita e
simples usando Sigma, salte para a direita e eu vou vê-lo neste curso.
2. Descida de projeto: Tudo bem. Até agora, construímos uma simulação para um aplicativo móvel. Uma marcação completa com sete páginas. Ah, e agora nossos clientes nos deram um novo projeto para trabalhar, e desta vez parece que vai ser um aplicativo da Web. Ah, para suas lojas de lavanderia realmente procurar seus pedidos de serviço dos clientes. E então, a partir daí, eles podem aceitar ou recusar esses pedidos e, em seguida, alterar seu status. Ou a última marcação permitiu que os clientes desta empresa de canguru limpa pudessem realmente
enviar um pedido para que sua roupa fosse retirada, levada para a loja de lavanderia e, em seguida, entregue de volta a eles frescos e limpos. E então parece que agora eles querem um tipo de painel ou painel da Web para suas
lojas de lavanderia para ser capaz de usar, o que completamente faz sentido. E, claro, queremos criar um aplicativo da Web que seja responsivo. Então, se o cliente ou a loja de lavanderia abrir em seu dispositivo móvel, ele ainda parece bom. Precisamos criar o esquema de cores,
então já criamos um esquemade cores para os últimos projetos que aplicaremos nosso
esquema de corese também nossos fundos para o projeto também. Precisamos criar o esquema de cores,
então já criamos um esquema de cores para os últimos projetos que aplicaremos nosso
esquema de cores E, claro, podemos usar o logotipo para este projeto também. Neste momento, estamos realmente interessados nas páginas necessárias para o momento. Então, queremos se inscrever, cortar a página de login e, em seguida, se inscrever. As opções serão enviar passaporte por e-mail e assinar com o Google, semelhante ao nosso aplicativo móvel. Queremos um painel para ver seus ganhos e estatísticas de cima faz sentido. Então isso é novamente para as lojas de lavanderia para ver quanto dinheiro eles ganharam através do Clean Kangaroo e então eles estão dizendo que um gráfico aqui seria bom. Então vamos em frente e encontrar um gráfico para usarem tão baixo. E, em seguida, por último, vale a pena mostrar todo o seu pedido de serviço com a opção de optar por alterar o seu estado de cada pedido para dar ao cliente eso informado. Se você se lembra em nosso design de aplicativo móvel, tivemos um pequeno status sobre os serviços e isso mostrou que passo lá serviço de lavanderia estava em. Então isso é controlado pela loja, como a loja de lavanderia aqui, hum, passando por esta página e mudando o status de cada pedido ou cada pedido que chega . Então, sim, muito simples e direto. Bem, página
de inscrição de aplicativo, uma página de painel e um serviço que eu solicito página. Então, agora que sabemos muitos dos conceitos e ferramentas que temos acesso no MMA figo, eu acho que projetar essas três páginas será super fácil. E na próxima lição, vamos entrar e começar a configurar com um modelo. Ah, e indo de lá.
3. Começando com um modelo: Certo, então acho que estamos prontos para começar com nosso novo projeto aqui. Uma coisa que eu vou mencionar é que nós não vamos gastar tanto tempo passando por detalhes
muito específicos neste projeto só porque nós cobrimos praticamente tudo nas últimas seções. Então, vamos passar esta seção realmente ficando para baixo para montar maquete para Rob aplicação Super fast eso, a
fim de ajudar sem. O que eu fiz é que eu coloquei juntos um pequeno arquivo de modelo em ter usado um monte de outros modelos que você pode encontrar a partir deste modelos usado um ponto Txt. Então, este primeiro link aqui é um link para desenhos de materiais modelo figo MMA eles podem usar este é
uma versão gratuita. Então, ele inclui um monte de elementos e desenhos que você pode usar gráficos gratuitos deste um para MMA
figo. Ah, que você pode ir e usar também, e isso lhe dá gráficos bonitos dentro de seus desenhos de figura fora. Então eu já fui em frente e baixou estes e, em seguida, colocá-los dentro deste modelo web
canguru limpo que você pode usar. E tem um monte de coisas dentro também que nós vamos explorar eso, a fim de adicionar isso ao seu projeto ou seu MMA figo Primeiro, eu vou para a minha equipe de canguru limpo aqui porque eu quero colocar isso dentro de um projeto em Aqui. Se você não tem esta equipe onde você não seguiu este passo, você também pode simplesmente colocar este arquivo em sua pasta de rascunhos, bem como, e isso vai funcionar muito bem. Então eu vou seguir em frente e cabeça aqui para um novo projeto em Vamos apenas nomear este projeto Web aplicativo ou vamos fazer lavanderia loja Web app. Vamos criar projeto e, em seguida, vamos em frente e selecione Are Clean Kangaroo chorou. Simplesmente não encaixe o arquivo aqui Uma vez que ele é importado com sucesso. Eu vou fazer um duplo clique para abri-lo aqui e vamos realmente rapidamente rever
algumas coisas aqui. Então, há quatro páginas configuradas aqui. O 1º 1 tem nossos três quadros principais que estavam tentando projetar Um, a quarta página aqui tem os requisitos que passamos na última lição. Eso você tem acesso a isso aqui é baixo e Estas são as três páginas que estavam tentando projetar em nossa página de marcações Web Mais aqui, então temos estilos. Então eu fui em frente e realmente criei alguns estilos para o meu texto, bem
como o esquema de cores que usamos na última lição ou nas últimas seções. E, na verdade, adicionei-os aos estilos locais também. Assim que você importar este arquivo, você terá acesso aos mesmos estilos de cores que adicionamos nas seções anteriores, bem
como alguns têxteis com nosso Fundo Rubicam Carla. Agora, se você não seguiu as últimas seções, vá em frente e certifique-se de instalar esses fundos em sua máquina local. E então, se você estiver executando a fig mo web up, vá para o Google e procure o instalador de fontes MMA figo e então baixe isso para que você possa usar essas fontes em seu figo, meu aplicativo Web também. Caso contrário, se você estiver sob essa parada, você pode simplesmente instalar essas fontes e depois voltar para cá, e então deve funcionar muito bem. Eu também tenho uma página de componentes aqui onde eu coloquei foram novamente. Eu usei desenhos de materiais, modelos de
figment para gerar muitos destes. Recurso é assim que temos um monte de cartões aqui que podemos usar. Temos um pequeno gráfico aqui a partir do modelo de gráfico que eu lhe disse anteriormente. Um monte de botões,
suspensões, campos de
texto, campos de
texto, até mesmo e depois meio que subiu aqui para obter informações e coisas assim. Ah, e também um pequeno painel de navegação também. Agora, a razão que criou estes e forneceu-lhes com eles para que possamos passar por montar juntos ou zombar super rápido. Hum, nós já aprendemos muitos desses conceitos, incluindo como criar componentes e como reutilizar e alterar componentes e como criar
instâncias a partir de componentes e usá-los. Hum, se você ainda não lavou essas lições, certifique-se de ir para as últimas seções e rever os componentes. Ou se você esqueceu como eles funcionam, eu os encorajo a rever novamente essas lições como baixo em apenas tipo de chegar a velocidade com isso. Sim, bem, use muitos desses componentes aqui só para tornar nosso processo de design muito mais rápido e eficiente. Uma coisa legal que não vamos nos meter muito,a
propósito, a
propósito, é que em seus ativos você vai encontrar um pequeno ícone de biblioteca de equipe aqui. Sim. Se você estava trabalhando com uma equipe, você pode realmente ir em frente e publicar esses componentes que você tem aqui para
toda a sua equipe. E agora, depois de selecionar isso, se você não tiver a versão completa, ele dirá que você precisará de um plano profissional para usar esse recurso. Você também pode simplesmente publicar o estilo para que entre sua equipe, se ela estiver trabalhando em vários projetos, você possa usar os mesmos estilos. Então, se eu clicar nisso, todo
o aplicativo canguru da equipe terá acesso a esses estilos para a fonte. E a cor é bem s Oh, você pode definitivamente publicar esses estilos entre suas equipes e usá-los no plano gratuito. Mas se você quiser também ter acesso a todos esses componentes entre vários
projetos diferentes ou vários arquivos diferentes dentro de sua equipe, definitivamente aproveite o ano da biblioteca da equipe. E, claro, você pode usar todos esses componentes apenas indo para o toque de ativos, e você tem acesso a eles bem aqui. Estes são apenas componentes gerais que não têm uma categoria. Estes botões de ar, contentores ver cartões, por isso vamos definitivamente usar estes e as nossas simulações aqui. Então vamos voltar para rep mock ups e, em seguida, no próximo ouvir vai começar a projetar nossa página de login a partir daí.
4. Página de login: Tudo bem. Então, sem mais delongas, vamos pular para projetar nossa página de arrastar aqui. Eu só vou usar set e zoom na página bem aqui. Então o que eu quero fazer aqui, eu quero ir em frente e dividir isso neste quadro em duas porções do lado direito. Vou ter um pouco de imagem. Então, no lado esquerdo, teremos nosso registro e painel, o que será bastante simples e direto. Então, as primeiras coisas primeiro. Vamos em frente e usar a grade de layout para que possamos ver exatamente o que estamos fazendo. Vamos em frente e clicar no quadro, e então eu já configurou um layout grão s para que possamos simplesmente ativar a visibilidade e usar isso aqui mesmo. Você deve ver este ano porque isso faz parte do modelo. Mas se você não simplesmente ir e adicionar uma grade de layout com um tipo de coluna de contagem 12. Eu disse que o papa, uma cidade da cor para 3% por isso é mais fácil ver todo o resto. , O tipo será esticado e,em seguida, as margens são 60 nos sites na sarjeta são 10 entre as colunas aqui,
então, uma vez que você ligar isso,
vamos em frente e criar um retângulo para talvez aqui. Vamos apenas ir em frente e ter certeza que esta é uma linha corretamente. E agora vamos usar um plug muito legal chamado Unspool Ash. Então vamos para gerenciar plugins para instalar isso. Se você não tiver,
basta ir para procurar todos os plugins. Agora, uma vez que isso carregue, você vai notar que pode ser a primeira opção aqui. Ou quando você estiver assistindo esse vídeo, ele pode estar em outro lugar. Assim, você pode simplesmente pesquisar em Splash na barra de pesquisa. Aqui está bem, já tenho instalado, então eu não vou instalá-lo. Mas você pode clicar neste botão para instalá-lo e vamos voltar para o nosso arquivo aqui e , em seguida, usado plug in na barra. Agora, se você se lembra, usamos cinzas unspool em nossa página de login anterior que fizemos em nosso aplicativo móvel. Agora, este é novamente um recurso de imagem de estoque gratuito que você pode usar e por isso eles estão plugin ajuda você a inserir imagens muito mais facilmente em seus projetos. S então certifique-se de primeiro selecionar o seu retângulo aqui e, em seguida, vá para cima para pesquisar em Vamos fazer talvez loja de lavanderia, ver o que aparece. Legal. Então temos um monte de opções. Eu só vou manter as coisas simples e ir com este 1º 1 aqui. Acho que parece muito bom. Legal. Só vou fechar isso aqui, , e agora vamos em frente e criar um pequeno divisor entre essas duas seções. Então eu estou criando uma linha e usando shift para ter certeza de que ela é reta e, em seguida, fazendo uma
cor de traçado fora. Vamos para os nossos estilos e escolher o nosso Vamos fazer a cor secundária aqui, o laranja vamos fazer a largura, talvez cinco pixels ou o ano de espessura. E então vamos em frente e mover isso para os direitos. Então está bem entre nossas diferentes seções aqui. Talvez possamos aumentar até oito pixels ou vamos fazer seis pixels. Isso parece bom. Então agora vou desligar minha nota de layout para o quadro aqui. Ah, e então vamos em frente e criar um quadro para o nosso registro e painel aqui e ter em mente, você sempre pode criar quadros dentro de quadros apenas para manter as coisas mais organizadas. Vá em frente e desenhe uma moldura aqui. Apenas certifique-se que se encaixa nesta seção inteira aqui. E então podemos até configurar um layout. Ótimo dentro daqui. Vamos fazer. Collins tem quatro Colons com uma margem de 60. Eu a peguei de 10. Faça 5% aqui apenas para que possamos alinhar as coisas corretamente. Vamos primeiro ir em frente e adicionar ou logotipo na parte superior. Então vamos mudar para o nosso recurso é que você deveria ter baixado da última lição. Uh, vá para o logotipo e vamos em frente e arraste este SPG de cor canguru direto para aqui. E então enquanto segura, deslocando Ault, eu vou ir em frente e redimensioná-lo enquanto mantém sua posição para Let's Do 76 por 76. Deve funcionar. Só vou ir em frente e colocá-lo bem aqui e talvez manter um espaçamento de 60 do topo é baixo. Vamos usar T para criar um texto de logotipo também aqui, e depois ir em frente e atribuir um estilo ou um têxtil de título um e, em seguida, escolher ah, estilo de
cor ou estilo de preenchimento do azul primário. Aqui, vamos seguir em frente e apenas alinhá-los selecionando-os juntos. E então vamos em frente e agrupá-los juntos também. Usando o Comando G. Vou renomear isso para logotipo. Vamos em frente e adicionar uma descrição. texto aqui é linha, então é usado T. Mas desta vez vamos desenhar uma caixa delimitadora para o texto bem aqui. Só não transborda a menos que se inscreva para ver seus ganhos e exceto
solicitações de lavanderia dos clientes. Acho que isso é bom. Vamos em frente e desvinculado este estilo e fazer ir para que parece bom. E agora vamos em frente e adicionar alguns botões e campos no ano. Hum, então vamos em frente e escolher nossos bens. Esfaqueie aqui e então vá em frente e abra os componentes aqui. Vamos dirigir a assinatura do Google, mas aqui e então vamos em frente e arrastar um campo de texto são na verdade dois deles aqui , um para e-mail, um para senha, e então nós também precisamos ah habilitado mas em como linha para o nosso login. E então há uma divisória aqui também. Então nós vamos apenas separar os dois tipos diferentes de Loggins usando este divisor. Então vá em frente e arrastado que aqui é baixo e vamos em frente e apenas zoom aqui e eu estou devidamente alinhado estes bem e redimensioná-los perfeitamente. Você está assinando com o Botão Google para ser o primeiro aqui, e depois vamos ter o divisor aqui. Vamos usar os centros horizontais alinhados, mas aqui, apenas para ter certeza de que ele está alinhado corretamente, mova estes um pouco para baixo e então talvez mantenha um espaçamento de 30 pixels aqui, 30 pixels com os campos de texto campos de texto podem ser talvez 15 pixels um do outro, onde podemos até mesmo fazer 10. E vamos em frente e apenas colocar o nosso mas aqui também arrastá-lo todo o caminho através. Vamos trazê-lo para baixo um pouco porque nós também queremos colocar uma senha esquecida. Mas aqui sim, podemos fazer isso apenas cozinhando chá e, em seguida, digite para obter senha. interrogação. Se não lhe der automaticamente os botões. A Carla. 14 pontos Ah, têxtil. Aqui, vá em frente e desconecte a célula e, em seguida, selecione. Mas na Carla 14 pontos. Vamos em frente e alinhá-lo aqui. 2 20 pixels daqui. Ok, isso parece bom. Vamos continuar e também duplicar este botão de passaporte esquecido. Coloque-o aqui e, em seguida, faça os termos de serviço e a política de privacidade dos links aqui. Eu vou selecionar o fim e realmente usar o comando. Esteja aqui para se desdobrar. Ele será controlado além do Windows. Vamos em frente e apenas assim e fazer linha horizontal e, em seguida, manter o espaçamento fora. Vamos fazer 40 de baixo. Vamos em frente e selecionar este quadro aqui e apenas esconder ou layout grade apenas para ver o que
temos . Acho que isso parece muito bom. Vamos em frente e apenas renomear um monte de coisas aqui ou alterar a configuração de um monte de componentes aqui. Uh, eu vou entrar aqui, mudar este para e-mail. Vamos mudar essa para senha. E agora, se selecionarmos ou painel de camadas, devemos ser capazes de saltar aqui. E então vamos esconder nosso quadro de sorte aqui para mostrar o e-mail e depois fazer o oposto no melhor campo e esconder o correio. Perfeito. Temos e-mail e senha, e agora só queremos mudar o nome deste botão para fazer login. Vamos em frente e apenas um multi. Selecione estes dois botões é Lei e Mudança. O preenchido para o nosso estilo de cor escura ou de texto aqui também. Perfeito. Acho que temos um bom tronco em paz agora e agora. Espero que você esteja começando a ver o poder dos componentes reutilizáveis e a rapidez com que podemos
montar uma página como esta que pode ter levado horas em outro design. O software é perfeito. Então, em nosso próximo vídeo, vamos entrar em nossa página do painel e criar um painel legal para nossas lojas de lavanderia aqui.
5. Maças de imagem: Tudo bem. Até agora, aplicamos imagens a formas simplesmente arrastando-as para a forma ou sobre a forma. Mas nós realmente não exploramos como as máscaras de imagem funcionam. Então, nesta lição, eu vou mostrar a vocês uma maneira alternativa. Ocorreu imagens em seu projeto. Então, digamos aqui, em vez de ter minha imagem de fundo aqui dentro deste retângulo, eu quero tê-lo dentro, talvez em um lábios ou um círculo ou talvez em vários círculos. Hum, realmente
cabe a você. Máscaras de imagem. Realmente? Dê-nos a opção dois, por favor. Imagens dentro de outra forma ou várias formas em. Vou te mostrar exatamente como isso vai funcionar. Para demonstrar. Vou criar um círculo aqui sobre a minha forma. Acho que algo assim funcionaria. E então agora o que eu quero fazer é colocar esta imagem dentro do círculo e cortar
tudo fora do círculo essencialmente para que a imagem essencialmente mostre dentro
do círculo, e ele apenas esconde tudo o resto fora. Então eu vou seguir em frente no painel de camadas, arrastar meu círculo abaixo da minha imagem aqui, então eu vou selecioná-los juntos e fazer a opção usar como máscara. E como você pode ver aqui agora nós aplicamos uma máscara de imagem, modo que a imagem é simplesmente máscara. Com isso, vamos moldar aqui para que você possa redimensionar seu círculo aqui. Se você quiser, mova-o para escolher onde você quer que seu círculo seja ou mesmo se você quiser vários círculos. Digamos que para representar essa máscara, você pode simplesmente ir em frente e duplicar seu círculo assim. Eu duplicei três vezes, então vamos selecioná-los todos juntos e depois fazer a seleção do sindicato aqui. E agora, se eu criar outra máscara novamente certificando-se de que minha forma de união está abaixo da imagem aqui e , em seguida, selecionando-os e batendo em Máscara ou Controle dos EUA, vamos em frente e fazer a mesma coisa. Então agora temos a nossa imagem colocada dentro deste tipo de único. Eu uso três formas de círculo ou o que quer que você queira chamar isso aqui, então sinta-se livre para brincar com isso e ver como você gosta de apresentar sua imagem em seus projetos. Por enquanto, vou apagar este sindicato e arrastar essa imagem para fora do meu grupo . E agora voltei ao que tinha antes. Então é assim que a maestria da imagem é legal.
6. Página de painel: Tudo bem. Assim, com a nossa página de login reunida, agora
podemos passar para a nossa segunda página aqui, que é a página do painel. Hum, então nós queremos incluir um monte de coisas aqui, como as receitas da loja de lavanderia, hum, como Bella. Talvez mostrar a eles uma lista de alguns de seus clientes e quantos itens eles têm ou pedidos de
lavanderia Hominy . Eles agradaram. E coisas assim poderíamos definitivamente adicionar um monte de outras coisas como suas audiências. Ao mesmo tempo, eu quero manter esta página simples apenas para a simplicidade desta seção Aqui. Nós não queremos ir muito em detalhes, mas sinta-se à vontade para fazê-lo você mesmo se quiser adicionar mais a este paciente do painel de controle. Então, se agora mudarmos para nossa guia de ativos aqui, um, primeira coisa que queremos fazer é ir até os componentes, e então você deve ser capaz de encontrar este componente de navegação aqui. E vamos em frente e apenas arraste uma instância. E aqui e vamos apenas ir em frente e alinhá-lo à esquerda. Deixe-me ver se entendi direito. Perfeito à esquerda no topo. Parece bom agora, por padrão, já alterou a cor de fundo desses quadros para esta cor aqui. Então, se o seu não está definido para essas cores, vá em frente e defina-o aqui. Este é apenas um pouco de estilo ou fundo é em branco liso, e acrescenta um pouco de apenas um pouco de contraste entre diferentes elementos, como a minha navegação aqui no fundo. Ainda assim, com nosso painel de navegação adicionado aqui, , a opção de painel já foi selecionada neste, então não precisamos fazer nenhuma alteração aqui. Então vamos em frente e começar a criar nossa página de painel aqui. Então, a primeira coisa que eu quero fazer, é como chá e painel direito só para dizer a eles que estamos na página do painel. E então vamos em frente e desvincular esse têxtil e adicionar um título um. Vamos mudar o Phil para o estilo de cor escura de texto. Vamos avançar e talvez mover isto para cima e alinhar em algum lugar por aqui e talvez manter o espaçamento distinto a 50 pixels daqui. Então, em nossos componentes, nós também temos contêineres, então vamos em frente e arrastar um grande contêiner para o nosso quadro aqui. Vamos em frente e também arraste um pequeno recipiente. Usaremos este grande contentor para guardar, ou talvez gráficos de receitas e coisas assim. E então este para talvez mostrar alguns dos clientes recentes para esta loja de lavanderia aqui. Então vamos em frente e apenas uma linha faz. Ei, aqui. Isso é manter um espaçamento de 50 e, em seguida, entre si. Vamos manter o espaçamento fora 30. Talvez. Acho que está muito bom de novo. Você pode definitivamente usar grãos de layout aqui para tornar seu trabalho um pouco mais fácil quando você está forrando coisas. Mas, por enquanto, vou me concentrar em criar esse design. Perfeito. Então agora vamos em frente e também pegar alguns cartões de visualização daqui. Vamos fazer a primeira opção aqui,
onde você coloca aquicom o espaçamento de 30 pixels do topo,
apenas como um lembrete mostrando o espaçamento entre diferentes elementos usando Ault. Vamos fazer a primeira opção aqui,
onde você coloca aqui com o espaçamento de 30 pixels do topo, Então, se você segurar tudo para a tecla de opção, você pode ver o que, ao ter um objeto ou uma forma selecionada, você pode ver o espaçamento com qualquer objeto que você passar o mouse sobre. Só um lembrete para o caso de você ter esquecido como fazer isso. É muito útil. Legal. Então vamos em frente e adicionar outro aqui. Talvez um selecionado agora. E você espaçamento de 30 novamente entre isso e novamente como aprendemos e consistência ux é a chave . Nós não queremos adicionar ah, espaçamento que parece fora comparado com tudo o resto. Então é por isso que estamos usando um espaçamento consistente aqui. Vamos ir em frente e usar Ault e arrastar outra instância desta ONU selecionado ou não selecionado opção do cartão de visualização aqui também. E novamente, eu vou apenas verificar novamente para ver se tudo está alinhado Perfeito. Vamos trabalhar o nosso caminho de cima para baixo aqui. A
primeira coisa que quero ir em frente e mudar este título para receita perfeita. E então vá em frente e mude esse texto suspenso para talvez vamos fazer mensalmente. Então, a partir daqui, talvez o usuário possa selecionar o termo que deseja ver seus gráficos em ou o que Lengthy. Quero procurar os dados do gráfico deles e, hum e então eu vou em frente e selecionar dos meus componentes um gráfico de barras para colocá-lo bem aqui. Vamos em frente e usar o shift aqui para redimensionar isso uniformemente. Vou manter o comando e expandir isto um pouco mais perfeito. Então, temos um espaçamento de 24 pixels de cada lado, então parece agradável e centrado. Então, primeiro vamos. E aqui e mudar esta receita para talvez refletir o mês que estamos olhando. Então vamos fazer apenas um exemplo de outubro de 2019. Isso parece bom. E parece que temos um monte de filtros aqui para o gráfico. Então nós realmente não precisamos deste aqui em cima para que possamos ir em frente e simplesmente apagá-lo daqui. Ter tudo sobre isso seria bom se você pudesse mostrar a receita total desse mês, talvez aqui em cima. Então vamos em frente e ir para o componente mestre aqui. E então vamos adicionar um texto aqui. Talvez colocar em uma quantidade em dólar em um fazer 000 O que está desligado ou destacado o estilo aqui e mudá-lo para ir para sobre este? Vá em frente e apenas mudou a cor de preenchimento para a nossa tecnologia. Comece aqui e mexam-se. Pode ser bem aqui, e claro, podemos usar o show e nos esconder. Se você quiser mostrar o filtro em vez do cifrão aqui. Mas, por enquanto, vou deixar isso aí. Vamos voltar para a nossa página de marcações da Web, e agora temos que aparece bola. Então vamos em frente e apenas editar isso e colocar em um número de amostra que parece bom. Vamos em frente e ajustar esses números aqui em baixo é, bem, eso se você notar que temos um monte de ícones aqui que estão em camadas em cima um do outro, vamos para este 1º 1 e clique em ícones. Então, uma vez que você encontrou o grupo Icons aqui, vá em frente e abra e você deve ver três ícones aqui. Ah, o 1º 1 representa as Estrelas ou quantas classificações eles têm. Hum, então neste, nós queremos fazer as pessoas, então nós queremos deixar este como mostrado, e então os outros como escondidos. E então faremos. Vamos embora que já ganhou 20 clientes. Hum, e então vamos em frente aqui para o 2º 1 É como os ícones aqui dentro. E então vamos em frente e esconder o ícone do povo agora e então vamos esconder este também , então nós só temos o do meio aqui e pode estar aqui em vez de 1 28 nós podemos mostrar que sua receita
total foi apenas colocado em um número aleatório aqui talvez 41 k e fazer a receita total. Isso parece bom. Vamos em frente por aqui. Então, aqui,
vamos em frente e deixar o 1º 1 e esconder os dois últimos, que deve nos mostrar este iPhone estrela aqui, e eu talvez façamos. Vamos fazer 4.5. Vamos fazer uma classificação média como esta. Eu acho que isso parece bom quando você usa comando e rolagem para diminuir o zoom de lá. Perfeito. Assim, o cliente aqui tem várias opções. Eles podem ir para diferentes guias para talvez ver suas classificações ao longo do tempo, talvez ver seu número de clientes ao longo do tempo. E isso tratará a página que estamos aqui, ou as estatísticas que estamos mostrando aqui em termos de seu painel. Agora vamos em frente e adicionar algo aqui. Vamos em frente e dobrar rápido e mudar isso para clientes recentes. Vamos ampliar aqui e agora se você passar por componentes de ativos, criei dois tipos diferentes de listas de avatares aqui. Então são os sapatos do 2º 1 aqui, que é o mais simples. E vamos apenas ir em frente e, hum, com um espaçamento de 24 aqui e então redimensionar isso para combinar com esse espaçamento. Certo, Austin, isso parece bom. Então, com um criado aqui, vamos em frente e usar Ault para arrastar outra cópia aqui e fazer. Pode ser um espaçamento de 12 entre cada item. E agora, se você realmente pressionar o comando de várias vezes, ele irá em frente e duplicar os próximos itens nesse espaçamento também. Acho que é bom aqui. Assim, a lição futura vai voltar e realmente preenchê-los com dados de amostra adequados para que eles não fiquem muito simples assim. Mas por enquanto, se eu diminuir o zoom, acho que tenho praticamente tudo o que eu queria adicionar ao meu painel aqui. , vez, temos um monte de espaço vazio aqui, então se você quiser preenchê-lo com um monte de outras coisas para um par de idéias que vêm à minha mente poderia ser você poderia mostrar a eles seus ganhos médios por ordem ou sua tempo médio de
resposta, então há um monte de coisas que você pode adicionar aqui para torná-lo melhor. Mas por enquanto, acho que vamos aceitar isto só para manter as coisas simples. E em nossa próxima lição, vamos voltar para a página de solicitação onde temos a lista de solicitações de lavanderia dos clientes, e então nós vamos realmente projetar isso usando um conceito muito legal chamado também.
7. Layout automático: Certo, acho
que estamos prontos para passar para a nossa última página aqui. Ah, a página do pedido. Então é aqui que a loja de lavanderia ou quem está logado na loja de lavanderia será capaz de ver sua lista de pedidos, se eles são os que precisam de aprovação ou aqueles que estão sendo lavados ou
secos ou o que quer que seja O caso é. Então nós vamos ter alguns componentes semelhantes desta página. Então, quando formos em frente e apenas copiá-los sobre eso, vamos ter a navegação aqui, então vamos selecionar que uma parede segurando o turno. Vamos como este título aqui. E, em seguida, vamos apenas como para esta vista bem usando o comando. Veja, nós podemos ir para o nosso quadro de pedidos aqui e então fazer o comando V Perfeito. Vamos mudar o nome para solicitar. Vamos ampliar aqui e vamos para a nossa guia de solicitação aqui, ou a seleção bem aqui. E vamos em frente e retângulo anti-higiênico a partir daqui e, em seguida, esconder o retângulo do outro e vamos em frente e selecionar o texto aqui estilo separado e fazer texto estilo escuro . Vamos gostar do ícone aqui. Estilo separado e fazer este texto cor média. E então vamos entrar aqui e fazer o oposto. Mude este, também, a cor primária aqui e, em seguida, fazer este também um estilo de cor primária perfeito. Então nós apenas trocamos a seleção de um para este. Aqui. Você poderia dar um passo adiante e realmente fazer um componente para cada um para ser selecionado ou em selecionado e levar as coisas um pouco mais longe e nossos componentes mestre, ou fazer os ajustes aqui em cada instância perfeitos. Então agora que temos isso, vamos para o nosso Vamos para o nosso contêiner aqui e vamos em frente e alinhá-lo aqui com o texto da solicitação, e eu vou apenas ir em frente e torná-lo maior para que ele se encaixe quase na tela inteira. Vamos ver como estamos com o espaçamento. Manter o comando, torná-lo um pouco maior aqui, e vamos em frente e apenas redimensionar isso para esta altura, e eu acho que parece bom. Então vamos para o texto aqui e mudar o alinhamento para alinhar à esquerda. Vamos em frente e mudar o texto para um solicitações de espera, então estes são essencialmente os pedidos que a loja de lavanderia precisa aceitar ou rejeitar. Na verdade, talvez possamos fazer isso menor, então temos alguns pedidos do que aqui. E então temos um monte de outras opções para talvez pedido aceito e assim por diante. Agora eu quero mostrar a vocês um conceito muito legal chamado Odelay aqui fora. É relativamente novo com MMA de figo, mas é super útil, e essa pequena animação está mostrando um bom exemplo disso. Essencialmente, ele permite criar quadros inteligentes que se redimensionam com base no conteúdo que está dentro dele. Então isso pode ser bom para um monte de coisas, como botões novamente. Assim, enquanto você estiver digitando, os botões serão redimensionados de acordo com o texto. Ou, por exemplo, se você tiver um monte de elementos semelhantes que entrarão em um quadro, você pode usar o layout automático para mover facilmente as coisas movidas assim, se você quiser ler mais sobre layout automático, vá em frente e confira este artigo. Mas também vou aplicá-lo aqui para mostrar como funciona. Certo, então agora vamos para nossa facada aqui, onde temos uma lista de nossos componentes. E então vamos em frente e arrastar essa lista de avatares para aqui, e eu vou redimensioná-la. Reposicionar redimensioná-lo. Então combina com o nosso espaçamento. Acho que isso é bom. Agora, se eu quiser duplicar isso e criar várias linhas desta instância aqui, eu posso fazê-lo, é
claro, usando o comando D ou alter como fizemos aqui nesta tabela. Mas também podemos usar o recurso de layout automático foi A coisa é super legal. Então vamos em frente e tentar layout automático. Vamos voltar para nossas camadas aqui em Vamos em frente e usar Ault para duplicar isso aqui e agora. Vamos em frente e usar shift para selecionar ambas as instâncias aqui e, em seguida, Agora você verá que você tem uma opção chamada para fora cedo aqui. Se você seguir em frente e clicar no sinal de mais, algo legal vai acontecer. Esses dois elementos agora chegarão a um quadro de layout automático aqui. Agora, uma coisa que vou fazer é desmarcar este conteúdo de piada. Eu vou te dizer por que em um segundo Então aqui, eu vejo que tudo parece normal, mas se eu realmente ir em frente e cortar o conteúdo para que qualquer sombra fora desta caixa delimitadora seja cortada. Se esta opção aqui estiver ativada, vamos em frente e desligá-la por enquanto. E agora este é um quadro de layout automático. Então nós temos acesso a um monte de coisas, hum, no painel direito aqui. Mas vamos em frente e primeiro criar mais algumas linhas. E a maneira mais fácil de fazer isso é apenas clicar em um dos itens aqui e fazer o comando D, e como você pode ver automaticamente, as coisas serão colocadas para baixo. Você pode selecionar seu outro quadro de layout aqui e do lado direito. Aqui, você tem algumas opções, então vamos analisá-las. Então, primeiro eu quero mostrar a vocês essa opção vertical. Imagina que estás a mostrar esta lista de uma forma horizontal. Em vez disso, você pode realmente mudar isso para horizontal, e esta lista será exibida horizontalmente em vez de verticalmente. Mas se você escolher verticalmente, ele será mostrado assim, que é o que queremos. Você pode tratar isso. Você pode tratar o tapinha horizontal aqui, então se você quiser mais espaçamento, hum à esquerda e à direita. Você pode tratar isso daqui. Então, na verdade, se você fizer 24 aqui, podemos apenas ir em frente e mover este quadro para aqui. Perfeito. E este será o seu preenchimento vertical. Então, se você quiser adicionar qualquer espaço para a parte superior e inferior deste quadro de layout automático inteiro , você pode fazê-lo aqui. Então, se você tivesse preenchimento de, digamos 24 Então agora entre o primeiro item aqui e o último item, sempre
haverá um tapinha de 24 pixels. E então este é o espaçamento entre os itens porque originalmente quando fizemos isso em um quadro
automático, esse era o espaçamento entre eles. Então, apenas manteve isso. Mas nós definitivamente podemos twittar isso e, hum, ir em frente e aumentá-lo se você quiser mais espaçamento ou diminuí-lo se você quiser menos espaçamento. Hum, então eu acho que podemos fazer 18 aqui e vai ficar bem. Incrível. Além disso, podemos adicionar o mesmo estilo ao nosso fundo aqui, então vamos continuar. Adicione um preenchimento de branco. Agora podemos fazer o conteúdo do clipe porque adicionamos esses padrões e eu vou em frente e adiciono um raio de
borda fora. Quatro. Vamos em frente e adicionar uma cor de traçado. Então, agora, para um golpe, vamos em frente e mudar a sculler e usar esta ferramenta conta-gotas aqui para escolher a mesma cor que a borda deste outro recipiente. Aqui. Agora o Phil é branco, que é o que queremos. Um derrame é o que queremos. Podemos fazer o curso do lado de fora e vamos também para este outro recipiente aqui e usar o controle. Veja neste texto e, em seguida, vá em frente e escolha o meu quadro totalmente fora e fazer comando V, e agora você percebe que ele colocou na parte inferior do quadro aqui. Mas se você quiser ir em frente e colocá-lo em qualquer posição que você gosta, você pode fazer isso. Então, se você quiser, por exemplo, distinguir entre estes dois tomando, coloque-o aqui ou você pode colocá-lo no topo como nós queríamos. Vamos em frente e excluir esse outro contêiner que temos. Vamos em frente e eu mexo isso para o topo perfeito. E então agora, se continuarmos duplicando e adicionando mais itens ou quadro inteiro aqui vai crescer muito bem ou ele vai encolher à medida que você começa a excluir itens dele assim. Então, quando sairmos do estrangeiro aqui, então vamos em frente e duplicar este quadro totalmente fora, usando Ault e arrastando-o até aqui. Vamos fazer um espaçamento de talvez 30 no meio. Vamos em frente e agora mudar este também. Solicitações ativas onde podemos mostrar os serviços de lavanderia aceitos aqui. Legal. Então, há um ordenado para nós. Espero que agora você possa ver por que é tão útil. E com isso, acho que já completamos nossa simulação aqui em cima. Se eu diminuir o zoom, temos todas as três páginas que precisamos. Agora vamos em frente e em alguns dados de amostra porque agora parece muito simples s. Vamos em frente e fazer isso na próxima lição.
8. Como adicionar dados de amostra: Tudo bem, então com a nossa simulação praticamente concluída aqui, o que queremos fazer é ir em frente e adicionar alguns dados de amostra para este recente toque de cliente
aqui , ou o contêiner aqui e também nossos pedidos aqui. Portanto, um plug-in realmente útil quando se trata de adicionar dados de amostra aos seus designs é chamado Content Trio. Agora, se você se dirigir para gerenciar plugins, vá para procurar todos os plugins, você deve ser capaz de encontrar conteúdo real aqui. Ou você pode procurar por ele aqui também. Este plugins da Microsoft, que é super legal. Você pode ir dentro do evento e ler mais sobre ele. Mas, essencialmente, isso nos ajuda em alguns dados de teste ou em alguns dados de amostra em nossos projetos com muita facilidade. Então temos um monte de opções como nomes, números de
telefone. Endereço está em um monte de outros dados que podemos adicionar em nosso design. Então parece real. Então vá em frente e instale-o se você ainda não o tiver instalado e vamos para nosso projeto aqui e agora, vamos ampliar a nossa peça do painel aqui. Então eu ouvi para adicionar alguns dados de amostra primeiro significando para selecionar os combustíveis de texto. Eles querem adicionar dados para s. Então vamos em frente e para o nosso painel de camadas. Em seguida, clique na lista de Avatar e selecione o primeiro campo de nome aqui ou o primeiro texto de nome aqui e, em seguida, faça a mesma coisa aqui em baixo enquanto mantém o comando em. Basta ir para o próximo aqui e continuar fazendo isso por toda sua Rose. E acho que são todos os seis aqui. Então vamos em frente e fazer plugins. E assim o conteúdo da vida riel. E assim que a tomada abrir, podemos usar nomes. Mas antes de fazermos isso, vamos fazer apenas os primeiros nomes. Então toque nos três pontos aqui e, em seguida, desmarque as últimas coisas aqui. Vamos voltar, e então podemos ir em frente e apenas clicar nele para aplicar. E assim, temos um monte de nomes aleatórios gerados para nós aqui não para adicionar avatares para cada um de nossos avatares aqui, como você pode ver, se você clicar irá dizer-lhe que você precisa de uma imagem Lee ou primeiro, Então estes são todos,
na verdade, apenas ícones vetoriais. Mas precisamos de uma imagem. Então o que podemos fazer é voltar ao nosso componente mestre aqui usando esta opção. Vamos até aqui. Vamos como este exemplo de imagem de perfil que temos aqui em nosso toque de navegação ou uma barra lateral de
navegação e eu vou em frente e substituir este avatar por uma imagem, e então vamos apenas ir em frente e aplicar o mesmo tamanho. Então isto é 40 por 40. Então eu vou manter que 40 por 40 e, em seguida, sobre as porções aqui é, bem, perfeito, e nós podemos realmente ir em frente e esconder esta camada. Nós realmente não precisamos dele lá até que nós queremos aplicar uma imagem. E agora vamos em frente e apenas copiar isso usando o Comando C e aplicá-lo aqui é baixo para selecionar este avatar e fazer o comando V. E apenas para garantir que a palavra perfeita. Então agora vamos voltar para nossas simulações da Web, e agora temos uma camada de imagem aqui também. Então vamos em frente e abrir nosso plug in novamente para caçar para você, e vamos em frente e selecionar este quadro aqui. Agora vamos em frente e entrar neste quadro aqui e selecionar a imagem. E agora vamos em frente e realmente mostrar a imagem para este 1º 1 aqui e vamos em frente e imagem E anti-higiênica da primeira linha aqui. Então agora vamos em frente e aplicar avatar aleatório ao nosso cliente recente. Aqui está então vamos em frente e selecione a imagem. Certifique-se de ir e selecionar imagem real e não o quadro,
e, em seguida, fazer avatar aqui e escolher Masculino Perfeito. E agora, se você for para o próximo, certifique-se de selecionar o avatar novamente. Escolha a imagem
e, em seguida, com base no sexo aqui, podemos escolher imagem inadequada. E então vamos em frente e correr. Esconda isso também. Perfeito. Vamos para este avatar em Ocultar a imagem, selecionar a imagem e fazer o e-mail aqui. Agora tenha em mente que seus nomes podem ser diferentes aqui, então vá em frente e nas imagens. As imagens do avatar em conformidade. E vamos apenas seguir em frente e repetir isso todo o caminho. Então eu tenho que duplicar para que eu possa apenas ir em frente e clicar novamente para obter outra imagem. Perfeito. Isso está começando a parecer, Riel. Agora só temos as ordens aqui. Então, o que você pode fazer para isso como você pode ir em frente e clique duas vezes no texto aqui. Então selecione este texto aqui, vá para o texto e podemos apenas fazer números. Mas vamos mudar isso aqui. Não queremos fazer decimais. E talvez queiramos fazer um intervalo numérico nas tendas para que seja mais realista. Vamos voltar e adicionar números. Perfeito. Então, agora, se quisermos fazer isso por todos eles, podemos ir em frente. E como fizemos antes, com nossos primeiros nomes aqui, selecione cada texto para os pedidos. Vá em frente e escolha números, duas vezes gerar números aleatórios em todos os lados. E então podemos ir um por um aqui em ordens,
as ordens de texto. E então, para facilitar as coisas, podemos ir em frente e e o quê? Será que nós apenas selecionar os pedidos aqui e em seu usando copiar e colar? Agora você pode notar que o campo de texto aqui é super pequeno em termos de altura, então podemos definitivamente voltar e mudar isso para dar um pouco mais de altura, então é mais fácil trabalhar com ele. Mas acho que funciona aqui por enquanto. Vamos ir em frente e fechar isso agora se eu apenas diminuir um pouco, eu acho que fica muito melhor com dados reais adicionados aqui. Agora, vamos em frente e fazer a mesma coisa para uma página de solicitação. Mas desta vez eu só vou avançar através dele. Eu acho que agora você tem a idéia porque é realmente o mesmo processo. Uma coisa que eu quero dizer é que um ótimo atalho para usar aqui seria comando e deslocamento. Como juntos comando nos permite selecionar itens individuais dentro de um componente ou dentro de, ah grupo aqui, e deslocamento nos permitirá selecionar vários um. Então isso é muito útil. Eu definitivamente recomendo que para tornar este processo um pouco mais rápido. Tudo bem, então agora eu acho que eu tenho alguns dados de amostra, e aqui isso parece bom. Eu quero mencionar algumas coisas legais sobre layout automático. Você pode definitivamente selecionar um item aqui e movê-lo. Então, se você quiser, por exemplo, esta estrada específica para ser a 3ª 1 aqui. Você pode fazer isso ou você movê-lo para baixo, então é muito mais fácil mover as coisas agora se eu for para esta página aqui, nós não usamos totalmente aqui fora, mas podemos fazer algo semelhante. Se ele segurar vários itens juntos, podemos fazer coisas como aumentar o espaçamento. Se passarmos o mouse sobre esta linha rosa aqui e
arrastarmos para cima e para baixo, também podemos trocá-los usando este pequeno círculo que torna um pouco mais fácil mover as coisas também. E isto é, se você não tiver totalmente aplicado a este quadro. Outra coisa que eu quero mencionar sobre totalmente fora é que você não pode usá-lo com restrições. São conceitos completamente diferentes, e você não pode usá-los juntos. E agora que conclui, nossa Web simula aqui. Isso seria muito bom ano se nossas marcações também funcionassem com o ano móvel. Então, se fosse responsivo e funcionasse em um dispositivo móvel, isso seria realmente ideal tanto para o cliente quanto para seus clientes. Então, como um exercício, vou deixar isso para você projetar uma versão móvel também. Se você quiser, mas como um recurso, vou deixar a versão completa, incluindo uma versão móvel, e definitivamente poderia baixar esse recurso e verificar também.
9. Histórico de versão: Então, como mencionei no início do curso, uma das coisas bonitas sobre o estigma é que ele auto salva seu trabalho. Portanto, não há realmente necessidade de pressionar comando, salvar ou controlar seguro para salvar o seu trabalho. Outra coisa legal sobre isso é que o estigma cria automaticamente uma espécie de linha do tempo para o seu arquivo aqui também. Um monte de outros aplicativos também fazem isso, como o Google Sheets e até mesmo páginas no Mac. Então, se você ir para o seu nome de arquivo aqui e clicar na pequena seta e, em seguida, ir em frente e escolher mostrar overs no histórico aqui e depois aqui, você verá todos os salvamentos automáticos que o produto fez através da linha do tempo. Então este é o meu último “tudo para salvar”. Mas se eu clicar em outro, eu posso ver que isso é logo antes de adicionar meus dados de amostra. E então, se eu for, mais
uma eu posso ver isso é logo antes de eu adicionar os pedidos. Página s. Então isso é muito bom porque no caso de você querer fazer algumas alterações ou você quer voltar
para uma determinada versão que você tinha,
você pode ir em frente e clicar nos três pontos aqui e ou nomear esta versão para que você possa volte a ele ou restaure esta versão para que esta seja a versão atual. No caso de você querer se livrar das alterações feitas desde então, você pode até copiar o link e mostrar aos clientes ou equipes a versão do seu design. Uma coisa a ter em mente é que a versão gratuita só lhe dá 30 dias de
histórico de versões . Eu só vou voltar para este aqui, que é o mais recente. E você também pode adicionar uma versão manualmente, subindo aqui dando-lhe o título como então eu não
posso nem descrever o que mudou aqui e, em seguida, ir em frente e salvar. E então isso daria a esta versão atual esse nome aqui tão legal. Se você quiser ver o histórico do seu arquivo aqui e eu estou usando o fugitivo, eu posso ir em frente e sair desse histórico de versões. E isso é muito útil e muito útil em. Uma das coisas legais sobre isso é que você sempre pode ir para o arquivo e seguro para o
histórico de versões , onde isso também irá salvar as alterações que você fez até agora como uma nova versão, história também, muito legal.
10. O que vem a seguir?: por Parabénsporcompletar o curso de Web design com Sigma. Ao longo do curso, aprendemos a projetar um aplicativo web bonito e
simples para o nosso cliente, Clean Kangaroo e lojas de lavanderia para poder usar. E então o quê? Sexo para você. Uau, há algumas coisas que você pode fazer daqui. O primeiro 1 será criar um protótipo para o seu aplicativo Web que você projetou. Agora eu tenho um curso de prototipagem bem aqui sobre compartilhamento de habilidades também. Então, se você está interessado em aprender a criar um protótipo real fora de marcas como estas, você pode definitivamente verificar isso. Outra coisa que você poderia fazer é projetar uma versão móvel e
amigável do nosso tempo para cima. Se te lembras, dou-te isto como um exercício. Por isso, sinta-se à vontade para fazer este passo, se quiser. Caso contrário, no recurso é para este curso, você também será capaz de encontrar a minha versão das simulações concluídas, que também inclui uma página que mostra uma versão móvel amigável para os projetos também. Portanto, sinta-se livre para se referir a isso enquanto você projetou sua própria versão móvel. Além disso, se você estiver interessado em marketing. Sinta-se livre para cumprimentar algum material de marketing para um canguru limpo. Esta será uma boa oportunidade para mostrar o nosso tempo. Ou, se você estiver tomando o celular, você é você cursos X. Bem, você será capaz de criar algum conteúdo de marketing para mostrar limpo pode desenhar e o que eles fazem no que seu aplicativo faz e como pode mudar a vida das pessoas. Agora vou fazer um curso no futuro para material de marketing adequado para seus clientes. Então, se você está fazendo freelancing ou você está trabalhando em uma empresa ou seu próprio negócio e você quer criar material de marketing, que os tribunais serão perfeitos para você, então fique de olho nesse curso, lembre-se, como sempre, você pode entrar em contato comigo em Olá inteligente no gmail dot com. Ficarei feliz em responder a quaisquer perguntas ou fornecer qualquer feedback sobre os designs que você criou , então sinta-se à vontade para entrar em contato agora. Com isso dito, parabéns novamente por terminar este curso. Estou ansioso para vê-lo em um futuro.
Nima Tahami, Entrepreneur & Product Designer
