首页 > 其他分享 >实验一原型设计-汽水音乐app

实验一原型设计-汽水音乐app

时间:2024-04-19 18:56:07浏览次数:33  
标签:汽水 功能 界面 app 音乐 原型 播放 交互

一、对比墨刀、Axure、Mockplus等原型设计工具的各自的适用领域及优缺点

  1. 墨刀
    • 适用领域:主要专注于app原型设计,适合高保真原型、复杂多交互项目以及安卓/ios端项目。
    • 优点:操作效率高,易于上手,特别适合设计移动应用的交互原型。
    • 缺点:在后台和网页设计方面稍显乏力,归档能力不足,输出形式更偏向于链接和二维码,不能直接以文档形式输出。
  2. Axure1
    • 适用领域:广泛适用于视觉稿、高保真原型、大型复杂项目、Web线框图以及网页原型的设计。
    • 优点:功能强大,编辑效率高,支持丰富的交互设计,可以项目共享,使得团队成员间可以同步工作,并保留所有工作历史,支持随时导出历史版本的项目文档。
    • 缺点:正版售价较高,可能不适合学生等预算有限的群体;动态面板和中继器等高级功能学习成本较高,需要一定时间掌握;只支持在本地进行设计,可能不适用于所有团队的工作流程。
  3. Mockplus
    • 适用领域:适用于中低保真原型、快速原型、WEB/移动端/平板原型、线框图和视觉稿的设计。
    • 优点:基础版免费使用,操作简单易上手,功能多样且实用,支持团队协作和审阅,预览方式多样,包括无缝真机预览,适合快速开发迭代的模式。模版管理、组件交互动画、素描风格等功能为独有创新。
    • 缺点:不支持手势交互,可能在某些交互设计方面受到限制;虽然功能多样,但相较于其他高级工具可能在专业性和细腻性上稍逊一筹。

二、使用摹客进行汽水音乐原型设计
1.主题名称
汽水音乐
2.功能介绍
• 音乐播放和控制。采用上下滑屏的方式切换歌曲,这种操作方式与抖音短视频类似。播放界面设计简洁,上方展示音乐名称和歌词,背景支持静态或动态视频。
• 播放控制区域。包含点赞、评论、转发等基本交互功能,以及音乐本地下载和曲库列表。
• 音乐推荐和搜索。通过AI推荐智能曲库,向用户推送个性化的音乐内容。搜索界面提供推荐歌曲和歌单,满足用户发现新音乐的需求。
• 特效功能。拥有独特的“嗨听模式”,该模式根据音乐节奏在播放界面显示闪烁等特效,提升听歌体验。
• 账户系统和同步。支持手机验证码登录,新用户可获得2个月VIP会员资格。账户信息与抖音账号同步,允许用户将抖音上收藏的歌曲自动生成歌单,反之亦然。
• VIP服务。提供无损音质和付费歌曲下载权限。
• 此外,还有睡眠模式、隐藏设置、查看专辑等功能,可提升用户体验。用户还可以将当前播放的音乐添加到不同的歌单中。
3.界面设计考虑因素
在视觉设计上,汽水音乐最大的特点是简约,首页下方只有音乐、发现、我的三个模块,对于只是单纯需要听音乐的用户更友好。选择音乐风格这里,用了悬浮气泡,大小不一暗示音乐风格独一无二,符合产品潮流的定位。


-- 界面演示
1.登录
界面功能:登录界面显示多种登录方式以及服务条款项
界面组成:本机号码一键登录、其他手机号码登录
前置条件:打开软件
后置条件:与手机号码关联或者输入一个手机号码
操作步骤:点击“本机号码一键登录”按钮进入

2.发现
界面功能:能够进行页面滑动和局部页面滚动,滚动页面时有上下浮窗固定展示,图片轮播,实现播放音乐和搜索功能以及交互页面跳转功能
界面组成:歌单漫游、搜索栏、图标、图片、发现、音乐、我的
前置条件:登陆成功默认进入发现界面
后置条件:选择喜欢的音乐进入下一个界面
操作步骤:点击我的按钮

3.音乐播放
界面功能:可以实现播放音乐,更换音乐模式,图片旋转交互,进度条滚动功能
界面组成:图标、图片、文字、面板、内容面板、交互
前置条件:选择喜欢的音乐进入播放音乐界面
后置条件:选择喜欢的音乐模式可以对音乐进行收藏
操作步骤:点击我的按钮

4.设置
界面功能:设置界面显示多种设置方式
界面组成:播放和下载模块、账号与隐模块、使用相关模块、关于模块
前置条件:音乐账号已经登录成功
后置条件:找到播放和下载模块
操作步骤: 点击“定时关闭”按钮进入

5.定时关闭
界面功能:定时关闭界面显示关闭限定时间,或者关闭定时关闭功能
界面组成:返回键、关闭、10分钟、20分钟、30分钟、60分钟、90分钟、播完整首后
前置条件:进入定时关闭设置模式
后置条件:选择一个时间来定时关闭音乐或点击关闭
操作步骤:点击“关闭按钮”

6.界面切换流程图

** 三、演示链接**
https://rp.mockplus.cn/rps/RVrjofRmA2/ymZEno3yVE? 请查看《汽水音乐app》

标签:汽水,功能,界面,app,音乐,原型,播放,交互
From: https://www.cnblogs.com/haojianmin/p/18146628

相关文章

  • 网易云APP—原型设计
    一、实验题目:原型设计二、实验目的:掌握产品原型设计方法和相应工具使用。三、实验要求(1)对比分析墨刀、Axure、Mockplus等原型设计工具的各自的适用领域及优缺点(至少3条)。1.墨刀:  ~适用领域:墨刀适用于快速原型设计和协作,特别是在移动应用和网页设计方面。它提供了丰富的元素......
  • Apple App Store API 快速获取app综合评分,最新评论
    iDataRiver平台https://www.idatariver.com/zh-cn/提供开箱即用的苹果应用商城appstore数据采集API,供用户按需调用。接口使用详情请参考appleAppStore接口文档接口列表1.获取指定app的基础信息参数类型是否必填默认值示例值描述apikeystring是idr_***......
  • uniapp安卓在线更新版本
    实现逻辑通过获取线上的版本号和app的版本号进行对比查看是不是最新版—app版本号小于线上版本号则不是最新版提示更新模拟检测更新请求起一个服务,也就是检测更新的接口返回值为最新版本号和最新版wgt文件下载地址,例:{  "code":0,  "msg":"success",  ......
  • 【超详细】Windows申请iOS证书上架App Store详细教程
    ​转载:Windows申请iOS证书上架AppStore详细教程(有这一篇就够了)_windows提交ios审核-CSDN博客Windows申请iOS证书上架AppStore详细教程上架基本需求资料1、苹果开发者账号(如还没账号先申请-苹果开发者账号申请教程)2、开发好的APP通过本篇教程,可以学习到ios证书申请和打包i......
  • APP阿里云一键取号 (一键登陆)php接口-- (阿里云号码认证服务)
    #通过composer安装阿里云SDK"alibabacloud/dypnsapi-20170525":"^1.1.2","alibabacloud/darabonba-openapi":"^0.2.10","alibabacloud/tea-console":"^0.1.0","alibabacloud/tea-utils":"^0......
  • 实验1:原型设计——时光书阁二手书交易APP
    一、实验题目:原型设计二、实验目的:掌握产品原型设计方法和相应工具使用。三、实验要求(1)对比分析墨刀、Axure、Mockplus等原型设计工具的各自的适用领域及优缺点(至少3条)。    墨刀、Axure和Mockplus都是目前市场上较为流行的原型设计工具,它们各自具有独特的适用领域和......
  • 实验一——椰子视频app原型设计
    一、对比分析墨刀、Axure、Mockplus等原型设计工具的各自的适用领域及优缺点。(1)Axure的优缺点1.主要优点Axure作为老牌的原型图工具,功能最齐全,交互最多样,基本任何想要的效果都可以实现,尤其在制作PC端原型图上有优势。2.主要缺点Axure缺点同样也相当明显,Axure的动态面板、中......
  • 实验一-原型设计 微信卡包页面
    微信卡包页面-原型设计分享一、实验题目:原型设计二、实验目的:掌握产品原型设计方法和相应工具使用。三、实验要求 对比分析墨刀、Axure、Mockplus等原型设计工具的各自的适用领域及优缺点(至少3条)。1.墨刀:  ~适用领域:墨刀适用于快速原型设计和协作,特别是在移动应用和网页......
  • 第二代长安X5 PLUS 2024款车机绕开限制安装第三方APP
    测试车型:第二代长安X5PLUS2024款智尊型系统版本:OnStyle5.2.0安卓版本:9.0Pie文章内容仅供参考,不同车型不同版本可能操作不同一、拨号页*#*#888,输入密码密码规则见二、)进入工厂模式二、工厂模式动态密码规则:4位,和当前时间有关,24小时制,1、2位位当前分钟整十数,3、4位为小......
  • 小程序生态是更灵活构建超级App的方式
    互联网从1.0发展至今,已经经历了几十年的进步和变迁,催生出很多垂直领域的超级App。以下就是几个典型的超级App:1、电子商务Shopee(新加坡):东南亚最大的电子商务平台,拥有超过3.6亿活跃用户,覆盖7个国家和地区。Shopee提供广泛的商品品类,包括服饰、电子产品、家居用品等,并提供多种......