-
模块划分
-
头部(导航区) 标题(title)
-
内容区
-
流媒体的左右区域,相对称
-
文字
左右两列 文字左右两侧的间距,左侧6px + 46px(头像+左箭头距离),右侧46px,自适应(4h),如果全是英文,需要自动折行
气泡会跟着文字变化而变化,气泡与文字的间距10px(3H) 文字行间距1.5em
-
语音 最长65%,最短34%(4H)
-
图片 最多9张,每发送一张,图片的显示最宽51%,高度自适应。等比例缩放
-
头像区域 40*40,针对不规则图片处理方法:图片设置最大宽高40px,然后让其长条水平居中,竖条的垂直居中
-
各功能区域的间隔15px
-
底部区域 fixed 布局底部输入框,只需要开发文字输入
-
交互的需求细节
- 语音播放结束后,动画结束播放
- 当前语音继续点击时,真难听当前语音播放
- 点击其他语音,先暂停所有语音动画( 并且所有语音回归到三线状态)
- 每次重复点击 语音都会重头播放
-
-
讨论需求的可行性
-
功能区域复杂度
-
模块拆分
- 头部模块 3h
- 内容区 2d
- 底部区 1d
- 架构
- base,global
- 业务模块
- 切分支
- 开发
- 自己测试(各种Android· iphone 机型测试)
- 与UI比对,误差不超过3px
- 发邮件,抄送给开发,老大
- 与开发校验数据
- 与QA调bug
- 运维