丰泽老司机教你高清素材处理技巧

有些时候，你做UI设计面对高质量图片素材，可能会感觉无从下手，不知该怎么来处理。那么就请看下面的思路分析，也许会对你们有所帮助，听郑州丰泽UI设计培训班老司机为你娓娓道来...

处理后效果

这是原图

当然你们还可以找到其他可以get的点。在这之前，这张图片整体我用LR进行了调色。以这三张一个系列的图片为UI设计主题，来设计一个模特介绍的小页面。下面我们来分析一下：

4根红线代表页面3列形式的排版。这样的目的是为了让UI设计页面整体看起来有主形式。（内容宽度不超过红线，实际应用过程中可用辅助线代替，这样利于内容做对齐）。

这里的模特为什么要取上半部分。因为在第一眼浏览banner我们需要给浏览者、留下一个深刻印象，让这个模特给浏览者留下深刻印象，所以把这几张模特图里最有UI设计的色彩层次，最有视觉张力的的放在这里。这样让人还有种意犹未尽的感觉。

通过序号l、3、5我们分析出页面的3个主色调均来自图片素材。

通过序号2我们从衣服里面分析出与之页面相呼应的图案，引用图片素材中的元素做思维拓展，是最稳妥的做法。对于整个UI设计页面的统一性很有帮助。但最终找不到与之一样的图案，我只好找相似的了，结果我找到这样的还算不错的。

特点：

    l、符合模特衣服的图案的气质。

    2、形状基本相似，线条简洁清晰，基本很好的融合页面。

    3、综上所述，作为页面的装饰元素才不显得多余起到简约，然后具体应用就是上面图示序号4、6、了的形式了。

    使用原则：不能喧宾夺主，抢了主体内容的风头。

字体搭配 

   无衬线和衬线体的搭配有个技巧点。大多数情况下无衬线体作为最高层级，衬线体作为次层级（两一般是标题和正文的关系）。这样在美学层次的对比上比较舒服。但这里为什么使用了衬线体，因为模特和花朵的图案很秀气。我们选了个秀气的衬线体，使整体页面更具气质，颇具时尚气质的细无衬线体搭配秀气的衬线体给人一种高雅、富有内在的浏览感受且不违和。

    在UI设计页面视觉流畅度里面，颜色的上下过渡也十分重要。中间的淡黄色很好的过度了黄色和蓝色的鲜明对比，使视觉产生舒适感。再者，从页面UI设计交互角度来说，用颜色区分内容也很明显：

    黄色：banner部分

    淡黄色：模特介绍部分

    蓝色：联系模特部分

所以这就是一个视觉和交互和谐交融的一个搭配！ 我与丰泽，丰泽是我人生的新起点

    通过以上的方法，大家应该有所收获了。最重要的是集思广益，沿用此方法的拓展无限大，“学UI设计，选丰泽教育”！快来一起加油奔跑进步吧！同学们！