Sketch/XD para HTMLConversão de layout em HTML

Seu design do Sketch ou XD montado em HTML e CSS: uma página a partir das pranchetas exportadas, com versão para celular

Normalmente fica pronto em 15 minutosAjustes incluídosControle de qualidade
Pagamento protegidoDetalhes
  • Os ajustes previstos no pacote são gratuitos.
  • Se você não responder em 3 dias após a entrega, o trabalho é aprovado automaticamente.
Fazer pedido · R$ 217

O dinheiro fica reservado no pagamento e só é liberado quando você aprova o trabalho.

Seu design do Sketch ou XD montado em HTML e CSS: uma página a partir das pranchetas exportadas, com versão para celular

Exemplo de resultado

Exemplo do pacote Padrão

Página inicial de uma clínica odontológica feita a partir do design

Antes: o design que o cliente enviou

O design da página inicial

Depois: a página funcionando

A página no computador A página no celular

Arquivos: um arquivo ZIP com index.html, os estilos e 2 imagens para a página, pronto para subir na hospedagem do cliente. As imagens aqui são capturas de tela da página.

Cliente: Bright Smile Dental. Tarefa: transformar o design da página inicial em uma página HTML funcionando, com o mesmo layout, as mesmas cores e textos, e botões de agendamento que ligam para a clínica.

O cliente e todos os dados são fictícios.

Sobre este serviço

Alguns designs ainda estão em arquivos do Sketch ou do Adobe XD, difíceis de abrir sem o app, e a página nunca foi montada. Exporte as pranchetas em PNG e envie, e nós as montamos em HTML e CSS: as mesmas seções, grid, cores e botões, com texto real, além de uma versão para celular feita a partir da prancheta desktop quando não houver uma mobile. Não conseguimos abrir arquivos .sketch ou .xd, links de nuvem nem protótipos, então o que não aparece na exportação vai para o briefing. Fotos e ícones são desenhados de novo no mesmo espírito, a menos que você os exporte e envie separadamente. Sem animações, back-end, CMS ou hospedagem.

O que está incluído

  • O que você recebeUm arquivo ZIP com as páginas, estilos e imagens, pronto para subir na sua hospedagem, e uma prévia de cada página na página do pedido.
  • A partir das suas pranchetasSeções, espaçamentos, cores e tamanhos de texto como na exportação
  • Versão para celularFeita a partir do design desktop quando você não tem um mobile
  • Texto realTítulos e parágrafos em HTML que os buscadores leem
  • Suas imagensFotos, ícones e logo exportados separadamente entram como estão
  • Código limpoHTML e CSS simples, sem frameworks, nada carregado de outros sites

Como funciona

  1. 1
    ExportaçãoVocê exporta as pranchetas em PNG e envia com as suas anotações
  2. 2
    MontagemMontamos as páginas e desenhamos as imagens que faltam
  3. 3
    Prévia e arquivoVocê compara as páginas com o seu design no computador e no celular, baixa o arquivo e pede ajustes dentro do seu pacote

O que precisamos de você

Até 5 imagens em PNG, JPEG ou WebP: pranchetas exportadas do Sketch (seção Export do Inspector) ou do XD (Arquivo > Exportar > Selecionados), uma página por arquivo, em 1x ou 2x, e, se quiser, fotos, ícones ou seu logo exportados separadamente. Diga qual prancheta é qual página, as fontes, estados que não aparecem na exportação, como um menu aberto, e para onde leva cada botão. Não arquivos .sketch ou .xd.

Vamos perguntar:

  • Qual prancheta é qual página?
  • Fontes do design
  • Mudanças em relação ao design antigo
  • Para onde leva cada botão?
  • O design é seu?

Compare os pacotes

Básico1 prancheta, até 5 seçõesR$ 117Padrão1 prancheta, até 10 seçõesR$ 217PremiumAté 3 pranchetasR$ 373
Prazo1 dia2 dias3 dias
Ajustes123
Páginas113
Seçõesaté 5até 10até 8 por página
Ilustrações feitas para a página24—
Versão para celularSimSimSim
O que enviarExportação das pranchetas em PNGExportação das pranchetas em PNGExportação das pranchetas em PNG
Ilustrações feitas para as páginas——6
Fazer pedidoFazer pedidoFazer pedido

Pagamento protegido

Você paga ao fazer o pedido, mas o dinheiro só é liberado pelo trabalho aprovado.

  • Preço fixoO preço do pacote não muda depois que você paga.
  • O dinheiro fica reservadoAo pagar, o valor fica apenas reservado. Ele só é repassado quando você aprova o trabalho.
  • Verificado antes da entregaCada resultado passa por um controle de qualidade antes de chegar até você, e você o vê na página do pedido antes de aprovar.
  • Ajustes gratuitosPeça ajustes dentro do seu briefing quantas vezes o pacote permitir.
  • Aprovação após 3 diasSe em 3 dias após a entrega você não aprovar o trabalho nem pedir ajustes, ele é aprovado automaticamente. Se você escrever no chat do pedido após a entrega, o pedido fica em espera; depois que respondermos, podemos reiniciar a contagem de 3 dias e avisaremos no chat.
  • Refazer ou reembolso totalSe o resultado não corresponder ao seu briefing e os ajustes não resolverem, ou se o trabalho levar mais que o dobro do prazo, escreva no chat do pedido: refazemos o trabalho ou reembolsamos o pagamento integralmente.
Como funciona →

Perguntas e respostas

Não tenho mais o Sketch ou o XD instalado.

Então peça a quem ainda tem o arquivo para exportar as pranchetas, ou envie capturas de tela nítidas do design, se o texto estiver legível nelas. Trabalhamos só a partir de imagens.

Vocês podem usar meu link de nuvem?

Não, trabalhamos só com imagens enviadas, não com links nem arquivos de design, e não acessamos as suas contas.

Vai ficar idêntico ao meu design, pixel por pixel?

Vai ficar próximo no layout, nas cores, nos tamanhos e na ordem das seções, mas não pixel por pixel: as fontes são fontes do sistema parecidas, e as fotos são desenhadas de novo, a menos que você envie as suas. Os ajustes corrigem o que importa para você.

Vocês podem atualizar o design antigo enquanto montam?

Pequenas mudanças do seu briefing, como um texto, uma cor ou um rótulo de botão novos, sim. Um novo layout para a página inteira é um redesign e não faz parte deste serviço: aqui montamos o design que você enviar.

Não encontrou a resposta?

Todos os serviços de Desenvolvimento e TI

Mais em Desenvolvimento e TI

Fazer pedido · R$ 217· ~15 min