Ui图文混排之瓷片区设计

前言：

图文混排是一个很笼统的概念，应用范围也很广，总的来说就是界面设计中的图片加文字的综合展示区域，在界面中也可以叫做列表流设计或者瓷片区设计；

这个词语是当下卡片化设计的延伸，卡片设计的优点从视觉上说：区别于纯扁平，有集中展示信息的好处，逼真的划分界面区域，同时阴影的运用增加了画面的立体感；交互上来说：优点是卡片可以提供多维度的展现交互，不管是滑动、切换、旋转等都更容易让用户产生交互动作心生触动，增强用户的体验感；

那么UI设计中的图文混排是如何运用的呢？

首先，拿到一个app设计需求后我们该如何去做？

1、产品功能点的确认：

1.0版本的话首先分析脑图，确定界面之间的交互逻辑以及跟我们app的特色功能点在哪里，如何凸显特色功能点；

2、找准产品的类型定位：

简单的说就是，该类商品是电商类型的，例如：淘宝、京东、1号店等，还是工具类型的，例如：小黄车、滴滴打车、美图秀秀等；还是内容类型的，例如：keep、十点读书、网易云音乐等；

3、竞品分析

首先分析竞品的功能点，主打的特色点是什么？这个特色点针对的用户人群是什么样的？有什么突出特征？比如有什么兴趣爱好、一般都是哪个时间段用这款app、用户手机的群体是安卓还是苹果（以此分析用户的常用的交互手势和手机本身框架结构的问题，比如ipx以上都是没有home键和按键区域的，而安卓常用的是有按键和返区域的设计的时候就要注意啦！）以此得出产品界面设计选取的品牌色以及其他区域的辅助色、强调色运用等；

4、跟需产品沟通下听下ta意见

我们作为设计师在视觉上可能更专业点，同时作图做多了会容易麻痹，有时候不妨换个角度去思考下产品的意见，因为用户下载量，重要界面的用户转化和留存数据在ta们手中，他们可能比我们更清楚的知道用户的喜好和操作习惯，同时一方面来说他也是我们设计app的第一位用户不是吗？

5、确定交稿时间

不管多风格产出也好，还是后期增加功能也罢，一点也不问时间是不是会显得很不专业呢！毕竟好的设计是需要时间的，如果时间充裕可以在设计上多多的优化，在竞品分析上多跟产品沟通是否需要改进功能，但是如果时间紧那就要选择最能出效果同时又把基本功能展示的那版啊！

Balabala，终于看完了！

本篇重点，不分门类只讲图文混排de运用！！