平面设计作品集网站:页面、案例、清单

如何搭建平面设计作品集网站:展示多少个项目、需要哪些页面、可直接套用的案例模板,以及上线前的检查清单。

常见问题

平面设计作品集网站应该放多少个项目?

建议放 6 到 10 个项目,把最出色的两三个放在最前面。这个数字没有官方标准,关键是每个项目都值得展示,并且整体能体现你希望接到的那类工作。如果某件作品比其他的弱,就果断删掉。精简的作品集比冗长的更能体现你的判断力。

平面设计作品集需要自己的域名吗?

不是必须的,但用你名字组成的域名(如 yourname.com 或 yourname.design)放在简历和邮件签名里更显专业,而且更换平台时域名也能一直跟着你。购买前请先向域名注册商确认域名是否可用以及续费价格,因为不同注册商的价格各不相同。

作品集里只放成品设计,还是也要展示设计过程?

两者都要放,但要有主次。每个项目先展示最终成果,再简短呈现草图、初稿或被你否掉的备选方案。设计过程能体现你的思考方式,这对企业内部岗位和设计公司的招聘尤其重要。如果是供快速浏览的页面,请把过程放在项目详情页,不要放在首页。

可以放学生作业、个人作品或概念项目吗?

可以,尤其是职业生涯早期。请如实标注为学生作业、个人项目或概念设计,避免被误认为客户项目。自己拟定的设计需求也没问题,只要把问题和限制条件讲清楚。等有了真实客户项目,再逐步替换掉它们。

作品集图片应该用什么文件格式和尺寸?

导出适合网页的图片:样机等照片类图片通常用 JPEG 或 WebP,扁平图形和 Logo 用 PNG 或 SVG。把图片调整到实际显示的宽度,并进行压缩,让页面加载更快。另外单独保留一份高分辨率的 PDF 作品集,用于邮件投递。

作品集网站比 PDF 作品集更好吗?

两者作用不同。网站方便通过链接分享,能被搜索引擎收录,而且可以随时更新。PDF 适合在投递时明确要求附件的场合。大多数设计师两者都准备,以网站为主,再用同样的项目导出一份 PDF。

简短回答:平面设计作品集网站需要展示 6 到 10 个最好的项目,每个项目写成一篇简短的案例(问题、你的角色、过程、结果),再加上四个页面:首页、作品、关于、联系。把最强的三个项目放在最前面,只展示你希望多接的那类工作,并让联系方式一眼就能找到。下面的模板和清单涵盖了其余内容。

平面设计作品集网站到底需要什么

作品集只有一个任务:帮助陌生人在一两分钟内决定要不要给你发邮件。网站上的一切都应该服务于这个决定。访客通常是下面三类人之一:

  • 客户:想知道你能否解决他们那类问题(品牌、包装、社交媒体、印刷)。
  • 招聘经理或猎头:想看到你的审美、涉猎范围,以及与他人协作的方式。
  • 合作伙伴或设计公司:需要快速了解你的专长。

在挑选项目之前,先想清楚你的主要读者是谁。面向自由职业品牌客户的作品集,和面向初级企业内部设计岗位的作品集,看起来会很不一样。

展示多少个项目

目标是 6 到 10 个。少于 6 个会显得单薄,除非每个都是深入的案例。超过 10 个通常意味着有些作品在稀释最好的作品。

决定去留的简单方法:

  1. 列出所有你引以为傲的项目。
  2. 标出与你希望多接的工作类型相符的项目。其余的删掉,即使它们是有偿项目。
  3. 把剩下的按质量排序,前三名放在最前面。
  4. 检查你擅长领域内的多样性:例如一套 Logo 系统、一件包装作品、一件编辑设计或宣传活动作品。
  5. 如果两个项目证明的是同一项技能,只保留更好的那个。

需要搭建的页面

四个页面就足够了。只有在你确实有内容可放时,才添加其他页面。

页面作用内容
首页几秒内让访客了解你一句话说明你做什么、3 到 6 个精选项目、清晰的联系入口
作品(或项目)完整作品集带项目名称和设计类别的缩略图,链接到各个案例
案例页面证明你的思考方式每个项目一页,按下面的模板制作
关于让你成为一个有血有肉的人简短简介、照片、技能或工具、服务内容或可接单时间
联系减少沟通阻力邮箱、可选的表单、专业社交主页链接

可选的补充页面:如果你做自由职业,可以加一个服务页;如果正在求职,可以加一个简历页;如果每个项目的流程都相似,可以加一个简短的工作流程页。

案例结构模板

每个项目都可以套用这个大纲。每个部分都要简短。大多数访客只会快速浏览,所以请用标题和图片来讲故事。

模板

  1. 项目标题和一句话概述。客户或项目名称、设计类别和年份。示例:“Harbor Coffee Roasters,包装与品牌形象,2025 年。”
  2. 需求简报。用两三句话说明客户需要什么以及原因。如果有限制条件(预算、截止日期、目标受众),请写明。
  3. 你的角色。你做了什么;如果是团队项目,也写明其他人做了什么。要具体:“主设计师,与一位文案和一位印刷师合作”比“所有设计都是我做的”更可信。
  4. 过程。三到五张图片或简短说明:草图、情绪板、早期方向,以及你做出选择背后的理由。
  5. 最终作品。页面上最大、最清晰的图片。用样机或印刷成品的实拍照片展示设计在实际场景中的效果。
  6. 成果。用你能如实陈述的事实来说明发生了什么变化:客户已上线使用、取代了旧的品牌形象、现已上架销售、以某个规模印刷。如果没有数据,就不要写。不要编造指标。
  7. 下一个项目链接。让访客继续浏览你的作品。

可参考改写的示例文案

  • 需求简报:“客户是一家社区小面包店,希望 Logo 和包装有手作感,同时能以单色低成本复制。”
  • 角色:“我负责调研、Logo 设计和包装系统。产品文案由客户撰写。”
  • 过程说明:“三个早期方向。我们放弃了手写体字标,因为缩小后辨识度下降。”
  • 成果:“新包装于春季上市,现已用于所有产品线。”

让作品成为主角的网站设计

  • 导航保持在四到五项。首页、作品、关于、联系就够了。
  • 使用中性背景和充足留白。色彩由你的项目来承担。花哨的模板会与作品争夺注意力。
  • 选用一到两种字体。作为设计师,你自己的网站就是一份字体排印样本。保持统一、易读。
  • 图片要大。缩略图要清晰,项目页应让关键图片铺满整个宽度。
  • 把你的名字和设计方向放在首页顶部。“陈梅,品牌与包装设计师”比一句没人看得懂的巧妙口号好得多。
  • 用手机检查。很多访客会在手机上打开你的链接。测试作品展示、菜单和联系链接。
  • 压缩图片。过大的文件会拖慢页面,对访客体验和搜索可见度都不利。

分步指南:从零到上线

  1. 确定方向和读者。用一句话说明:“我为[谁]设计[什么]。”
  2. 按上面的筛选方法选出 6 到 10 个项目。
  3. 按模板撰写每篇案例,先从最好的项目开始。
  4. 导出适合网页的图片,尺寸与实际显示一致,并给文件起清晰的名字。
  5. 选择建站工具和布局,以图片为先,干扰要少。如果想找个起点,可以参考平面设计师网站建设工具页面和 AI 设计师作品集模板,了解现成布局的样子。
  6. 搭建四个核心页面,并加入你的案例。
  7. 绑定一个用你名字命名的域名。
  8. 全面校对,然后请朋友或前同事在网站上找你的邮箱地址。如果他们找得费劲,就改进联系页面。
  9. 发布,然后分享链接:放进邮件签名、简历和专业社交主页。

如果你在比较工具,We.Inc 的免费方案允许你使用现成模板发布最多三个网站;根据提示词生成网站初稿的 AI 建站功能,从 Starter 方案起,每月 $20。你可以在这里注册。如果你要从其他作品集平台迁移,可以看看这份 Portfoliobox 替代方案清单。

上线检查清单

分享链接之前,复制这份清单并逐项打勾。

内容

  • [ ] 6 到 10 个项目,最强的三个放在最前面
  • [ ] 每个项目都有需求简报、你的角色、过程、最终作品和成果
  • [ ] 学生作业、个人项目和概念设计都已如实标注
  • [ ] 没有展示你无权公开的客户作品
  • [ ] 关于页面有照片、简短简介以及你可承接的工作
  • [ ] 联系页面和页脚都能看到邮箱地址

设计

  • [ ] 导航不超过五项
  • [ ] 统一使用一到两种字体
  • [ ] 文字与背景对比清晰、易读
  • [ ] 作品展示中的图片大而清晰,尺寸一致
  • [ ] 每张图片都有描述性的替代文字(alt text)

技术

  • [ ] 在手机、平板和电脑上显示正常
  • [ ] 图片已压缩,页面加载迅速
  • [ ] 所有链接都有效,包括“下一个项目”链接
  • [ ] 已为首页和每个项目设置页面标题和描述
  • [ ] 已绑定自定义域名,网站通过 HTTPS 加载
  • [ ] 已设置社交分享预览图,分享链接时显示效果好

上线之后

  • [ ] 已把链接加入邮件签名、简历和专业社交主页
  • [ ] 已设置提醒,每隔几个月检查作品集并替换为新作品

需要避免的常见错误

  • 把做过的所有东西都放上去。取舍本身就是你要展示的能力之一。
  • 只有图片,没有背景说明。一张漂亮的样机,如果没有需求简报,就无法让访客了解你的思考。
  • 把联系方式藏起来。如果需要点击不止一次才能找到,你就会流失咨询。
  • 宣称无法证实的成果。如实描述发生了什么。真实而朴素的成果,比含糊的夸大说法更可信。
  • 从不更新。用更强的新作品替换旧作品。

下一步

网站上线之后,同一份作品集还可以支撑你的自由职业业务。以下指南介绍了后续步骤:如何获得网页设计客户和如何发展网页设计业务,对于在平面设计之外开始提供网站服务的设计师同样适用。

免费开始 · 无需信用卡

Umair Ali Sadaqat

We.Inc 创始人

Umair 是 We.Inc 的创始人。他撰写有关 AI 建站、代理机构以及经营网站工作室的文章。

准备好打造出色的作品了吗?

加入 15,000+ 家使用 We.Inc 在一个平台上完成上线、增长和自动化的企业。

免费开始

无需信用卡 · 联系销售

相关内容: 博客

产品

适用对象

功能

资源

公司

网站地图