比心
BIXIN
有共同兴趣，也有新的相遇。
兴趣与技能服务
正在呈现画面项目介绍
ABOUT THE PROJECT有共同兴趣，也有新的相遇。
比心是一款连接兴趣与技能服务的社交 App。本次基于已有界面改版，围绕兴趣发现、品类筛选、技能展示与订单账户，重新整理页面层级和视觉表达，衔接服务选择与交流入口。
- 产品类型
- 兴趣与技能服务
- 设计类型
- 已有界面改版
- 主要场景
- 发现 / 服务 / 交流
设计流程
DESIGN PROCESS以已有界面为基础，梳理兴趣发现与技能服务的结构，调整内容、订单和账户之间的衔接。
- 01
梳理现有层级
基于已有的发现、品类与交流入口，重新整理筛选、技能和订单的内容层级。
结构规划 - 02
统一视觉表达
延续蓝色主调，统一人物、内容卡片与服务信息的视觉层级。
视觉规范 - 03
调整服务界面
围绕品类选择、技能展示与下单，调整原有页面的信息排布和操作入口。
界面设计 - 04
完善账户衔接
将身份认证、支付、钱包和聊天状态连接到相应的服务路径。
交互细节
设计规范
VISUAL SYSTEM蓝色承载主要操作，清晰的内容层级帮助用户找到人与服务。
主要强调色Blue
#2996FD选中状态 / 主要操作 / 重点信息
深色基础Charcoal
#101113内容背景 / 场景衬托
浅色基础White
#FFFFFF主要文字 / 深色背景中的内容
辅助信息Gray
#8C8C8C说明文字 / 次要状态
布局规范
LAYOUT & SPACING依据真实页面组织照片、内容、入口和操作，标注相应的布局关系。
推荐、搜索与品类入口位于顶部，下面是双列服务内容；每项内容依次呈现封面、标题、技能标签与人物信息，底部保留四个导航入口。
16pt
服务封面服务内容
12pt
品类入口筛选按钮
16pt12pt
- 左右边距
- 16 pt
- 双列间距
- 12 pt
- 服务间距
- 14 pt
核心界面
MAIN SCREENS从主要使用场景开始，查看产品的核心界面。点击图片可以查看完整大图。
更多设计细节
MORE SCREENS沿着使用路径，继续查看内容、操作与不同状态。
