【UI设计】云外新能源-真实案例分享

用户头像
深圳/UI设计师/4年前/700浏览
【UI设计】云外新能源-真实案例分享

【云外新能源】这是一个实时记录和监测各大站点、网点用电量的手机端网站。

2020.3

甲方找到我们赛尔极这个小公司,

希望做一款能够与【电能卫士】对标的手机端网页。


这是⼀款实时监测电量情况的物联⽹H5平台,

通过各个监测点的⿊匣⼦将数据返回到后台数据库,

然后微信前台链接读取并展示实时数据。


当时因为各种原因,刚好空缺产品一职,

然后,我就“光荣地”充当了产品经理,

与甲方进行了详细的讨论和规划。


项目链接:https://deve.gogouhui.com:9443/electric-weixin/index.html#/(建议手机查看)

蓝湖设计稿链接:https://lanhuapp.com/url/MNE5h 密码: X6tr








一、项目信息


项目上线时间:2021年3月X日

设计交付时间:2021年2月22日

需求对接人:朱xx(我们老板)、潘xx(甲方)

项目背景:智能负载监控线上应用平台首版







二、需求相关


用户可以通过微信公众号登陆,登陆后进入H5移动端页面。

同步启用用户账户,不同用户仅可看的自己的监测点。


我把甲方给我的需求文档看完后,

(需求文档链接:https://qj726l8gad.feishu.cn/docs/doccnZW5ezLwjvKfUtt8ig5mpAf)


进行了 产品结构梳理:



然后每页与甲方一一核对,根据他的要求对页面的功能进行增删:


该产品有搭建好的后台监测数据系统,

以现在的测试站点数据来分析,发现了4大比较明显的产品问题:


这有利于我们重新调整产品策略,重新定义这款产品:







三、解决问题


1、制定产品的调性

在bing、百度了电网、电量、电能相关的图片:



发现科技风格的调性是十分符合甲方的产品属性的。

但如果与竞品【电能卫士】一样采用蓝绿风格,会过于雷同,

直到我看到了下面图片:



于是我大胆地与甲方进行沟通,

决定在视觉上做出比较颠覆性的改变,

大调上采用暗色系,甲方也同意了我的想法。



2、制定设计规范

字体设计规范:



元素风格:




3、页面改版



4、动态展示


首页:



能耗管理页:



监测点详情页:



四、项目复盘


这项目没有产品经理,

自己根据需求文档,跟甲方沟通,

整理了原型图,并反复与甲方核对,

极大提高自己对产品的理解和梳理能力;


该项目属于电网类,接口数据庞杂,站点和监测点繁复, 

需大量采用折线、饼状和柱状统计图,

我参考了知乎、百度的疫情数据图表,

结合项目自身情况进行了设计。







11
举报
|
17
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
新拟态风格 UI设计组件库
高级表盘系列UI源文件
高级感金属拟物 UI设计组件库
UI 登录界面设计模板包
【新年UI图标】体育icon
新能源APP应用UIKit
Security Camera UI kit
【新年UI图标】美食icon
钱包ui模板
【新年UI图标】礼物/活动icon
森系3D渐变流体抽象矢量UI背景图
户外旅行飞机情侣假日出行
【新年UI图标】旅行icon
3D渐变流体抽象矢量UI背景图
【新年UI图标】活动icon
APP/小程序商业项目UI模板|99个高保真UI+79个原型
UI通用设计素材1
【新年UI图标】美妆icon
科技医疗透明柜UI界面设计
智能家居中心 简约 UI设计组件库
UI界面 组件
我的钱包-UI界面设计-app
【新年UI图标】家具icon
你可能喜欢
相关收藏夹
大家都在看
登录注册