设计网站有哪些？灵感、素材与学习分类找

找设计网站，先分清这次缺什么：想看版式与视觉风格，去作品社区；要给项目补照片、插画或界面素材，找资源库；遇到交互判断和实现难题，再看专业文章与问答。把“可浏览的作品”与“可使用的素材”分开，才能少收藏一堆图片，多解决一个具体问题。

如果要把参考落到可编辑的页面，先在Pixso 资源社区寻找对应的界面与组件，再用自己的内容调整。下面按灵感、素材和学习三类任务选择合适的入口。

一、找灵感：先比较作品，再提炼设计规则

Pixso 资源社区：从参考进入可编辑页面

Pixso 资源社区包含界面设计、组件、图标和模板等内容，适合按“网页、表单、移动端”等具体对象查找，而不是只搜索“好看的设计”。先看页面层级与组件组织，再查看资源的使用入口和作者说明。

例如做服务介绍页，可以选一个层级接近的页面：把标题换成自己的服务名称，把展示图换成自己的项目，再检查长文字与手机布局。复制资源能减少从空白画布搭建的工作，但素材的授权、字体和图片来源仍要分别确认。

Dribbble：观察视觉方向与作品表达

Dribbble聚合网页、品牌、图标和插画等作品，适合在项目早期比较构图、配色与表现方式。浏览时记下“为什么适合这个项目”，例如卡片密度、标题层级或主色使用，而不只是保存截图。

作品展示图不一定覆盖完整用户流程，也不代表其中素材可直接商用。想借鉴一张界面，应继续问：真实文案变长后怎样排？错误和空状态怎样显示？作品带来方向，具体方案还需要回到自己的任务。

二、找素材：先看文件用途，再看使用许可

Pexels：为页面选择照片和视频

Pexels提供照片和视频素材，适合为品牌介绍、文章和营销页面寻找视觉内容。搜索时同时考虑主题、主体位置与留白；横幅需要放标题，就不要只挑主体占满画面的照片。

Pexels 许可允许多种免费使用，但禁止未经修改直接转售、暗示人物或品牌背书等用途。涉及人物、标识与具体商业用途时，先查看Pexels 许可条件，不要把“免费”理解成不受任何限制。

unDraw：统一风格的插画资源

unDraw主要提供 SVG/PNG 插画，适合空状态、引导页和功能说明等场景，不宜一概称为图标库。先选与段落含义相符的画面，再调整颜色，保持同一页面的视觉一致。

其官方许可允许个人和商业项目中的多种免费使用，但不允许把素材打包再分发、仿建竞争素材服务，也对 AI/机器学习训练用途作了限制。作为页面配图使用与经营素材库是两种不同的行为。

Freebiesbug：按格式筛选模板、字体和图标

Freebiesbug汇集字体、图标、样机、设计文件和 HTML 模板。下载前先确认你需要的是能编辑的设计源文件、网页代码，还是仅用于展示的图片；相似封面下面可能是不同类型的资源。

每个资源还要查看原作者的许可、文件格式和依赖。免费聚合站不等于为所有资源提供统一的商业授权；字体用于网页、App 或品牌项目时尤其要读清授权范围。

Mockplus 资源：按模板所属产品选择

Mockplus官网提供原型、设计与协作相关产品，并有模板资源入口。查找模板时先确认它属于哪一类产品、使用什么文件格式，避免把产品介绍页或预览图当成可直接导入任意软件的源文件。

适合需要观察页面结构、线框和交互组织的读者。要把资源放进已有工作流，先用一个小文件验证可编辑内容与所需软件，不根据品牌名称推断格式兼容性。

三、学方法：带着具体问题阅读与提问

UX Mastery：补足研究与体验设计方法

UX Mastery保留了研究、分析、设计与职业发展等主题文章，适合围绕“怎么选研究方法”“如何组织访谈”等问题阅读。先看文章讨论的场景与方法，再决定能否用于自己的项目。

经典方法和工具版本的时效性不同。研究思路可以参考，但涉及当前软件入口、价格或平台规则时，应再查看对应官方资料；不把旧文章的日期和会员数量当成质量依据。

User Experience Stack Exchange：解决明确的交互问题

User Experience Stack Exchange是用户体验相关的问答社区，内容涉及导航、表单、可用性和信息架构等。适合搜索一个明确问题，而不是寻找一整套可直接照搬的产品方案。

读答案时一起看提问背景、限制条件与讨论；提问时给出用户目标、现有方案和卡住的位置。例如“地址表单要不要分步”比“怎样做出好体验”更容易得到可用建议。

Graphic Design Forum：讨论平面设计与制作问题

Graphic Design Forum包含平面设计、排版、标志、作品反馈等讨论，更适合品牌和平面视觉问题，不需要硬归为 UI 素材站。准备寻求反馈时，说明作品用途、目标受众和希望讨论的问题。

“喜欢哪张图”只能得到偏好；“用于小尺寸标签时哪个版本更容易识别”更有助于形成修改方向。公开展示客户作品前，也要确认自己有分享权限。

SitePoint：把网页视觉方案连接到实现

SitePoint提供 HTML、CSS、JavaScript 等开发学习内容，适合设计师了解响应式布局、网页实现与设计交付中的技术问题。它不是纯图片灵感库，阅读价值在于理解设计如何在浏览器中运行。

遇到旧教程，先核对示例依赖和浏览器支持；学习页面布局可先从 HTML/CSS 的基础能力开始，不必为了跟着单篇文章安装复杂技术栈。部分内容或学习产品有单独访问条件。

怎样组合使用，避免只收藏不落地

做一个新页面时，先选 2—3 个参考链接，分别记录内容顺序、视觉层级和组件规则；只下载确实需要的素材，并记录来源与授权。随后把这些规则应用到自己的真实文字、图片和数据中，对比哪些仍然成立。

如果当前任务是专门寻找界面和组件参考，可继续看UI 设计网站与界面资源；如果要把视觉方案做成真正能访问的网页，则进入网页制作的代码与上线步骤。不同入口服务不同阶段，不需要同时打开所有网站。

把参考变成自己的页面

在 Pixso 中建立一页练习稿，把参考拆成标题、内容区、卡片和操作入口。用自己的内容重新组织，而不是描摹一张展示图；完成后检查长标题、空内容和手机宽度，再邀请同伴指出信息不清楚的地方。这样，灵感、素材和方法才会一起成为可持续修改的设计方案。