杭州会计培训
达内杭州会计培训中心

13732203138

热门课程

你的首屏设计,有吸引住用户吗?

  • 时间:2020-06-09 14:12
  • 发布:杭州编程培训
  • 来源:网络

今天就想来分析下,首屏需要达到怎样的设计目标、设计时需要注意哪些关键点来达成这些目标。

首屏的设计目标

这里的首屏是指,打开一个页面,无需进行滑动操作就可以看到的、第一屏的内容。


首屏的设计对一个页面,尤其是是新产品或者活动宣传来说,至关重要。它影响着用户对这个页面乃至整个产品的认知,用户要对产品建立起认知之后,才有可能对产品产生信任与价值认可、产生后续的转化。

通俗点说,滚屏交互虽然简单,但还是有一定操作成本的,首屏内容必须给用户足够的动力,让用户对滚屏后可出现的内容有一定预见和期待,才会滚动查看更多的内容。

首屏设计的目标有三,循序渐进。

第1点,需要让用户能够快速地感知到这个产品/活动是做什么的。比如是在线观看视频的产品,或者是优惠活动页面等等,总之要有一定的认知度,要通过页面结构和细节元素的设计,让用户感知到产品的功能范畴。

第2点,首屏要让用户快速的感知到产品/活动的基本结构、内容范畴。比如这是一个专门看美剧英剧的视频App,或者是购社科类书籍满减的活动等等。


这两点其实都在唤起用户旧脑中已有的认知模式,如果一个新的产品页面可以让用户感觉到,”啊~它跟某某产品是类似的“,”啊~我知道这个icon是代表这个意思“,那么就可以让用户很好的建立起它是做什么的,它能提供什么内容这样的认知。

在此基础上,第3点,首屏还要告诉用户,为什么要选择这个产品。比如上面新电商产品的例子,同样都是电商产品,为什么不选择京东淘宝而选择这个产品呢?这就需要在首屏就传达给用户的。

第3点是最难的一点,其实是要调动用户的新脑,让用户建立起一个新的认知,认识到产品的差异化价值点,从而抛开其他的竞品选择它。

那么我们接着再往下看,在设计时如何完成这3点目标呢?

第1点:我是做什么的

做好这一点,需要在功能架构设计、界面布局以及文案配图等细节上通盘考虑,明确传达产品的功能定位,不让用户困惑。

比如网易云音乐的首屏:


金刚区展示了每日推荐、歌单、排行榜,中部展示了精选歌单,下方展示了个性化推荐的歌曲,很好的诠释了「为你推荐好歌的音乐播放软件」这样的产品功能定位。

再比如马蜂窝旅游的首屏:


上部展示了攻略和订酒店、机票等入口,此外绝大部分页面空间用来展示景点视频或者文章、直播的首页。这些内容很直观的传达了产品的定位——服务用户的出行旅游,包含了吃、住、行、玩等方面。

总结来说,设计时要做到:

1、分类清晰,并列信息、父子级信息之间具备严密的逻辑关系,能够给用户讲一个完整的故事或者传达完整的价值观;

2、有鲜明的视觉风格,迎合目标用户的喜好与诉求,尤其注意品牌元素的合理露出、banner轮播图等视觉冲击力较强区块风格符合品牌认知。

第2点:我有什么内容

这一点的含义是,通过导航、模块标题、默认展示内容、运营区块等等,让用户快速了解产品可以提供的信息内容。

比如小红书:


首屏除了底部的一级导航,顶部的logo、二级导航和搜索框,页面中只放置了4个内容卡片。导航展示了产品的功能范畴是笔记+商城,解答了「我是做什么的」这个问题。

而卡片内容其实另有玄机——我开关了几次App,发现这4个卡片的内容,一般都会有1~2个美食类的、1个健身类的、其它的是关于穿搭、明星、或者美妆护肤的。这其实是产品想传达给用户的、产品中已有的笔记内容范畴。并且通过卡片中的大图或者视频,直观地展示出来。

总结一下,首屏中要选择尽量直观、有冲击力的方式,来展示产品或者活动中涵盖的内容。同时要通过推荐策略,让用户尽量能够看到产品的内容全貌。

同时要注意,设计师要把握自己说不的权利。


比如商务或者业务提出要在首屏重要位置,放置与产品调性不符、或者用户难以理解的内容时,设计师要果断 Say NO。比如原本的旅游服务产品要放做美食的技巧,原本音乐播放器要放贷款……

如果这类内容真的不得不上,也一定要打上「广告」等标签,最好支持关闭此内容或此模块,从而告诉用户——这块其实跟我们产品没有联系!我们是个纯纯粹粹的XX类产品!

第3点:为什么选择我

要做到这一点,对于产品设计来说任重而道远,但总的来说一定要做到,在首屏有能够打动用户的信息点。在极短的时间内能让用户感受到产品的价值。这样才能在众多精品中脱颖而出,让用户选择「我」。

比如盒马:


在头部轮播图、金刚区icon、瓷片区以及其他运营位,均使用高明度的实物图片素材,整个首屏页面营造出一种轻清亮、灵动、鲜活的感觉,容易让用户对盒马售卖产品有新鲜、效率高等印象。可别小瞧了这一点印象分,很有可能就是用户选择盒马并长期使用的原因。

再比如拼多多:


首屏中秒杀、现金、赚大钱、补贴等文案或标签,标红突出展示的价格,几乎是手屏正中间的百亿补贴模块,无一不在说着「我是真的很便宜呀,快来买我吧!」

总的来说,设计侧要高度配合产品运营策略,比如在首屏明显位置的焦点图、瓷片区或者浮窗,展示极具诱惑力的优惠,或者是差异化别处无法获取到的内容、功能、体验,都可以成为用户选择并长期使用的原因。

划重点

本文分析了页面首屏设计的关键目标及设计要点:

第1点,要通过功能架构设计、界面布局以及文案配图等细节上的通盘考虑,让首屏具有鲜明风格与严密逻辑,明确传达产品的功能定位;

第2点,在导航、模块标题、默认展示内容、运营区块等位置,结合直观的表现形式、全面的推荐策略,让用户可以快速了解产品的内容范畴;

第3点,在首屏就要「放大招」,要有能够打动用户的信息点,如优惠、稀缺、高效等,让用户在极短的时间内能让用户感受到产品的价值。

预约申请免费试听课

怕钱不够?就业挣钱后再付学费!    怕学不会?从入学起,达内定制课程!     担心就业?达内多家实践企业供你挑选!

上一篇:为何阿里、腾讯、美团等大厂都选择了卡片设计
下一篇:没有下一篇了

为何阿里、腾讯、美团等大厂都选择了卡片设计

今天周六,我们一起来偷看日记吧!O(∩_∩)O~

设计需要思考点什么呢?

为什么要去达内参加UI培训

选择城市和中心
江西省

贵州省

广西省

海南省