“信息架构是将意图转化为可感知形式的过程，必须先看清全局，再动手搭建局部。”
——《信息架构：超越Web设计》
首页不是设计“开场动画”，而是信息的第一道分发口。
它长得漂亮没用，走错一步，用户直接流失。
做App首页前，你得画这三种图
很多设计师一上来就开始堆模块、调风格，但其实：
信息没理顺，首页做再多轮都白改。
先画好这3张图，再也不怕乱、改、卡思路
01. 内容清单（Content Inventory）
目的：你得知道“我手上到底有什么”
把首页可能出现的所有功能/内容列出来，比如：登录入口、推荐模块、搜索框、活动banner、常用工具区……
先不设计，先看清“原材料”。
书中提醒：“在架构信息前，必须先审视现有资源，否则只能是瞎设计。”
02. 信息地图（Information Map）
目的：搞清楚“信息之间的逻辑关系”
将功能/内容按主题、优先级或使用场景进行分类+排序，画成一张“信息关系图”
比如：
- 搜索模块 > 连接内容页
- 快捷入口 > 引导核心功能
- banner > 跳转营销页
原话指出：“地图能帮助设计者理解用户心智模型与内容分发方式之间的差距。”
03. 信息路径草图（Wayfinding Sketch）
目的：确定“用户在首页如何移动”
模拟用户从首页出发可能的浏览路径，比如：
- 首次访问：banner → 注册 → 功能页
- 熟练用户：搜索框 → 内容页
- 想回看某功能：导航栏 → 常用工具区
这不是UI草图，是导航行为的动线草图。
书中强调：“路径是用户构建意义的方式，他们不是在看首页，而是在找路。”
小贴士（亲测好用）：
- 做图可以手绘，不求美观，只求理清思路
- 内容清单和信息地图可用Notion或脑图工具协作完成
- 别等视觉完稿才调整，前期图画得越清晰，后期越少返工
温柔收尾
首页像一座信息大厅，设计师要当好“动线引导员”而不是“美陈布景师”。
做出真正有用的首页，得从架构图开始，一步步理清：我们有什么、怎么放、用户怎么走。
你在设计首页时，最容易卡在哪一步？欢迎评论区畅聊~~
兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。我们建立了一个微信群，每天分享国内外优秀的设计，有兴趣请加入一起学习成长，咨询及进群请加蓝小助微信ben_lanlan
