Bem vindo ao GGames

Registre-se agora para obter acesso a todos os nossos recursos. Uma vez cadastrado e logado, você será capaz de criar tópicos, postar respostas a tópicos já existentes, dar reputação a seus companheiros, obter seu próprio mensageiro privado, postar atualizações de status, gerenciar seu perfil e muito mais. Esta mensagem será removida depois de você ter feito login.


Entre para seguir isso  
403 - Forbiddeen

Photoshop Como fatiar e exportar layouts PSD para HTML

1 post neste tópico

Como fatiar e exportar layouts PSD para HTML


Utilizando a ferramenta Photoshop de fatiar (Slice tool) para exportar imagens de layout website para o html da maneira correta.

 


SETUP: i7 4790k à 4Ghz + Deepcool Captain 360 / 16Gbs de Memória DDR3 HyperX Beast 1866Mghz / GTX 1070 Zotac Extreme / Fonte 1000W EVGA G2 / SSD 120Gb Samsung / 2 HD (1TB + 2TB) / Gabinete CM STORM Stryker / Mouse EVGA TORQ X5 / Headset Corsair Gaming Storm Void / Mousepad Razer BF4 / Teclado CM STORM Aluminum Mech / Monitor LG 29' Ultra Wide 

Pixel Project - Desenvolvimento Web & Marketing
 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora
Entre para seguir isso  

  • Conteúdo Similar

    • Por 403 - Forbiddeen
      25 Atalhos úteis para o Photoshop
      Essa é uma listinha com 30 atalhos úteis para o Photoshop! Se você é Designer, provavelmente não deva conhecer todas. Atalhos para Photoshop H : Ferramenta Mão (Hand Tool). D : Restaura as cores originais da paleta. B : Pincel (Brush Tool). F : Pressionando uma vez, a barra de menus desaparece, e fica possível movimentar o campo de trabalho além dos cantos da tela. Pressionando duas vezes, o Photoshop se ajusta à tela do computador, e o fundo do programa (antes cinza) fica preto. Ctrl + : Zoom In. Ctrl – : Zoom Out. Ctrl + 0 (Zero) : Ajusta a imagem à tela. Ctrl + Z : Desfaz a última alteração. Se pressionado duas vezes, a imagem retorna ao ponto de partida, ou seja, como estava antes da utilização do atalho. Ctrl + Alt + Z : Desfaz as alterações continuamente. Ctrl + Shift + Z : Refaz as alterações desfeitas. Tab : Oculta/mostra todas as paletas e menus abertos. Excelente para uma vizualização rápida em tela cheia! [ : Diminui o tamanho do pincel. ] : Aumenta o tamanho do pincel. Shift + [ : Diminui a dureza (Softness) do pincel. Shift + ] : Aumenta a dureza do pincel. 0 ~ 9 : Aumenta ou diminui a opacidade da ferramenta que está sendo utilizada, ou da camada. Combine os números para obter valores exatos. Ex: pressionando apenas o número 4, a opacidade ficará em 40%. Já se você pressionar os números 4 e 3, a opacidade ficará em 43%. Shift + 0 ~ 9 : Aumenta ou diminui o preenchimento da ferramenta que está sendo utilizada, ou da camada. Ctrl + Tab : No Firefox, este comando abre a próxima aba. Já no Photoshop, se você estiver com vários arquivos abertos ao mesmo tempo, este comando trará o próximo para o primeiro plano. Ctrl + Alt + Shift + N : Cria um novo layer de imediato, sem exibir caixas de diálogo. Ctrl + L : Níveis (Levels). Ctrl + Alt + L : Abre a ferramenta níveis com a última configuração utilizada. Ctrl + B : Equilíbrio de cores. Ctrl + Alt + B : Abre a ferramenta equilíbrio de cores com a última configuração utilizada. Ctrl + U : Ferramente Matiz/Saturação. Ctrl + Shift + U : Remove a saturação (deixa a imagem em preto e branco). Autor 403 - Forbiddeen Categoria Photoshop Enviado 31-07-2018 13:49  
    • Por Nakamura
      Tipos e formatos de imagens
      Oii, bom tive um aula na minha faculdade sobre compactação de imagens ( Formatos de arquivos ) e vim compartilhar com vocês! Tipos de Imagens Existem dois tipos de imagens. Estes dois tipos recebem o nome de Bitmap e Vetor. Ambos possuem diferenças, vamos entende-las melhor agora.   Bitmap Ele é utilizado na maioria das imagens. Também conhecido como "Mapa de bits", no qual as imagens que possuem este tipo são formadas literalmente por vários pontos pequeninos que levam o nome de "Pixels". Cada pixel tem já designado uma cor para si, juntando todos os pixels através de coordenadas especificas (X e Y) eles formam uma só uma imagem. As imagens são todas formadas por pixels.  Para vê-los você pode abrir uma imagem qualquer no Photoshop e dar zoom, verão que a imagem ficará cheia de quadradinhos, estes são os pixels desta imagem. Os pixels funcionam igual as construções de Minecraft, colocamos bloco por bloco, cada um de uma cor até formar algo.   Observe um print pelo Wikipédia mostrando os pixels     Vetor   O vetor é formado por imagens que se baseiam em polígonos formados por pontos, eles são usados muito em logotipos. Quando falamos de imagens vetorizadas estamos falando de imagens criadas em computação gráfica. Os vetores podem ser ampliados e diminuídos o quanto for necessário, pois eles não perdem sua qualidade.    Elas são traçadas por formas, retas, curvas e são calculadas milimetricamente com formulas matemáticas, garantindo a riqueza de detalhes (Porém neste quesito eles perdem para os bitmaps) e o mantimento de suas proporções Elas são traçadas por formas, retas, curvas e são calculadas milimetricamente com formulas matemáticas, garantindo a riqueza de detalhes (Porém neste quesito eles perdem para os bitmaps) e o mantimento de suas proporções   Programas que utilização Vetorização    Adobe Ilustrator | Corel Draw    existem outros porém esses são os mais utilizados por Designers    Tipos de Arquivos   JPG/JPEG       Este formato é o formato padrão de grande parte dos usuários, é o formato gerado por nossas câmeras fotográficas, celulares e afins. Eles podem ser abertos em praticamente todos os programas de edição de imagem. Possui uma taxa de compressão muito alta, essa taxa de compressão alta é capaz de fazer com que um papel de parede com resolução Full HD (1920x1080) ocupe apenas 100 KB em disco. No entanto, quanto maior a compressão menor a qualidade da imagem.   Este formato é recomendado apenas àqueles que querem arquivos leves, já as pessoas que querem arquivos detalhados, e imagens com qualidade altíssima não é recomendado este tipo de formato. Lembrando que o formato JPG também não possui transparência, então imagens com fundo transparente não devem ser salvas em JPG.     GIF O GIF é o formato mais usado quando falamos em animações, é um dos formatos mais queridos pela internet e está em todos os lugares (Principalmente em memes), este formato é um dos mais antigos e já foi motivo para varias discussões judiciais por conta de direitos autorais. A abreviação GIF vem de "graphics interchange format".    Um dos males dos GIFs é que eles suportam apenas 256 cores, com isso algumas animações ficam bem ruins em questões de cores e perdem muitos detalhes. Este formato foi o primeiro que abordou animações, e continua sendo um dos únicos, porem suas limitações estão fazendo com que outros concorrentes apareçam. Um deles é o APNG que é um formato que também suporta animações e mantém a qualidade das imagens PNG.   O recomendado é que o formato GIF seja usado apenas na internet, por quem não se importa muito com qualidade pois quando alterado seu tamanho inicial ele perde toda qualidade.                                                                PNG   O PNG (Portable Network Graphics) é também usado para imagens transparentes, ele suporta milhões de cores, suporta compressões sem perda de qualidade e atualmente esta até suportando animações (APNG - Animated Portable Network Graphics). Entrementes tudo isso tem um preço, os formatos PNG são muito mais pesados em questões de KB em relação aos GIF e JPEG.   Este formato é o mais indicado para tudo que você vá fazer, por ter um tamanho em bits adequado e manter a qualidade das imagens altíssima.         PSD   ste formato é muito utilizado por quem tem interesse em estudar design, Photoshop e afins. Como seu próprio nome já diz (Adobe Photoshop Document) ele é um tipo de formato da Adobe especialmente desenvolvido para usar em programas da mesma empresa.  Possui suporte para máscaras, modo CMYK, camadas de texto, transparência e outras ferramentas avançadas.   Muitos dos designers gostam de salvar seus trabalhos em PSD para que possam abri-lo quando quiserem e a partir daquele trabalho criar outros, ou apenas da-los para      SVG   Os formatos JPG, GIF e PNG são formatos de compressão de arquivos Bitmap, pois o formato que vamos falar agora não funciona desta maneira. Ele se baseia em textos, sim em textos e descreve as imagens em formatos vetoriais. A sigla de SVG vem de "Scalable Vector Graphics", ele é reconhecido pela maioria dos web sites mais modernos.   São capazes de comprimir bem mais seus arquivos do que os outros e não perdem qualidade nenhuma. Eles também podem suportar transparências e animações. Ele é recomendado para smartphones e tablets pois possuem em si hardwares limitados se comparados com hardwares de computadores.      Uma observação final que possivelmente o arquivo JPEG/JPG poderá ser trocado por outro tipo de arquivo mais leve ainda esse ano 2018   Créditos: Khaleesi Atualização:  Nakamura     Cit Autor Nakamura Categoria Photoshop Enviado 14-07-2018 14:24  
    • Por Nakamura
      Sing Brush + Luz
      Salve pessoas, bom esse é meu primeiro tutorial então espero eu gostem   Autor Nakamura Categoria Photoshop Enviado 14-07-2018 14:22  
  • Quem Está Navegando   0 membros estão online

    Nenhum usuário registrado visualizando esta página.