恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
【星图计划】-百度地图国际化ICON优化升级
0.0°
2018-07-30 原创文章 经验/观点 举报 18120 146 290 19

【星图计划】是去年下半年起,在百度地图境外地区的底图优化项目,一直在延续进行中,下面给大家分享一些项目中的设计经验,也请大家在出游时体验一下,多多提出宝贵意见。

Image title


引言 | Foreword


星图(star atlas),亦为“星星的地图”,是天文学上观星、认星和指示位置的一种重要工具。星图对于天文学家来说,就好比地图对旅行者一样,天空也有自己的网络系统,它和地球的经纬线作用相似,是用来衡量天体位置的。如果我们把“地图”比拟成“星图”,那么地图上的“POI”就像天上的星星一样,这就是“星图计划”的由来。


项目背景  | Background


百度地图国际化主要针对有出境游需求的国人用户,是从属于百度地图的一款出行工具。国际化地图与国内地图在使用场景和操作方式上有着明显的区别,由于这种显而易见的语言及文化差异,使得国际化地图衍生出了不同于国内地图的需求。


产品分析  |  Product analysis


01. 用户行为分析


· 在出境游的场景下,有更多的用户在使用地图时,不是直接发起检索,而是通过图像去查找自己的目的地。


· 一般用户平均在一年内使用国际地图的频率只有少数几次,甚至有些用户几年才会使用一次,一次使用时长为5-15天左右。


· 出境游用户会更关注POI附近的“吃喝玩乐购”相关数据推荐,即需要通过地图的推荐来帮助决策。

Image title

02. 问题现状

Image title


产品目标 | Target


我们从用户的行为以及底图本身存在的问题着手,把目标放在产品的体验上,重点提升产品的使用效率,因此最终锁定了产品的目标,即强化重点POI,聚焦“吃喝玩乐购”的数据推荐


01. 目标拆解


将产品目标有针对性的进行拆解,提取出目标关键词,即聚焦,直观,吸引力

Image title

根据上述这些信息,我们将数据展现进行了层级的划分,将设计的重心放在地标景点,以及吃喝玩乐购相关分类上,针对两个方向分别进行个性化ICON设计,从而强化用户对于重点数据的感知。

Image title

02. 设计原则

Image title

项目执行   |  Design(以地标ICON为例)


01. 语言提炼

· 基础元素

Image title


在底图较为复杂的大前提下,特殊ICON需要运用更加简练的设计语言来表达出其背后的含义,才能使界面达到平衡。


· 设计语言简化过程


设计语言的提炼是一个在不断做减法的过程,整个过程中经历了从微透视,到去环境,去细节,再到去背景等一系列的优化。

Image title

不断做减法的过程


02.设计进阶


从不断的尝试过程中,我们得到了一个非常明确的设计方向,就是用最简单的设计语言,让语义最大限度的还原现实世界,期望用户能够通过高度还原的语义快速的找到目标。

Image title

场景再现


Image title



03. 制定规范


色彩


主色由品牌色衍生而来,整体色彩的饱和度及明度与品牌色保持一致,既保证在复杂的底图中清晰醒目,又符合用户在旅游场景下愉悦的心理感受。色彩区间的范围较灵活,单独icon参考建筑主体本身的色彩倾向,有助于后期提升其延展性。


Image title


Image title

建议参考比例


圆角


考虑到用户在出行状态下易于产生急躁、焦虑的心理,设计中避免使用锋利的尖角,我们规定这里采用2px的圆角,使其在视觉上给人比较柔和的感受。


尺寸


参考用户点击的操作行为,定义icon的设计尺寸为74px,但在安全区域内,需要针对不同体量的建筑形态进行视错觉的尺寸调整。


Image title


04. 组件库集合


组件库的建立,我们着重从两个维度去思考。一是色彩维度,色彩是用户的首要感知对象,并且能够留下深层记忆;二是特色建筑结构,如顶部,门窗,柱式等,不同建筑会有特定的设计风格,换句话说,解决问题的关键,就是找到首要的记忆点。

Image title



建筑结构元件拆分

Image title

按地域特色划分

Image title

按结构划分


Image title


________________________


最终方案 | Design


Image title


Image title

Image title

Image title


原创文章-仅作学习用途,转载请注明:本文来自DUBEST原创作品,如有其他用途请联系作者,谢谢!


Image title

更新:2018-07-30

收藏

146人已收藏

DUDESIGNER

与你一起探究AI设计

  • 74

    作品

  • 1443

    粉丝

  • 1

    关注

  • AI助力导航产品—AI技术的设计变革,设计师如何去思考?
  • 设计体系建设赋能,让B端产品设计更高效
  • 百度技术中台用户体验设计团队:用户研究如何驱动AI产品体验升
  • 变革时期的设计领导力思考

    猜你喜欢

      2018-07-30 原创文章 经验/观点 举报 18120 146 290 19

      【星图计划】-百度地图国际化ICON优化升级

      0.0°

      你确定要举报【星图计划】-百度地图国际化ICON优化升级

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2018年07月30日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      290
      146
      19

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录