从入门级自由职业者到高级设计师,在线作品集对于所有职业阶段的设计师来说都是必不可少的。潜在客户或雇主希望在雇用之前看到展示设计技能的作品集。
继续滚动查看下面最好的 15 个 UX 设计 portfolio 示例,从最佳实践中学习并获得灵感来创建自己的网站。
什么是用户体验设计作品集,为什么需要?
任何在各自行业工作的设计师都必须有专业的作品集。对于用户体验设计师来说,作品集是展示你最好的作品、创意过程和个性的机会,还可以提供深入的案例研究,传达如何促进用户体验。然而,所有用户体验设计 portfolio 都需要在引人入胜的视觉体验与增强可用性的视觉体验之间取得平衡。
15 个 UX 设计 portfolio 网站示例
这份精选的最佳作品集网站列表重点介绍了这些专业用户体验设计师在其 Wix 网站上实施的一些最佳实践。在创建自己的用户体验设计作品集时将这些考虑在内。
相关文章:什么是 Portfolio 网站
1.苏菲·布里顿
数字和品牌设计师索菲·布里顿 (Sophie Brittain) 在她的用户体验 portfolio 中精心设计了一个诱人、宽敞的设计。色彩鲜艳的抽象图形出现在她主页的顶部。这个主题在她的整个作品中重复出现,有助于定义一个独特的个人品牌。
Sophie Brittain 的 UX 产品 portfolio 的主要收获
索菲利用网站的首页介绍自己并简要说明她的专业领域。在大排版中说明她的名字和设计领域的创意学科,网站访问者不会错过这些重要信息。她还添加了一个友好的“你好!” 以及自定义图标形式的个人风格。
当把自己的 portfolio 放在一起时,要明确个性和专业知识。除了自己的之外,未来的雇主和客户可能还会浏览数十种 UX portfolio,因此添加有风度的风格,让作品脱颖而出。
02.戴安娜·塔塔连科
这位 2021 Wix Playground Academy参与者使用简洁的线条和简单的颜色创建了一个迷人的用户体验 portfolio。添加异想天开的石灰绿色字体散发出俏皮的氛围。
Diana Tatarenko 的 UX 产品 portfolio 的主要收获
戴安娜网站的亮点是“工作”部分,不仅展示了她最近的项目,还解释了她的过程。每个项目都概述了客户面临的问题,并解释了戴安娜如何通过设计解决问题。她向参观者展示了她的愿景、思维过程和支持每一步的图像——全面概述了她的创意工作流程。
你的 portfolio 是一个机会,在你见到客户之前就对他们保持透明。通过展示在创建最终产品时如何克服挑战和解决问题,客户会对您的方法更有信心。
3.狂奔
Run Wild 的 UX 产品 portfolio 提供几乎交互式的体验,使用视频背景作为网站的欢迎屏幕。标语是用大块白色字母写成的,下面有一个开始用户旅程的按钮,从设计师的简历开始。整个网站充满异想天开和信息丰富,而且浏览起来很轻松。Run Wild 通过使用汉堡菜单、大排版、滚动效果和他的设计项目图像,让艺术才华大放异彩。
Run Wild 的 UX 产品 portfolio 的主要收获:
该站使用两种形式的导航。第一个是汉堡菜单,位于左上角。网站页脚中还有一个水平导航菜单,每个菜单项都写在页面底部。
以 Run Wild 为榜样,通过简单明了的导航让访问者可以访问所需的所有信息。如果有人必须寻找简历或联系信息,可能会放弃并离开网站。
4.萨洛尼·乔希
这个简单的 UX 作品集包含一个宽敞的顶部折叠,专门用于简短的介绍性段落和与 Saloni 取得联系的链接。再往下,会发现她展示的项目。
Saloni Joshi 的 UX 产品 portfolio 的主要收获:
Saloni 在她的 UX 产品 portfolio 中包含高质量的书面内容,以易于阅读和熟悉(但专业)的语气呈现所有最重要的信息。
同样,应该使用书面内容来阐明信息(例如姓名和当前的就业状况),并突出显示感兴趣的机会和项目细节。像 Saloni 一样,使用可读的字体和最少量的文本,有策略地将这些基本细节放在 portfolio 中。访问者将希望无需搜索即可快速找到所需的详细信息。此外,建议将简历直接添加到网站的菜单中。
5.达莉亚·格林
Dalya Green 的单页 UX 作品集无疑具有冲击力,让访问者对她的作品和愿景有一个全面的印象。该网站充满了有趣、引人入胜的元素,例如渐变背景,访问者可以自行更改其配色方案。
Dalya Green 的 UX 产品 portfolio 的主要收获
该网站的顶部折叠处包含一个白色按钮,上面写着“单击以查看一些有趣的事实”。单击后,会打开另外五个彩色圆圈,将她的介绍与有趣的事实重叠,包括她的早晨例程和她的 Netflix 氛围。她甚至在页面底部的“信息”部分还有另一个粉红色按钮,上面写着“错过了有趣的事实?” 当访问者点击时,相同的信息会叠加在屏幕上。这创造性地吸引了游客的注意力并吸引他们继续探索。
作为一名 UX 设计师,工作需要创建流畅、轻松的数字交互,因此让作品集成为引人入胜的体验。让访问者不仅可以观察作品集,还可以以不同寻常的方式与之互动时,它会展示创造力和设计技巧——让他们先睹为快,了解他们对作品的期望。此外,它使作品集独一无二且令人难忘。
6.利塔卡尔尼
充满活力的色彩 portfolio 在 Lital Karni 的专业产品 portfolio 中脱颖而出,使顶部褶皱显得既精致又俏皮。主页上的布局很简单,有一个有组织的全屏网格。Lital 为每个项目精心匹配了不同的背景,同时还创造了具有凝聚力的主页美感。
她还创建了一个自定义徽标设计,该徽标固定在屏幕上并作为指向她主页的便捷链接。由于其微妙的光芒,字体标志在任何背景颜色下都清晰可见。
Lital Karni 的 UX 产品 portfolio 的主要收获:
Lital 结合使用了多种技术来显示联系方式并允许访问者与她联系。例如,当浏览作品集时,“让我们谈谈”按钮固定在屏幕上,吸引网站访问者伸出手。单击它将被带到页面底部的联系表。最重要的是,她在“关于”页面上添加了她的电子邮件、电话号码和社交链接,以确保访问者可以轻松取得联系。
当制作自己的用户体验作品集时,请确保联系方式可见。毕竟,个人网站的目标是吸引人们关注作品并最终获得聘用。通过将所有必要信息包含在易于发现的位置(在专门的联系页面上或通过网站页脚或关于页面),让雇主或客户更容易取得联系,还可以考虑添加电子邮件地址、电话号码和指向社交渠道的链接。
7.正和
UI/UX 设计师 Jung 在他的 UX 作品集(工作、关于和 CV)上创建了三个简单的页面,访问者可以在右上角的菜单中轻松浏览这些页面。访问此网站时,浏览者最初会被带到 Jung 的作品页面,该页面也是该网站的主页。
Jung Hoe 的 UX 产品 portfolio 的主要收获
Jung 亮黄色的作品集不仅能吸引注意力,还能让一窥乐观的个性。此外,从屏幕顶部落下的黄色球体动画背景介绍了 Jung,并以 13 种不同的语言旋转问候语。英语问候包括“你好!” 和“你好伙伴!” 并立即让访问者与这位设计师建立情感联系。
该网站举例说明了用户体验 portfolio 如何扩展设计品牌。每一页的外观、颜色和语气都保持一致,甚至延伸到他的简历。Jung 统一的品牌标识给人留下了深刻的印象,有助于访客了解对他和他的作品的期望。
8.苏菲西部荒野
Sophie Westfall 工作的主要原则与处理心理健康和支持非营利机构有关。遵循这一原则,她结合了平静的色调和舒缓的意象,让参观者在浏览她的作品时“感到平静和安全”。一张她家人的黑白旧照片旁边是一段简短的介绍,一只黑白相间的小蝴蝶在左下角飞舞。
Sophie Westfall 的用户体验 portfolio 的主要收获
干净、对称的线条勾勒出米色背景上 Sophie 的项目。她的数字项目出现在台式机、平板电脑或手机屏幕上,传达了她根据任何设备定制作品的能力。索菲选择展示的三个数字展示柜还包括强调最终产品设计的道具。尺寸合适的图片不会让网站访问者不知所措,但仍能展示她作品的细节以及她明显的才华。
以您希望观众看到的方式展示作品。Sophie 的 UX 作品集展示了如何在目标平台上精美地展示作品。如果一个项目同时具有移动和桌面设计,请同时展示这两种资产,以便潜在客户可以看到全部才能。
9.迈克尔拉·特维尔斯基
产品设计师 Michaella (Miki) Twersky 的作品集外观经典,但同时传达出她独特的个性。Miki 在她主页上的图片上添加了悬停效果。虽然图像最初以黑白形式出现,但当鼠标悬停在上面时,它们会充满色彩。这有助于访问者专注于他们正在查看的特定项目,从而改善他们的浏览体验。
Michaella Twersky 的 UX 产品 portfolio 的主要收获
虽然给人留下深刻印象,但 Michaella 的作品集只突出了她最好的六个项目。由于 UX 作品集展示了最佳技能,因此无需包括整个职业生涯中所做的一切。在选择要在 portfolio 中显示自己的哪些项目时,请仅包括最喜欢的项目或那些反映将来想做的工作类型的项目。
10.高瑟姆·穆克什
这个 UX portfolio 示例完美地反映了 Gautham Mukesh 时尚现代的设计风格。受深色模式启发的配色方案搭配干净的字体和完美实现的动画触发效果,传达出这位 UX、产品和网页设计师关心创造用户友好的浏览体验。
Gautham Mukesh 的 UX 产品 portfolio 的主要收获
少即是多。作品集应该突出设计个性和你的工作。但不要忘记留白的重要性——即有助于将人们的注意力吸引到战略内容上的空白空间。
Gautham 简洁明了的网站只强调了作品中的重要组成部分。虽然看起来很简单,但 Gautham 的网页设计仍然具有丰富的复杂设计功能,例如自定义图像、视差滚动和方便的 QR 代码以进行联系。
11.泽比·威廉姆斯
Zebi 的 UX 产品 portfolio 以引人注目的英雄形象开始,带领参观者通过无缝的旅程来发现设计师的作品、经验和流程。总的来说,Zebi 的站点支持具有视觉细节的重要书面信息,例如颜色、动画和图像。
Zebi 用户体验产品 portfolio 的主要收获
引人入胜的产品 portfolio 让初次访问者感到愉悦。当用户滚动浏览网站主页时,地图会跟踪用户的位置,鼓励用户继续探索。UX portfolio 的每个部分都有价值——无论是详细的案例研究、推荐、支持性图像还是联系方式。
12.詹妮弗·比嘉悦子
由于未经过滤的图像、衬线字体的使用以及温暖配色方案的复古感,Jennifer 的 UX 作品集具有 90 年代的时尚氛围。虽然 Jennifer 的主页干净且易于阅读,但它证明可以用极简主义元素做出大胆的声明。
Jennifer 的用户体验设计 portfolio 的主要收获:
使用设计原则知识来微调布局。詹妮弗利用她对互补色及其对访客影响的理解,创造了一种无缝的用户体验,既不会让人不知所措,也不会分散注意力。
13.塔尼亚·索拉亚
Tania 网站上结合使用了土色、霓虹色和中性色来营造更具吸引力的体验。Tania 仅展示了最近从事的三个核心项目,以便让访问者集中了解她的工作。Tania 始终使用友好的文字语气和表情符号,看起来平易近人,鼓励游客联系了解更多详情。
Tania 的用户体验设计 portfolio 的主要收获
网站使用最少的视觉和文字内容,但传达了现代风格的清晰愿景。简洁干净的布局搭配网状渐变背景,凸显了个人风格。
有时候,一个好的网站背景就是让你的个性闪耀的全部。在 Tania 的案例中,复杂的渐变证明了两件事:首先,Tania 绝对掌握了网页设计趋势的脉搏。其次,不怕跳出禁区。
14.尹麦迪逊
正是这些细节让网站对访问者更具吸引力。在这里,Madison 实施了取悦眼球的战略设计元素——例如吸引注意力的动画和创造视觉平衡的留白。此外,大排版的使用提高了可读性,使网站轻而易举地滚动和阅读。
Madison 的 UX 产品 portfolio 的主要收获:
访问者访问网站后,主页的顶部折叠就可以看到。由于给用户留下印象只需几秒钟,因此将其视为宝贵的网页设计不动产。
麦迪逊充分利用了这一概念,主页的顶部折页色彩丰富,包括简短的专业简历、CTA 和简洁的导航菜单。最重要的是,麦迪逊的动画标志对整体设计产生了惊人的影响。
15.陈苏菲
很欣赏 Sophie Chen 的用户体验作品集直截了当。永恒的网页设计直接进入工作经验示例的展示,从主页的顶部折叠开始。
每一个 portfolio 示例都包含一个标题、简短摘要和一个指向“案例研究”的按钮。参观者可以选择更多地了解 Sophie 的流程以及每个项目中使用的特定工具。
Sophie Chen 的用户体验设计 portfolio 的主要收获:
Sophie 作品集上使用的简单布局在移动设备上效果很好。在桌面版本上查看的相同信息可以从较小的屏幕轻松访问。内容与用户界面完美契合,特别是汉堡菜单允许更多空间显示每个页面的内容。
在创建自己的用户体验 portfolio 时,确保使用自适应或响应式设计方法来完善移动版本。由于近60% 的在线流量来自移动设备,避免错失在旅途中发现产品 portfolio 的客户。
用户体验 portfolio 的 10 个最佳实践
从其他 UX 设计师那里汲取灵感后,收集要点并打造自己的在线形象。以下是基本的设计作品集技巧,可帮助从上述用户体验行业示例中学习如何制作作品集:
- 清楚你是谁,你做什么。
- 易于联系。
- 用高质量的图像展示作品集。
- 使用简洁的副本描述工作。
- 展示过程,而不仅仅是最终产品。
- 使用网站来建立品牌。
- 添加简历的更新副本。
- 提及每个项目的基本细节。
- 只包括最好的作品。
- 确保网站在移动设备上看起来不错
如何在 Wix 上制作 UX 作品集网站
准备好开始自己的 portfolio 了吗?按照这些步骤制作 Wix 网站。可以从 portfolio 模板开始,以加快流程或磨练设计技能并从头开始制作。奠定基础后,牢记最佳实践来定制用户体验 portfolio。
- 选择 portfolio 网站模板
- 使用网站设计功能个性化网站
- 进入 Wix 编辑器,将元素拖放到适当位置
- 上传媒体
- 添加关于页面
- 添加联系表格
- 发布和推广网站