【吴刚大讲堂】个人网站设计零基础入门,是一套专为设计初学者、自由职业者及希望系统化提升个人品牌影响力的从业者量身打造的体系化实战课程。许多设计师往往忽视个人官网的价值,误以为建站只需套现成模板,却不知专业且个性鲜明的官网,才是展现审美能力、服务规格与技术功底的核心名片。本课程彻底摒弃枯燥的代码教学,回归设计本质,从需求洞察到视觉落地,完整贯穿一次定制化个人网站的设计全流程。

学习本课程的门槛极低,无需具备任何编程基础,适合从零起步的设计爱好者。课程遵循由浅入深、层层递进的学习顺序:前半段侧重设计思维与视觉规范的建立,后半段聚焦PRD文档拆解与具体页面模块的技术实现。开篇先从个人站与定制站的需求差异入手,讲解建站原则及各版块划分方法,帮助学员建立全局认知框架。随后深入视觉细节——尺寸规范、调性统一性、字号选择与各级文字配比、中英文字体(如等线体与衬线体)的场景辨析、文字配色标准、图形元素设定等,逐一拆解决定网站质感的关键参数。这部分内容构成了个人站设计的底层基石,建议学员务必打牢基础,不可跳过。

进入实操阶段后,课程以真实的设计师个人站PRD文档为案例,演示如何将抽象的业务需求转化为可视化的产品图表,并逻辑清晰地安排各页面内容及其画面呈现形态。接着从版宽与版心参数设定、各屏高度规划、首屏导航布局,到LOGO制作、导航按钮规范化实现、点选状态效果,再到首屏Banner的需求分析、构图关系及详细制作步骤,最后延伸至轮播区实现、跨页面制作方法及各头部区域设计标准的统一性把控。整个流程环环相扣,每一步都有清晰的操作要点与落地规范,学员可按视频顺序逐课跟练,形成完整的设计工作流。

完成全部课程后,你将能够独立产出一份结构严谨的网站设计需求文档,并交付一套调性统一、交互规范、画面表现力强的个人官网界面,真正掌握从规划到落地的闭环能力。建议学习时结合课程配套资料包,对照PRD案例进行同步临摹与练习,尤其要重点关注资料中关于各屏头部区域设计标准统一性的分析内容,深化对页面衔接关系的理解,将理论规范内化为实际设计判断力。

课程目录

课程目录50 集
  • 1 01-个人网站和定制化网站设计的需求点及建站原则 (04:09).mp4
  • 2 02-个人站各版块划分的原则和方法 (08:27).mp4
  • 3 03-定制化网站设计的尺寸规范及调性统一性问题 (08:13).mp4
  • 4 04-网站的字号选择和不同级别文字的配比规范 (05:12).mp4
  • 5 05-中英文字体的选择及等线体和衬线体的使用场景区别 (04:35).mp4
  • 6 06-网站应用文字的的配色标准和规范 (05:07).mp4
  • 7 07-个人站的网页元素图形设定标准 (01:38).mp4
  • 8 08-设计师个人站的网站设计诉求PRD文档分析 (02:43).mp4
  • 9 09-网站设计中业务展示模块需求分析及产品需求图表化落地 (05:22).mp4
  • 10 10-网站建设页面内容安排的逻辑性问题及画面化实现形态 (03:08).mp4
  • 11 11-作品展示内容的创建及网站画面化表现方式 (02:07).mp4
  • 12 12-个人网站设计任务书解读及各屏之间的衔接关系 (01:35).mp4
  • 13 13-个人站建站的版宽和版心宽度的取样和参数化设定 (05:36).mp4
  • 14 14-网站各屏高度设定及首屏导航位置设定和布局划分 (03:04).mp4
  • 15 15-个性化网站LOGO制作方法 (06:32).mp4
  • 16 16-导航按钮文案区域的规范化实现 (08:50).mp4
  • 17 17-首屏导航区域导航按钮的点选状态效果实现 (03:03).mp4
  • 18 18-首屏Banner的需求分析及设计点分析 (03:43).mp4
  • 19 19-Banner区与轮播条区的位置布局及主体素材构图关系 (04:18).mp4
  • 20 20-个人站首屏Banner制作步骤及技术实现方法 (08:21).mp4
  • 21 21-轮播区制作方法及首屏的跨页面制作 (05:03).mp4
  • 22 22-各屏头部区域设计标准统一性分析及技术操作要点 (02:11).mp4
  • 23 23-第二屏主文案的版式布局及细节规范化落地 (06:12).mp4
  • 24 24-头部区域图案纹理的还原方法及制作技巧 (08:24).mp4
  • 25 25-第二屏头部文字版式的制作方法及批处理方案 (03:51).mp4
  • 26 26-网站版心内容区域模块分割的平均分布方法 (05:28).mp4
  • 27 27-内容版块的模块化实现和同级替换法 (09:33).mp4
  • 28 28-第二屏的整体风格把控及细节局部微调方法 (04:56).mp4
  • 29 29-第三屏的版心定位及头部区域规范化延续 (06:21).mp4
  • 30 30-黑屏头部区域分案的反白效果实现及文案替换 (03:13).mp4
  • 31 31-作品集分类区域制作方法 (04:38).mp4
  • 32 32-作品集版块展示区域分区布局 (03:07).mp4
  • 33 33-作品集显示窗口版块的图文排版 (08:14).mp4
  • 34 34-作品集三大展示板块表现的技术实现方法 (05:21).mp4
  • 35 35-第四屏头部的延续性制作及个性化调整 (04:48).mp4
  • 36 36-文案排版与文案字号配色同头部文案内容统一性实现 (04:05).mp4
  • 37 37-多边形背景素材文件生成器插件的使用方法及应用 (09:24).mp4
  • 38 38-第五屏头部的延续性更替 (04:03).mp4
  • 39 39-多边形生成工具制作背景特效 (04:03).mp4
  • 40 40-合作伙伴版面LOGO的排列布局版式定稿 (04:38).mp4
  • 41 41-合作伙伴LOGO的排列组合和对齐分布 (04:44).mp4
  • 42 42-通过添加调整成控制图层蒙版制作局部点击变彩色效果 (01:47).mp4
  • 43 43-第六屏底部背景效果制作及细节修饰方法 (04:12).mp4
  • 44 44-第六屏头部区域批量反白效果实现 (02:33).mp4
  • 45 45-联系方式图标组反白搞制作及布尔运算的绘制 (07:37).mp4
  • 46 46-表单的风格统一性制作及验证码效果制作方法 (07:51).mp4
  • 47 47-地图的局部变亮效果制作和指示标志 (05:22).mp4
  • 48 48-版权区域的制作及网站整版裁剪和整体效果核对 (03:46).mp4
  • 49 49-将网站图片文件置入到浏览器中查看效果的方法 (06:26).mp4
  • 50 50-个人站设计及制作方法和设计思路总结 (08:04).mp4