HarmonyOS仿网易云音乐设计

临窗而观

已于 2025-02-08 16:37:02 修改

阅读量1.2k

点赞数 34

文章标签： harmonyos 华为

于 2024-11-25 17:17:28 首次发布

本文链接：https://blog.csdn.net/c3095255243/article/details/144031541

版权

HarmonyOS仿网易云音乐设计

一，项目参考的原型应用（图形+文字说明）

顶部导航栏：
- 搜索功能： 顶部中央有一个搜索框，便于用户搜索音乐、歌单或内容。
- 侧边菜单： 左上角的三条横线图标表示隐藏的侧边栏功能。
- 右上角图标： 包含扫码和语音识别功能，适合快速操作。
问候语及主要推荐模块：
- 问候语： 页面显示“晚上好”，人性化设计增加亲和力。
- 推荐内容：
  - 每日推荐：以卡片形式显示推荐音乐列表。
  - 私人雷达：个性化推荐功能。
  - 热门模块：提供特定主题的音乐推荐，例如“符合你口味的新鲜好歌”。
- 每个推荐卡片都包含封面、标题和简要描述，用户可以快速点击播放。
歌单推荐：
- 以矩阵布局显示多个歌单，包括封面图和描述文字，便于浏览。
- 封面图具有吸引力，与文本描述搭配能够提高点击率。
播放控制条：
- 位于页面底部，有当前播放的歌曲信息以及播放控制按钮，支持随时调整播放状态。
底部导航栏：
- 包含多个模块：
  1. 推荐：高亮显示，当前处于此页面。
  2. 发现：用于发现更多音乐内容。
  3. 漫游：可能是与音乐相关的趣味功能。
  4. 笔记：用户可以记录自己的音乐心得或感受。
  5. 我的：管理个人账户及收藏内容。

图1.网易云音乐-推荐页面

顶部导航栏：

二级导航：

主推荐内容：

精选歌单：

矩阵布局，显示多个推荐歌单，包括：
- 播放次数： 每个歌单封面显示了播放次数，如“3.9万”、“108.0万”。
- 歌单名称与描述： 简单描述增强歌单的吸引力，例如“经典老歌珍贵永恒”。
- 用户可以直接点击封面播放。

新歌推荐：

底部播放条：

底部导航栏：

图2.网易云音乐-发现页面

顶部导航栏：

内容展示区域：

布局方式：
- 矩阵式卡片布局，分为多列显示，每列包含图片、文字和互动按钮。
内容类型：
- 包括文字、图片和用户生成内容，呈现形式丰富。
- 例如：
  - 第一列展示动漫截图，并附带一段文字“Miss也是miss”。
  - 第二列展示一张日常生活的照片，并附言希望相关事宜。
点赞和评论互动：
- 每个卡片下方有作者昵称和点赞数量，提升用户参与感。