UI设计案例分析:Colony 的登陆页设计是如何目标受众需求的

对很多品牌和网站而言,登陆页在数位营销上有着至关重要的作用,尤其是在提高转换率方面。不过,设计出符合目标受众口味的登陆页,往往需要花费大量精力,这实在是消耗巨大、效率极低。本文将为各位品牌网站带来了一个登陆页实战案例分享,有兴趣的朋友可往下看!

UI设计案例分析:Colony 的登陆页设计是如何目标受众需求的

UI设计案例分析

UI设计案例分析:分享一个登陆页实战案例

【案例背景】

英国公司 Collectively Intelligent Limited旗下一款名为Colony 的线上数字协作平台需进行单独设计登陆页。

该平台的创建,旨在帮助全球不同国家和地区的用户可透过它来共同创建公司。在社区中,不同用户可以围绕一个目标进行合作,协同创造,共同管控资金,分享项目收入。

登陆页设计要求:

1. 登陆页设计要相对简单且平易近人,同时能传达出产品的价值主张;

2. 登陆页的主要功能是帮助用户了解它的运作以及从中获得的好处。

UI设计案例分析:Colony 的登陆页设计是如何目标受众需求的

UI设计案例分析

【登陆页设计的核心特点】

有些会认为,登陆页尽可能包含产品/服务细节才能吸引用户。在实际操作中,登陆页的设计不应包含过量信息,而是直接让用户注意到产品的核心价值,凸显对用户有利的信息。

因此,进行登陆页设计时,通常会采用相对简约明晰的UI设计,透过富有凝聚力的UI元素(如CTA按钮和表单)来呈现。

UI设计案例分析:Colony 的登陆页设计是如何目标受众需求的

UI设计案例分析

【着陆页设计内容】

接下来,围绕着登陆页设计的核心特点进行设计,设计师透过有层次地规划整个UI布局和各部分的优先级,让用户逐步获取信息。

我们一起来看看设计师到底做了哪些UI设计工作:

UI设计案例分析:Colony 的登陆页设计是如何目标受众需求的

UI设计案例分析

◆ 自定义插画

自定义插画是登陆页中重要的UI组件,有助於用户更容易理解产品的功能和概念。因此,在UI设计中使用插画是相同普遍且有效的选择。

为了设计出更加有效的首屏插画,设计师尝试将地球上不同区域的用户相互连接的概念进行设计,同时确保整个登陆页UI设计与产品主题保持一致,营造出友好、平易近人的氛围,让用户对整个公司形象产生足够的好感。

考虑到产品的商业定位和客户的方向选择,产品UI设计倾向於浅色背景和流畅的轮廓,并绘制了一系列的变体。而配色方面,则采用了集中明亮但并不富有侵略性的色彩,如粉红、黄色、绿松石色以及紫色。

UI设计案例分析:Colony 的登陆页设计是如何目标受众需求的

UI设计案例分析

◆ 配色方案

设计师还为不同功能设计自定义插画。为了简明地展示产品功能而存在,同时方便用户可以快速理解产品的功能和本质,这些插画的配色方案与首屏插画保持一致。此外,插画还会搭配一些微文案,帮助用户了解这功能特点。

如你所见,所有插画都使用大量留白和微妙元素凸显产品的复杂性。插画所选用的配色方案也极具亲和力,使得整个UI设计显得非常友好、富有吸引力。

为了让整个界面看起来足够一致,设计师还制作了产品故事插画,用於阐述用户使用该产品的好处,并吸引潜在客户关注,给用户留下好印象。

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/41952.html

如有侵犯您的合法权益请发邮件951076433@qq.com联系删除

(2)
Inspirr的头像Inspirr订阅用户
上一篇 2022年6月23日 16:31
下一篇 2022年6月23日 16:31

相关推荐

  • 2022 设计趋势!Web3 圈子正在流行的新设计风格-Boxmoji。

    无独有偶,设计师 Diego Salvatierra 还提出一种新的「Boxmoji」的设计趋势,而他所总结出的这种设计趋势,和 Michal Malewicz 所提出的「新粗野主义」风格有不少共通的地方。「boxmoji」有啥特征?所谓「Boxmoji」…

    2023年3月1日 SEO操作
    07
  • 浅谈网页设计前应如何了解项目背景

    要进行网页设计之前,都需要进行项目背景的了解。由来、原因、展望等等。这些都要与客户和团队成员之间的沟通,这样才能够在後续的设计工作中避免很多不必要再次确认或者疑惑的情况出现。 1、 为什麽要做这样一个网…

    2022年6月14日
    0187
  • 正解网站页面设计应赋予可观性、可读性、美观性三大原则。

    为了让用户更容易获取信息,网页布局设计需要使图片和文本相互配合,让视觉图片营造一种氛围,优先将一般信息和感觉传递给用户,而文本则提供详细准确的内容,以确保信息准确无误。可用。文本也需要尽可能容易理解…

    2023年2月17日
    011
  • 按钮如何在细节上让用户不犯错

    1、 正向的首选操作 也就是当需要用户进行的首选操作是正向的时候,相关的表单和按钮会拥有比较突出的视觉重量。而次要的选项按钮视觉重量会更加轻。 2、 反向的首选操作 如果需要用户进行的首选操作是反向的,如替…

    2022年6月25日
    0115
  • 严重影响网站搜索引擎优化的五项网页设计弊端。

    一、如果你没有移动网站,或者你的移动网站只是做了一个简单的代码转换和浏览器调整,那么你的移动搜索结果将非常糟糕。这在百度尤为突出。据说百度有一个在线工具可以测试移动网站的分数。如果你的网站是H5移动网…

    2023年2月20日
    02
  • 轮播图你真的需要用到?

    因为,我们都知道轮播图的点击率通常都低,而且转化的效果也不好。但往往占用了页面最抢眼的大面积位置,所以要真的切实地考虑是否有必要使用轮播图。 首先,设计不当的的话,轮播图很容易被用户是广告图片而已,会…

    2022年6月25日
    0142
  • 超全总结!5个章节帮你完整掌握卡片式设计。

    本文从卡片式设计的定义、设计价值、常见的设计样式、适用场景介绍、设计原则及小技巧五个方面,帮你掌握卡片式设计。前言近几年,卡片式设计可以说是移动端产品中极为常见的设计形式了,甚至有很多互联网大厂将卡…

    2023年3月2日 SEO操作
    02
  • 如何利用动效设计提升网站的用户体验

    随着交互设计的重要性逐渐提升,动效也越来越倍受设计师所重视。动效设计不但是取悦用户的工具,更视为改善用户体验的重要手段。那麽,如何利用动效设计提升网站的用户体验? 一、弹性动效   一般来说,弹性动…

    2022年6月25日 建站资讯
    0119

联系我们

QQ:951076433

在线咨询:点击这里给我发消息邮件:951076433@qq.com工作时间:周一至周五,9:30-18:30,节假日休息