什么是图片流：
多个物品按照特定规律 依次排列，这种呈现方式称为流
图片流的关键在于规律排布 和图片展示（展示图片为主，文字标签适当弱化处理）
图片流的使用场景有哪些?
适用于侧重图片展示的应用。 社交，电商类产品较常用； 工具类产品较少用
图片流的布局模式
根据产品特性 选择布局模
（1）水平单图
1、图片主导性强
2、页面焦点集中
* 多用于内容类页面，引导用户沉淀式 阅读（eg：马蜂窝 知乎 爱彼迎）
（2）水平双图
1、展示内容更多
2、方便对比
* 多用于电商及工具类 页面，便于用户做判断 （eg：淘宝 盒马鲜生 花瓣）
图片流的组成要素
（1）搜索栏
1、上下间距统一（eg：间距20px）
2、图片和文字统一（eg：高度：30px 颜色：#999）
知识拓展：热搜词（提示型，推广型，热门型......）
来自热搜榜，反应实时搜索热度，增加点击率，提升商业价值。
（2）筛选栏
1、添加子选项（eg：24px 常规：#999）
2、突出当前项（eg:24px 加粗 #333 筛选条 4px）
3、调整间距（eg：四周20px 选项间60px）
知识拓展：复杂筛选栏
1、下拉子选择项（电商APP中常用复杂筛选栏进行组合查询）
2、排序选择项
3、筛选——侧滑或全页子选项（复杂选项，繁杂）
（3）图片流
3-1 图片质量（1、图片清晰 2、主体明确 3、色彩鲜明——可靠近品牌色系）
3-2 文字层级
主标题——24px 加粗 #333
注释文字——20px 常规 #333
采用字号（最小公倍数4）和字重区分层级
3-3 图标及头像（图片流类的图标和头像视觉上弱化）
图标——20*20px #bebebe 2px线粗
头像——36*36px 圆形（头像图形轮廓更明确，背景更干净些，注意头像区域和成像的呼吸感）
3-4 间距把控（最小公倍数法，等分五分原则）——UI设计规范总结色块法
1级间距——20px
2级间距——10px
知识拓展：图片流高度固定与不固定
* 高度固定——排版整齐，方便对比（工具类，社交类产品）
* 高度不固定——展示完整，布局灵活（内容类，电商类产品）
总结：图片流组成——导航栏功能；图片；标签；用户头像；卡片化小功能；微投影
