小程序怎么排才不乱？15个布局名词看图懂
文章以Punk咖啡馆点单小程序为例，沿着菜单、规格、购物袋、确认订单四个页面，图文讲解15个布局与视觉设计名词，包括信息架构、用户流程、线框图、首屏、视觉层级、栅格、对齐、留白、响应式布局、安全区域、设计变量、语义色、字阶、行高及Padding/Margin。作者还指出固定底栏遮挡内容的常见坑，并给出从定入口、画线框、定边距对齐到小程序内验证的完整排版流程，帮助读者用具体语言描述布局需求，让AI能精准修改页面。
全部文档 / 标签: 布局
3 篇
开源：350套排版布局 x 知识图鉴
作者在早期整理的「100 种排版」基础上扩充升级，开源了包含 350 种排版与构图方法的视觉参考图鉴，并提供 GitHub 项目地址。项目涵盖三分法、黄金比例等经典构图，以及字体网格、网页 UI、影视画面、中国传统构图、PPT 等场景，分为 8 个一级分类和 33 个二级主题。图鉴支持在线浏览、搜索与高清图下载，并提供 CSV 和 JSON 数据便于程序读取与工具集成，适合设计新手、学习者、AI 创作者、UI 设计师、PPT 制作者及设计团队使用。
2026 构图与提示词指南：100 种设计布局方案及开源工具介绍
作者通过对比传统设计书籍与 GPT2 的教学效率，整理了 100 套关于构图与布局的视觉方案。文章重点介绍了如何利用这些方案优化 AI 绘画提示词，以提升海报设计和排版的实战效果。同时，作者开源了相关的 Chrome 插件 xPoster，支持批量上传 Markdown 到 X 平台，并分享了包含 100 种布局示例的 GitHub 项目下载链接。