在电子商务设计工作中，细节页面的设计是我们不得不面对的一个大问题。不同于普通的专题页面，细节页面的设计更多的是对文案和卖点的视觉提炼和视觉表达的过程；如何通过视觉流畅向用户表达一款产品的卖点和特色，降低用户阅读的时间成本，增强视觉给用户带来的整体感受；在详细的页面设计中，上面的折叠，也就是页眉图，对整体也很重要。一个优秀的标题图设计可以吸引用户继续阅读，提高用户的停留时间，间接促进订单的购买；那么既然这么重要，那么我们在设计的时候应该注意什么呢？有哪些设计技巧可以提高我们详细的页眉设计的视觉表现？这一期我会通过分析总结和大家讨论讨论 也正是因为头像设计的重要性，很多设计师才会把大部分精力花在这里，一味的强调视觉应该有多么出众和与众不同，甚至用特别复杂的合成手法和各种特效来突出头像的重要性。其实这样有时候适得其反，那要注意什么:第一，视觉流畅，也就是说褶皱上面要让别人看着舒服，文案和视觉传达的信息可以一目了然，不会给人。 第二:头像复杂不代表出众。这里可以提一下“少即是多”的理论。太多太复杂的效果有时会影响视觉传达；要与产品充分融合，让产品出现在合理的场景中 那么，详细页面的页眉设计有哪些常用的表达方式呢？这里举个例子:在细节页面的页眉设计中，产品的局部放大是一种常见的视觉表现形式，因为它会给用户呈现出简单大气的视觉感受和强烈的视觉冲击，同时也会让你的设计整体看起来饱满、内容丰富、不单调。很多情况下，页眉设计只是背景、文案、放大或部分放大产品的简单组合，就能做出优秀的页眉。比如所有的案例都是优秀的细节页页眉设计。总的来说，这种以产品为核心的放大产品或海报设计有以下优点:一是整体画面简洁大气，视觉流畅性和可读性非常强，给人以舒适的视觉体验，有品牌感和超前感 第二:绝对的产品核心，直奔主题，而且因为图片中产品的比例增加，不会给人内容匮乏或者空的感觉。整体视觉重点明显，没有太多辅助元素分散用户注意力。 第三，背景设计很有特色，看起来是简单的彩色背景。其实特点是无法言表的。下面我们来做一些修改。相比之下，背景在原海报的基础上由渐变色变为纯色，整个海报的视觉间隙一目了然。那么，造成这种差距的原因是什么呢？首先，这些海报中背景的渐变不是简单的颜色，而是反映其光源方向的视觉表达。光从哪里来，哪里就会亮，远离光源的方向就会暗。这是光影最基本的知识；第二:正是因为有了这种光影的感觉，才会给海报增加很多色彩、场景、光感等视觉上的变化，会给人一种虽然视觉元素不多，但整体还是不显空 很多人会问，这种光感应该如何体现？其原理是:“确定光源的方向——光源附近的视觉元素是亮的——远离光源的视觉元素是暗的”，明与暗的关系能很好的体现场景感 我们不妨找一些优秀的细节页面进行分析。这种体现光感的表现手法非常实用。所谓场景表现法，顾名思义就是把产品放在一定的视觉场景中。这样做的目的是为了增强细节页折叠上方的视觉感，通过场景表达来形象地表达产品的目的、功能和卖点。这种形式既体现了视觉，又兼顾了产品。为用户形成的视觉体验更加生动、立体、鲜明。下面的例子说明，场景表达的形式侧重于场景与产品之间的视觉整合和关联。这里的场景可以是产品的实拍。也可以是自己合成的场景图；如果是找一个场景来融合或者简单的合成自己的场景，这对于设计师来说是一个很高的基本功，但本质在于光影的体现，其次是头脑风暴。比如在厨房放牙刷大吵大闹是不合理的。做这个场景合成的时候，首先要问自己几个问题。以空气体净化器为例:一、请问空气体净化器用在哪里？答:常用于客厅、办公室、卧室。二、客厅场景应该是怎样的？窗帘、沙发、绿色植物、地板、桌子等。第三:光从哪里来？哪些物品离光源比较近？文章的哪个区域靠近光源？影子在哪里？产品和场景的结合很容易被其他视觉元素抢走，所以我们通常可以:1。模糊次要视觉元素，用类似景深的视觉效果表现主体；2.放大主体，其他视觉元素以正常比例呈现，也能很好的突出主体；3.削弱周围的视觉元素，比如把产品放在夜景里等等 这种场景代表了产品的形式。最重要的是最终的场景感和产品整合是否合理。同样的场景也不算太复杂。无论什么形式，视觉流畅度都是必须考虑的 有些场景也可以在花瓣、站酷或者其他素材网站上找到，只要与产品的融合程度稍加修改即可！立体块可以理解为立体形态，即通过立体块的各种形态的摆放与产品相结合，也是详细表头设计的表现形式之一。但是这样的场景不要太复杂，要以产品为主，突出产品，不一定要靠三维软件。可以通过寻找参考，结合基本的透视理论来完成。比如用简单的三维块搭建场景，限制很小，适合很多产品。这种强调不仅仅是上面说的光感，更是材质、高光、立体感的体现。之前的文章都提到过素材，重点是亮点。高光是指立体块交界处的高光。这样的高光可以体现出立体块的细节和立体感。比如对于立体感的体现，只要透视合理，还是可以转换成光感的。记住以上几点，多练习。 最后说一下排版。详情页的排版不容易太复杂。排版太复杂只会增加阅读的时间成本。一定要注意可读性，不要追求特色而忽视设计的本质问题 这里以一款“牙刷消毒器”产品为例，谈谈我的具体思路和制作方法。首先我得问自己一个问题:牙刷消毒器常用在哪个场景？答:浴室、牙刷摆放的地方等场景还有哪些元素？答:洗脸池、镜子、墙壁、窗帘、植物等。然后根据这两个问题，把材料综合起来，场景简单搭建如下:接下来，问:光从哪里来？影子去哪里？那边亮吗？那边黑吗？然后继续丰富场景:牙刷消毒器对应牙刷和牙膏，场景也可以点缀一些绿植:继续找问题，背景墙太单调，可以加一些格子纹理；绿色植物太醒目，可以模糊；光线在背景中的反射并不明显:最后看一下GIF的整个过程:案例做的很匆忙，目的是向大家解释一张海报从无到有到执行的过程，也是今天提到的理论的一些实践 这里只是给大家提供一些思路供参考。优秀的细节标题设计并不局限于这些形式，而是着重把握它们的要点和实用技巧，如:光感的体现，能做好光感，在视觉表达上已经很实用；只是看似简单的“光感”两个字，要求我们要努力，要不断的练习，才能真正的做好，学习，多看，多学，多练，不要不如别人 升职加薪的目标指日可待！原文:老张来源:阿特·史密斯·巴尼