Peças gráficas
Design de currículo para engenheiro frontend
Este design de currículo chinês em duas colunas combina uma trajetória profissional detalhada com seções compactas de habilidades, formação e idiomas.
Casos de uso de design de currículo
- Currículos de engenheiros frontend senioresApresente uma trajetória técnica por meio de cargos, projetos e habilidades.
- Currículos técnicos em chinêsCombine descrições em chinês com termos técnicos em inglês de uso corrente.
- Resumos de trajetória profissional técnicaRelacione o trabalho de engenharia a medidas e resultados concretos.
Destaques do layout do currículo
- Leitura guiada pela trajetória profissionalPerfil primeiro, seguido de cargos com datas e projetos públicos.
- Informações em duas colunasA experiência ocupa a coluna mais larga; as qualificações ficam ao lado.
- Destaques azuis pontuaisNúmeros importantes e marcadores de seção se destacam do texto corrido.
O currículo para engenheiro frontend, coluna por coluna
1 / 3
Um currículo chinês para engenheiro frontend
Distribuído na biblioteca da comunidade OpenDesign, com HTMLAnything declarado como fonte upstream, este currículo chinês retrata um engenheiro frontend sênior de exemplo. O título combina o cargo em chinês com “Senior Frontend Engineer”, enquanto a linha de contato reúne Xangai, e-mail, GitHub e LinkedIn abaixo do nome. Um perfil breve alega oito anos de experiência em frontend, uma reformulação do sistema de design de um produto descrito como atendendo mais de 50 milhões de usuários ativos mensais (MAU) e foco em ferramentas de desenvolvimento assistido por IA. Essas credenciais são ilustrativas, não um histórico pessoal verificado.
Colocar o perfil antes da seção de experiência oferece ao leitor um enquadramento conciso antes das evidências mais densas que vêm a seguir. A linha de contato mantém os dados práticos visíveis perto do nome, embora seus vários itens em linha talvez precisem ser reorganizados em formatos mais estreitos.
Onde esta estrutura de currículo se encaixa
Este design atende a uma pessoa candidata da área técnica cuja trajetória depende da progressão profissional e do escopo de engenharia. Na coluna de experiência do exemplo, Acme AI, ByteDance e Meituan aparecem em ordem cronológica inversa, cada uma com um cargo e um período de datas. Os tópicos abaixo retratam trabalhos como a atualização do React 16 para o 19 e a migração do webpack para o Vite. Os nomes das empresas, a cronologia e os resultados pertencem ao exemplo; esta página não verifica o vínculo profissional da pessoa retratada.
Essa sequência ajuda os leitores a percorrer empresas e datas antes de considerar as alegações associadas a cada cargo. Também reserva um espaço próprio para projetos após o histórico profissional: “公开项目” lista html-anything e lite-form com breves descrições. Essa separação pode manter o trabalho independente visível sem interromper a trajetória profissional. Pessoas candidatas com outra ênfase podem adaptar a ordem, mas devem preservar uma distinção clara entre empregos e projetos apresentados à parte.
Progressão profissional
Use grupos de cargos com datas quando as mudanças de responsabilidade ou de foco técnico forem centrais para a trajetória da pessoa candidata.
Trabalho independente
Crie uma seção própria para projetos públicos quando eles acrescentarem evidências além do histórico profissional.
Como as duas colunas dividem o conteúdo
A página usa um layout com 210 mm de largura. Na captura completa, experiência e projetos públicos ocupam o lado esquerdo, mais largo, enquanto formação, habilidades, idiomas e interesses ficam à direita, mais estreita. Essa proporção reflete o conteúdo: as descrições de cargos incluem tópicos mais longos, que ocupam mais de uma linha, enquanto a coluna direita usa itens curtos e listas compactas.
A introdução em toda a largura recebe o rótulo “个人简介”. Abaixo dela, a coluna esquerda segue de “工作经历” a “公开项目”, enquanto a direita contém “教育”, “核心技能”, “语言” e “兴趣”. O lado da trajetória profissional comporta a narrativa mais longa; a barra lateral serve como referência compacta de qualificações. Os tópicos mais longos sobre empregos podem dar a esse lado mais peso visual do que à coluna mais curta de qualificações.
Coluna principal
A experiência com datas e as descrições de projetos comportam o conteúdo mais longo e explicativo.
Barra lateral
Formação, rótulos de habilidades, níveis de idiomas e interesses aparecem em itens compactos.
Cargos com datas e evidências
Cada emprego começa com a organização e o cargo, com o período alinhado no lado oposto. O item da Acme AI tem três tópicos: um editor interno de IA com números declarados de DAU e NPS; uma atualização de framework com uma alegação sobre regressões e uma comparação da velocidade do compilador; e uma biblioteca de componentes com números de adoção e downloads. Essa combinação mostra como o design acomoda alegações sobre produto, migração e reutilização em um mesmo cargo.
O destaque azul chama a atenção para valores selecionados, como “12k”, “68” e “3.2 倍”. Isso facilita a leitura rápida, mas também pode fazer os números parecerem mais conclusivos do que suas definições permitem. Por exemplo, o currículo não explica como o NPS foi medido nem quais eram as condições de comparação por trás da alegação sobre velocidade. Ao adaptar esse padrão, mantenha contexto suficiente para explicar a que cada métrica se refere, em vez de destacar apenas um número. As alegações fornecidas continuam sendo ilustrativas.
Listas compactas mudam o ritmo da leitura
A seção de habilidades usa chips com rótulos curtos, incluindo TypeScript, React, Next.js e Vite, enquanto os idiomas aparecem em pares de nome e proficiência: chinês e “母语”, inglês e “CET-6 615”, japonês e “N3”. A formação também é compacta: Universidade Fudan, diploma, datas e GPA aparecem em um pequeno bloco. Essas formas concisas tornam a barra lateral rápida de percorrer, mas deixam menos espaço para explicar proficiência, disciplinas ou domínio das habilidades.
O item sobre interesses é mais longo e ocupa várias linhas, mostrando que mesmo uma coluna compacta precisa prever quebras naturais de texto. Em uma nova versão, o conteúdo deve determinar a extensão da barra lateral; ela não deve ser comprimida a ponto de apagar as diferenças entre nomes de habilidades, qualificações e evidências.
O que o design apresenta
As capturas mostram um currículo estático com alegações ilustrativas sobre a pessoa, sua trajetória profissional e sua formação. Os dados de contato são elementos span comuns no código-fonte, não links funcionais para e-mail ou perfis; nenhum serviço de recrutamento ou fonte de dados está conectado. Uma folha de estilos para impressão remove o fundo externo e a sombra, mas não implementa um controle de exportação para PDF nem comprova compatibilidade com sistemas de rastreamento de candidaturas. Métricas, qualificações, estrelas de projetos e comparações de desempenho precisam ser verificados à parte. A declaração MIT do manifesto incluído não estabelece licenciamento separado para cada recurso visual representado.
Como criar um design de currículo para engenheiro frontend no OpenDesign
Defina a página e a função de cada coluna
Comece com uma página em formato retrato e uma área de largura total para o nome, a linha de contato e um perfil breve. Abaixo dessa introdução, destine a coluna esquerda, mais larga, ao histórico profissional com datas e aos projetos públicos; reserve a coluna direita, mais estreita, para formação, habilidades, idiomas e interesses. Deixe espaço suficiente para que os tópicos com evidências possam ocupar mais de uma linha.
Prompt sugeridoCrie um design de currículo chinês para um engenheiro frontend sênior em uma página retrato com 210 mm de largura. Coloque o nome, o título profissional bilíngue, a linha de contato e um perfil breve em toda a largura, acima de uma grade de duas colunas. Use a coluna esquerda, mais larga, para o histórico profissional em ordem cronológica inversa e os projetos públicos; use a coluna direita, mais estreita, para formação, rótulos de habilidades, níveis de idiomas e interesses. Use conteúdo de exemplo claramente ilustrativo e destaque azul comedido para marcadores de seção e alguns números. Considere não verificados os vínculos profissionais e as alegações de proficiência, a menos que eu forneça evidências; não dê a entender que há links ativos ou serviços conectados.
Organize as evidências por cargo
Para cada cargo, informe a organização, o título, as datas e alguns tópicos concisos. Mantenha a combinação do exemplo — trabalho em produto, migração de framework e adoção de biblioteca de componentes — somente quando essas categorias se aplicarem à pessoa candidata. Defina as comparações e métricas no texto ao redor; não dependa de números destacados para que seu contexto fique evidente.
Ajuste a barra lateral e as quebras de linha
Mantenha os nomes de habilidades separados das qualificações em idiomas e inclua o nível ou a evidência que dá sentido a cada item. Revise as linhas mais longas de interesses ou formação na largura de página prevista para que as quebras não ocultem a estrutura das seções. A referência é um exemplo de design estático; portanto, não acrescente suposições sobre comportamento de links, persistência ou uma fonte de dados de produção.
Exportar e obter um link de compartilhamento
Exporte seu design finalizado e, em seguida, use Compartilhar no OpenDesign para obter um link de compartilhamento. Abra o link em uma janela separada do navegador e verifique se a versão desejada e seus assets estão disponíveis antes de enviá-lo.
Design de Pôster Editorial de Fluxo de Trabalho com IA
O design de pôster editorial de fluxo de trabalho com IA apresenta seis propostas em capítulos numerados, com exemplos concretos de prompts, fundo creme e acentos tipográficos em ferrugem.
Peças gráficas
Design de Carrossel Social sobre Fluxo de Trabalho com IA
Sete cards verticais usam títulos chineses superdimensionados, hábitos numerados, campos de cor variáveis e uma declaração final para explicar fluxos de trabalho de edição com IA.
Peças gráficas
Design de Shader Aurora Field
Um campo de ruído azul-esverdeado animado automaticamente dá atmosfera a um hero em WebGL, enquanto um título fixo e um pequeno indicador local de taxa de quadros ancoram a cena.
Peças gráficas
Design de Shader Aurora Veil
Aurora Veil é uma composição interativa de shader que transforma luz em camadas, estrelas e movimento do cursor em um hero atmosférico em WebGL.
Peças gráficas