拖动浏览,滚动或双指缩放。打开帮助查看键盘操作。

Yan
开放
合作
聊聊吧
Yan Fontão Boring view
All work

Case 011移动应用设计

HubProlog

一款移动应用:chapa(巴西负责装卸货物的帮工)可以在里面找到有报酬的短期零工,接下活儿,并保存付款记录。

我的职责
界面设计
项目状态
界面设计 · Figma 存档
HubProlog 样机,为这面项目墙用项目的真实页面合成。
为这面项目墙用项目真实页面合成的样机。

01

我的贡献

HubProlog 在屏幕上显示为 hub,是一款葡萄牙语应用,面向接短期、有报酬的零工的人,比如 chapa,也就是装卸货物的帮工。应用把这类活儿叫作 trampos,是巴西人日常口语里指零工的词。

设计文件里有 47 个移动端画框,涵盖登录、邀约、搜索、凭证和个人资料。这里展示的工作、地点和金额都是示例内容。

Buscar 页面,标题为 Propostas em São Paulo,有一张画着仓库工人的大幅插画卡片,工作是 Chapa,每天 R$ 100,距离 11 km,另有拒绝、撤销和接受按钮。
Convocação 页面,hub 标志位于淡化的仓库插图之上,另有工作描述、所含工作内容的清单,以及 Recusar 和 Aceitar 按钮。
录自 Figma 原型。滑动浏览邀约、按城市筛选,并打开其中一条。 Buscar 一次显示一份工作,配有拒绝、撤销和接受。 邀约先把服务讲清楚,再请对方回复。

02

一次只显示一份工作

Buscar 把可接的工作做成可以滑动的卡片,一次一张大卡片。卡片上写着这份工作是什么、报酬多少、在哪里、距离多远,文字放在深色渐变上,压在插图上也依然清晰。下方是三个圆形按钮:拒绝、撤销和接受。

03

先读,再回答

一份邀约先用平实的话描述服务,再列出包含的内容。问题到最后才出现:“Você aceita este trampo?”,就在 Recusar 和 Aceitar 的正上方,读完之后才轮到做决定。珊瑚色代表拒绝,品牌的青柠绿代表接受,各个邀约页面用的都是这一对颜色。

Comprovantes 页面,带有 Holerites 和 Comprovantes de PIX 两个选项卡,以及一份按周分组的列表,列出通过 PIX 收到的 R$100 示例付款。
登录页面,有 hub 标志、一个 CPF 输入框和一个深色的 Continuar 按钮。
Comprovantes 把付款记录按周分组。 登录只要求填一样东西:CPF。

04

付款凭证

Comprovantes 把 Holerites 和 Comprovantes de PIX 分开,并按周给记录分组。每张卡片先写金额,再写工作和日期。登录同样简短:一个 CPF 输入框和一个 Continuar 按钮。

000

使用说明

Yan Fontão
轻点
打开一个屏幕
点击
打开一个屏幕
拖动
浏览项目墙
滚轮
鼠标缩放,触控板移动,双指缩放
− +
拉远查看整面项目墙,或拉近
方向键
在案例中:↑↓ 切换案例,←→ 切换媒体。在项目墙上:移动
空格
打开或返回
Enter
打开
Esc Backspace
返回
Home
回到中心,再回到开场
PgUp PgDn
上一个或下一个频道
Tab
依次浏览项目和链接
R
随机项目
0–9
输入频道号,1–61
?
本页
快捷键

项目墙背景音乐

文件已为网页压缩并统一音量。

开放
合作
聊聊吧

给 Yan 发消息

告诉我你是谁,我会尽快回复。

000

关于 Yan

你好,我是 Yan

产品设计师/ 设计工程师

大多数产品都会在设计和代码之间丢掉一些东西。我的不会:我研究问题、设计产品,并亲手把界面上线,所以你批准的,正是用户最终拿到的。

  • 2018开始软件开发
  • UI + code设计与实现

合作过 Motorola · Ambev Tech · Rei do Pitaco · OneTool · CESAR

巴西 · 可远程、混合或驻场

Yan Fontão 的坐姿肖像:穿绿色毛衣、戴眼镜,手持麦克风。
开放
合作
聊聊吧
开放
合作
聊聊吧
000

加密频道

受保密协议约束

请输入访问码

向 Yan 索取访问码 ↗
开放
合作
聊聊吧
YAN FONTÃO 完整案例

频道 11 移动应用设计

HubProlog

一款移动应用:chapa(巴西负责装卸货物的帮工)可以在里面找到有报酬的短期零工,接下活儿,并保存付款记录。

我的职责
界面设计
项目状态
界面设计 · Figma 存档
HubProlog 样机,为这面项目墙用项目的真实页面合成。
为这面项目墙用项目真实页面合成的样机。

一次一张卡片,决定一份短期零工

来自原始 Figma 设计文件的页面,使用示例数据。

我的贡献

HubProlog 在屏幕上显示为 hub,是一款葡萄牙语应用,面向接短期、有报酬的零工的人,比如 chapa,也就是装卸货物的帮工。应用把这类活儿叫作 trampos,是巴西人日常口语里指零工的词。

设计文件里有 47 个移动端画框,涵盖登录、邀约、搜索、凭证和个人资料。这里展示的工作、地点和金额都是示例内容。

录自 Figma 原型。滑动浏览邀约、按城市筛选,并打开其中一条。
Buscar 页面,标题为 Propostas em São Paulo,有一张画着仓库工人的大幅插画卡片,工作是 Chapa,每天 R$ 100,距离 11 km,另有拒绝、撤销和接受按钮。
Buscar 一次显示一份工作,配有拒绝、撤销和接受。

一次只显示一份工作

Buscar 把可接的工作做成可以滑动的卡片,一次一张大卡片。卡片上写着这份工作是什么、报酬多少、在哪里、距离多远,文字放在深色渐变上,压在插图上也依然清晰。下方是三个圆形按钮:拒绝、撤销和接受。

Convocação 页面,hub 标志位于淡化的仓库插图之上,另有工作描述、所含工作内容的清单,以及 Recusar 和 Aceitar 按钮。
邀约先把服务讲清楚,再请对方回复。

先读,再回答

一份邀约先用平实的话描述服务,再列出包含的内容。问题到最后才出现:“Você aceita este trampo?”,就在 Recusar 和 Aceitar 的正上方,读完之后才轮到做决定。珊瑚色代表拒绝,品牌的青柠绿代表接受,各个邀约页面用的都是这一对颜色。

Comprovantes 页面,带有 Holerites 和 Comprovantes de PIX 两个选项卡,以及一份按周分组的列表,列出通过 PIX 收到的 R$100 示例付款。
Comprovantes 把付款记录按周分组。

付款凭证

Comprovantes 把 Holerites 和 Comprovantes de PIX 分开,并按周给记录分组。每张卡片先写金额,再写工作和日期。登录同样简短:一个 CPF 输入框和一个 Continuar 按钮。

登录页面,有 hub 标志、一个 CPF 输入框和一个深色的 Continuar 按钮。
登录只要求填一样东西:CPF。