ps期末复习2

这是一篇关于ps期末复习2的思维导图，包含主图的视觉体现、移动端商品详情页视觉设计要点、商品详情页的视觉设计要点等。

ps期末复习2

• banner
  • 网页导航图片，体现网站的中心主旨；核心：吸引用户关注，然后被点击；主题性鲜明，突出关键内容并有效抓住用户眼球的一种广告
  • 元素：吸引人的商品名，清晰美观的图片，醒目的折扣或价格、明确的活动主题
  • 作用：展示商品，营造氛围、吸引消费者
  • 原则：1店铺风格突出品牌定位明晰2.品牌、店铺两级优势直观呈现3.图像清晰、设计感强
• 海报的视觉组成（三要素）/构建设计图的三要素p88
  • 背景，商品，文案
• 海报（banner）的画面构图p89（特征以及描述）
  • 左右构图
    • 比较典型，非常稳定、平衡
  • 左中右构图
    • 左右为图，中间为文字，更具有形式感，更灵活
  • 上下构图
    • 稳定、平衡
  • 底面构图
    • 体现商品的品质和店铺的形象，
  • 倾斜构图
    • 画面显得时尚、动感，但要注意画面的平衡，倾斜度不大于30%，文字一般右上倾斜
• 导航作用（功能）
  • 引导用户查找信息，通过主导航、次导航，以及分类便于用户快速找到自己真正所需要的信息
  • 便于访问者理解整个网站的结构
  • 形成地图的作用，让用户了解网站方向的指南
• 导航分类
  • 店招导航
    • 页中分类导航
      • 左侧分类导航
        • 页尾导航（底部导航）
          • 悬浮导航
• 店招设计规范
  • 淘宝后台店招高度120px，导航栏高度30px店招尺寸为950×120px，整个店招1920×150px
• 店招与导航栏
  • 视觉设计风格
    • 店招的风格引导着整体的店铺的分割，而整体店铺的风格大多取决于店铺的商品，一般来说，店铺中的店招、导航栏、商品风格应与店铺的整体风格一致
  • 视觉设计要点p84
    • logo设计：logo是店铺的形象标志，可以加深消费者对该店铺的印象
    • 促销商品：添加促销商品信息，可以让消费者进入店铺后立即看到，引导消费者直接进入促销商品的页面，增加销量
    • 收藏和关注：可以方便消费者快速收藏和关注店铺，进一步提高店铺知名度，树立品牌形象
    • 优惠券：让消费者快速看到店铺的优惠信息，提高促销活动的效率，营造活动氛围，促进商品销售
• 商品详情页的视觉设计要点p106
  • 颜值诱惑
    • 人群定调法
    • 卖点展现法
  • 情感催化
    • 直击内心的卖点图
    • 身临其境的场景图
  • 引起共鸣的品牌故事
  • 细节征服
    • 功能说明图
    • 工艺细节图
    • 服务说明图
• 主图的视觉体现p31，p40-41
  • 是应到消费者进入店铺的图片，主要起到引流的作用。主要通过商品背景、品牌、卖点得以体现。好的主图能提升商品 的点击率，还能直接影响商品成交量
  • 每款商品一般有5个主图位置用于展示商品
  • 展示逻辑
    • 主图卖点展现的逻辑
      • 寻找卖点要有逻辑，要从商品的特征中寻找卖点，挖掘消费者重点关注的问题
    • 主图素材选择的逻辑
      • 选择清晰且能够体现商品整体或部分细节卖点的图片
    • 主图展示顺序的逻辑
      • 展示顺序：整体形象，材质细节，色彩和款式、包装、用法、配件、赠品等
• 商品主图设计-设计形式
  • 展示商品的全貌
  • 场景化的设计
  • 拼接式设计
  • 突出商品卖点
• 移动端首页视觉设计要点p148
  • 注重感官的舒适性
  • 合理控制页面的长度
  • 把握页面整体内容
  • 与pc端的视觉统一
• 移动端商品详情页视觉设计要点p148
  • 一屏一主题
  • 商品更突出
  • 卖点展示更加精炼
  • 细节质感化
• 移动端与pc端的区别p163
• 移动端商品详情页的设计要点p150
  • 第一屏：展示商品应用的场景
  • 第二屏，对商品的场景效果进行展现
  • 第三屏，对商品的细节部分进行展示
  • 第四屏，对商品的尺寸进行展示