flight food-background

Piedparker

App store上线产品
https://www.piedparker.com

参与负责:
UX/UI
Web design

职位:
UX/UI 设计师
网页设计师

工具:
Sketch
Illustrator
Photoshop

工作经历总结

我在Piedparker美国公司主要担任UX/UI设计师。
参与设计新网站设计,独立完成框架图设计,参与讨论用户体验提升与Illustrator图标设计,并参与完善停车场客户端UX设计。

01

网站设计

1.1 网站框架图
Pied_IA

完善用户体验导航结构

1.导航栏增加模块选项区分开停车用户和停车场管理客户,方便用户注册/登陆账号。

2.首页加入演示视频选项,通过跳出式模块让新用户第一时间了解piedparker带来的便利性与使用方法。

3.首页用户分类项增加导航选项,让不同需求用户直接转到解决方法(4)网站页。

4. 增加弹出式联系选项,让用户及时了解需求信息。

1.2 网站首页 - 第一页

版本一

P_home_v1

版本二

Pied_H_v2
1.3 网站首页 - 第二页

Piedparker 产品工作步骤

placeholder image

第二页主要为产品的工作流程展示,通过停车场矢量图标注明的方式,让客户了解产品的运作流程,在页面右边注释客户车辆进出停车场的步骤。让客户了解到产品使用过程中的便利性与流畅性。

placeholder image

产品运作原理介绍

1.Pied Box
2.LPR Camera
3.Smart Beacons

手机端用户使用流程

1. 用户通过手机app登陆个人与汽车信息
2. 到停车场收费口大开车库门
3.离开停车场在手机端支付

1.4 网站首页 - 第三页

客户解决方案页

Home_3users

在首页第三页为了增加页面之间的导航体验,增加了停车场管理客户端的介绍与页面展示,为了区分不同用户在页面下方增加了停车解决方法不同使用场景的页面导航,通过生动的矢量图标让用户更直观的了解到功能区分,用户可以通过点击图标进入解决方法页,使网站导航效率更加流畅。

不同用户需求区分

user_parking

停车场需求

event_user

重大事件需求

traveler_user

更多需求

02

Commercial Operator - 停车场管理

2.1 停车管理客户端首页

停车管理客户端主要用户是停车场的管理者,通过客户端可以及时了解到停车系统的客流量信息,收入涨幅,停车位占有量,通过点击窗口可以在小模块组里了解细化信息。方便管理者及时分析解决停车遇到的问题。

首页总览

garage_home

首页 - 功能页面

placeholder image

客户端登陆界面

通过网站导航页直接进入客户端端登录界面

如果是新用户点击get in touch联系Piedparker注册个人&停车场信息创建账户

garage_Overview_menu

菜单选项

Dashboard / Reports / Support / Account Settings / Sign Out

placeholder image

菜单选项 - Reports

用户通过菜单选项进入Reports页,了解各停车场收入情况

garage_Overview_menu

Reports - 细化

选择上方各项信息,了解更细化的停车场情况。

placeholder image

停车客户信息

通过点击细化选单的客户名字,显示piedparker手机端客户用户信息。

2.2 模块细分

停车场地图显示

section_map

主要功能显示:

停车场位置信息

停车场新消息提醒

停车场汽车位占有率(通过百分比显示)

通过点击橘黄色按钮进入该停车场管理页面

video_include_home
video_parking

点击停车场图表进入单独管理系统

每个停车场有独立的管理系统,新增加视频监控页页面,用户可以点击视频模块及时通过视频了解到停车场车辆进出情况,也可为发生紧急情况作出最快反映处理。

及时信息

placeholder image

系统显示进入和出入停车场信息:
搜索信息栏 / 及时&过去信息显示 / 停车场位置 / 车辆牌照 / 起始&结算时间 /

UX改善:初始版本只识别使用Piedparker手机app的用户信息,在新版本中识别所有社会车辆信息,使客户信息更加完善。

停车场车辆信息

placeholder image

系统显示进入和出入停车场信息:
搜索信息栏 / 及时&过去信息显示 / 停车场位置 / 车辆牌照 / 起始&结算时间 /

UX改善:初始版本只识别使用Piedparker手机app的用户信息,在新版本中识别所有社会车辆信息,使客户信息更加完善。

停车位占有量

placeholder image

停车位占有量是直接了解停车产运营情况的主要来源信息之一,用户可以根据图表显示了解不同时段的停车位使用效率,通过客户端及时调整不同时段停车价格,及时调整停车策略使停车收入与车位占有量更好的平衡。

停车场收入报表

placeholder image

用户可以通过右上角时间导航项选择不同时间点的收入情况,通过图表与百分比结合停车场占有量模块了解停车收支平衡。

停车顾客信息汇总

summury

停车信息汇总显示日租停客户的总进出量,月租停车客户的总进出量,在下方对应相应的百分比显示。另外显示停车客户的平均停车时长与平均停车支付价格,因为停车场在不同时段的收费价格标准不同,这种显示方式更加直观的帮助停车场管理者了解客流量与收入情况。

2.3 停车场设置
setting_monthly
Setting_height
Holiday_setting
time_setting

更多人性化停车设置选择

通过停车场设置选项,可以方便及时的更改停车场开放时间,收费标准,停车场进车尺寸显示等设置,更改完设置可以及时显示在Piedparker手机端用户的app上,让用户根据不同时间和自身情况对停车选择作出及时调整,提升用户体验。