结合产品特点做了一套适合厚予的基础组件,让客户根据自己的需求自由配置所需页面。

项目介绍
厚予科技:致力于国内财富行业一站式资产交易服务saas平台,通过自主研发系统,科技赋能财富管理,提供基于机构/独立理财师与投资人投资撮合服务。

痛点分析
厚予科技给用户提供资产配置app开发、维护等全方位服务,如果面对不同客户提出的不同的需求,都要重新开发一套app页面,成本太高了。况且大多数客户的需求都有很多重叠的地方。
根据金融行业产品的特点,应用市场审核要求较多。平台对功能复用,避免再次开发就显得很重要。

设计目标
给tob用户提供自己配置页面的功能,不是简单的让用户搭建一个页面,还要保证用户在使用时的体验感受、使用流程的顺畅、信息展示的清晰性、行为效率的高效、甚至是否能有效的引导用户完成目标。
所以高效专业、轻量易用、独立个性就成为我们这次项目的设计目标。


骨骼-框架布局
结构简洁、布局清晰易用
每个客户对app使用场景要求不同,不同的场景需求就要求页面框架结构相对简洁,布局清晰易用。
复杂的页面结构,设计师很难串联模块,反而不容易让页面视觉更好的呈现。对于研发而言复杂的结构需要判断的逻辑更多,开发成本更高。
所以应该秉承b端设计追求产品的稳定性、结构逻辑清晰、框架布局灵活的主张,保证产品的安全、灵活、易用。

交互逻辑
因为这期不是实时可见的装修玩法,所以后台呈现的app页面和前端呈现的有真实数据的app页面不同,后台以图片映射的交互方式来提高用户体验。(未来会做后台实时可见,最大程度还原后台和前端真实数据)
标题和内容同时设计在一个卡片上,灵活布局,页面整体统一。后台组件自由增删、上下移动,发布后前端展示编辑结果页面。
为了保证页面的整体美感,其中任意一个组件移动至第一层时,默认与标题栏、状态栏融为同一个卡片。
细节
为了较大程度的提高美观个性,大胆尝试用24px圆角,让用户配置出来的页面更有设计感。

色彩-变量色
使用逻辑清晰、配色高端大气
为了配合换肤功能,要有一套拓展性高、可控性强的方法来维系产品的风格呈现。这里用主色和主渐变色,辅色和辅渐变色参与了换肤功能,哪些功能以及板块用了这四个变量色都要有清晰的思考,避免换肤时配色混乱,功能层级不清楚。
两个主色都有自己的渐变色以及透明度使用方式,保持用色逻辑不复杂的情况下增加了配色丰富度。
通过金融行业内的竞品分析和竞品调研,选了6套色相差异较大的配色方案衔接更多客户的品牌色,供用户切换风格主题。
色彩-产品色
低饱和度、用色面积较小
除了主色、辅色、功能色、中性色,还给每个产品分类配置了专属色,用于快速区分不同产品的组件。
客户运营app时自己上传的宣传物料和内容图片颜色肯定比较丰富,模块如果颜色突出,后期对宣传物料颜色的应用门槛就较高,页面效果不容易把控。
而且太过于丰富的颜色也会让配置的页面混乱,所以组件配色不适合饱和度高、颜色大面积使用。
如果有需要大面积使用颜色的地方,应该尽量选择透明度模式使用。无透明度纯色适合小面积点缀。


基础组件
满足多场景搭建个性页面
梳理和归纳很多复杂的产品体系和需求,设计了一套可组装、可复用的页面配置解决方案。
通过灵活的框架,通用的设计规则,使用者可以像组装乐高一样快速组装产品界面,满足不同场景不同需求,不用重复发版反复审核。






除非注明,否则均为UIED用户体验学习平台-宜信设计团队的原创文章,转载必须以链接形式标明本文链接
本文链接:https://www.uied.cn/10212.html