设计作品展示系统
分类筛选、大图浏览、杂志式详情，让每一张设计图都得到应有的观看节奏——作品不是被划过去的，是被认真看完的
作品是设计公司唯一的硬通货
客户找设计公司，嘴上说看团队、看方法论，其实眼睛全在作品上。一个作品页做得好不好，直接决定客户愿不愿意继续聊。但很多设计公司的作品页，把最好的设计图塞进了最糟糕的展示方式：小图缩略图、挤成三列、点进去还要加载半天。
设计作品展示系统，专门解决"怎么让作品被认真看"这件事。我们设计了从列表到详情的完整观看路径：列表页让访客快速扫到感兴趣的那一组，点进去后用全宽大图+讲解文字的杂志式排版慢慢看，看完还能继续逛相关作品。
- 作品按类别/行业/年份多维筛选
- 列表页大图节奏，不挤缩略图
- 详情页杂志式长卷，大图配讲解
- 图片懒加载与 CDN，大图秒开不卡
设计公司的作品页，最伤作品的四种做法
缩略图挤成九宫格
一屏塞 20 张小图，每张不到 200px。设计作品的细节、材质、光影全看不清，访客只能凭标题猜哪个好。
点进去只有一堆图
详情页就是 30 张大图按顺序排，没有任何讲解。客户不知道这是哪个项目、为什么这么设计、用了什么材料。
图片加载慢
一张作品图 5MB，手机上转半天。访客没耐心等，直接关掉。设计公司自己的作品页，加载比客户官网还慢。
没有筛选
50 个作品全堆在一个列表里，想找"住宅类"得翻到底。访客是带着特定需求来的，你得让他快速筛出来。
六件事，把作品页做成画廊体验
多维筛选
作品列表顶部放筛选标签：按行业（住宅/商业/办公）、按服务（空间/品牌/展陈）、按年份。点一下即时过滤，不刷新页面。
大图画廊
列表页每张作品卡至少 400px 宽，hover 时轻微放大并显示项目名。小图不叫画廊，叫图标墙。
详情长卷
点进作品后，主图全宽铺开，设计说明左对齐窄栏，过程图按章节嵌入。像翻一本设计年鉴，不是刷信息流。
数据优化
所有图片自动压缩为 WebP，首屏图预加载，其余懒加载。10MB 的原图在网页上变成 200KB，画质肉眼无差。
相关推荐
作品底部推荐 3 个同类别作品。客户看完一个不过瘾，自然继续逛，停留时长拉长。
后台上传
设计师在后台拖拽上传一组图，自动生成详情页排版：首图、章节图、细节图按顺序排列，配文字说明。
作品详情页，具体怎么排
一张主图定调
作品详情页打开的瞬间，一张全宽大图占据首屏，项目名和类型标签压在图上或旁边。不堆图、不放导航、不塞说明。让访客第一眼就沉浸在作品里。
主图选最有代表性的那张——不是最华丽的渲染图，而是最能体现项目气质的现场照或关键视角。主图选错，后面讲再多都白搭。
图文按章节展开
往下滚动，进入正文区。每一章一个小标题：设计理念、平面布局、材料选择、细节处理。每章配 2-4 张图，图前有讲解，图后有注解。
文字不堆在图上，而是放在图的旁边或下方窄栏。图片占视觉宽度，文字占阅读宽度，各司其职。这是杂志排版的基本原则，也是设计公司作品页该有的尊严。
看完作品，给个下一步
作品最后一页，不是图就结束了。放三块内容：项目信息卡（面积、地点、时间、主创）、客户评价（如果有）、"类似项目咨询"按钮。
访客看完一组作品，正是心动时刻。这时候给一个轻量咨询入口，比让他自己翻回首页找联系电话顺畅得多。
三步搭好作品系统
作品整理
从现有项目里选出值得展示的 20-40 组，按行业和服务分类，每组准备首图+讲解文字。
系统搭建
上线列表筛选、详情长卷、相关推荐、后台上传。首屏图片优化到秒开。
持续补充
后台培训客户编辑，以后新项目自己上传。我们提供图片压缩与排版规范，保证新旧作品风格统一。
这些设计公司，最该先把作品页做对
作品多但展示乱
做了上百个项目，但官网作品页挤成一团，好作品被埋没。
视觉/品牌设计公司
作品就是你的简历。作品页做不好，客户直接 pass。
图片加载慢被吐槽
客户反馈"你们官网打开好慢"，其实就是作品图太大。
每次发新项目要找开发
想自己上传作品，但后台难用，只能每次找技术同事。
作品系统，客户最常问的五件事
10MB 的原图，怎么变成 200KB 还清晰
设计公司的作品图动辄 5-10MB（单反原图或高精度渲染图）。直接上传到网页，手机加载要 5 秒，访客早走了。但压缩太狠，图又糊。
迪森泰的做法是：服务端自动把原图转成 WebP 格式，按屏幕宽度输出三档（750px / 1200px / 2000px）。手机用户加载 750px 档，电脑用户加载 1200px 档，只有点开放大才加载 2000px 原图。
配合懒加载——首屏外的图不加载，滚动到了才下。这样一个 30 图的作品页，首屏只加载 2 张图，秒开。访客感受不到等待，但看到的每一张图都是对应分辨率的最佳画质。
为什么我们坚持两个栏目分开
作品展示系统和案例展示看起来像一回事，但服务目的不同。作品页是"画廊"，目的是让访客快速浏览、建立审美印象，每组图只配一句话。案例页是"故事"，目的是证明交付能力，要讲背景、挑战、结果。
如果把所有项目都按案例写，更新成本太高，团队坚持不下来；如果把所有图都按作品堆，又看不出你到底做成了什么。我们建议：大部分项目放进作品库（轻量展示），挑 10-15 个最具代表性的写成深度案例（重叙事）。
两个栏目互相打通：作品卡片上标"含完整案例"，点过去看深度故事；案例页底部推荐"更多同类作品"。访客自由穿梭。
作品系统，迪森泰的三条死规矩
不压画质
压缩到 200KB 是为了加载快，但放大后细节不糊。宁可加载稍慢，不要糊图。
不盗图
作品库里只放客户自己的项目图，不混 stock 图库凑数。
不开放原图下载
防止作品被盗用竞标。原图只通过销售审核后定向发送。
作品页是设计公司的门面，也是最容易被敷衍的
我们见过太多设计公司，花大价钱做视觉，却把作品页做成了一个相册：缩略图挤成九宫格，点进去是一堆图，没有讲解。客户看完只记得"图挺多"，记不住任何一个项目。
迪森泰做作品系统，核心是"节奏感"。一张图占多大、文字放哪里、下一张什么时候出现，都是设计。不是把图堆上去就完事。
图片技术处理也被严重低估。设计公司原图都是 5MB+，直接上传手机打开要 5 秒。我们自动转 WebP、按屏宽出三档、懒加载，让大图秒开。客户不会因为加载慢而错过你的好作品。
作品系统做好后，客户自己能上传新项目。我们会培训一次，附操作手册。以后主创做完项目，5 分钟传一组图，官网永远是新的。
2026 年作品展示的三个方向
杂志式长卷
作品详情页像翻设计年鉴，大图+讲解，不是刷信息流。
大图优先
列表页大图节奏，不再挤九宫格。让作品被认真看。
性能即体验
图再美，加载慢就白搭。WebP+懒加载+CDN 是标配。
作品展示，我们当画廊做
不压画质、不盗图、不开放原图下载。让好作品被认真看。
迪森泰做作品系统，核心是节奏感。大图、中图、细节图交替，图文按呼吸编排。不是把图堆上去就完事。
技术上我们做 WebP 压缩、三档尺寸、懒加载。图再大，2 秒内打开。客户不会因为加载慢错过你的好作品。
作品库只放你自己的项目，不混 stock 图。原图不开放下载，防盗用竞标。销售审核后才定向发送。
作品系统上线后，我们会培训你的编辑团队。以后新项目自己传，不用找我们。我们留好操作手册，30 天内免费答疑。
聊之前，你可以先想这些
合作前请准备：高清作品原图（RAW 或 TIFF 最好）、项目基础信息（客户、面积、时间、获奖）。没有图的项目先不上，宁缺毋滥。
作品系统是设计公司的长期资产。我们建议你把它当成画廊来经营——定期换展、精选佳作、保持呼吸感。30 个精选项目比 100 个凑数项目更能打动客户。