前言：

圖文混排是一個很籠統(tǒng)的概念，應用范圍也很廣，總的來說就是界面設(shè)計中的圖片加文字的綜合展示區(qū)域，在界面中也可以叫做列表流設(shè)計或者瓷片區(qū)設(shè)計；

這個詞語是當下卡片化設(shè)計的延伸，卡片設(shè)計的優(yōu)點從視覺上說：區(qū)別于純扁平，有集中展示信息的好處，逼真的劃分界面區(qū)域，同時陰影的運用增加了畫面的立體感；交互上來說：優(yōu)點是卡片可以提供多維度的展現(xiàn)交互，不管是滑動、切換、旋轉(zhuǎn)等都更容易讓用戶產(chǎn)生交互動作心生觸動，增強用戶的體驗感；

那么UI設(shè)計中的圖文混排是如何運用的呢？

首先，拿到一個app設(shè)計需求后我們該如何去做？

1、產(chǎn)品功能點的確認：

1.0版本的話首先分析腦圖，確定界面之間的交互邏輯以及跟我們app的特色功能點在哪里，如何凸顯特色功能點；

2、找準產(chǎn)品的類型定位：

簡單的說就是，該類商品是電商類型的，例如：淘寶、京東、1號店等，還是工具類型的，例如：小黃車、滴滴打車、美圖秀秀等；還是內(nèi)容類型的，例如：keep、十點讀書、網(wǎng)易云音樂等；

3、競品分析

首先分析競品的功能點，主打的特色點是什么？這個特色點針對的用戶人群是什么樣的？有什么突出特征？比如有什么興趣愛好、一般都是哪個時間段用這款app、用戶手機的群體是安卓還是蘋果（以此分析用戶的常用的交互手勢和手機本身框架結(jié)構(gòu)的問題，比如ipx以上都是沒有home鍵和按鍵區(qū)域的，而安卓常用的是有按鍵和返區(qū)域的設(shè)計的時候就要注意啦?。┮源说贸霎a(chǎn)品界面設(shè)計選取的品牌色以及其他區(qū)域的輔助色、強調(diào)色運用等；

4、跟需產(chǎn)品溝通下聽下ta意見

我們作為設(shè)計師在視覺上可能更專業(yè)點，同時作圖做多了會容易麻痹，有時候不妨換個角度去思考下產(chǎn)品的意見，因為用戶下載量，重要界面的用戶轉(zhuǎn)化和留存數(shù)據(jù)在ta們手中，他們可能比我們更清楚的知道用戶的喜好和操作習慣，同時一方面來說他也是我們設(shè)計app的第一位用戶不是嗎？

5、確定交稿時間

不管多風格產(chǎn)出也好，還是后期增加功能也罷，一點也不問時間是不是會顯得很不專業(yè)呢！畢竟好的設(shè)計是需要時間的，如果時間充?？梢栽谠O(shè)計上多多的優(yōu)化，在競品分析上多跟產(chǎn)品溝通是否需要改進功能，但是如果時間緊那就要選擇最能出效果同時又把基本功能展示的那版?。?/p>

Balabala，終于看完了！

本篇重點，不分門類只講圖文混排de運用！！