Transcrições
1. Introdução a Angel Davchev: Diabos, rapazes. Bem-vinda. Meu nome é Sonya. Estou dando essa aula. Podemos aprender a projetar áreas de aplicação móvel. A mulher obriga-me a mim. Eu também sou designer de UX. Bem, mais de cinco anos de experiência no Inglês lançou muitos amplificadores do mercado para ambos chorou e selvagem plana. Um deles aguenta. Let's foi destaque na revista Forbes recebeu o prêmio Katie governante em 2000 e 16. Experiências de usuários cada vez maiores Empresas de profissão de todo o mundo buscam designers de
bom uso para ajudá-los a superar seus problemas como eles usam designer. Seu trabalho é tornar o usuário confortável usando seu caminho. Estou feliz por tê-lo a bordo e espero que você aprenda muito com esta aula. Fique atento para uma emocionante jornada de
2. Apresentação do curso: Bem-vindo a bordo. Senhoras e senhores, Obrigado por fazer esta aula onde você pode aprender a projetar um aplicativo móvel para reservar bilhetes usando vários U. Y em novas técnicas X. Este vidro pressupõe que você tenha conhecimento prévio de um software de design, como ilustrador de
loja de fotos para o Adobe Experience Design. Se você não tem conhecimento prévio, não se preocupe. Você ainda pode acompanhar. Este vidro é destinado a pessoas querem aprender que você está em seu design ovos e
design móvel . Se você é um iniciante, intermediário ou até mesmo um profissional, eu posso ter um truque ou dois até o meu sono que pode aumentar o seu conhecimento. Aprender nunca é suficiente. Você vai aprender quais problemas, er persona. E por que é importante no design da experiência do usuário, Você vai aprender o que é o fluxo do usuário e qual é o propósito dele. E, finalmente, você aprende a projetar o aplicativo real. O software que vamos usar. 12 Esta série é chamada Sigma e autoridade conduta gratuitamente no sinal ponto com. Fig more está entre os piores suaves mais populares para você. Por que e você projetar ovos e você pode usá-lo no navegador. No entanto, eu recomendo que você não conheça o aplicativo de área de trabalho. Agora. Se você não quer usar o estigma porque você está usando outro software, como cheio de Loja ou esboço, talvez tudo bem, porque você ainda pode seguir essa classe. Cada vídeo terá seu próprio painel de ativos. Aqui você vai encontrar várias imagens e ícones necessários para você completar os vídeos. Como nossa turma não apresenta tópicos como eu posso projetar ou a fotografia usará esses recursos que eles são livres para usar. E você pode ver os links boneca Recon, outros ativos, se você quiser. Finalmente, você vai precisar de atitude positiva para completar esta aula. E lembre-se, aprender nunca é suficiente. Obrigado por se juntar ao meu copo e vamos começar.
3. Persona de usuário: neste vídeo, vamos dar uma olhada no que é um usuário pessoal. E por que é tão importante no design da experiência do usuário? Eu já preparei o usurpador Sana para este vídeo, então vamos discutir isso agora. Que diabos é um Papai Noel usurpador? Pense nisso como uma representação de ficção do seu cliente ideal. No mundo do marketing, há um termo chamado Target, e que é um grupo de pessoas que compartilham as mesmas características. Comportamento, faixa etária
pesada e renda que podem ser direcionados como potenciais clientes para o seu negócio é o mundo da experiência do usuário. A persona do usuário é algo semelhante a isso. Ao construir um irmão, você deve sempre pesquisar e definir quem vai ser um usuário. Coisas como hábitos, necessidades metas, idade, etc. Implantando um novo usuário para o Sana Ao criar um modelo, você tem uma compreensão clara sobre o que seu produto deve ser e se sentir como Se você quiser que as pessoas usem seu produto,
você deve criá-lo para que eles gostem dele. Lembre-se, você sempre constrói para os usuários porque é o usuário que dirige seus negócios. Se o usuário puder navegar pelo aplicativo. Herói, período
diligente como designer de experiência do usuário, você deve seguir o comportamento dos usuários e construir o produto dessa forma. Como regra geral, pense nos usuários como crianças pequenas que são facilmente perdidas se eles não vêem uma seta apontando sua direção. Agora vamos examinar nossa personalidade de usuário. Se você usurpador do Google filho de modelos, você deve encontrar algo semelhante a este. O objetivo do modelo é personificar o grupo de pessoas que viemos a ser os usuários fora do nosso aplicativo que vai tornar um trabalho muito mais fácil uma vez que temos uma
compreensão clara sobre o que devemos construir e para quem estamos construindo. Digamos que nossa equipe de pesquisa de usuários nos forneceu dados suficientes para construir este modelo. Como podem ver, nosso utilizador chama-se Tobias Swenson. Ele é um estudante de 24 anos de Gotemburgo, Suécia. Ele é uma pessoa extrovertida, gosta de festejar nos fins de semana e viaja para novos lugares quando pode. Como você pode ver em uma foto, que está abaixo de,
hum, hum, splash dot com, o preconceito raramente é visto sem o telefone dele. Ele é muito ativo nas redes sociais, mas também é explorar e sair. Estudar este modelo nos diz que, embora ele seja experiente em tecnologia, comprar um bilhete para o techno 14 Burling não deve ser um aborrecimento para o bayous. Sua jovem enérgica e gosta de ver o valor real rápido. Assim como qualquer outro milenar. Ele gosta de suas mídias sociais se ele toca em histórias no instagram, tweets ou pergaminhos. Cronograma no Facebook. Sabendo que percebemos que a tela de login deve ter canais de mídia social incluídos e vendo Tobias como uma pessoa ativa fica frustrada pela Internet lenta, provavelmente
devemos excluir o registro com e-mail, uma vez que requer várias etapas que entram em conflito com o comportamento de nosso usuário. Digitar e-mails, palavras
rápidas e confirmar senhas através de e-mail pode ser frustrante para o viés, porque ele pode estar emprestando Internet de um café para comprar ingressos para uma festa. Ao longo disso, os vídeos se referirão ao modelo de persona do usuário. Quando vamos tomar decisões em nosso design, é
isso para este vídeo. Pausá-lo e examinar o usurpador alguns de modelo enquanto você gosta. Obrigado por assistir, e eu vou vê-lo no próximo vídeo
4. Fluxo do usuários: Bem-vindos de volta, pessoal. Neste vídeo, vamos aprender o que está no fluxo de usuários e por que é importante e design da experiência do usuário? Já projetei o fluxo de usuário para um projeto. Vejamos cuidadosamente e examinemos cada parte. Anos de fluxo é o caminho que o usuário toma para concluir atrás em um site para um aplicativo. No nosso caso, já que estamos projetando um aplicativo de reserva de ingressos, o fluxo de usuários está orientando o usuário a comprar ingressos para seu concerto favorito. Projetar e fluxo de usuário é uma parte crucial em qualquer aplicativo, uma
vez que define um guia visual claro sobre como o aplicativo deve se parecer e como o usuário irá navegar com cada retângulo representa uma tela separada que existirá dentro nossa aplicação. As setas indicam a relação entre a tela. Em primeiro lugar, temos o nosso ponto de entrada de utilizadores, que é o Splash Queen. Esta é a tela que aparece assim que o usuário deseja que você o aplicativo. Após a implicação ser carregada em segundo plano, a tela inicial desaparece e foi apresentada com a tela de login. A tela de login é importante para a nossa aplicação, já que o objetivo da aplicação é que o usuário compre ingressos. Vamos precisar dele ou dela na nossa candidatura, a fim de obter informações
pessoais. Depois que o usuário faz login, ele é apresentado com a tela do Lee da festa. Aqui, o usuário pode encontrar uma lista de festas que estão disponíveis para o dia. Como podemos ver, o usuário pode prosseguir para a tela do calendário onde ele ou ela pode selecionar um dia no calendário e ver o partido está disponível para esse dia específico. partir daqui, o usuário também pode acessar Tickets Queen. Se o usuário não comprou nenhum bilhete, ele ou ela é mostrado em tela vazia. Agora projetar uma tela vazia é um importante design de experiência de usuário de negociação. Como designer, você deve sempre incluir algum gráfico apropriado, um texto o estado vazio indicado e uma chamada à ação que nunca dará usuário e não deixará em um beco sem saída. No nosso caso, se não houver bilhetes disponíveis na rainha dos bilhetes, devemos adicionar uma chamada à ação que diz algo como Comprar bilhetes agora e vamos levar o usuário de volta no ciclo. Ok, então de volta para a tela de lista de festas quando o usuário toca em pelo menos item em uma tela de festa Lee . Ele é redirecionado para a Rainha das Partes Únicos, que contém detalhes sobre essa parte em particular, como local da festa, o preço do bilhete. Quando o show vai começar, bem
como uma pequena amostra de vídeo para esse DJ particular a partir da tela de um único partido, o usuário pode navegar para a tela de vídeo, onde ele pode assistir a amostra de vídeo disponível e se familiarizar com o música. A coisa mais importante que o usuário pode fazer na tela de um único partido é reservar bilhetes para essa festa em particular. Ele é então levado para a tela de bilhetes de livro, que ele ou ela pode escolher quantos bilhetes comprar na informação do cartão de crédito. Depois disso, ele ou ela é mostrada uma mensagem de sucesso. Se a compra foi bem-sucedida ou uma mensagem de erro se a compra não foi concluída, mostrar uma mensagem de sucesso ou erro é crucial para o usuário, tal como ele é. Dar feedback sobre se os tickets foram comprados ou não dado feedback ao usuário é uma das coisas mais importantes no design da experiência do usuário porque, como designer, você nunca deve deixar o usuário em um estado onde ele ou ela não sabe o que é acontecendo. Depois que os bilhetes são comprados com sucesso, o usuário é então levado para a rainha dos bilhetes, onde ele ou ela é mostrado os bilhetes comprados. Isso conclui o caminho que o usuário toma. Ele completa o ciclo completo usando nossa aplicação. E isso conclui nosso vídeo. Vejo-te no próximo.
5. Tela Splash: neste vídeo, nós vamos aprender a ralar uma tela inicial para um projeto. A tela inicial é uma parte integrante fora mais enquanto o aplicativo, porque é a primeira coisa que o usuário vê. Uma vez que ele observa o aplicativo, ele serve em ambos os sentidos. Ele cobre toda a tela enquanto o aplicativo é carregado em segundo plano. A menos que o usuário obtenha fórmula com a marca implicações, uma das telas principais é carregada, a tela inicial desaparece. Agora vamos criar uma tela inicial para o nosso projeto. Selecione Canal direto dois ou pressione estão no teclado. Desenhe um retângulo que cobre toda a tela. Altere o nome da camada BG para plano de fundo e movendo-se para a parte inferior das camadas. Empilhar cor genial para um B 1540 Agora vamos criar o menor para aplicação. Selecione os lábios para incluir os lábios. Clique neste changeling para restringir sua proporção e alteração de tamanho. 260 pixels no centro o suficiente. Remova seu campo e que Ah, 40 pixels traçar para ele. Duplicar este círculo e
assim, como o anterior. Em um efeito, com uma gota rasa com 44 pixels, desfoque e remova os valores de ex e por que mudar sua cor para TD para ser Pacey. Agora vá para o painel de ativos e selecione esta imagem. Esta é uma imagem livre de tudo maçante. De splash dot com. Mova-o para a nossa Rainha salpicada e baixado para o bastão do covil. Selecione o primeiro a saltar e a imagem com o botão direito Clique em Selecionar usado como máscara. Selecione o Grupo de Refeições e a Primeira Elipse. Agrupe-os juntos. Altere o nome para Lovell Image. Agora vamos usar a ferramenta de texto e digitar Burling. Definitivamente. Os bilhetes mudam a cor branca seu tamanho para 30 pixels e no centro amanhã. Quebre a palavra para que Berlim e Technol estejam em uma linha. Os bilhetes são loucos. Selecione ambos os trabalhos de Berlim e techno e mudou o peso frontal para parafuso. Selecione o trabalho bilhetes e mudou seu peso para luz. Ótimo. Agora podemos centrá-lo. Selecione a imagem do logotipo e os bilhetes Techno de Berlim. Bom eles juntos. Chame isso mais baixo e centralize em nossa tela. Ótimo. Agora temos a nossa Rainha Splash
6. Tela de Logn: Bem-vindos, pessoal. Neste vídeo, vamos aprender como criar uma tela de login para um projeto. Agora, ah, login na tela não é uma parte crucial para um aplicativo. Mas no nosso caso, é. Já que estão felizes é comprar bilhetes. Vamos precisar de informações de usuários estudando a personalidade do Greaser. Vemos que nosso usuário gosta muito de usar as mídias sociais. Então, em vez de projetar, pertencer, tela por que nome de usuário da senha. Quando escrevermos a senha, usaremos registro social. O registro social é uma maneira mais fácil para as pessoas se conectarem a um aplicativo. Uma vez que a informação já é fornecida a um canal de mídia social. Vamos criar uma tela de login agora mesmo. Primeiro, vamos eleger um mais longo e com um grande topo Agora vamos criar as garrafas para um registro de mídia
social, selecione a ferramenta de retângulo clique uns e digitando 345 pixels para o com e 60 pixels. Para a altura, altere o raio do canto para pixels e centralize isso. Vamos mudar a cor do dedo do pé. Três B 59 Meu nome, que é uma cor hexadecimal para Facebook. A menos que em vigor para ele um shuttle gota com 10 pixels desfocados, cinco pixels cheios de valor I e 20% de capacidade. Ótimo agora. Então deixe a ferramenta de texto e digitação vir continuar com o Facebook e colocar isso ou a base de para mudanças de peso inferior, negrito e tamanho 24 pixels. Agora, já que Bellis Loy é uma forma condensada, vamos mudar o espaçamento entre letras para 4%. Vamos mudar o centro branco de preenchimento de Yeah, e vamos passar para os nossos painéis de ativos. Vamos selecionar este Facebook. Eu venho, eu fornecê-lo e arrastar uma porta para nossas câmeras, selecionar o ícone do Facebook e a base de sua garrafa e centrá-los, agrupados para o fundo do Facebook. Ótima. Agora vamos duplicar este frasco selecionando-o, segurando o parafuso no teclado e arrastando-o para baixo. Vamos mudar para continuar o Gmail. Agora vamos enviá-los com o outro trabalho. Agora vamos passear pelo Facebook. Eu venho com o Jimmy como uma faca fornecida no painel de ativos. Então, como o Jimmy gosta e arrastado para a conta, selecione a base fora do fundo e centralizá-los para cima. Agora, finalmente, precisamos mudar a cor para essa base, e a mudança está mudando. Para ver vários 1610 Grande. Agora temos nossa tela de blogs
7. Tela de lista de festas: Olá, pessoal. Bem-vindo de volta a este vídeo, vamos projetar a festa Lee Screen para aplicação. As listas do partido. Queen é essencialmente a tela principal do nosso aplicativo, já que é um ponto de acesso a muitas telas diferentes, como a tela do calendário, a tela do ticket na tela do single party. O objetivo principal fora da tela da lista do partido é fornecer ao usuário uma lista de
partes disponíveis , mesmo assim em Não falar e vamos começar a trabalhar. Em primeiro lugar, selecione sua ferramenta de retângulo e desenhe um retângulo em toda a tela. Mude seu nome para ser Jeep para plano de fundo e movê-lo para baixo na última ordem. Vamos mudar sua cor para 071 9 para 3. Agora vamos usar na imagem para melhorar nosso plano de fundo. Visualmente, eu não quero esta imagem de todos splash dot com, o que pode fazer é bem de graça. Então deixe esta imagem em arrastar. Vai funcionar para nossas câmeras de três tamanhos e posicioná-lo de acordo com o gosto real. Agora vamos mover a imagem para baixo em nossa pilha de camadas. Ótima. Ok, vamos adicionar outra sensação a esta imagem, que vai ser um ingrediente linear com a mesma cor que o fundo em ambas as paradas de
cor selecionar o primeiro Grady em ponto, e nós movemos sua capacidade para zero apenas isso até que ele se mistura bem com o fundo. Agora vamos ter a Heather para a nossa tela. Mais tarde, vamos converter isso em um componente. Sinta-se mais nos permite criar componentes, e nós os usamos em várias telas que facilitarão muito nosso trabalho. Além disso, quando fazemos uma alteração, ela refletirá em todas as cópias dos componentes. Selecione a ferramenta de retângulo novamente e desenhe um retângulo cheio com as alterações. Altura, 140 pixels. Renomeie este BG para plano de fundo e moveu uma camada para baixo na pilha de camadas. Clique neste globo ocular ao lado dele para ocultar as camadas. Grupo de fundo está usando controle Genome seu teclado, e nós nomeamos este grupo toe Heller. Agora selecione o tempo para em festas de digitação em Berlim. Mude o telefone. Babel nevando o tamanho do telefone 30 pixels, o peso frontal muito ousado. O espaçamento da letra para 4% desde o ruído de Bevan uma forma condensada e, finalmente, mudou a cor do dedo do pé branco. Este vai ser o nosso título. Mova o título para o carrinho de criança de cabelo e mova-o para cima. Selecione o globo ocular novamente ao lado da camada de terra para ver o fundo. Agora mover o título 20 pixels da parte inferior do fundo disse Eyeball novamente sobre o jogador de
fundo. Agora vamos copiar com o título mantendo velho e movê-lo para cima. Altere o tamanho do telefone 18 pixels, mova-o para a esquerda e moveu 14 pixels do topo do título. Certo, vamos mudar isso para um encontro. Por exemplo, 17 de novembro de 2000 e 18. Vamos posicioná-lo de acordo. Agora vamos para o painel de ativos e pegar os ícones que eu fornecer seletivos e
movê-los para nossas câmeras. Vamos movê-los para a pasta do assassino e posicioná-los na borda da tela
à direita. Alinhou-os com o topo fora do dia e vamos mudar a cor do dedo do pé branco. Os ciclos vão representar a tela do ticket e a tela do calendário, respectivamente. Ok, então selecionável e movido, hum, 15 pixels da borda da tela. Ótima. Certo, vamos selecionar nosso cabeçalho Fuller. Agora, o que é ótimo para se conformar na televisão selecionado e clique, este ícone iria apenas criar um sinal componente sobre criativo informado, embora nossa pasta Vamos passar para a esquerda e Let's Kobe, mas segurando velho e bebendo direito em nosso campus. Isso agora cria uma cópia de todo o nosso componente, que podemos usar em todas as nossas telas. Vamos ver como os componentes funcionam. Cometemos um erro ao escrever mal os grupos de trabalho no nosso título. Vamos mudar isso. Mountain Tore Messer de Born e permite que você chame as mudanças refletem em nossa cópia à direita. Veja, é assim
que é fácil trabalhar com componentes em sinais. Agora, a única coisa que nos resta é criar a própria lista do partido. Selecione ou um único, também. Clique uma vez ao digitar 325 pixels para a semana e 120 pixels para a altura. Basta isso para o centro da tela e mudar a cor do dedo do pé. Um bife 1540 Mude as coronárias quatro pixels e vamos efetivamente em uma nave auxiliar de tambor . 10 pixels desfoque cinco pixels para o branco vai você e 24 7 40 opacidade alterar atraso BG para fundo. Mova para prender seu painel e selecione esta imagem, que tem Donald novamente a partir de um ponto de splash com. Basta ir para splash dot com e digitar techno na barra de pesquisa. Você pode encontrar muitas imagens para jogar com imagem seletiva e arrastá-lo para nossas câmeras . Vamos ajustar com 95 pixels, 97 pixels para a altura. Mova isso de acordo em nosso painel e ajuste 10 pixels a partir da esquerda da borda. Vamos mudar o raio do canto para dois pixels. Selecione a imagem e o plano de fundo e agrupá-los usando o controle G. Vamos renomear este grupo para listar. Eu disse. Selecione o tipo para novamente e digitando. Conheces o Kravitz. Vamos mudar o alinhamento para a esquerda até o meio. Altere a cor do dedo branco e altere o tamanho da fonte 24 pixels. Posicione isso e a linha de 10 pixels da direita da imagem Coffee Destexhe segurando o antigo e arrastando-o para baixo. Alterar o tamanho da fonte para 18 pixels e a espera do telefone para reservar mudou o campo. Então passividade a 70%. E vamos mudar isso para Burke Hind, Pamela Rama e Bar Selecione o texto tipo nascimento e Kravitz e agrupá-los juntos. Chame isso de doloroso e mova-o para o nosso item da lista. Selecione este grupo e duplicado mantendo o antigo e arrastando-o para baixo. Vamos ampliar e limpar os decks. Mova isto para o topo e mova isto para baixo. Agora mude. Isso começa e mudar isso para 13h. Mudou o tamanho do telefone, 18 pixels e este tamanho do telefone 14 pixels e, em seguida, apenas eles em conformidade. Vamos renomear seu grupo Start duplicado mantendo velho e arrastando-o para a direita. Vamos movê-los 20 pixels um do outro. Mude este preço também, que indicará o preço dos bilhetes e mudará isso para algo como 18 anos de idade. Renomeie isso de acordo. Agora, a única coisa que nos resta é projetar um apelo à ação. Ah, direção
fria é algo que incita a ação para o usuário. Por exemplo, comprar bilhetes. Pegue o texto para na digitação de bilhetes de presente. Vamos mudar a forma de um ônibus. O tamanho divertido 14 pixels. Vamos mover isto para a esquerda. Coloque-o dentro do título do Oeste e mude sua cor para E. D.
Dois d. J. J. C. Mude o caminho da frente para votar e vamos fazer zoom para ajustar isso à bola. Agora eu adicionei no ícone de seta para os ativos, então vamos agarrá-lo e fomos para os nossos camelos. Ok, vamos posicionar daqui. Vamos movê-lo para o nosso grupo de itens da lista. Agora vamos movê-lo. 10 píxeis ou cinco píxeis dos bilhetes recebidos. Vamos selecionar os dois e agrupá-los. Vamos chamar esta cidade de oito. O que está Call to action, Mais porta para a borda do nosso fundo para o item da lista e magia. 10 pixels para a esquerda. Ótima. Sabemos que projetamos nosso item de lista. Finalmente, vamos converter este item de lista em um componente. Então podemos usá-lo de novo? Vamos selecioná-lo e vamos clicar em, Criar conformidade, movê-lo para a esquerda e co pago segurando Holt e arrastando-o de volta em direção à câmera. Vamos enviar para Ele foi duplicado quatro vezes, segurando velho arrastado para baixo e com algo como 10 pixels fazer o GAM e, finalmente, quatro coisas. Então são todos esses títulos. Escondei-o para a parte inferior da tela e mova-os. 15 grandes sociais. A garrafa. Ok, então agora temos os itens da lista para as nossas festas. Vou postar o vídeo em Preencher os dados agora. Bem-vinda de volta. Como podem ver, calculei os dados para uma variedade com vários nomes de DJ, locais, preços dos
bilhetes, etc. Também mudei as imagens das diferentes festas. Agora o sinal não nos permite adicionar imagens ou outros elementos em nossas instâncias componentes. A maneira como resolvemos isso é colocar todas as imagens em um componente mestre. Vá para o item da lista e clique fora do Aibos das imagens
que você não quer mostrar e pronto. Os caras não teriam a tela do Bartoli terminado. Até agora, aprendemos muitas coisas, como
como um item da lista deve ser organizado com imagens, informações e plano de ação. Finalmente, aprendemos o que são componentes na Fig.? MMA? Como trabalhar com eles e por que eles são importantes no design? Obrigado por assistir. Vejo-te no próximo vídeo.
8. Tela única de festa: Bem-vindos de volta, meninos e meninas. Neste vídeo, vamos projetar a tela de uma única festa como mencionado anteriormente nesta rainha. Vamos colocar os detalhes sobre o Partido Seletivo, como o nome do DJ, o local da festa, a data, a hora em que o DJ começa, bem como o preço do bilhete. Também vamos colocar o vídeo de amostra do DJ para que o usuário possa ter uma sensação melhor ou que tipo de conversa? Aquele lugar DJ pela experiência do usuário. Perspectiva. Esta é uma característica importante para a nossa aplicação. Finalmente, neste verde, vamos colocar uma chamada à ação no fundo para que o usuário possa comprar ingressos para esta festa. Ok, vamos começar. As primeiras coisas primeiro. Nós vamos usar a imagem de tela cheia para que possamos melhorar o fundo visualmente e
dar-lhe um branco escuro, que é complementar com o movimento fora de nossa aplicação. Como sempre, eu não vivo esta imagem de sunsplash dot com. Vou fornecê-lo no painel SS, passar por cima do painel de ativos. Então, como a imagem e mova-a de volta para a nossa tela, arrastada para a pilha de covil em, posicione-a de acordo. Você gosta Vamos adicionar outro campo a esta imagem, que vai ser Polina Grady. E nós vamos usar essa mesma cor para as duas paradas de cor fora. A cor vai ser alguns de 71 9 para 3. E vamos mudar a opacidade das paradas do carro. A primeira parada de cores vai ser 66% de capacidade, e o 2º 1 vai ser algo como 93 suave Grady Inbar. Até que goste do próximo, vamos usar o componente capilar da nossa lição anterior. Copie o componente capilar selecionando a falha e arrastando-o para o nosso campus. Agora, vez que a tela de um único partido é uma fórmula subsequente tela Party Lee, precisamos fornecer nosso usuário longe para nunca voltar para a rainha anterior. A maneira de fazer isso é ter uma garrafa traseira. Agora, já que não podemos modificar nossos componentes e outras coisas, vamos ter que modificar nosso componente mestre. Sabe, nosso painel de ativos? Providenciei uma volta. Eu venho seletivo e Dragão velhos mestres turnê conformidade mudando cor branca e posição em conformidade. No topo da data, como você pode ver em nossos componentes, exemplo, podemos ver o ícone de volta. Agora. A única coisa que nos resta é exagerar o encontro. Clique fora do globo ocular ao lado da data para escondê-lo. Ótimo, agora
temos o botão Voltar para nossa tela. Em seguida, vamos adicionar o título a ele. Vá para o painel de ativos gráfico de decoração selecionado, que eu forneci e movendo-se em direção a câmeras. Agora abra seu tipo dois e digite. Sabe, Kravitz mudar o tamanho do telefone 50 pixels. O peso da frente é voto, e a cor é branca. Alinhado estes dois gráficos de decoração e movendo algo como cinco pixels
da parte inferior dele. Selecione-os ambos ranhurado-los e mudar isso para um título. Então, como o grupo título passou para o Heller e movendo 50 pixels da parte inferior do cabelo, vamos sair de nossos detalhes. Squeak. Selecione a hora para digitar novamente as datas. Alterar a diversão tamanho 18 pixels, uma linha para a esquerda, mudar a cor branca e alterar a opacidade. 40% alinhado estes com o título Bolt titular e arrastá-lo para baixo e mudou sua loja. Data especificada, que é 17 de novembro de 2000 e 18. Altere a capacidade deste campo 100% e altere o tamanho do telefone para 24 pixels, alinhou-os e moveu algo como cinco pixels do final da data. Então deixe os dois e agrupá-los juntos. Faça uma cópia deste grupo mantendo o antigo e arraste-o para a direita. Mova este grupo algo como 25 pixels para a direita. Altere isso para um local. Mude para Burke Hind Panorama Bar. Mude a semana fora desta palavra para que o trabalho do bar vá por baixo. Selecione ambos os grupos, copie-os mantendo a tecla antiga e arrastando para baixo. Movido em algo como 10 pixels pela parte inferior. Vamos alterar esta informação de acordo para refletir a da nossa tela anterior. Então comece, o que vai ser um passado por mim, meu preço e bilhete, que vai ser 18 anos de idade. Isto para que ele vai combinar aqui. Vamos mover a bola. Dois grupos por cerca de cinco pixels a mais. Ok, ótimo. Vamos fazer burros juntos e chamar este grupo na íntegra e mover algo como 30 pixels do fundo do nosso título. Agora vamos ter o vídeo. Café simples. Um grupo da gripe segurando velho e arrastando-o para baixo, movendo-se para fora do grupo e chamá-lo de vídeo com algo como 40 pixels da parte inferior do Mpaluku. Vamos mudar a opacidade do trabalho superior para 100%. Vamos excluir o trabalho inferior. Agora vá para o painel de ativos. Então, deixe essa imagem que eu forneci e mova-a para nossas câmeras, arraste-a para dentro do nosso grupo de vídeo e ajustada como cinco pixels para a parte inferior do
preço do bilhete . Altere o preço do bilhete para simples Jim oficial. Apenas o com fora da imagem para 210 pixels, a altura para 120 pixels. O raio de canto quatro vasos AP outra sensação a ele. Vai ser uma cor sólida preta por 50% de capacidade. A última coisa é para outra imagem afetiva, que vai ser uma sombra de gota. O desfoque terá 10 pixels. O porquê bem, você será cinco pixels e a capacidade será 60%. Isso fará com que a imagem se destaque do fundo. A última coisa aqui é o fundo do jogo. Mover para a família ativos, Selecione a parte inferior do jogo, que eu forneci e arrastá-lo ou para nossas câmeras. Coloque dentro do grupo de vídeo. Vamos Century selecionando a parte inferior do jogo e imagem e enviado para ele usando nossos
ícones de alinhamento . Ótimo. Agora temos amostra de vídeo. Ao clicar nisso, o usuário estará levando para uma nova tela fria. A tela de vídeo. Agora, a única coisa que falta dedo do pé nosso design é a chamada para ação inferior Copia manteiga de nossa tela de login e movido para o nosso campus, alinhando para a parte inferior da tela e movido algo como 15 pixels de cerca de. Agora vamos mudar o nome para Cidade A para chamada de ação. Vamos apagar este ícone. Altere isso para bilhetes de presente. Vamos mudar a cor dele para você estar tão em uma linha. 23 Vamos mudar também a cor destes fundos para este carro sido, que é et tu de eles vêem agora. A última coisa a fazer aqui é criar um componente fora da nossa chamada à ação, a fim de
usá-lo em outras telas, clique no componente sair Tyco e vamos arrastá-lo para fora, copiado segurando velho e bebendo de volta na turnê veio com vamos posicioná-lo em conformidade. 15 pixels do fundo. É isso aí, pessoal Isso conclui nossas lições. Vejo-te no próximo.
9. Tela de bilhetes para bilhetes: Olá de novo, meninos e meninas. Neste vídeo, vamos continuar construindo em cima do nosso design anterior, a tela de uma única festa. Vamos projetar uma parte de reserva de ingressos que será apresentada em um modelo que desliza da parte inferior da tela logo após o usuário clicar na chamada à ação. Mas arranja bilhetes. O objetivo disso é benéfico para o usuário porque ele não perderá o foco ao ser
navegado . Duas telas diferentes neste mais solicitarão ao usuário que insira seu nome e detalhes do
cartão de crédito no Rio para fazer uma compra para os ingressos ao trabalhar dados confidenciais,
como detalhes do cartão de crédito. É fundamental que você não acredite que o usuário no Voy não saiba o que está acontecendo com o seu dinheiro. É por isso que o DF precisa fornecer ao usuário feedback sobre o que está acontecendo. Ok, vamos deixar a conversa e vamos ao assunto. As primeiras coisas primeiro. Certifique-se de que você tem uma cópia da tela anterior porque nós vamos excluir algumas coisas depois que você copiou a rainha anterior entregou o título. A saudação de informações na amostra de vídeo, mas deixe o frasco de chamada à ação. Já que vamos usar mais tarde,
basta clicar no globo ocular semana que vem para escondê-lo. Em seguida, selecione a imagem de fundo e aplicando eficazmente. O efeito é Leibler 20 pixels para o M O. A razão pela qual estamos desfocando o fundo. Eles trabalham o foco do usuário para o intestino deslizante. O fundo ainda estará lá, mas menos proeminente. Agora selecione seu retângulo para e desenhe um retângulo com a semana inteira, mas altere sua altura para 600 pixels. Clique neste ciclo ao lado do canto. raio do canto independente do suor de Brady para direcionar o ângulo nos 2 primeiros campos de entrada tinha 15 pixels e deixar o resto de zero. O primeiro pé tempo se sente referido para o canto superior esquerdo e superior direito respectivo. Apenas esta camada, modo que tal é a parte inferior da tela. Agora vamos mudar a cor do dedo do pé um B uma esposa para zero e vamos até outra sensação para ele, que vai ser cor sólida preto em 40% capacidade. Por último, vamos mudar a cor motile dis layer a exclusão e arrastou um retângulo na
pilha de camadas . Agora abra o seu tipo dois e digite em reservar um bilhete. O tamanho divertido é de 18 pixels. A tigela dos salários da frente e a cor é branca. Mas mude a opacidade. 40% duplicam isso segurando velho e arrastando-o para baixo. Renomeá-lo para significar, Oh Kravitz, alterar o tamanho da fonte 40 pixels e alterar a opacidade dele de volta para 100%. Agora vamos ter apenas isso e vamos ler cinco pixels para baixo. Selecione os dois e mova-os para cá. Ajuste ele e solte-os como 10 pixels. Agora abra o retângulo para novamente e clique uma vez. Alterar a largura para 95 pixels, e a altura para 75 mudou alguns para o mesmo salto que estamos usando para uma chamada à ação garrafas, muito estes para o canto superior direito do nosso modelo. E vamos ter um indivíduo do coro a 15 pixels no segundo campo de entrada para suavizar apenas o canto superior direito. Agora vamos dirigir uma cópia da nossa etiqueta segurando velha e arrastando-a em fundos de torpedos. Selecione o plano de fundo e o rótulo e Sentara altere a cor destes 2071 93 e
altere a opacidade para 70% trazendo isso para a faixa total de Cope Jalloh V segurando velho e arrastando-o para baixo, altere isso para 18 anos de idade, alterar o tamanho da fonte para 34 pixels e trazer de volta a opacidade que queremos de boa porcentagem. Centralize os dois. Selecione tudo agrupando Hitler de Coley. Certo, vamos fazer um ajuste rápido a isso. Selecione ambos Nina Kravitz e reservar um bilhete textos e a alinhá-los para a borda da tela. Agora movido para cima 15 pixels para a direita. Ótima. Agora vamos projetar um stepper número, que vai fornecer ao usuário a opção de comprar um ou vários bilhetes, Selecione este grupo e duplicado segurando velho e arrastando-o para baixo. Exclua tudo dentro dele, exceto este rótulo. Nós nomeamos este dedo quantos ingressos agora para o nosso painel de ativos e selecionamos Aumentar e Diminuir Aiko, que eu forneci. Mova-os para a nossa tela e eu gosto deles para as bordas da tela. Mova o mais eu venho 10 pixels para a esquerda. Selecione o ciclo secundário e a justiça na linha com este texto. Agora selecione-os ambos e centro de todos eles grande. Abra seu tipo dois e digitando um. Este será o valor inicial fora bilhetes mudar o tamanho da frente para 50 picaretas fora e a cor branca. Centralize estes e selecione ambos os ícones e a correção e selecione e Landau verticalmente
agrupados . E não acabe neste grupo. Quem nomeou este grupo para Number Stepper. Certo, agora alinhamento. 30 pixels para baixo a partir da borda deste retângulo. Ok, Quando o usuário toca no mais e menos, ele vai ajustar o valor como o número fora bilhetes muda. O preço também deve mudar para refletir mudanças em tempo real. Isso é crucial para a experiência do usuário. Selecione o grupo número Stepper e duplicado mantendo o antigo e arraste-o para baixo, movendo 30 pixels para baixo. Selecione este grupo com ícones do número e exclua. Renomeie isso para nome de usuário e alterou o rótulo também. O seu nome. Selecione o único direito também e desenhe um retângulo com 345 pixels em semanas e 50 pixels de altura. Altere o raio do canto para duas seleções fora da cor branca e a capacidade para 10% posição . Este cinco pixels para baixo a partir da borda fora do rótulo. Agora abra seu tipo dois digitando o nome do nosso usuário, que é o preconceito, Svensson. Certo, vamos mudar a DST circular da frente. Mude a carta. Espaçamento 0%. O tamanho do formulário é de 20 pixels e a cor é branca. Agora, DST
Circular é uma forma mais legível do que o noi de Baba. Coloque-o 10 pixels à direita a partir da borda do retângulo. Ok, este vai ser o nosso campo de entrada novamente. Duplicar este grupo mantendo o antigo e arraste-o para baixo e novamente com 30 pixels. Ok, nós nomeamos este número de cartão do dedo do pé e renomeamos o rótulo, bem como o número do cartão digitando um número aleatório de
16 dígitos que é agrupado em quatro grupos por quatro dígitos e separado com traços. Isso simbolizará o número do cartão, ouro ou ativos, Penhall. E pegue o card de monstro baixo e beba em nosso número de cartão. Você se sentiria movê-lo. 10 pixels para a esquerda, da borda à direita do retângulo. Ok, estamos adicionando o logotipo para que o usuário possa obter um feedback visual de que este é um cartão existente e tudo está OK. Lembre-se ao trabalhar com dados confidenciais como este. É fundamental que você forneça feedback ao usuário. Ótima. Agora vamos revisá-lo ou painel de ativos novamente e agarrou o ícone de erro e movê-lo para a nossa tela de desenho. Coloque-o no mesmo local que o logotipo MasterCard, mas esconda-o clicando no globo ocular ao seu lado. Este ícone aparecerá se um número de cartão de crédito estiver envolvido. Além disso, bem no rótulo de erro abaixo do campo de entrada que diz número do cartão é Vale. Tente de novo. Vamos mudar o formulário para 12 pixels e usar a mesma cor que o erro, que é E B 001 B. Vamos escondê-lo por enquanto. Que vamos selecionar o nosso logotipo MasterCard e colocá-lo em nosso grupo número de cartão. Vamos ocultar o ícone do ar clicando no globo ocular ao lado dele. Selecione o grupo de números de cartão e duplicado novamente segurando o molde e arrastando-o para baixo e
movendo 30 pixels para baixo a partir da borda fora do campo de entrada para o número do cartão. Agora este telhado será a data de validade do cartão de crédito. Renomeie e mude o poço de LaBella. Agora vamos apagar o logotipo do carro muscular, o nível de terror e o ícone de erro. Já que não precisamos deles. Altere isso para outubro de 2000 e 20, o que indicará a data de validade de um carro. Agora não há necessidade de este retângulo ser tão grande Celeste. Ajuste com ele. Agora selecione este rótulo e um retângulo e centralize-os. Ótima. Agora selecione o grupo de datas de expiração e competir novamente mantendo velho e arrastá-lo para a direita desta vez e casou 30 pixels para a direita. Este será o número de cartões seriamente que está indo que é encontrado na parte de trás fora do cartão. Agora é um número do Egito. Mas vamos escondê-lo colocando asteriscos no passo. Selecione-os ambos com o retângulo e centralize-os para cima. Ok, vamos esconder a nossa chamada à acção no fundo e vamos mudar os paus para verificar. Ok, agora temos os nossos bilhetes para o livro. Design Queen. Vejo você no próximo vídeo
10. Tela de calendário: Bem, olá de novo. Meninos e meninas neste vídeo vai mergulhar fundo e projetar uma tela de calendário para aplicação . A tela do calendário é um lugar onde o usuário pode escolher uma data específica no mês e verificar se há partes disponíveis para esse dia. Agora vamos falar de alguns cenários reais aqui. Não há uma festa disponível em cada encontro que a maioria dos meus clubes trabalha nos fins de semana e raramente em um dia de semana. Isso significa que o nosso calendário deve permitir-nos escolher datas que estão enfraquecidas ou próximas a ele. No nosso caso, vamos começar de quinta até domingo. Isso significa que segundas, terças e quartas estão fora para diferenciar entre os dias disponíveis e
os que não estão, vamos usar um estado deficiente. Um estado desativado é um estado em que os elementos não são selecionáveis. Isso significa que teremos que fazer com que pareçam diferentes do outro elemento. Isso geralmente é conseguido alterando a cor e a capacidade do elemento. Ok, chega de falar. Vamos aos negócios. Em primeiro lugar, abra seu retângulo para desenhar um retângulo que cobre toda a tela. Renomeie para DJ e mova-o para baixo, fora da pilha de camadas. Mude a cor para você adivinhou que é o seu 71923 Ok, como você pode ver, temos uma cópia sobre Heather Component colocada em nossas câmeras. Vamos projetar a tela do calendário para ser um seletor de modelos de tela cheia. Para conseguir isso, precisamos de fazer algumas mudanças na nossa saúde. Como você se lembra, não
podemos fazer alterações, instalações
na loja, então precisamos atualizar nossos componentes principais, ir ao painel de ativos dela, pegar o ícone de roupas e colocá-lo em nosso componente de massas, alinhando para o topo e para a direita. Certifique-se de que ele se encaixa nas bordas e vá para os nossos componentes em coisas. Como você pode ver com Rep replicado que eu entrar em nossa instância agora hype o ícone de calendário no ciclo de ticket, já que não deixá-los finalmente mudou o título para a nossa instância, também. Escolha. Eles agora vamos projetar são calendário real. Volte para o painel RSS e pegue este ícone de seta. Coloque-o em nossa tela e alinhando à esquerda, faça uma cópia, eleva segurando, segurando, arrastando-o para a direita. Clique nele e escolha virar horizontal para virar horizontalmente. Abra seu tipo dois e digite no mês. Lembre-se, o tamanho do telefone é uma fonte muito grande. O telefone salta, mas mudou a cor para o salto que temos usado para baixo . Centralize-o em nossa tela e selecione ícones mais antigos. E o trabalho novembro e agrupá-los juntos chamado seu grupo Calendário Heather. Agora vamos criar os dias do calendário. Pegue seu tipo dois de novo. Vou digitar o trabalho em ambos para segunda-feira. Mude os telefones, espera para reservar. Altere o tamanho do telefone para 20 pixels. O carro é branco com 80% de capacidade alinhada. Este trabalho para a borda esquerda da tela. Agora vou postar o vídeo e duplicar mais seis vezes para representar os sete dias da semana. Bem-vinda de volta. Como podem ver, criei os dias da semana e os agrupo ou os nomeei dias de calendário. Agora vamos criar as datas reais que temos. Digite dois novamente e digite um. Altere o peso da frente de volta para um tamanho de 30 pixels. A cor é branca e capacidade total colocar isso sob nossa quinta-feira é que é o início do mês movendo 30 pixels para baixo. Vou postar o vídeo de novo e criar as datas no calendário. Poupe algum tempo. Certo, pessoal, bem-vindos de volta. Como você pode ver, há muita coisa acontecendo. Então deixe-me explicar. Eu alinhei estes calendários, Heller e Calendar dias 50 pixels do topo para fora escolher uma data. E esses dias de calendário são 50 pixels da parte inferior do calendário. Heyler. Agrupei todas as funções indicando as datas e espaço em 30 pixels cada. Como você pode ver, os dias de segunda a quarta-feira são de uma cor diferente indicando que não pode haver clique. Este é o estado de desativação. O poço fora antes tudo o que eu fiz foi mudar a opacidade 30%. Este círculo aqui indica o estado do pé. É um diâmetro de 50 a 52 picaretas oceânicas e a cor é a mesma coisa que você usa para garrafas. Finalmente, temos o nosso apelo à ação que aplica a data seletiva e fecha o celular. Este fundo aparece no Lee. Se selecionamos a data, é isso. Os caras não teriam o design da tela do calendário. Vejo-te no próximo vídeo
11. Tela de vídeo: Olá outra vez. Senhoras e senhores, bem-vindos de volta à nossa série neste vídeo irá projetar a tela de vídeo. Aqui o usuário pode ver um vídeo curto simples representando um DJ do partido selecionado, se
você se lembrar de um vídeo anterior sobre como projetar a tela de festa única com adicionado um vídeo de macho com um fundo de jogo. Quando o usuário toca no Tamil, ele é redirecionado para a tela de vídeo. Agora esta rainha espera um modelo de tela cheia, mesmo que a nossa tela de calendário. O usuário pode ver o vídeo e controlar a linha do tempo do vídeo usando uma barra lateral como por fala
o suficiente habitual . Vamos começar a trabalhar, Abra seu reto e desenhe um retângulo que colore a tela inteira como de costume, renomeando para fundo BJP e, como de costume, movendo nossa pilha de camadas. Vamos mudar a cor para a nossa cor favorita, que é 071 93. Como você pode ver com a instância do céu ou componentes Hiller que precisam mudar, clique fora do globo ocular para que o ícone do calendário, o ícone do bilhete, a data eo título clique no globo ocular fora do ícone de roupas. Quando o usuário toca no ícone de roupas, o celular fecha de volta para a tela de um único grupo. Nenhum movimento ou para os nossos bens. O Penhall. Pegue a imagem e mova-a para nossas câmeras. Esta é a mesma imagem que temos usado em nossa tela de grupo único, e vai representar nosso vídeo, torná-lo quatro semanas e mudar seu hype. 265 dias de folga. Posicionamento para o centro da tela. Excelente junção esquerda para projetar é a barra doente. Pegue um ângulo reto para clicar nas paredes e torná-lo 345 pixels com e centralmente para cima. Faça a altura três pixels e altere a cor dela. 103 quatro para
um.Isto irá representar as barras doentes que cresceram duplicado pressionando o controle C e Controle V e mudar a cor do branco. Este será o tempo decorrido das barras do mar. Torná-lo 75 pixels em com Agora, agarrar em um banco de licença e um rápido. Clique no ícone de cadeia para restringir as proporções do círculo e alterar a semana 25 pixels. Isso mudará automaticamente a altura para 25 pixels também. Mude a cor do círculo branco e coloque-o para ser Etch fora do tempo decorrido. Este será o controle de barras doentes, que o usuário pode diminuir. Alterar os vídeos Tempo Finalmente, abra o seu tempo para e digitando zero carvão 16 barra um carvão 30 Alterado a falha para circular STD. A letra Espaçamento para zero O tamanho completo é 16 pixels na frente. O peso está se reunindo e a cor é lugares brancos para a borda direita, em algum lugar abaixo do Sigmar. Este número representa o Stein do nosso Eleito e o link de vídeo selecionado. Selecione os lábios e os retângulos e agrupe-os. Renomeie esses grandes bares organizando Baylor e pronto. Os caras não teriam nosso design de tela de vídeo. Vejo-te no próximo vídeo.
12. Tela de bilhete: Bem-vindo de volta aos meninos e meninas sérios neste vídeo vai dar uma olhada em como projetar
a tela do bilhete como mencionamos antes. A tela do ticket é um lugar onde o usuário pode ver seus ingressos de compra. Pense nisso como um tipo especial de carteira que existe no seu telefone. Agora vamos falar para projetar o bilhete real. Vamos nos certificar de que isso é autêntico. Então vamos projetar o ticket virtual para se assemelhar a um em tempo real. Vamos usar os mesmos dados do nosso grupo. O bilhete foi comprado para, como o nome do DJ, o local com o preço do bilhete e quando começaríamos. Finalmente, vamos usar um barco para o nosso bilhete. O código de barras é necessário para que as pessoas na porta usem tipos especiais de
leitores de código de barras para autenticar o bilhete. Vamos usar on-line para gerar o Barco, basta Google até gerador de código de barras livre e clicar na primeira ou na segunda consulta de resultado . Lá você pode gerar a imagem de código de barras e você pode dobrá-la como um arquivo PNG. Além disso, eu estou sobre por que a imagem de código de barras no painel de ativos. Agora, como sempre, chega de falar e vamos começar a trabalhar. Em primeiro lugar, broca
habitual. Crie o plano de fundo, usando nosso retângulo para e nossa cor favorita. Selecione, direcione e vá para o pé. Faça um tolo e altura total. Certo? Renomeie único BG para fundo. Descendo nossa pilha de camadas. Mude sua cor para 07123 Agora, vez que a tela do ticket é uma tela interna em nosso aplicativo, precisamos fornecer o usuário longe para nunca voltar. Agora, se você se lembra de nossa lição anterior sobre a tela de um único partido, nós adicionamos um grande fundo para o componente Heather. Vá para o Heller Component Systems e clique fora dos globos oculares fora de tudo, exceto o Big Bottle, eo título mudou o título para os meus filhos ou minha carteira, se você preferir que assim. Ok, vamos projetar o bilhete real. Agora pegue direcionando Goto novamente e clique paredes mudar a cor de fundo para branco alterado com dedo do pé, 345 pixels e o dedo do pé de altura, 465 pixels. Centralize isso e mude a esquina. Agora, no painel de ativos, temos a mesma imagem que temos usado para fundo nos partidos individuais Rainha seletiva e movido para nossas câmeras. Certifique-se de que é o mesmo com o retângulo e para a altura que vamos usar ter a altura fora do retângulo para fazê-lo. Seletiva e digitação. 465 pixels divididos por dois em nosso campo de entrada. Aqui, podemos criar as equações matemáticas calculam automaticamente a altura da imagem. Ok, agora vamos adicionar raio de canto a esta imagem também. Clique aqui para adicionar cantos independentes e digitação para pixels. Nas primeiras 2 entradas, isso irá atuar para pixels. O canto é para o canto superior esquerdo e para o canto superior direito, respectivamente. Agora vem a parte divertida. Selecione o banquinho lib e clique em um. Recorte este changeling para restringir as proporções do círculo e digitando 35 pixels para a semana. Selecione o círculo no lugar dele para D H R. Para obter você verá as linhas vermelhas encaixar. Ok, selecione o círculo e copie segurando o antigo e arrastando-o para a direita. Certifique-se de que a cópia também se encaixe. Ótima. Agora selecione ambas as elipses e agrupe-as. Certifique-se de fazer uma cópia deles pressionando o controle C no teclado. Agora selecione tanto o retângulo nos círculos, segurando o navio e perfurando. Subtrair seleção. Você vê, isso faz um ticket como retângulo. Mova o subtrair abaixo aqui, e certifique-se de que você baseou os círculos anteriormente Kobe. Ele controlaria o teu teclado. Agora coloque este grupo acima da imagem e selecione a imagem e os círculos. E ele subtrai a alegria novamente. Agrupe tudo. E nós nomeamos esses ukip beat. Agora temos um tempo real para chegar aqui. Agora vamos colocar os dados. Copie as informações da tela de um único grupo e as baseie. Não verifique se a câmera está na linha central e se movendo 30 pixels da parte superior. Agora tudo é o mesmo, exceto este o nome do DJ em nome do local nosso centro alinhado. A última coisa a fazer com o nosso bilhete é o dedo do pé na casca. Mais para o painel RSS, selecione um código de barras que eu forneci e coloque-o em nossa tela de desenho. Você também pode, como eu mencionei antes, fazer seu próprio código de barras indo on-line e procurar por conversores de código de barras gratuitos. Está bem. A última coisa a fazer é agrupar tudo e policiar uma multa. Nós também podemos fazer um componente fora do ticket. Então clique em grandes componentes e filmes para fora copiar, mas segurando velho e arrastando-o de volta em direção à câmera. Agora, se você comprar mais de um bilhete, vamos fazer um café. Oco para ser autêntico. E isso é tudo para a lição de hoje. Pessoal, vejo vocês no próximo vídeo.
13. Tela vazia: Bem-vindo ao segundo vídeo acima da tela do ticket,
a tela de estado vazio. Neste vídeo curto, aprendemos como projetar em estado vazio para obter tela. Uma vez que a tela do bilhete é acessível a partir da nossa tela inicial, um k a. a tela do partido. Há uma possibilidade de que esta rainha não tenha nenhum conteúdo, veja o usuário. Ainda não comprei nenhum bilhete para este propósito que estamos projetando em Empty State, que mostrará se não houver nenhum bilhete na tela da figura. Se você se lembra, mencionamos isso no usuário para vídeo. Como uma tela vazia deve parecer os elementos são algum gráfico apropriado, uma mensagem que explica por que não há conteúdo aqui em uma chamada à ação que fará com que o usuário faça algo no nosso caso. Compre ingressos. Então, sem mais delongas, vamos ao assunto. Suponho que você já criou seu plano de fundo, usando o retângulo para em nossa cor favorita. Se não, faça-o agora estamos usando o mesmo Heller. Há uma tela de tíquetes onde temos um fundo grande e um título de tela agora em nosso
painel de ativos . Eu forneci o gráfico para esta lição. Pegue e coloque em nossas câmeras. Como você pode ver, este é o mesmo que Michael estava usando em nosso componente de cabelo para nos ligar aos bilhetes Rainha só maior e uma cor diferente. Coloque-o no meio de nossas câmeras. Agora abra o seu tipo, também, e digitando. Parece que você não tem filhos. barco mudou os quatro lados para isso. 30 picaretas no telefone. Espere, ele é normal e a cor é branca. A última coisa a fazer é centrar. Alinhe este texto e certifique-se de que ele se encaixa em nossa tela quebrando essas palavras. Agora coloque. 30 pesos não são gráficos e forro central para Kemalist. Então, tanto o gráfico quanto o texto e agrupá-los centro alinhados com o moinho fora de nossas câmeras. Agora, a última coisa a fazer é rebocar na chamada à ação, copiar e colar a direção do código de nossas telas anteriores e alterar o conteúdo para reservar ingressos. Agora certifique-se que esta é a linha central e 15 pixels da parte inferior. É isso aí, pessoal. Fizemos dele o projeto final para aplicação. Verei vocês no próximo vídeo onde discutiremos as coisas que aprendemos até agora e prepararemos para o desafio. Muito obrigado pela sua atenção.
14. CONCLUSÃO: Bem-vindos à conclusão do vidro, pessoal. Em primeiro lugar, quero dizer Parabéns por terminar este copo. Obrigado por ser meu público. Eu sinceramente espero que você ame algo desses Siri para recapitular. Aprendemos como projetar um fluxo de usuário, uma persona de usuário e muitos tipos de telas que para uma aplicação móvel ao longo dos vídeos em dicas úteis polvilhadas que contribuem para uma boa experiência do usuário. Lembre-se, o usuário é uma chave para qualquer negócio, e você deve sempre projetar para o usuário. Eu penso fora do aplicativo como uma engenhoca chique que serve como uma ferramenta para o usuário, mais fácil ele pode fazer as coisas, melhor para ele e para as mortes de negócios. Você estava pisando a experiência do usuário? Os designers garantem que os usuários se sintam confortáveis ao usar seus aplicativos. E agora o desafio na verdade dois desafios. A primeira parte é projetar a tela de sucesso e a tela de erro. Se você se lembrar quando o usuário compra os bilhetes, ele é redirecionado para o sucesso ou erros rainha. Dependendo do resultado da compra, o desafio é projetar essas rainhas usar as técnicas que você aprendeu nesses vídeos para alcançá-los ou você poderia pensar que você tem uma solução melhor. Vá em frente e use-o. A segunda parte é projetar Ah aplicativo de reserva inteiro usando as técnicas que você aprendeu até agora. O up pode ser para onde eles estavam. Gosta de reserva de hotel ,
bilhetes de
avião , reserva de mesa, etc. Eu vivo para você decidir mais uma vez. Obrigado por fazeres parte da minha turma. E espero voltar a conhecê-lo no futuro da Siri
Angel Davchev, UI/UX Designer
